Struggling with tags in list view

  • Goal: I'm building a list view of customer activity and expecting to display the activity type in tags format

  • Steps: I have a list view that repeats the latest 5 customer activities. It works well.
    msedge_2024-08-09_17-50-42
    however when I try to display the activity type in tag format, the behavior is confusing

  • Details: Basically, when I the tags component and link it to my activity query, and map the results to the tags component, instead of getting the activity type per customer displayed as tag, retool is almost like creating a set of all unique activity types from each activity and displays them as tags. No matter what I do the component treats the value as an array and displays three tags instead of the relevant activity type only.
    msedge_2024-08-09_17-53-50

I'm at a loss, I tried changing the query output using formatAsArray and formatAsObject but that didn't help.
In my tags component I see this


My SQL is simply getting the last five activities

SELECT ca.title, ca.body, ca.id AS activity_id, ca.created_at, u.name AS csm_name, u.email AS csm_email, u.id AS csm_id, ca.type

from customer_activities ca
LEFT JOIN users u
  ON u.id = ca.csm_id

WHERE 
  ca.customer_id = '{{ customer_list.selectedRowKey }}'
ORDER BY ca.created_at desc
LIMIT 5

I saw this in the retool doc page, so it can be done, however I'm not sure if they're using mapped values or manual values in this image

Hi there @TehITGuy,

How have you mapped your tags data source?? Have you used item.typr as well?? The data source is expecting and array, so if what your query is returning is a simple string , e.g. "Cadence" then I think something like [{{item.type}}] in your mapping and the simply {{ item}} in your value and tag should work.

I'm not sure I follow. My data source is my activities query, since it contains the 1:1 relationship between the activity and the type so that's what I'm pulling.

I managed to get it working with this
msedge_2024-08-10_12-00-39

lastActivities is the list view component, and I'm pulling the item.type value from it.

I'm not sure if this is the right way or not, but it's working. I'm sure there must be a better way to do this, but for now this is working.

So, as your tags component is within a listView, you can use {{ item }} in the tags data source to refer to the data referring to each instance (which is basically what you've done by referring to the listView).

Thanks man, that worked as well!

1 Like