React best practices using constant data

Question

I am trying to figure out what is the best practice for saving constant data needed in UI. The DB stores the a lot of data which I display in my react project, for instance lets say the DB is worker DB which contains lots of data for employees (types, contacts, personal information etc..)

I need to display the type of each worker with a specific color and background color. for example as for regular workers I want the color to be #e7d2ec and the background #990098 while for contractors i want it to be #f6d2d5 and #fb5658. I have many types of employment and I have those types inside my DB table.

My question is: where do I store the color scheme?

1) inside the DB, new table which contains the worker type, and its colors.

2) inside the react constant files?

3) something else?

I chose number 2. What I did so far is this:

created new constant inside my react project:

Then inside my css I used the props provided to know which color to choose

and this is the result

But I was told its not the best practice since If a new status is created I'll need to make changes inside the code, and not just alter the DB.

It just feels wrong to store UI only related data inside the DB since its not something that serves my back-end application, but I'm not sure its correct.

What do you think? Thanks in advance

Answer 1

It depends on your cases:

• If your users can change themselves the color and use custom colors: Store it in DB.

• If your list doesn't change often: Keep in React constant file.

• If your list changes often and users can't use custom color: It Depends.

  • If only developer can add new colors: Keep in React constant file.
  • If your color can be added by someone else: Store it in DB.