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

   1 /*
   2  * SonarQube
   3  * Copyright (C) 2009-2021 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 { ButtonLink } from 'sonar-ui-common/components/controls/buttons';
  22 import HelpTooltip from 'sonar-ui-common/components/controls/HelpTooltip';
  23 import { translate } from 'sonar-ui-common/helpers/l10n';
  24 import { AlmBindingDefinition } from '../../../../types/alm-settings';
  25
  26 export interface AlmBindingDefinitionFormFieldProps<B extends AlmBindingDefinition> {
  27   autoFocus?: boolean;
  28   help?: React.ReactNode;
  29   id: string;
  30   isTextArea?: boolean;
  31   maxLength?: number;
  32   onFieldChange: (id: keyof B, value: string) => void;
  33   optional?: boolean;
  34   overwriteOnly?: boolean;
  35   propKey: keyof B;
  36   value: string;
  37 }
  38
  39 export function AlmBindingDefinitionFormField<B extends AlmBindingDefinition>(
  40   props: AlmBindingDefinitionFormFieldProps<B>
  41 ) {
  42   const {
  43     autoFocus,
  44     help,
  45     id,
  46     isTextArea,
  47     maxLength,
  48     optional,
  49     overwriteOnly = false,
  50     propKey,
  51     value
  52   } = props;
  53   const [showField, setShowField] = React.useState(!overwriteOnly);
  54
  55   return (
  56     <div className="modal-field">
  57       <label className="display-flex-center" htmlFor={id}>
  58         {translate('settings.almintegration.form', id)}
  59         {!optional && <em className="mandatory">*</em>}
  60         {help && <HelpTooltip className="spacer-left" overlay={help} placement="right" />}
  61       </label>
  62
  63       {!showField && overwriteOnly && (
  64         <div>
  65           <p>{translate('settings.almintegration.form.secret_field')}</p>
  66           <ButtonLink
  67             onClick={() => {
  68               props.onFieldChange(propKey, '');
  69               setShowField(true);
  70             }}>
  71             {translate('settings.almintegration.form.update_secret_field')}
  72           </ButtonLink>
  73         </div>
  74       )}
  75
  76       {showField && isTextArea && (
  77         <textarea
  78           className="settings-large-input"
  79           id={id}
  80           maxLength={maxLength || 2000}
  81           onChange={e => props.onFieldChange(propKey, e.currentTarget.value)}
  82           required={!optional}
  83           rows={5}
  84           value={value}
  85         />
  86       )}
  87
  88       {showField && !isTextArea && (
  89         <input
  90           autoFocus={autoFocus}
  91           className="input-super-large"
  92           id={id}
  93           maxLength={maxLength || 100}
  94           name={id}
  95           onChange={e => props.onFieldChange(propKey, e.currentTarget.value)}
  96           size={50}
  97           type="text"
  98           value={value}
  99         />
 100       )}
 101     </div>
 102   );
 103 }