DEV Community

Sabari S
Sabari S

Posted on

How to globally hide currency/amount fields in a React + Rails app based on user permissions?

I’m working on an application built with React 19 (frontend) and Ruby on Rails 5.0.7.2 (backend).
The requirement is to hide all currency/amount fields in the UI based on user permissions.
The backend provides a boolean flag (e.g. can_view_amount: true/false) that indicates whether the logged-in user has permission to see amount fields.

If the user does not have permission, then all amount fields throughout the app should be hidden.

This should be implemented in a scalable and future-proof way:

It should be a one-time implementation, not something we have to manually re-implement on every new screen.

Even if new screens are added in the future that display amounts, the same logic should automatically apply without developers forgetting to handle it.

Question:
What would be the best architectural approach or design pattern to implement this?
I’m considering:
A global wrapper/component for displaying amounts (that internally checks permission before rendering).

A higher-order component (HOC) or React Context solution to control visibility.

Any Rails-side suggestions for structuring the permission flag so it integrates cleanly with the frontend.

Has anyone solved a similar problem, and what’s the most maintainable way to ensure amount fields are consistently hidden across the app based on permissions ?

Top comments (0)