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 {
  21   ButtonSecondary,
  22   FlagMessage,
  23   FormField,
  24   InputField,
  25   InputTextArea,
  26   Link,
  27 } from 'design-system';
  28 import * as React from 'react';
  29 import { FormattedMessage } from 'react-intl';
  30 import { useDocUrl } from '../../../../helpers/docs';
  31 import { translate, translateWithParameters } from '../../../../helpers/l10n';
  32 import { AlmBindingDefinitionBase } from '../../../../types/alm-settings';
  33 import '../../styles.css';
  34
  35 export interface AlmBindingDefinitionFormFieldProps<B extends AlmBindingDefinitionBase> {
  36   autoFocus?: boolean;
  37   help?: React.ReactNode;
  38   id: string;
  39   isInvalid?: boolean;
  40   isTextArea?: boolean;
  41   maxLength?: number;
  42   onFieldChange: (id: keyof B, value: string) => void;
  43   optional?: boolean;
  44   overwriteOnly?: boolean;
  45   propKey: keyof B;
  46   value: string;
  47   isSecret?: boolean;
  48 }
  49
  50 export function AlmBindingDefinitionFormField<B extends AlmBindingDefinitionBase>(
  51   props: Readonly<AlmBindingDefinitionFormFieldProps<B>>,
  52 ) {
  53   const {
  54     autoFocus,
  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   const toStatic = useDocUrl('/instance-administration/security/#settings-encryption');
  69
  70   return (
  71     <FormField
  72       htmlFor={id}
  73       label={translate('settings.almintegration.form', id)}
  74       description={help}
  75       required={!optional}
  76       className="sw-mb-8"
  77     >
  78       {!showField && overwriteOnly && (
  79         <div className="sw-flex sw-items-center">
  80           <p className="sw-mr-2">{translate('settings.almintegration.form.secret.field')}</p>
  81           <ButtonSecondary
  82             aria-label={translateWithParameters(
  83               'settings.almintegration.form.secret.update_field_x',
  84               translate('settings.almintegration.form', id),
  85             )}
  86             onClick={() => {
  87               props.onFieldChange(propKey, '');
  88               setShowField(true);
  89             }}
  90           >
  91             {translate('settings.almintegration.form.secret.update_field')}
  92           </ButtonSecondary>
  93         </div>
  94       )}
  95       {showField && isTextArea && (
  96         <InputTextArea
  97           id={id}
  98           maxLength={maxLength || 2000}
  99           onChange={(e) => props.onFieldChange(propKey, e.currentTarget.value)}
 100           required={!optional}
 101           rows={5}
 102           size="full"
 103           value={value}
 104           isInvalid={isInvalid}
 105         />
 106       )}
 107       {showField && !isTextArea && (
 108         <InputField
 109           autoFocus={autoFocus}
 110           id={id}
 111           maxLength={maxLength || 100}
 112           name={id}
 113           onChange={(e) => props.onFieldChange(propKey, e.currentTarget.value)}
 114           type="text"
 115           size="full"
 116           value={value}
 117           isInvalid={isInvalid}
 118         />
 119       )}
 120       {showField && isSecret && (
 121         <FlagMessage variant="info" className="sw-mt-2">
 122           <span>
 123             <FormattedMessage
 124               id="settings.almintegration.form.secret.can_encrypt"
 125               defaultMessage={translate('settings.almintegration.form.secret.can_encrypt')}
 126               values={{
 127                 learn_more: <Link to={toStatic}>{translate('learn_more')}</Link>,
 128               }}
 129             />
 130           </span>
 131         </FlagMessage>
 132       )}
 133     </FormField>
 134   );
 135 }