import React, {memo, useCallback} from 'react';
import {ApiErrors} from '@config/api';
import {useGoBack} from '@hooks/useGoBack';
import {Navigation} from '@interfaces/navigation';
import FormLayout from '@modules/form/layouts/FormLayout';
import {editForm} from '@modules/form/services';
import {Screens} from '@shared/constants';

function EditForm(props: Navigation<Screens.EDIT_FORM>) {
  const {goBack} = useGoBack();
  const {onCannotEdit} = props.route.params;

  const handleError = useCallback(
    (errorCode: string) => {
      if (errorCode === ApiErrors.CANNOT_EDIT_FORM) {
        onCannotEdit();
        goBack();
      }
    },
    [goBack, onCannotEdit],
  );

  return (
    <FormLayout editable {...props} onError={handleError} onSubmit={editForm} />
  );
}

export default memo(EditForm);