Best practice for FE to show/hide links based on permissions

What’s the best practice for showing links/button based on permissions?

I have 2 choices:

  1. Filter the items at BE, and pass back the json to FE to render. FE has no knowledge about the permission. However, sometime the menu items/button contains links to another FE url, that means BE needs to have knowledge of FE.
  2. FE filter the links based on Roles (I can’t retrieve the permissions in FE, only can get Roles). That means user can inspect the roles in Javascript.

What is the general practice for this?

You can add the roles to the token then conditionally render UI based on that. That is typically the guidance for this type of thing.