Grid contains transactions of a sort. Each transaction can be: Open, Closed, or Cancelled. There's a "Status" column, and each cell has one of the 3 words in it: Open, Closed, or Cancelled.

Now, Open, Closed, or Cancelled, is just the highest level status. Each category, has between 10-20 sub-statuses. Like, if the transaction is Open, which team is it Open with? Legal, Compliance, Operations, or other.

What are some good ways to show this sub-status?

  1. I was thinking maybe on hover.

  2. Or an extra column that shows on default, but user can hide if they want to.

  3. Or maybe it's all together, in one cell, like this, "OPEN: awaiting Legal approval". But I don't know if this is feasible from a TECH perspective?

Any other ideas?

Thank you.

  • Hi Yelena! Could you provide some mock-ups of your ideas?
    – Aline
    Commented Jan 22, 2020 at 15:39

2 Answers 2


Could it be an option to show the additional information in an expandable row within the table?

I assume the users are interested in the Status, and only then, they may be interested in the further details of that given item.
So, perhaps a progressive disclosure could be a possible scenario here.

(I found an example on the internet, just to convey the behaviour: https://codesandbox.io/s/collapsible-table-rows-in-react-ybb28)

expandable row


Consider representing those top-level statuses using colour and/or pattern, then the text can focus on conveying any sub-status.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.