feat: add preview launch configuration#129
Conversation
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (5)
🚧 Files skipped from review as they are similar to previous changes (5)
📝 WalkthroughWalkthroughThe preview CLI accepts pane, theme, and fit settings, passes them through serve-sim middleware, and injects them into browser configuration. The client uses these settings to initialize visible panels and simulator sizing. ChangesPreview startup state
Estimated code review effort: 3 (Moderate) | ~20 minutes Sequence Diagram(s)sequenceDiagram
participant CLI
participant serve
participant simMiddleware
participant PreviewClient
CLI->>serve: Build initialState from --panes and --fit
serve->>serve: Apply --theme to target devices
serve->>simMiddleware: Pass initialState
simMiddleware->>PreviewClient: Inject preview configuration
PreviewClient->>PreviewClient: Initialize panes and simulator fit
Possibly related PRs
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (2)
packages/serve-sim/src/middleware.ts (1)
819-865: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚖️ Poor tradeoffGrowing positional-parameter list on
previewConfigForState.The function now takes 7 positional params (
codec/proxyHelpersoptional with defaults,initialStatetrailing). Every call site must passundefined/falseplaceholders to reachinitialState, which is easy to get wrong as more options get added later.♻️ Suggested direction: collapse trailing options into a single object
-export function previewConfigForState( - state: ServeSimState, - base: string, - serveSimBin: string, - execToken: string, - codec?: string, - proxyHelpers = false, - initialState?: PreviewInitialState, -): ServeSimState & { ... } { +export function previewConfigForState( + state: ServeSimState, + base: string, + serveSimBin: string, + execToken: string, + opts: { codec?: string; proxyHelpers?: boolean; initialState?: PreviewInitialState } = {}, +): ServeSimState & { ... } { + const { codec, proxyHelpers = false, initialState } = opts;This would require updating all call sites and the test file, so weigh against the current low churn.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/serve-sim/src/middleware.ts` around lines 819 - 865, Refactor previewConfigForState to replace the trailing positional codec, proxyHelpers, and initialState parameters with a single options object, preserving their defaults and return behavior. Update every call site and related tests to pass named options, and verify existing endpoint and state construction remains unchanged.packages/serve-sim/src/client/utils/sim-endpoint.ts (1)
34-38: 🗄️ Data Integrity & Integration | 🔵 Trivial | ⚡ Quick winReuse the shared preview state type
initialStateshould usePreviewInitialStatefrompreview-initial-state.tsinstead of inlining the pane union, so the client-side window shape stays aligned with the server contract.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/serve-sim/src/client/utils/sim-endpoint.ts` around lines 34 - 38, Replace the inline initialState shape in the relevant client endpoint type with the shared PreviewInitialState type imported from preview-initial-state.ts, keeping the client and server preview state contracts aligned.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/serve-sim/src/client/client.tsx`:
- Line 96: The initial state derivation does not enforce mutual exclusivity
between the tools and devtools panes, allowing both right-edge panels to open
initially. Update the logic around `initialState` to detect when
`initialState.panes` contains both `tools` and `devtools`, then apply the
existing exclusivity rule so only the appropriate pane remains open before the
first render.
In `@packages/serve-sim/src/client/hooks/use-simulator-resize.ts`:
- Around line 44-52: Update the resize restoration logic around
`readRestoredWidth()` so the `initialFit` option is consumed only once, rather
than recalculating the fit-to-viewport width whenever `defaultWidth` changes.
Track whether the initial restore has already occurred, preserve the user’s
resized width for subsequent device switches, and keep normal default-width
updates working after that first restore.
---
Nitpick comments:
In `@packages/serve-sim/src/client/utils/sim-endpoint.ts`:
- Around line 34-38: Replace the inline initialState shape in the relevant
client endpoint type with the shared PreviewInitialState type imported from
preview-initial-state.ts, keeping the client and server preview state contracts
aligned.
In `@packages/serve-sim/src/middleware.ts`:
- Around line 819-865: Refactor previewConfigForState to replace the trailing
positional codec, proxyHelpers, and initialState parameters with a single
options object, preserving their defaults and return behavior. Update every call
site and related tests to pass named options, and verify existing endpoint and
state construction remains unchanged.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 84c0fb0a-db66-4114-9dac-75afb95dd47c
📒 Files selected for processing (9)
packages/serve-sim/README.mdpackages/serve-sim/src/__tests__/middleware-selection.test.tspackages/serve-sim/src/__tests__/preview-initial-state.test.tspackages/serve-sim/src/client/client.tsxpackages/serve-sim/src/client/hooks/use-simulator-resize.tspackages/serve-sim/src/client/utils/sim-endpoint.tspackages/serve-sim/src/index.tspackages/serve-sim/src/middleware.tspackages/serve-sim/src/preview-initial-state.ts
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/serve-sim/src/client/hooks/use-simulator-resize.ts`:
- Around line 68-73: Update readRestoredWidth so it remains pure during render
and no longer mutates initialFitConsumedRef.current. Move the one-time ref
mutation into an empty-dependency useEffect that runs after the initial mount
commits, while preserving the existing initialFit sizing behavior for the first
visible render.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 3c4b417a-9a42-41a9-bfce-258df8976e44
📒 Files selected for processing (6)
packages/serve-sim/README.mdpackages/serve-sim/src/__tests__/preview-initial-state.test.tspackages/serve-sim/src/client/client.tsxpackages/serve-sim/src/client/hooks/use-simulator-resize.tspackages/serve-sim/src/index.tspackages/serve-sim/src/preview-initial-state.ts
🚧 Files skipped from review as they are similar to previous changes (3)
- packages/serve-sim/src/tests/preview-initial-state.test.ts
- packages/serve-sim/src/preview-initial-state.ts
- packages/serve-sim/src/client/client.tsx
Adds launch-time controls for the serve-sim preview:
--panes,--fit, and--theme light|dark. Startup state flows through middleware to the browser, including the empty-device view; the theme is applied to the simulator after boot. Tools and DevTools are mutually exclusive at launch, and fit is applied only on the first size restore. Includes validation, documentation, and test coverage.Summary by CodeRabbit
serve-simCLI options to seed the preview UI:--panes <panes>(devices/tools/devtools ornone),--fit, and--theme <light|dark>.serve-simREADME/examples to include--panes,--fit, and--theme dark.