Skip to content

feat(ui): Polish empty states with ContextualEmptyState component#212

Merged
dgarson merged 1 commit intofeat/horizon-ui-phase1-cleanupfrom
feat/horizon-ui-phase3-empty-states
Mar 3, 2026
Merged

feat(ui): Polish empty states with ContextualEmptyState component#212
dgarson merged 1 commit intofeat/horizon-ui-phase1-cleanupfrom
feat/horizon-ui-phase3-empty-states

Conversation

@dgarson
Copy link
Owner

@dgarson dgarson commented Mar 3, 2026

Summary

Fixed 11 views with poor empty state implementations by replacing inline text/emoji empty states with the ContextualEmptyState component.

Changes

Each empty state was improved to include:

  • Helpful icon — Uses a Lucide icon component, not emoji
  • Clear message — Contextual headline and description
  • Action button — Primary and/or secondary CTA to resolve
  • Proper spacing — Uses size prop (sm/md/lg) for appropriate density

Views Fixed

View Icon Actions
FeatureFlags.tsx Flag Create Flag
ExperimentDashboard.tsx FlaskConical New Experiment
ContentModerationQueue.tsx ShieldCheck Clear Filters
ChaosEngineeringDashboard.tsx Bug, AlertTriangle Clear Filter, New Experiment
EnvironmentManager.tsx Variable Add Variable, Clear Filters
DiscoveryRunHistory.tsx Compass Clear Filters
DatabaseSchemaViewer.tsx Search, FileSearch2
MessageQueueManager.tsx Inbox
OpenAPIExplorer.tsx FileCode2
KnowledgeBase.tsx BookOpen New Doc, Clear Filters
PromptLibrary.tsx MessageSquareText New Prompt, Clear Filters

Documentation

See apps/web-next/EMPTY_STATES_AUDIT.md for detailed documentation of all changes.

Testing

  • pnpm build # ✅ Passed
  • 
    

🧱 Generated by Wes

- Replace inline emoji/text empty states with ContextualEmptyState
- Add contextual icons, descriptions, and action buttons
- Fix 11 views with poor empty state implementations:
  - FeatureFlags.tsx
  - ExperimentDashboard.tsx
  - ContentModerationQueue.tsx
  - ChaosEngineeringDashboard.tsx (FindingsTab + ActiveRunsTab)
  - EnvironmentManager.tsx
  - DiscoveryRunHistory.tsx
  - DatabaseSchemaViewer.tsx (SearchTab)
  - MessageQueueManager.tsx
  - OpenAPIExplorer.tsx
  - KnowledgeBase.tsx
  - PromptLibrary.tsx

Co-authored-by: Wes <wes@openclaw.ai>
@dgarson dgarson merged commit ee551bc into feat/horizon-ui-phase1-cleanup Mar 3, 2026
2 of 6 checks passed
@dgarson dgarson deleted the feat/horizon-ui-phase3-empty-states branch March 3, 2026 20:28
Copy link

@chatgpt-codex-connector chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: dcce67754c

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

Comment on lines +508 to +510
setSearch("");
setScopeFilter("global");
},

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P2 Badge Reset all filters in empty-state "Clear Filters" action

The new empty-state secondary action in EnvironmentManager is labeled "Clear Filters", but it only clears search and forces scopeFilter to "global" while leaving typeFilter and agentFilter unchanged; this can leave users stuck in an empty state after clicking the CTA. In this same view, the existing filter-bar clear button resets all filters to "all", so this new behavior is inconsistent and makes the empty-state recovery path unreliable when type/agent filters are active.

Useful? React with 👍 / 👎.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant