extract auth to lib

src/hooks/useEditableForm.ts

@@ -0,0 +1,68 @@
+import { useCallback, useState } from 'react';
+import { useValidatedFields } from './useValidatedFields';
+
+type FieldErrors<TValues> = Partial<Record<keyof TValues, string | undefined>>;
+
+type UseEditableFormOptions<TValues> = {
+  initialValues: TValues;
+  validate: (values: TValues) => FieldErrors<TValues>;
+};
+
+export function useEditableForm<TValues extends Record<string, string>>({
+  initialValues,
+  validate
+}: UseEditableFormOptions<TValues>) {
+  const [isEditing, setIsEditing] = useState(false);
+
+  const {
+    values,
+    errors,
+    isValid,
+    setValues,
+    setFieldValue,
+    validateAll,
+    setFieldError,
+    setErrors,
+    clearErrors
+  } = useValidatedFields({
+    initialValues,
+    validate
+  });
+
+  const startEditing = useCallback((sourceValues: TValues) => {
+    setValues(sourceValues, { validate: true });
+    setIsEditing(true);
+  }, [setValues]);
+
+  const discardChanges = useCallback((sourceValues: TValues) => {
+    setValues(sourceValues, { clearErrors: true });
+    setIsEditing(false);
+  }, [setValues]);
+
+  const loadFromSource = useCallback((sourceValues: TValues) => {
+    setValues(sourceValues, { clearErrors: true });
+  }, [setValues]);
+
+  const commitSaved = useCallback((sourceValues: TValues) => {
+    setValues(sourceValues, { clearErrors: true });
+    setIsEditing(false);
+  }, [setValues]);
+
+  return {
+    values,
+    errors,
+    isValid,
+    setValues,
+    setFieldValue,
+    validateAll,
+    setFieldError,
+    setErrors,
+    clearErrors,
+    isEditing,
+    startEditing,
+    discardChanges,
+    loadFromSource,
+    commitSaved,
+    setIsEditing
+  };
+}