From 539b39ceb33d8d2bd37da3fd613d48ff17e994e8 Mon Sep 17 00:00:00 2001 From: Avram Walden Date: Fri, 17 Mar 2023 10:24:48 -0700 Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20Fixes=20reset=20and=20cle?= =?UTF-8?q?arErrors?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Form/Form.tsx | 2 +- src/useInertiaForm.ts | 75 ++++++++++++++++++++++++++----------------- src/utils.ts | 6 ++++ 3 files changed, 53 insertions(+), 30 deletions(-) diff --git a/src/Form/Form.tsx b/src/Form/Form.tsx index 47b7e6b..6c1090e 100644 --- a/src/Form/Form.tsx +++ b/src/Form/Form.tsx @@ -13,7 +13,7 @@ export type HTTPVerb = 'post' | 'put' | 'get' | 'patch' | 'delete' /** * useForm declaration */ -export interface UseFormProps extends UseInertiaFormProps { +export interface UseFormProps extends UseInertiaFormProps { model?: string method: HTTPVerb to?: string diff --git a/src/useInertiaForm.ts b/src/useInertiaForm.ts index cb90b47..48ba575 100644 --- a/src/useInertiaForm.ts +++ b/src/useInertiaForm.ts @@ -2,7 +2,7 @@ import { Method, Progress, router, VisitOptions } from '@inertiajs/core' import { get, isEqual, set } from 'lodash' import { useCallback, useEffect, useRef, useState } from 'react' import { useRemember } from '@inertiajs/react' -import { fillEmptyValues, renameWithAttributes, unsetCompact } from './utils' +import { coerceArray, fillEmptyValues, renameWithAttributes, unsetCompact } from './utils' import { useFormMeta } from './Form/FormMetaWrapper' import { type NestedObject } from './types' @@ -26,8 +26,8 @@ export interface UseInertiaFormProps { setDefaults(): void setDefaults(field: keyof TForm, value: string): void setDefaults(fields: Record): void - reset: (...fields: (keyof TForm)[]) => void - clearErrors: (...fields: (keyof TForm)[]) => void + reset: (fields?: string|string[]) => void + clearErrors: (fields?: string|string[]) => void setError(field: string, value: string): void setError(errors: Record): void getError: (key: string) => string|string[] @@ -187,6 +187,18 @@ export default function useInertiaForm( return { data, + isDirty: !isEqual(data, defaults), + errors, + hasErrors, + processing, + progress, + wasSuccessful, + recentlySuccessful, + + transform: useCallback((callback) => { + transformRef.current = callback + }, []), + setData: useCallback((keyOrData: string | Function | TForm, maybeValue?: TForm[keyof TForm]) => { if(typeof keyOrData === 'string') { const processedKey = railsAttributes ? renameWithAttributes(keyOrData) : keyOrData @@ -199,10 +211,12 @@ export default function useInertiaForm( setData(keyOrData as TForm) } }, [railsAttributes]), + getData: useCallback((key: string): unknown => { const processedKey = railsAttributes ? renameWithAttributes(key) : key return get(data, processedKey) }, [data, railsAttributes]), + unsetData: useCallback((key: string) => { const processedKey = railsAttributes ? renameWithAttributes(key) : key const clone = structuredClone(data) @@ -210,16 +224,7 @@ export default function useInertiaForm( return setData(clone) }, [data, railsAttributes]), - isDirty: !isEqual(data, defaults), - errors, - hasErrors, - processing, - progress, - wasSuccessful, - recentlySuccessful, - transform: useCallback((callback) => { - transformRef.current = callback - }, []), + setDefaults: useCallback((fieldOrFields?: keyof TForm | Record, maybeValue?: string) => { if(typeof fieldOrFields === 'undefined') { setDefaults(() => data) @@ -230,23 +235,22 @@ export default function useInertiaForm( })) } }, [data]), - reset: useCallback((...fields) => { - if(fields.length === 0) { + + reset: useCallback((fields) => { + if(!fields) { setData(defaults) - } else { - setData( - (Object.keys(defaults) as Array) - .filter((key) => fields.includes(key)) - .reduce( - (carry, key) => { - carry[key] = defaults[key] - return carry - }, - { ...data }, - ), - ) + return } + + const arrFields = coerceArray(fields) + + const clone = structuredClone(data) + arrFields.forEach(field => { + set(clone, field, get(defaults, field)) + }) + setData(clone) }, [defaults, data]), + setError: useCallback((fieldOrFields: string | Record, maybeValue?: string) => { setErrors((errors) => { const newErrors = { @@ -259,15 +263,21 @@ export default function useInertiaForm( return newErrors }) }, [errors]), + getError: useCallback((key: string): string|string[] => { return get(errors, key) }, [errors]), - clearErrors: useCallback((...fields) => { + + clearErrors: useCallback((fields) => { + if(!fields) setErrors(undefined) + + const arrFields = coerceArray(fields) + setErrors((errors) => { const newErrors = (Object.keys(errors) as Array).reduce( (carry, field) => ({ ...carry, - ...(fields.length > 0 && !fields.includes(field) ? { [field]: errors[field] } : {}), + ...(arrFields.length > 0 && !arrFields.includes(String(field)) ? { [field]: errors[field] } : {}), }), {}, ) @@ -275,22 +285,29 @@ export default function useInertiaForm( return newErrors }) }, [errors]), + submit, + get: useCallback((url, options) => { submit('get', url, options) }, []), + post: useCallback((url, options) => { submit('post', url, options) }, []), + put: useCallback((url, options) => { submit('put', url, options) }, []), + patch: useCallback((url, options) => { submit('patch', url, options) }, []), + delete: useCallback((url, options) => { submit('delete', url, options) }, []), + cancel: useCallback(() => { if(cancelToken.current) { cancelToken.current.cancel() diff --git a/src/utils.ts b/src/utils.ts index 16f6585..4ba0578 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -101,3 +101,9 @@ const renameKey = (obj, oldKey, newKey) => { delete obj[oldKey] } } + + +export const coerceArray = (arg: string | string[]) => { + if(Array.isArray(arg)) return arg + return [arg] +}