Skip to content

Add empty states and loading skeletons across pages #14

@BunsDev

Description

@BunsDev

Problem

Pages like traces, workflows, artifacts, and memory show blank content when there is no data or while data is loading. This creates a confusing experience — users can't tell if data is loading, if there's an error, or if the page is simply empty.

Proposed Solution

Empty States

Add illustrated empty states with:

  • A relevant icon or illustration
  • A descriptive message (e.g., "No traces yet")
  • A call-to-action where appropriate (e.g., "Run your first ingestion" with a link to docs)

Loading Skeletons

Add skeleton placeholders that match the layout of the actual content:

  • Table rows for list pages
  • Card placeholders for dashboard
  • Text block placeholders for detail pages

Pages to Update

  • /dashboard — skeleton for charts and metric cards
  • /traces — empty state + table skeleton
  • /workflows — empty state + table skeleton
  • /artifacts — empty state + grid skeleton
  • /memory — empty state + list skeleton
  • /investigations — empty state + list skeleton
  • /calendar — empty state for days with no activity

Acceptance Criteria

  • Every list/table page has a meaningful empty state
  • Loading states use skeleton components (shadcn/ui Skeleton already available)
  • Empty states include actionable next steps where relevant
  • Consistent visual style across all empty states

🤖 Generated with Claude Code

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or requestgood first issueGood for newcomersuxUser interface and experience

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions