source.dussan.org Git - sonarqube.git/blob

   1 /*
   2  * SonarQube
   3  * Copyright (C) 2009-2023 SonarSource SA
   4  * mailto:info AT sonarsource DOT com
   5  *
   6  * This program is free software; you can redistribute it and/or
   7  * modify it under the terms of the GNU Lesser General Public
   8  * License as published by the Free Software Foundation; either
   9  * version 3 of the License, or (at your option) any later version.
  10  *
  11  * This program is distributed in the hope that it will be useful,
  12  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  13  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
  14  * Lesser General Public License for more details.
  15  *
  16  * You should have received a copy of the GNU Lesser General Public License
  17  * along with this program; if not, write to the Free Software Foundation,
  18  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  19  */
  20 import * as React from 'react';
  21 import { FormattedMessage } from 'react-intl';
  22 import DocLink from '../../../../components/common/DocLink';
  23 import { ButtonLink } from '../../../../components/controls/buttons';
  24 import ValidationInput, {
  25   ValidationInputErrorPlacement,
  26 } from '../../../../components/controls/ValidationInput';
  27 import { Alert } from '../../../../components/ui/Alert';
  28 import MandatoryFieldMarker from '../../../../components/ui/MandatoryFieldMarker';
  29 import { translate } from '../../../../helpers/l10n';
  30 import { AlmBindingDefinitionBase } from '../../../../types/alm-settings';
  31 import '../../styles.css';
  32
  33 export interface AlmBindingDefinitionFormFieldProps<B extends AlmBindingDefinitionBase> {
  34   autoFocus?: boolean;
  35   error?: string;
  36   help?: React.ReactNode;
  37   id: string;
  38   isInvalid?: boolean;
  39   isTextArea?: boolean;
  40   maxLength?: number;
  41   onFieldChange: (id: keyof B, value: string) => void;
  42   optional?: boolean;
  43   overwriteOnly?: boolean;
  44   propKey: keyof B;
  45   value: string;
  46   isSecret?: boolean;
  47 }
  48
  49 export function AlmBindingDefinitionFormField<B extends AlmBindingDefinitionBase>(
  50   props: AlmBindingDefinitionFormFieldProps<B>
  51 ) {
  52   const {
  53     autoFocus,
  54     error,
  55     help,
  56     id,
  57     isInvalid = false,
  58     isTextArea,
  59     maxLength,
  60     optional,
  61     overwriteOnly = false,
  62     propKey,
  63     value,
  64     isSecret,
  65   } = props;
  66   const [showField, setShowField] = React.useState(!overwriteOnly);
  67
  68   return (
  69     <div className="settings-definition">
  70       <div className="settings-definition-left">
  71         <label className="h3" htmlFor={id}>
  72           {translate('settings.almintegration.form', id)}
  73         </label>
  74         {!optional && <MandatoryFieldMarker />}
  75         {help && <div className="markdown small spacer-top">{help}</div>}
  76       </div>
  77       <div className="settings-definition-right big-padded-top display-flex-column">
  78         {!showField && overwriteOnly && (
  79           <div>
  80             <p>{translate('settings.almintegration.form.secret.field')}</p>
  81             <ButtonLink
  82               onClick={() => {
  83                 props.onFieldChange(propKey, '');
  84                 setShowField(true);
  85               }}
  86             >
  87               {translate('settings.almintegration.form.secret.update_field')}
  88             </ButtonLink>
  89           </div>
  90         )}
  91
  92         {showField && isTextArea && (
  93           <textarea
  94             className="width-100"
  95             id={id}
  96             maxLength={maxLength || 2000}
  97             onChange={(e) => props.onFieldChange(propKey, e.currentTarget.value)}
  98             required={!optional}
  99             rows={5}
 100             value={value}
 101           />
 102         )}
 103
 104         {showField && !isTextArea && (
 105           <ValidationInput
 106             error={error}
 107             errorPlacement={ValidationInputErrorPlacement.Bottom}
 108             isValid={false}
 109             isInvalid={isInvalid}
 110           >
 111             <input
 112               className="width-100"
 113               autoFocus={autoFocus}
 114               id={id}
 115               maxLength={maxLength || 100}
 116               name={id}
 117               onChange={(e) => props.onFieldChange(propKey, e.currentTarget.value)}
 118               size={50}
 119               type="text"
 120               value={value}
 121             />
 122           </ValidationInput>
 123         )}
 124
 125         {showField && isSecret && (
 126           <Alert variant="info" className="spacer-top">
 127             <FormattedMessage
 128               id="settings.almintegration.form.secret.can_encrypt"
 129               defaultMessage={translate('settings.almintegration.form.secret.can_encrypt')}
 130               values={{
 131                 learn_more: (
 132                   <DocLink to="/instance-administration/security/#settings-encryption">
 133                     {translate('learn_more')}
 134                   </DocLink>
 135                 ),
 136               }}
 137             />
 138           </Alert>
 139         )}
 140       </div>
 141     </div>
 142   );
 143 }