useCan() Based off Page Access

Hi! I'm currently using the following for action access on a table.

const { data: canAccess } = useCan({
        resource: resource,
        action: "field",
        params: { field: "actions" },
    })

const { data: canAccess } = useCan({
        resource: resource,
        action: "field",
        params: { field: "actions" },
    })

However, I'd like to avoid adding field permissions for each user type. Rather, I'd like to have it so that anyone with access to the resource page in the first place can view it. How could I change this?

5 Replies

kapa.ai•10mo ago

Hi @avangeous. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Sure, if you want to allow anyone with access to the resource page to view it, you can change the action parameter in your useCan hook to a different action like "show" or "list". This way, you're checking if the user has permission to view the resource, not just a specific field. Here's how you can do it:

const { data: canAccess } = useCan({
    resource: resource,
    action: "show",
})

const { data: canAccess } = useCan({
    resource: resource,
    action: "show",
})

const { data: canAccess } = useCan({
    resource: resource,
    action: "list",
})

const { data: canAccess } = useCan({
    resource: resource,
    action: "list",
})

This will check if the user has permission to "show" or "list" the resource, rather than checking for field-level access. If the user has access to the resource page, canAccess will be true. Remember to handle the access control in your accessControlProvider's can method accordingly. Here's an example:

accessControlProvider={{
    can: async ({ resource, action }) => {
        const enforcer = await newEnforcer(model, adapter);

        if (action === "show" || action === "list") {
            const can = await enforcer.enforce(role, resource, action);
            return { can };
        }

        const can = await enforcer.enforce(role, resource, action);
        return { can };
    },
}}

accessControlProvider={{
    can: async ({ resource, action }) => {
        const enforcer = await newEnforcer(model, adapter);

        if (action === "show" || action === "list") {
            const can = await enforcer.enforce(role, resource, action);
            return { can };
        }

        const can = await enforcer.enforce(role, resource, action);
        return { can };
    },
}}

This way, the can method will handle "show" and "list" actions and return whether the user has the necessary permissions. For more information, you can refer to the Access Control Provider documentation (https://refine.dev/docs/api-reference/core/providers/accessControl-provider/) and the useCan documentation (https://refine.dev/docs/api-reference/core/hooks/accessControl/useCan/). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•10mo ago

<@1122927158348763206> kapa.ai is still learning and improving, please let us know how it did by reacting below

like-gold•10mo ago

Hello @avangeous I didn't fully understand what was wanted to be done. Can you give more details?

genetic-orange•10mo ago

The bot's solution solved it; the way I had it originally, I had to manually give 'field' access to each user. I just wanted to change it to anyone who has view access. A bit of a nothing question in retrospect, i'm just running on very little sleep right now 😅

like-gold•10mo ago

clever bot 🚀 sleep is important 🥲