packages/components/containers/forward/AttachmentsCondition.tsx

   1 import { c } from 'ttag';
   2
   3 import Radio from '@proton/components/components/input/Radio';
   4
   5 import type { Condition } from '../filters/interfaces';
   6 import { ConditionComparator } from '../filters/interfaces';
   7
   8 interface Props {
   9     index: number;
  10     condition: Condition;
  11     onUpdate: (condition: Condition) => void;
  12 }
  13
  14 const AttachmentsCondition = ({ index, condition, onUpdate }: Props) => {
  15     const withAttachment = condition?.comparator === ConditionComparator.CONTAINS;
  16     const toggleAttachment = () => {
  17         onUpdate({
  18             ...condition,
  19             comparator: withAttachment ? ConditionComparator.DOES_NOT_CONTAIN : ConditionComparator.CONTAINS,
  20         });
  21     };
  22
  23     return (
  24         <div className="flex w-full mb-6 flex-column md:flex-row">
  25             <Radio
  26                 id={`condition-${index}-with-attachment`}
  27                 name={`attachment-condition-${index}`}
  28                 className="inline-flex items-center mr-4 mb-2 md:mb-0"
  29                 checked={withAttachment}
  30                 onChange={toggleAttachment}
  31             >
  32                 {c('email_forwarding_2023: Label').t`With attachment`}
  33             </Radio>
  34             <Radio
  35                 id={`condition-${index}-without-attachment`}
  36                 name={`attachment-condition-${index}`}
  37                 className="inline-flex items-center"
  38                 checked={!withAttachment}
  39                 onChange={toggleAttachment}
  40             >
  41                 {c('email_forwarding_2023: Label').t`Without attachment`}
  42             </Radio>
  43         </div>
  44     );
  45 };
  46
  47 export default AttachmentsCondition;