Redirect to resource/show/:id After Creating Said Resource
Hello! I'd like to redirect the user to the newly-created resource after they've created it.
How could I go about this? Would it just be useLink, or is there a simpler method?
14 Replies
Hi @avangeous. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Yes, you can achieve this by using the
redirect
option in the <Refine>
component. By default, refine redirects to the list
page of the resource after a successful form mutation. However, you can change this behavior based on the form action.
Here's an example of how you can set the redirect
option to redirect the user to the show
page after they've created a new resource:
In this example, after a successful create
action, the user will be redirected to the show
page of the newly created resource. If the redirect
option is set to false
, no redirect is performed after a successful form mutation.
Please note that if you don't have a show
page and you redirect to the show
page, the user will be redirected to the list
page. Also, in the undoable
and optimistic
mutation modes, redirect happens before the mutation succeeds. Therefore, if there is no data in the query cache, the user will be redirected to the list
page.
You can find more information about this in the refine documentation (https://refine.dev/docs/api-reference/core/components/refine-config).
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@1122927158348763206> kapa.ai is still learning and improving, please let us know how it did by reacting below
sensitive-blue•13mo ago
@kapa.ai
I've added
To my <Refine/> component. /show/:id exists for the resource, but it's still redirecting me to the list page. Are the afterClone, afterEdit attributes required?
Let me check the knowledge base for you. One moment! :books:
----------------------
No, the
afterClone
and afterEdit
attributes are not required for the redirect
option in the <Refine>
component. The afterCreate: "show"
option should redirect you to the show
page of the newly created resource after a successful create
action.
However, there are a few things to note:
1. If you don't have a show
page and you redirect to the show
page, the user will be redirected to the list
page. Make sure that the show
page for the resource exists and is properly configured.
2. In the undoable
and optimistic
mutation modes, redirect happens before the mutation succeeds. Therefore, if there is no data in the query cache, the user will be redirected to the list
page.
If you've checked these points and the issue persists, it might be due to some other configuration or code issue. You can find more information about the redirect
option in the <Refine>
component in the refine documentation (https://refine.dev/docs/api-reference/core/components/refine-config).
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@1122927158348763206> kapa.ai is still learning and improving, please let us know how it did by reacting below
quickest-silver•13mo ago
Hey @avangeous, last answer of @kapa.ai looks correct 😅 The mutation of the form needs to be done in
pessimistic
mode to make sure refine has the id
.
You can set it either globally by using <Refine>
component or in useForm
hook for that specific call by setting mutationMode: "pessimistic"
If your app is already running on pessimistic
mutation mode and the issue continues, you may need to check the response of the create mutation, while doing so, you may want to set redirect: false
for easier debugging.
The response should contain the id
property with the correct value of the created item. This is the expected response, if your response has proper id
but the redirect is still not happening correctly, we can move this to GitHub issues 🙏
If the issue continues, can you please try to provide a basic repro for us to debug? 🙏Let me check the knowledge base for you. One moment! :books:
quickest-silver•13mo ago
But anyways, the
mutationMode
and the mutation response are the critical parts where I think they will resolve this issue 🚀----------------------
Yes, you're correct. The mutation mode of the form needs to be set to
pessimistic
to ensure that refine has the id
of the newly created resource before the redirect happens. You can set this either globally in the <Refine>
component or locally in the useForm
hook for that specific call.
Here's how you can set the mutation mode to pessimistic
in the <Refine>
component:
And here's how you can set it in the useForm
hook:
If your app is already running in pessimistic
mutation mode and the issue persists, you might want to check the response of the create mutation. For easier debugging, you can set redirect: false
.
The response of the create mutation should contain the id
property with the correct value of the created item. If your response has the correct id
but the redirect is still not happening correctly, it might be a good idea to move this to GitHub issues for further investigation.
If the issue continues, providing a basic reproducible example would be very helpful for debugging.
You can find more information about the mutationMode
and redirect
options in the refine documentation (https://refine.dev/docs/api-reference/core/components/refine-config).
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@339382369469595651> kapa.ai is still learning and improving, please let us know how it did by reacting below
sensitive-blue•13mo ago
I figured it had something to do with not getting the id 🤔
I just tried the
mutationMode="pessimistic"
inside the Refine component like the bot mentioned, but its telling me that Property 'mutationMode' does not exist on type 'IntrinsicAttributes & RefineProps'.
I also tried
but that didn't seem to work. How do I go about setting it globally?quickest-silver•13mo ago
Passing it inside
options
is the correct way.
Do your create call return the id
value of the created entity?sensitive-blue•13mo ago
I believe it does, but let me double check
Ahh, found the reason, I hadn't checked the error
_app.tsx
was showing me 😂 I had two 'options'quickest-silver•13mo ago
😅