genetic-orange
genetic-orange•2y ago

How can i create a custom action for a resource?

I want to create an action similar to "edit" but with a different name, is it possible?
9 Replies
kapa.ai
kapa.ai•2y ago
Hi @memento000. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Yes, it is possible to create a custom action similar to "edit" with a different name. In refine v4, you can define your actions as paths instead of components, allowing you to create custom routes for actions without being restricted to the routes created automatically. You can take advantage of the full potential of your router by defining custom routes for your actions. Here's an example of defining custom routes for actions in the resources prop:
resources={[
{
name: "products",
list: "/:tenantId/products",
show: "/:tenantId/products/:id",
edit: "/:tenantId/products/:id/edit",
create: "/:tenantId/products/create",
// Add your custom action route here
customAction: "/:tenantId/products/:id/custom-action",
}
]}
resources={[
{
name: "products",
list: "/:tenantId/products",
show: "/:tenantId/products/:id",
edit: "/:tenantId/products/:id/edit",
create: "/:tenantId/products/create",
// Add your custom action route here
customAction: "/:tenantId/products/:id/custom-action",
}
]}
In this example, a custom action named customAction is added with a custom route. You can implement the logic for this custom action in your application. For more information on enterprise-grade routing in refine, refer to the refine v4 announcement (https://refine.dev/blog/refine-v4-announcement). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai•2y ago
<@940544202788458566> kapa.ai is still learning and improving, please let us how it did by reacting below
genetic-orange
genetic-orange•2y ago
@kapa.ai I already tried but is not working combined with useResource
kapa.ai
kapa.ai•2y ago
Let me check the knowledge base for you. One moment! :books: ---------------------- I apologize for the confusion. The useResource hook is designed to work with the predefined actions like list, create, edit, show, and clone. To use a custom action with useResource, you can try the following workaround: 1. Add your custom action to the resources prop:
resources={[
{
name: "products",
list: "/:tenantId/products",
show: "/:tenantId/products/:id",
edit: "/:tenantId/products/:id/edit",
create: "/:tenantId/products/create",
// Add your custom action route here
customAction: "/:tenantId/products/:id/custom-action",
}
]}
resources={[
{
name: "products",
list: "/:tenantId/products",
show: "/:tenantId/products/:id",
edit: "/:tenantId/products/:id/edit",
create: "/:tenantId/products/create",
// Add your custom action route here
customAction: "/:tenantId/products/:id/custom-action",
}
]}
2. In your component, use the useResource hook to get the resource object:
const { resource } = useResource("products");
const { resource } = useResource("products");
3. Access the custom action path from the resource object:
const customActionPath = resource.customAction;
const customActionPath = resource.customAction;
4. Use the customActionPath in your application logic as needed. Please note that this workaround may not provide the same level of integration as the predefined actions. For more information on the useResource hook, refer to the useResource documentation (https://refine.dev/docs/api-reference/core/hooks/resource/useResource). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai•2y ago
<@940544202788458566> kapa.ai is still learning and improving, please let us how it did by reacting below
quickest-silver
quickest-silver•2y ago
Hey @memento000, Did the bot help you?
genetic-orange
genetic-orange•2y ago
Hi @salihozdemir , no. I checked the source code and I think is not possible to add a new custom action that work seameless with the hook etc. Probably the quickest way is to change the edit component.
quickest-silver
quickest-silver•2y ago
Hey @memento000, unfortunately there's no way to define a custom action. Of course you can create a new page and use the resource by passing it to the components/hooks. Can you explain your use case and how it would ease your work? Let's see if we can make this a feature 😅
If you think this will be a good addition to refine, you can create a feature request on github!
genetic-orange
genetic-orange•2y ago
Hi @aliemirs , I'm experimenting trying to find the best solutions, for example I set a 'group' resource with the actions: 'list', 'edit', 'create'. I'm trying to create a component to view and modify the active permissions for a specific group, creating this component and viewing the page the group item is no longer active in the side menu because I no longer have a reference to the resource. So I was wondering whether to create a custom action 'permission' to keep the reference with the resource 'group'. The other solutions I have in mind is to modify the menu to keep the item active in this case or to change the edit component to have a tab with this permission managment.