SPA - Manage authorization based on resources and roles

Question

I'm developing a Single Page Application using ReactJS + .Net Core 5 which has several fine-grained authorization checks. So, in my application there are users, roles and userroles to link these two information. Then, I have a Permissions table and RolesPermissions to link the permissions (or actions) for each roles. But this diagram cannot work correctly because some roles are tailored on resources (so, I can be Editor on resource A and Reader of resource B, where A and B are the same type of resource). To summarize, some roles are directly linked to resource.

How can I manage the authorization in this case? I read on Resource-Based authorization (https://learn.microsoft.com/en-us/aspnet/core/security/authorization/resourcebased?view=aspnetcore-2.1&tabs=aspnetcore2x#operational-requirements), but in this case the permissions design on database side would be useless and I have to write a lot of C# code to manage each possibilities (a lot of if/else). I'm looking for some alternatives... also because, after correctly managed the permisssions on backend side, I need to pass information to frontend in order to segregate the layout (for example, the button "Create" must not be displayed if you are only reader on a specific resource).