Take care if links in a layout are rendered

[mknet]

Hey @AlanWei,

I came up with the idea that the rendering of links should be not only dependent on one layout but also on a specific role. This is why I introduced a Link wrapper which does exactly this. Please have a look and tell me what you think.

Thanks in advance and regards Marcel

[AlanWei]

Hi @mknet!

Firstly thanks for the PR and I hope this lib provides some help in your project.

Regards to the Link issue you mentioned, my understanding is after config all the routes you need to use <Link to='/abc' /> within the app but you don't know whether it's a valid path or not. Correct me if I am wrong.

Considering this problem, my answer is you don't need to take care of it by yourself. As long as you define all routes in the router, for example, if a user with user role who wants to access <Link to='/abc'> but this route is defined as

{
  path: '/abc',
  exact: true,
  permissions: ['admin'],
  component: Abc,
  unauthorized: Unauthorized,
}

Then the permission check here

https://github.com/AlanWei/react-acl-router/blob/c88751f8b78c98e7cf96d457220ae97e537fc05a/src/AclRouter.jsx#L63

will help prevent the user to access the <Abc /> but render <Unauthorized />.

Hope this answers your question and let me know if there are any other issues. 🙂

[mknet]

Hey @AlanWei, sorry I haven't answered, yet. I'm very busy the last couple of weeks.

As far as I understand you there is only a way to render a component "Unauthorized" when the used tries to access a router he got no authorization for. But my idea in addition is to change the rendering of the links as well. So, that only links to authorized router getting rendered.

I know, that there is the idea of UnauthorizedLayout and AuthorizedLayout but I wanna be able to have more options than yes or no.

Do you get my idea?