Lidarr/frontend/src/Settings/General/ProxySettings.js

import PropTypes from 'prop-types';
import React from 'react';
import FieldSet from 'Components/FieldSet';
import FormGroup from 'Components/Form/FormGroup';
import FormInputGroup from 'Components/Form/FormInputGroup';
import FormLabel from 'Components/Form/FormLabel';
import { inputTypes, sizes } from 'Helpers/Props';
import translate from 'Utilities/String/translate';

function ProxySettings(props) {
  const {
    settings,
    onInputChange
  } = props;

  const {
    proxyEnabled,
    proxyType,
    proxyHostname,
    proxyPort,
    proxyUsername,
    proxyPassword,
    proxyBypassFilter,
    proxyBypassLocalAddresses
  } = settings;

  const proxyTypeOptions = [
    { key: 'http', value: 'HTTP(S)' },
    { key: 'socks4', value: 'Socks4' },
    { key: 'socks5', value: 'Socks5 (Support TOR)' }
  ];

  return (
    <FieldSet legend={translate('Proxy')}>
      <FormGroup size={sizes.MEDIUM}>
        <FormLabel>
          {translate('UseProxy')}
        </FormLabel>

        <FormInputGroup
          type={inputTypes.CHECK}
          name="proxyEnabled"
          onChange={onInputChange}
          {...proxyEnabled}
        />
      </FormGroup>

      {
        proxyEnabled.value &&
          <div>
            <FormGroup>
              <FormLabel>
                {translate('ProxyType')}
              </FormLabel>

              <FormInputGroup
                type={inputTypes.SELECT}
                name="proxyType"
                values={proxyTypeOptions}
                onChange={onInputChange}
                {...proxyType}
              />
            </FormGroup>

            <FormGroup>
              <FormLabel>
                {translate('Hostname')}
              </FormLabel>

              <FormInputGroup
                type={inputTypes.TEXT}
                name="proxyHostname"
                onChange={onInputChange}
                {...proxyHostname}
              />
            </FormGroup>

            <FormGroup>
              <FormLabel>
                {translate('Port')}
              </FormLabel>

              <FormInputGroup
                type={inputTypes.NUMBER}
                name="proxyPort"
                min={1}
                max={65535}
                onChange={onInputChange}
                {...proxyPort}
              />
            </FormGroup>

            <FormGroup>
              <FormLabel>
                {translate('Username')}
              </FormLabel>

              <FormInputGroup
                type={inputTypes.TEXT}
                name="proxyUsername"
                helpText={translate('ProxyUsernameHelpText')}
                onChange={onInputChange}
                {...proxyUsername}
              />
            </FormGroup>

            <FormGroup>
              <FormLabel>
                {translate('Password')}
              </FormLabel>

              <FormInputGroup
                type={inputTypes.PASSWORD}
                name="proxyPassword"
                helpText={translate('ProxyPasswordHelpText')}
                onChange={onInputChange}
                {...proxyPassword}
              />
            </FormGroup>

            <FormGroup>
              <FormLabel>
                {translate('IgnoredAddresses')}
              </FormLabel>

              <FormInputGroup
                type={inputTypes.TEXT}
                name="proxyBypassFilter"
                helpText={translate('ProxyBypassFilterHelpText')}
                onChange={onInputChange}
                {...proxyBypassFilter}
              />
            </FormGroup>

            <FormGroup size={sizes.MEDIUM}>
              <FormLabel>
                {translate('BypassProxyForLocalAddresses')}
              </FormLabel>

              <FormInputGroup
                type={inputTypes.CHECK}
                name="proxyBypassLocalAddresses"
                onChange={onInputChange}
                {...proxyBypassLocalAddresses}
              />
            </FormGroup>
          </div>
      }
    </FieldSet>
  );
}

ProxySettings.propTypes = {
  settings: PropTypes.object.isRequired,
  onInputChange: PropTypes.func.isRequired
};

export default ProxySettings;