Status Card
A card showing a state badge, label, and short note together. Use it on dashboards to surface health, order, or system status at a quick glance.
A card showing a state badge, label, and short note together. Use it on dashboards to surface health, order, or system status at a quick glance.
Search blocks by description or jump to a page.
Status Card is a single contained card for surfacing the current state of a resource at a glance. A title and short description sit in the header alongside a badge that reads the current status. The body holds a compact key/value list: uptime, last deployed time, and environment, each on its own row with the label on the left and the value on the right. Two buttons anchor the footer, one for viewing logs and one for jumping to a management view.
Every piece of that structure is independent. You can relabel the header for an AI job, a pipeline run, or an order, swap the badge text and variant to reflect any state, replace the three metadata rows with whichever fields matter, and retitle or hide either footer button without touching the rest.
Reach for this block anywhere a user needs to confirm that something is running, complete, or stalled without opening a detail page. It fits a sidebar widget on an AI assistant dashboard, the top of a model run detail view, or a grid of agent statuses on an ops screen. Compared to a plain alert or banner, this card keeps structured metadata readable next to the state label instead of flattening it into a single line.
A natural flow around it on a Components page:
Before
After
Any resource that has a discrete state and a handful of supporting facts is a good fit. A few common uses:
Tip: keep the metadata list to three or four rows so the card stays compact; push longer details to the linked view behind the footer button.