How to control the visibility of UI elements depending on user rights?

Question

Spring

Good afternoon!
There is a hypothetical web application. Back to Spring, front to React as a standalone application. There are users with different rights (Spring Security). Some interface elements need to be hidden from some users, depending on the rights. For example, menu items, buttons, that's all.
If the front was in Thymeleaf, we would use a construction like this for this. Question: how is this task solved in general terms when the front is written in a JS framework? Are there any practices or recommendations? So far, it only comes to mind with a separate request to receive information from the back about the availability of an interface element for the user. But the solution is obviously not very elegant and, therefore, most likely not correct. How do people generally solve this problem in general terms? Thank you!
<div sec:authorize="isAuthenticated()">

Answer 1

When on the SPA front, it is worth using JWT - for successful authentication by a login-password pair, give a token from the server containing information about rights. The front will display interface elements in accordance with the information from the token, and for actions requiring authorization, pass this token to the back for verification.