packages/components/containers/contacts/email/SignEmailsSelect.tsx

   1 import { c } from 'ttag';
   2
   3 import Option from '@proton/components/components/option/Option';
   4 import SelectTwo from '@proton/components/components/selectTwo/SelectTwo';
   5 import type { MailSettings } from '@proton/shared/lib/interfaces';
   6 import { SIGN } from '@proton/shared/lib/mail/mailSettings';
   7
   8 import type { SelectChangeEvent } from '../../../components/selectTwo/select';
   9
  10 interface Props {
  11     id?: string;
  12     value?: boolean;
  13     mailSettings?: MailSettings;
  14     disabled?: boolean;
  15     onChange: (value: boolean | undefined) => void;
  16 }
  17
  18 const SignEmailsSelect = ({ id, value, mailSettings, disabled, onChange }: Props) => {
  19     // An `undefined` value indicates the "default" option is selected.
  20     // However, `undefined` cannot be used as `Option` identifier, hence we convert to/from `null`.
  21     const handleChange = ({ value }: SelectChangeEvent<boolean | null>) => onChange(value === null ? undefined : value);
  22
  23     const SIGN_LABEL = c('Signing preference for emails').t`Sign`;
  24     const DO_NOT_SIGN_LABEL = c('Signing preference for emails').t`Don't sign`;
  25     const globalDefaultText = mailSettings?.Sign === SIGN.ENABLED ? SIGN_LABEL : DO_NOT_SIGN_LABEL;
  26
  27     return (
  28         <SelectTwo id={id} value={value === undefined ? null : value} onChange={handleChange} disabled={disabled}>
  29             <Option title={c('Default signing preference').t`Use global default (${globalDefaultText})`} value={null} />
  30             <Option title={SIGN_LABEL} value={true} />
  31             <Option title={DO_NOT_SIGN_LABEL} value={false} />
  32         </SelectTwo>
  33     );
  34 };
  35
  36 export default SignEmailsSelect;