on finish handler of refinr-hook-form giving create-property.tsx:34 TypeError: Cannot read properti
create-property.tsx:34 TypeError: Cannot read properties of undefined (reading 'toLowerCase')
at Function.singular (pluralize.js:136:1)
at Object.onSuccess (useCreate.ts:145:1)
at Mutation.execute (mutation.ts:226:1)
Getting this error
my file looks like this
import { useState } from "react";
import { useGetIdentity } from "@pankod/refine-core";
import { useForm } from "@pankod/refine-react-hook-form";
import { FieldValues } from "react-hook-form";
import Form from "components/common/Form";
const CreateProperty = () => {
const { data: user } = useGetIdentity();
const [propertyImage, setPropertyImage] = useState({ name: "", url: "" });
const {
refineCore: { onFinish, formLoading },
register,
handleSubmit,
} = useForm();
const handleImageChange = (file: File) => {
const reader = (readFile: File) =>
new Promise<string>((resolve, reject) => {
const fileReader = new FileReader();
fileReader.onload = () => resolve(fileReader.result as string);
fileReader.readAsDataURL(readFile);
});
reader(file).then((result: string) =>
setPropertyImage({ name: file?.name, url: result }),
);
};
const onFinishHandler = async (data: FieldValues) => {
if (!propertyImage.name) return alert("Please select an image");
await onFinish({
...data,
photo: propertyImage.url,
email: user.email,
});
};
return (
<Form
type="Create"
register={register}
onFinish={onFinish}
formLoading={formLoading}
handleSubmit={handleSubmit}
handleImageChange={handleImageChange}
onFinishHandler={onFinishHandler}
propertyImage={propertyImage}
/>
);
};
export default CreateProperty;
at Function.singular (pluralize.js:136:1)
at Object.onSuccess (useCreate.ts:145:1)
at Mutation.execute (mutation.ts:226:1)
Getting this error
my file looks like this
import { useState } from "react";
import { useGetIdentity } from "@pankod/refine-core";
import { useForm } from "@pankod/refine-react-hook-form";
import { FieldValues } from "react-hook-form";
import Form from "components/common/Form";
const CreateProperty = () => {
const { data: user } = useGetIdentity();
const [propertyImage, setPropertyImage] = useState({ name: "", url: "" });
const {
refineCore: { onFinish, formLoading },
register,
handleSubmit,
} = useForm();
const handleImageChange = (file: File) => {
const reader = (readFile: File) =>
new Promise<string>((resolve, reject) => {
const fileReader = new FileReader();
fileReader.onload = () => resolve(fileReader.result as string);
fileReader.readAsDataURL(readFile);
});
reader(file).then((result: string) =>
setPropertyImage({ name: file?.name, url: result }),
);
};
const onFinishHandler = async (data: FieldValues) => {
if (!propertyImage.name) return alert("Please select an image");
await onFinish({
...data,
photo: propertyImage.url,
email: user.email,
});
};
return (
<Form
type="Create"
register={register}
onFinish={onFinish}
formLoading={formLoading}
handleSubmit={handleSubmit}
handleImageChange={handleImageChange}
onFinishHandler={onFinishHandler}
propertyImage={propertyImage}
/>
);
};
export default CreateProperty;
