Skip to content

Commit

Permalink
fix: fix config.name to optional in render hooks
Browse files Browse the repository at this point in the history
  • Loading branch information
@adyfk
adyfk committed Aug 11, 2023
1 parent 1072cc6 commit 17a7d16
Show file tree
Hide file tree
Showing 6 changed files with 41 additions and 32 deletions.
2 changes: 1 addition & 1 deletion src/v2/components/FormGenerator.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -193,7 +193,7 @@ export function FormGenerator(props: Partial<IFormGeneratorProps>) {
return (
<>
{(schemas as ISchema[]).map((schema) => {
const key = schema.variant + schema.component + (schema.config.name || "") + (schema.key || "") + parent + generatedKey;
const key = schema.variant + schema.component + (schema.config?.name || "") + (schema.key || "") + parent + generatedKey;
return (
<SchemaComponent
key={key}
Expand Down
2 changes: 1 addition & 1 deletion src/v2/components/FormManagement.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -184,7 +184,7 @@ export function FormManagement(props: Partial<IFormManagementProps>) {
return (
<>
{(schemas as ISchema[]).map((schema) => {
const key = schema.variant + schema.component + (schema.config.name || "") + (schema.key || "") + parent + generatedKey;
const key = schema.variant + schema.component + (schema.config?.name || "") + (schema.key || "") + parent + generatedKey;
return (
<SchemaComponent
key={key}
Expand Down
19 changes: 11 additions & 8 deletions src/v2/hooks/useField.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import type { IForm } from "../logic/createForm";
import { IDefaultProp, ISchemaFieldCore } from "../types";
import { FormContext } from "../contexts/FormContext";
import useSubscribeAndCompare from "./useSubscribeAndCompare";
import generateId from "../utils/generateId";

// eslint-disable-next-line no-use-before-define
export const useField = <TSchema extends ISchemaFieldCore>(props: {
Expand All @@ -20,6 +21,8 @@ export const useField = <TSchema extends ISchemaFieldCore>(props: {
const { form = formContext, schema } = props as { form: IForm<TSchema>, schema: TSchema };
const _ref = useRef<any>();

const identity = schema.config?.name || schema.key || generateId();

useSubscribeAndCompare({
form,
getState() {
Expand All @@ -34,11 +37,11 @@ export const useField = <TSchema extends ISchemaFieldCore>(props: {
});

useEffect(() => {
form.fieldRef[schema.config.name] = _ref;
form.fieldRef[identity] = _ref;
return () => {
delete form.fieldRef[schema.config.name];
delete form.fieldRef[identity];
};
}, [schema.config.name]);
}, [identity]);

return {
state: form.getSchemaFieldState<TSchema["initialValue"], TSchema["propStateType"] & IDefaultProp>(schema as any),
Expand All @@ -49,16 +52,16 @@ export const useField = <TSchema extends ISchemaFieldCore>(props: {
onChange: useCallback(
(arg: any) => {
if (typeof arg === "function") {
form.setValue(schema.config.name, arg(form.state.values));
form.setValue(identity, arg(form.state.values));
} else {
form.setValue(schema.config.name, arg);
form.setValue(identity, arg);
}
},
[schema.config.name, form],
[identity, form],
),
onBlur: useCallback(
() => form.updateTouch(schema.config.name),
[schema.config.name, form],
() => form.updateTouch(identity),
[identity, form],
),
};
};
Expand Down
19 changes: 11 additions & 8 deletions src/v2/hooks/useFieldArray.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import type { IForm } from "../logic/createForm";
import { IDefaultProp, ISchemaFieldCore } from "../types";
import { FormContext } from "../contexts/FormContext";
import useSubscribeAndCompare from "./useSubscribeAndCompare";
import generateId from "../utils/generateId";

// eslint-disable-next-line no-use-before-define
export const useFieldArray = <TSchema extends ISchemaFieldCore>(props: {
Expand All @@ -20,6 +21,8 @@ export const useFieldArray = <TSchema extends ISchemaFieldCore>(props: {
const { form = formContext, schema } = props as { form: IForm<TSchema>, schema: TSchema };
const _ref = useRef<any>();

const identity = schema.config?.name || schema.key || generateId();

useSubscribeAndCompare({
form,
getState() {
Expand All @@ -40,11 +43,11 @@ export const useFieldArray = <TSchema extends ISchemaFieldCore>(props: {
});

useEffect(() => {
form.fieldRef[schema.config.name] = _ref;
form.fieldRef[identity] = _ref;
return () => {
delete form.fieldRef[schema.config.name];
delete form.fieldRef[identity];
};
}, [schema.config.name]);
}, [identity]);

return {
state: form.getSchemaFieldState<TSchema["initialValue"], TSchema["propStateType"] & IDefaultProp>(schema as any),
Expand All @@ -55,16 +58,16 @@ export const useFieldArray = <TSchema extends ISchemaFieldCore>(props: {
onChange: useCallback(
(arg: any) => {
if (typeof arg === "function") {
form.setValue(schema.config.name, arg(form.state.values));
form.setValue(identity, arg(form.state.values));
} else {
form.setValue(schema.config.name, arg);
form.setValue(identity, arg);
}
},
[schema.config.name, form],
[identity, form],
),
onBlur: useCallback(
() => form.updateTouch(schema.config.name),
[schema.config.name, form],
() => form.updateTouch(identity),
[identity, form],
),
};
};
Expand Down
25 changes: 14 additions & 11 deletions src/v2/hooks/useFieldForm.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import type { IEventCallback, IForm } from "../logic/createForm";
import { IDefaultProp, ISchemaFieldCore } from "../types";
import { FormContext } from "../contexts/FormContext";
import useSubscribeAndCompare from "./useSubscribeAndCompare";
import generateId from "../utils/generateId";

// eslint-disable-next-line no-use-before-define
export const useFieldForm = <TSchema extends ISchemaFieldCore>(props: {
Expand All @@ -20,6 +21,8 @@ export const useFieldForm = <TSchema extends ISchemaFieldCore>(props: {
const { form = formContext, schema } = props as { form: IForm<TSchema>, schema: TSchema };
const _ref = useRef<any>();

const identity = schema.config?.name || schema.key || generateId();

useSubscribeAndCompare({
form,
getState() {
Expand All @@ -29,12 +32,12 @@ export const useFieldForm = <TSchema extends ISchemaFieldCore>(props: {
});

useEffect(() => {
form.fieldRef[schema.config.name] = _ref;
form.fieldRef[identity] = _ref;
return () => {
delete form.fieldRef[schema.config.name];
form.unregisterEvent("submit", schema.config.name);
delete form.fieldRef[identity];
form.unregisterEvent("submit", identity);
};
}, [schema.config.name]);
}, [identity]);

return {
state: form.getSchemaFieldState<TSchema["initialValue"], TSchema["propStateType"] & IDefaultProp>(schema as any),
Expand All @@ -45,20 +48,20 @@ export const useFieldForm = <TSchema extends ISchemaFieldCore>(props: {
onChange: useCallback(
(arg: any) => {
if (typeof arg === "function") {
form.setValue(schema.config.name, arg(form.state.values));
form.setValue(identity, arg(form.state.values));
} else {
form.setValue(schema.config.name, arg);
form.setValue(identity, arg);
}
},
[schema.config.name, form],
[identity, form],
),
registerSubmit: useCallback(
(callback: IEventCallback) => form.registerEvent("submit", schema.config.name as string, callback),
[schema.config.name, form],
(callback: IEventCallback) => form.registerEvent("submit", identity as string, callback),
[identity, form],
),
onBlur: useCallback(
() => form.updateTouch(schema.config.name),
[schema.config.name, form],
() => form.updateTouch(identity),
[identity, form],
),
};
};
Expand Down
6 changes: 3 additions & 3 deletions src/v2/logic/createForm.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -103,12 +103,12 @@ export const initializeState = {
};

export function getSchemaKey(schema: ISchema, parent?: string) {
return `${parent ? `${parent}.` : ""}${schema.config.name ?? schema.key}`;
return `${parent ? `${parent}.` : ""}${schema.config?.name ?? schema.key}`;
}

export function getSchemaName(schema: ISchema, parent?: string) {
if (!schema.config.name) return "";
return `${parent ? `${parent}.` : ""}${schema.config.name}`;
if (!schema.config?.name) return "";
return `${parent ? `${parent}.` : ""}${schema.config?.name}`;
}

const createForm = <TSchema>(props: ICreateFormProps<TSchema>) => {
Expand Down

0 comments on commit 17a7d16

Please sign in to comment.