Specific Tag colors for KeyValue component not working

[audreyanne96]

• Goal: I want to set the colors of the tags in the KeyValue component to specific colors but it's not working when published. Any ideas?

• Steps: I've unchecked the assign tag colors automatically and coded in the Color, for example:

For the owner tag:

{{view_filteredtickets.selectedRow.owner_color || '#717C89'}}

For the primary color and secondary color tags:

{{item}}

• Details: The same code is working in the table component but not in the KeyValue component. To make the color show up, I have to be in edit and re-enter the same code. So it feels like a bug? Would still like help if anyone knows a work around.

• Screenshots:

How the above code for the KeyValue component looks like

Here's the same code working in the table:

[Jack_T]

Hello @audreyanne96!

That is very odd that the code for the tags works in the table but not they key-value component.

Could you share a screen shot of where in the component you put the code block {{view_filteredtickets.selectedRow.owner_color || '#717C89'}} ?

I can look to reproduce it, if there is a bug we can report it to the eng team to work on!

You also mentioned "To make the color show up, I have to be in edit and re-enter the same code" do you mean that you are able to get the color to show up with the above code block in the editor but it does not show the color when the app is published?

[audreyanne96]

Hey Jack --

I'm using the colors in a number of tags in the key-value component (see screenshot below). The owner and assignee tags are working well now (not sure when they started working well). Can't say the same for the other tags.

For owner and assignee which are working, they are similarly like:

{{view_filteredtickets.selectedRow.owner_color || '#717C89'}}

For priority, status, channel, pending info? and photos? which are NOT working:

{{
  item === 'Today - URGENT' ? '#92140C' : (
    item === 'Today - Not Urgent' ? '#BE7C4D' : (
      item === 'Demo Date' ? '#FFCF99' : (
        item === 'On Hold' ? '#F5F3BB' : null
      )
    )
  )
}}

For primary color and secondary color which are also NOT working:

{{item}}

The above are largely similar to the method I used for the table component.
Hope this clarifies!

[Jack_T]

@audreyanne96 Thank you so much for the clarifitcation!

All the details and screen shots helped out a ton, I was able to reproduce and the colors were not chagning in the Key-Value component as they should when the table had different rows selected.

I noticed this is an already reported issue and have tagged on your post to the issue thread! It should hopefully get some attention and I will keep you updated on any patches/bug fixes!

You did everything correct, my apologies for the issue!

[audreyanne96]

Sounds good! Thanks so much for the response and action on this.