CloneButton is not working
I have added a clone button on my list of data but the when I click on it it doesn't redirect me to the clone page. In version 3 there was not any issue but in version 4 it is not working.
11 Replies
Hi @dipbazz. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
In version 4, the
resourceNameOrRouteName
prop is deprecated, and you should use the resource
prop instead. This might be the reason why the CloneButton is not working as expected. Here's an example of how to use the resource
prop with the CloneButton:
Clicking the button will trigger the clone
method of useNavigation
(https://refine.dev/docs/api-reference/core/hooks/navigation/useNavigation/) and then redirect the app to /categories/clone/2
.
Make sure to update your CloneButton component with the resource
prop, and it should work as expected.
Sources:
- MUI CloneButton (https://refine.dev/docs/api-reference/mui/components/buttons/clone-button)
- AntD CloneButton (https://refine.dev/docs/api-reference/antd/components/buttons/clone-button)
- Mantine CloneButton (https://refine.dev/docs/api-reference/mantine/components/buttons/clone-button)
- Chakra-UI CloneButton (https://refine.dev/docs/api-reference/chakra-ui/components/buttons/clone-button)
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------useNavigation | refine
useNavigation is a hook that provides methods to navigate the app. Internally, it uses the go method of the routerProvider.
Clone | refine
Material UI component. It uses the clone
method from useNavigation under the hood.Clone | refine
uses Ant Design's component. It uses the clone
method from useNavigation under the hood.Clone | refine
uses Mantine's component. It uses the clone
method from useNavigation under the hood.Clone | refine
uses Chakra UI's component. It uses the clone
method from useNavigation under the hood.<@494653850632978472> kapa.ai is still learning and improving, please let us how it did by reacting below
fascinating-indigo•2y ago
@kapa.ai I have added a resource prop, but it still doesn't redirect me to the clone page.
Let me check the knowledge base for you again. One moment! :books:
----------------------
Hmm, I don't know enough to give you a confident answer yet. I recommend checking the refine documentation (https://refine.dev/docs) for more information on how to properly implement the CloneButton and other components.
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------Overview | refine
What is refine?
<@494653850632978472> kapa.ai is still learning and improving, please let us how it did by reacting below
ugly-tan•2y ago
Hey @dipbazz, yo'll also need to define a
clone
action in your resource definition to make it available for a resource.fascinating-indigo•2y ago
Hey @aliemirs should I also create a component for clone?
ugly-tan•2y ago
Yes, you'll also need to define a route for it. The component can be same with the
create
action if you don't have action: "create"
in its hooks and infer it from the route.
In the earlier versions, we were creating a route like /<resource>/clone/id
and render the same component that you're passing to the create
action. With the new version, this is now on user space.fascinating-indigo•2y ago
Thank you @aliemirs for your response. I solved my problem.