packages/components/containers/contacts/edit/fields/ContactFieldEmail.tsx

   1 import type { ChangeEvent } from 'react';
   2
   3 import EmailInput from '@proton/components/components/input/EmailInput';
   4 import { getAllFieldLabels } from '@proton/shared/lib/helpers/contacts';
   5 import type { VCardProperty } from '@proton/shared/lib/interfaces/contacts/VCard';
   6
   7 interface Props {
   8     vCardProperty: VCardProperty<string>;
   9     onChange: (vCardProperty: VCardProperty) => void;
  10 }
  11
  12 const ContactFieldEmail = ({ vCardProperty, onChange, ...rest }: Props) => {
  13     const label = getAllFieldLabels().email;
  14
  15     const handleChange = ({ target }: ChangeEvent<HTMLInputElement>) => {
  16         const newValue = target.value;
  17         onChange({ ...vCardProperty, value: newValue });
  18     };
  19
  20     return (
  21         <EmailInput
  22             value={vCardProperty.value}
  23             placeholder={label}
  24             onChange={handleChange}
  25             data-testid={label}
  26             {...rest}
  27         />
  28     );
  29 };
  30
  31 export default ContactFieldEmail;