Skip to content

Conversation

@ammar-agent
Copy link
Collaborator

Summary

Consolidate all Storybook stories to full-app only - no more isolated component stories. Every visual state is now tested in context, showing how changes will actually appear to users.

Changes

Deleted (22 files, ~5,800 lines)

  • All individual component stories in src/browser/components/
  • Original src/browser/App.stories.tsx

Created (2 files, ~1,800 lines)

  • src/browser/stories/mockFactory.ts - Composable mock infrastructure
  • src/browser/stories/App.stories.tsx - 17 full-app stories

New Story Organization

Area Stories
Empty/Welcome WelcomeScreen
Sidebar & Navigation SingleProject, MultipleProjects, ManyWorkspaces
Git Status GitStatusVariations (clean, ahead, behind, dirty, diverged, SSH)
Chat Messages ChatConversation, ChatWithReasoning, ChatWithTerminal, ChatWithAgentStatus
Streaming StreamingState (pending tool calls)
Markdown MarkdownTables, CodeBlocks
Media MessageWithImages
Errors StreamError, HiddenHistory
Diffs LargeDiff
Comprehensive ComprehensiveDemo (exercises everything)

Benefits

  1. Context is king - Every visual state shown in full app
  2. DRY mock infrastructure - Composable factories eliminate duplication
  3. Maintainable - Adding stories = combining existing building blocks
  4. Realistic - Stories exercise real app behavior
  5. ~70% less code - 1,800 lines vs ~5,800 previously

Generated with mux

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.

ℹ️ 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".

@ammar-agent ammar-agent force-pushed the full-app-storybook-refactor branch 3 times, most recently from 170694c to cf0b867 Compare December 1, 2025 20:46
Consolidate all component stories into full-app stories, then split the
mega-file into focused story files organized by functional area.

src/browser/stories/
├── mockFactory.ts      (542 lines) - Composable mock builders
├── storyHelpers.ts     (189 lines) - Reusable setup patterns
├── meta.tsx            (47 lines)  - Shared Storybook config
├── App.welcome.stories.tsx  - Empty/welcome states
├── App.sidebar.stories.tsx  - Project navigation, git status
├── App.chat.stories.tsx     - Conversations, tools, reasoning
├── App.markdown.stories.tsx - Tables, code blocks
├── App.media.stories.tsx    - Image attachments
├── App.errors.stories.tsx   - Stream errors, hidden history
└── App.demo.stories.tsx     - Comprehensive feature demo

- setupSimpleChatStory() - One workspace with static messages
- setupStreamingChatStory() - Active streaming state
- setupCustomChatStory() - Custom chat handler for edge cases
- selectWorkspace() - Set localStorage for workspace selection

Each story file is now ~100-200 lines, focused on a single area.

_Generated with `mux`_
@ammar-agent ammar-agent force-pushed the full-app-storybook-refactor branch 4 times, most recently from 4f44599 to 69efc29 Compare December 2, 2025 03:41
Add stories for all Settings modal sections:
- General (theme toggle)
- ProvidersEmpty (no providers configured)
- ProvidersConfigured (with API keys set)
- ModelsEmpty (no custom models)
- ModelsConfigured (with custom models)

Uses play functions to open the settings modal and navigate to sections.
Added @storybook/test dependency for interaction testing utilities.
@ammar-agent ammar-agent force-pushed the full-app-storybook-refactor branch from 69efc29 to e842a2e Compare December 2, 2025 03:44
@ammario ammario merged commit 372f0d9 into main Dec 2, 2025
18 of 19 checks passed
@ammario ammario deleted the full-app-storybook-refactor branch December 2, 2025 04:28
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.

2 participants