wise-white
wise-white3y ago

useform-metadata

But the error is coming from the UserWithRoles
23 Replies
Omer
Omer3y ago
If useForm's queryResult is returning results then the problem cannot be here
rare-sapphire
rare-sapphire3y ago
Correct
Omer
Omer3y ago
Can you check your network requests? There we can find the wrong request
rare-sapphire
rare-sapphire3y ago
This is the query that is being sent out: query ($id: ID!) { user (id: $id) } And this is the message in the response: Field "user" of type "UserWithRoles" must have a selection of subfields. Did you mean "user { ... }"?
Omer
Omer3y ago
Does the error go away when you remove the useForm?
rare-sapphire
rare-sapphire3y ago
Haven't tried that Give me minute Yes, its still there
Omer
Omer3y ago
Let's try to remove useList as well
rare-sapphire
rare-sapphire3y ago
Just caught it It's coming from const { register, handleSubmit } = useReactHookForm({ } Import statement of the same: import { useForm as useReactHookForm } from '@pankod/refine-react-hook-form'
Omer
Omer3y ago
hmm why did you import two forms?
rare-sapphire
rare-sapphire3y ago
Both are two different things right?
Omer
Omer3y ago
@pankod/refine-react-hook-form package extends useForm already in core. So just use @pankod/refine-react-hook-form
rare-sapphire
rare-sapphire3y ago
Ohh
Omer
Omer3y ago
const userRolesList = useList<IUserRoles>({
resource: "userRoles",
metaData: { fields: [ "id", "type" ] }
})

const { register, handleSubmit } = useReactHookForm({
refineCoreProps: {
action: "edit",
metaData: { fields: [ "id", "name", { user_roles: ["id", "type"], } ] }
}
})

const formSubmitHandler = e => onFinish(e)
const userRolesList = useList<IUserRoles>({
resource: "userRoles",
metaData: { fields: [ "id", "type" ] }
})

const { register, handleSubmit } = useReactHookForm({
refineCoreProps: {
action: "edit",
metaData: { fields: [ "id", "name", { user_roles: ["id", "type"], } ] }
}
})

const formSubmitHandler = e => onFinish(e)
rare-sapphire
rare-sapphire3y ago
Omer
Omer3y ago
Yes definitely, you can have a look here to use the properties in core https://refine.dev/docs/packages/documentation/react-hook-form/useForm/#properties
rare-sapphire
rare-sapphire3y ago
Working fine now Thank you soo much Ömer Wouldn't have found this if it was not for you
Omer
Omer3y ago
Hooray!! parrot Do you think we should update the document so others don't make this mistake?
rare-sapphire
rare-sapphire3y ago
Yes definitely, I have gone through the documentation many times, but never came across this It will be a great help for everybody
Omer
Omer3y ago
Great, what kind of enhancement do you think would work?
rare-sapphire
rare-sapphire3y ago
My bad, its already there.
No description
rare-sapphire
rare-sapphire3y ago
Dunno how I missed it
rare-sapphire
rare-sapphire3y ago
useForm | refine
refine offers a React Hook Form adapter(@pankod/refine-react-hook-form) that allows you to use the React Hook Form library with refine. Thus, you can manage your forms in headless way.
Omer
Omer3y ago
ohh okay, thank you! 🎁

Did you find this page helpful?