[Task](ui): implement `Status` component

[franzheidl]

Task Description

Implement a Status component in ui-components as a single, unified way to communicate non-data states (in progress, error, empty, no matches) across our UIs. The component replaces ad-hoc app-level patterns (LoadingDataRow, ErrorMessage, ErrorFallback, etc.) and becomes the default drop-in when no custom solution is needed.

Scope

In scope:

• Application-, page-, and section-level states
• DataGrid inner states
• Error boundary fallbacks

Out of scope (stay as-is):

• Form validation (in-place)
• Authentication errors (SignIn page)
• Inline and asynchronous operation feedback (Message, Toast)

Anatomy

Status renders a <div> with a subset of the following elements, all optional:

• Error code (large display, for HTTP errors)
• Spinner (via the existing Spinner component)
• Title
• Body text
• Details (stack traces, server responses)
• Action slot

Sensible defaults for title, body, and spinner behaviour are provided per status value so the component is useful with zero configuration.

DataGrid Usage

Status has no DataGrid dependency and renders a <div> only — no table markup. When used inside a DataGrid, the caller wraps Status in the appropriate DataGridRow and DataGridCell with the correct colSpan. This establishes a DataGrid Status convention beyond the component itself.

Status consumes the existing DataGridContext to automatically apply compact styling (dimensions, font sizes) when rendered inside a DataGrid. No additional props or effort required from the caller. Outside a DataGrid context, default page-level sizing applies. className is available for any further adjustments.

Default Copy

Sensible defaults for title and body are provided per status value. For status="error", defaults follow the HTTP error code reference in the ux docs.

API

Prop	Type	Default	Notes
status	"progress" | "error" | "empty" | "no-matches"	???	Required or optional — TBD. If optional, what does Status render with no status set?
title	string	undefined	Optional, overrides the per-status default title if set
body	string	undefined	Optional, overrides the per-status default body if set
spinner	boolean	false (true when status="progress")	Optional. Renders a Spinner when true. Could later be extended to accept a ProgressBar instead.
code	number | string	undefined	Optional. Large display, intended for HTTP error codes.
details	string	undefined	Optional. Renders inside a <pre> using monospaced font, y-scrolls if max-height is exceeded.
action	ReactNode	undefined	Optional, typically a <Button> or button-styled anchor element.
className	string	undefined	Optional, appended at the end of the class attribute of the root <div>.

Visual Design

• Error and States Visual Design (Figma)

Sub-tasks

• Discuss and verify component scope
• Design props/API
• Decide: is status prop required or optional?
• Implement component, add stories
• Add to ux docs