Function AddEmailForm

@app/client/src/pages/settings/emails.tsx:212–268

({ error, setError, onComplete }: AddEmailFormProps)

}

function AddEmailForm({ error, setError, onComplete }: AddEmailFormProps) {
  const [form] = useForm();
  const [addEmail] = useAddEmailMutation();
  const handleSubmit = useCallback(
    async (values: Store) => {
      try {
        setError(null);
        await addEmail({ variables: { email: values.email } });
        onComplete();
      } catch (e) {
        setError(e);
      }
    },
    [addEmail, onComplete, setError]
  );
  const code = getCodeFromError(error);
  return (
    <Form {...formItemLayout} form={form} onFinish={handleSubmit}>
      <Form.Item
        label="New email"
        name="email"
        rules={[
          {
            required: true,
            message: "Please enter an email address",
          },
        ]}
      >
        <Input data-cy="settingsemails-input-email" />
      </Form.Item>
      {error ? (
        <Form.Item>
          <Alert
            type="error"
            message={`Error adding email`}
            description={
              <span>
                {extractError(error).message}
                {code ? (
                  <span>
                    {" "}
                    (Error code: <code>ERR_{code}</code>)
                  </span>
                ) : null}
              </span>
            }
          />
        </Form.Item>
      ) : null}
      <Form.Item {...tailFormItemLayout}>
        <Button htmlType="submit" data-cy="settingsemails-button-submit">
          Add email
        </Button>
      </Form.Item>
    </Form>
  );
}