national-gold
national-gold17mo ago

Using response data in errorNotification useForm

Hello, My REST API sends a JSON with explanation of what's wrong with the response when request fails(4xx response code) . How do I use that response data inside errorNotification property of useForm hook? In error argument I only have an Error object, not the response data.
26 Replies
kapa.ai
kapa.ai17mo ago
Hey @metammodern! I'm the kapa.ai support bot. I've searched through the docs to try to answer your question. :wave:
kapa.ai
kapa.ai17mo ago
---------------------- Hmm, I don't know enough to give you a confident answer yet. However, you can refer to the refine documentation (https://refine.dev/docs) for more information on how to handle specific scenarios with the hooks provided by refine. ----------------------
Overview | refine
What is refine?
kapa.ai
kapa.ai17mo ago
<@689885255921827855> kapa.ai is still learning and improving, please let us how it did by reacting below
national-gold
national-gold17mo ago
Okay, nevermind, I found out how to do it. There is a response object in that error. Is there a way to add correct typings for the errorNotification and successNotification functions in useForm?
No description
grumpy-cyan
grumpy-cyan17mo ago
Hey @metammodern, You can checkout our useForm doc and see errorNotification and successNotification sections here: https://refine.dev/docs/api-reference/core/hooks/useForm/#errornotification Also, you can see useForm type params in here: https://refine.dev/docs/api-reference/core/hooks/useForm/#type-parameters You can give types like following:
useForm<TData, TError, TVariables>()
useForm<TData, TError, TVariables>()
national-gold
national-gold17mo ago
Thank you. In v3.x.x.x do those type pass into functions correctly? Because for all parameters I have "unknown" type. Also, I saw the documentation, it lacks examples of using response data
grumpy-cyan
grumpy-cyan17mo ago
All of them avaible in v3. Actually, all of generics has default types different from “unknown”. I think this must be what you're looking at: https://refine.dev/docs/api-reference/core/providers/data-provider/#error-format
Data Provider | refine
The data provider acts as a data layer for your app that makes the HTTP requests and encapsulates how the data is retrieved. refine consumes these methods via data hooks.
national-gold
national-gold17mo ago
Huh, that's odd Okay, I'll provide screenshots tomorrow of what I see in vscode
national-gold
national-gold17mo ago
@salihozdemir here's what I get
No description
national-gold
national-gold17mo ago
But I see that in d.ts in refine it's generic. So maybe I just wrote something incorrectly.
grumpy-cyan
grumpy-cyan17mo ago
Hey @metammodern, You're absolutely right, it's a bug. We missed to pass generic types to SuccessErrorNotification interface. You can see in here: https://github.com/refinedev/refine/blob/next/packages/core/src/hooks/form/useForm.ts#L140 Can you create an PR for this? All you have to do is change this line:
- SuccessErrorNotification
+ SuccessErrorNotification<TData, TError, TVariables>
- SuccessErrorNotification
+ SuccessErrorNotification<TData, TError, TVariables>
national-gold
national-gold17mo ago
Okay, will do Will the update go to v3 or v4?
grumpy-cyan
grumpy-cyan17mo ago
You can create a branch on next. For more details: https://refine.dev/docs/contributing/
national-gold
national-gold17mo ago
GitHub
WIP: Update Generic Typings for useForm and useCustomMutation Notif...
IMPORTANT: Please do not create a Pull Request without creating an issue first. Any change needs to be discussed before proceeding. Failure to do so may result in the rejection of the pull request....
grumpy-cyan
grumpy-cyan17mo ago
Thanks, we'll review your request and contact you shortly 🚀
national-gold
national-gold17mo ago
@salihozdemir hi, Is there any way to declare templates for notifications at some high level? My API always gives same sceme for when success and when error happens. I don't feel like copypastings errorNotification function in every useForm call. Even that I extracted function into a reusable util, I still have to put it into every useForm call. @salihozdemir ?
grumpy-cyan
grumpy-cyan17mo ago
Hey @metammodern, Sorry for the late reply. There is a way to do for error notifications. You can find more information here: https://refine.dev/docs/api-reference/core/providers/data-provider/#error-format However, there is no way to do it for success notifications yet. Can you please create an issue for it? We will investigate it and see if is possible to add it.
national-gold
national-gold17mo ago
Thank you @salihozdemir , so I'll have to rewrite some methods of data provider, right? And just map whatever error comes to HTTPError fields. And the in useForm I don't have to write errorNotification, it will work on itself. Hope I got it right, thank you) For success: I'll see if it's possible to ignore I'll ignore. Shouldn't be hard But wait, @salihozdemir , the HTTPError object has only message and status fields. The notification, however, has also a description field and my backend sends description as well. Techincally API sends this object {error: string, message: string} And I use it like on screenshot above
national-gold
national-gold17mo ago
aaalright, from sources I see that you use statusCode in description field and message value as description. That's a bit misleading :)) but it's okay
No description
grumpy-cyan
grumpy-cyan17mo ago
I'm glad to hear that, However, you're right, it doesn't enough to cover every case. Globally, there must be a way to handle all notification in a single place. We'll be very happy if you open an issue with your suggestion 🙏
national-gold
national-gold17mo ago
Okay, will do @salihozdemir . I already have a bunch of issues to create in your repo hehe. But one last thing to finish my task: Can you please tell how do I customize this modal when deleting an resource item?and also this notification. I want it to show which resource name was deleted(or resource id, depending on use case)
No description
No description
grumpy-cyan
grumpy-cyan17mo ago
You can use swizzle command for customization our components. In your case, you need to customize the DeleteButton. You can find more info here: https://refine.dev/docs/packages/documentation/cli/#swizzle For notifications, you check out this: https://refine.dev/docs/examples/notification-provider/react-toastify/ You can handle your notifications with any notification libraries using notificationProvider.
national-gold
national-gold17mo ago
Yes, I know about the notificationProvider, I was talking more about still using the same default provider, just changing the text. Probably swizzle is what I need, but I get this error: I'll try to find the reason, I had it before as well
No description
national-gold
national-gold17mo ago
@salihozdemir I didn't find the reason. Should I create an issue?
grumpy-cyan
grumpy-cyan17mo ago
Of course, you can create an issue. Just make sure to include the information to reproduce the problem.
national-gold
national-gold17mo ago
Okay done. Closing this thread as resolved. Thank you