feat: enhance animated CLI banner with branding and fixes#198
Conversation
This reverts commit ea0fb40.
Reviewer's GuideAdds a new animated Comet CLI banner module, wires it into Sequence diagram for comet init and animated CLI bannersequenceDiagram
participant User
participant InitCommand
participant CometBanner
participant TerminalRuntime
User->>InitCommand: initCommand(targetPath, options)
InitCommand->>CometBanner: printCometBanner({ enabled: !options.json })
CometBanner->>TerminalRuntime: read isTTY/env/getColumns
CometBanner->>CometBanner: canAnimateCometBanner(runtime)
alt [options.enabled === false]
CometBanner-->>InitCommand: return (no banner)
else [canAnimateCometBanner == false]
CometBanner->>TerminalRuntime: write("\n" + renderCometBanner() + "\n\n")
CometBanner-->>InitCommand: return
else [canAnimateCometBanner == true]
CometBanner->>TerminalRuntime: write("\n")
loop timeline()
CometBanner->>CometBanner: renderCometAnimationFrame(phase, progress)
CometBanner->>TerminalRuntime: write(replaceFrame(frame, first))
CometBanner->>TerminalRuntime: sleep(FRAME_DELAY_MS)
end
CometBanner->>CometBanner: renderCometBanner({ color: true })
CometBanner->>TerminalRuntime: write(replaceFrame(stableFrame, false))
CometBanner->>TerminalRuntime: write(RESET + "\n")
CometBanner-->>InitCommand: return
end
InitCommand->>InitCommand: printVersionInfo(log) (when !options.json)
InitCommand-->>User: init completes
Flow diagram for canAnimateCometBanner decisionflowchart TD
Start([Start]) --> CheckEnabled{enabled === false?}
CheckEnabled -- yes --> Static[Skip banner]
CheckEnabled -- no --> IsTTY{runtime.isTTY?}
IsTTY -- no --> Static
IsTTY -- yes --> CI{CI env set and not 'false'?}
CI -- yes --> Static
CI -- no --> NO_COLOR{NO_COLOR in env?}
NO_COLOR -- yes --> Static
NO_COLOR -- no --> TermDumb{TERM == dumb?}
TermDumb -- yes --> Static
TermDumb -- no --> Columns{columns >= BANNER_WIDTH?}
Columns -- no --> Static
Columns -- yes --> Animated[Use animated banner]
Static --> End([Render static renderCometBanner])
Animated --> EndAnimated([Run printCometBanner animation timeline])
File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
📝 WalkthroughWalkthroughThe CLI adds a shared Comet banner renderer with animated TTY playback, static fallbacks, and JSON suppression. Init, CLI help, package metadata, changelog, tests, design documents, and the website subproject reference are updated. ChangesComet banner experience
Website subproject reference
Estimated code review effort: 4 (Complex) | ~45 minutes Sequence Diagram(s)sequenceDiagram
participant InitCommand
participant printCometBanner
participant TerminalRuntime
participant Stdout
InitCommand->>printCometBanner: printCometBanner(enabled: !json)
printCometBanner->>TerminalRuntime: check TTY, environment, and width
alt animation supported
printCometBanner->>Stdout: write animation frames
printCometBanner->>TerminalRuntime: sleep between timeline frames
printCometBanner->>Stdout: write stable colorized banner
else fallback
printCometBanner->>Stdout: write static banner
end
InitCommand->>InitCommand: continue init after banner completes
🚥 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 |
Greptile SummaryThis PR adds a branded Comet banner experience to the CLI. The main changes are:
Confidence Score: 4/5This is close, but the banner alignment issue should be fixed before merging.
app/cli/comet-banner.ts Important Files Changed
Reviews (2): Last reviewed commit: "docs: align CLI banner color contract" | Re-trigger Greptile |
There was a problem hiding this comment.
Hey - I've left some high level feedback:
- app/cli/comet-banner.ts has grown quite large and mixes pure rendering, animation timing, and I/O concerns; consider splitting it into a pure rendering module and a small runtime/IO adapter so the animation logic is easier to follow and maintain.
- The BannerRuntime/getColumns/readColumns/animationFrameForRuntime chain is fairly indirect and throws on width changes; you could simplify by reading columns once per frame and passing the width into the renderer, turning width changes into a graceful static fallback instead of an exception path.
- renderCometBannerFrame now just wraps renderCometAnimationFrame('sweep', …) and is only used in tests; if there is no external dependency on it, consider making this an internal helper or inlining it to keep the public API surface of comet-banner.ts smaller.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- app/cli/comet-banner.ts has grown quite large and mixes pure rendering, animation timing, and I/O concerns; consider splitting it into a pure rendering module and a small runtime/IO adapter so the animation logic is easier to follow and maintain.
- The BannerRuntime/getColumns/readColumns/animationFrameForRuntime chain is fairly indirect and throws on width changes; you could simplify by reading columns once per frame and passing the width into the renderer, turning width changes into a graceful static fallback instead of an exception path.
- renderCometBannerFrame now just wraps renderCometAnimationFrame('sweep', …) and is only used in tests; if there is no external dependency on it, consider making this an internal helper or inlining it to keep the public API surface of comet-banner.ts smaller.Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 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 `@app/cli/comet-banner.ts`:
- Around line 237-245: Update animationFrameForRuntime to center each banner
frame using the current terminal column count when the runtime supports a
sufficiently wide TTY, including after resize events. Preserve unindented frames
for narrow terminals and non-TTY/static fallback paths, and ensure
staticFrameForRuntime remains compatible without runtime input.
In `@CHANGELOG.md`:
- Line 16: Update the release entry in CHANGELOG.md to include the required ###
Added, ### Changed, ### Fixed, ### Tests, ### Removed, and ### Security
headings, preserving the existing release content and leaving Tests empty rather
than listing ordinary regression tests.
In `@docs/superpowers/specs/2026-07-12-cli-banner-animation-design.md`:
- Line 22: Update the “扩散与落版(1100–1800ms)” design requirement to specify the
tagline’s actual gold final color, or update the banner implementation to render
the documented bright cyan-blue; ensure the requirement and implementation agree
unambiguously.
🪄 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
Run ID: 288c16a3-2aa3-4697-85a2-577b2831423f
📒 Files selected for processing (11)
CHANGELOG.mdapp/cli/comet-banner.tsapp/cli/index.tsapp/commands/init.tsdocs/superpowers/plans/2026-07-12-cli-banner-animation.mddocs/superpowers/specs/2026-07-12-cli-banner-animation-design.mdpackage.jsontest/app/cli-help.test.tstest/app/comet-banner.test.tstest/app/init-e2e.test.tswebsite
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
docs/superpowers/specs/2026-07-12-cli-banner-animation-design.md (1)
34-34: 🎯 Functional Correctness | 🟠 Major | 🏗️ Heavy liftImplement terminal-relative centering, or revise this specification.
The current implementation renders onto a fixed
BANNER_WIDTHcanvas, whileanimationFrameForRuntime()only validates the terminal width and returns the frame unchanged. It therefore does not recalculate left padding per frame, so output remains internally centered and terminal-width changes cannot update alignment. This also conflicts with the planned 80/100/120-column and resize tests in Lines 63–65.🤖 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 `@docs/superpowers/specs/2026-07-12-cli-banner-animation-design.md` at line 34, Revise the banner rendering flow around animationFrameForRuntime() to apply terminal-relative centering on every frame: calculate left padding from the current terminal column count and frame width, then prepend the same indentation to every Logo, particle, and tagline line, including the final static frame. Ensure terminal resizes recalculate alignment on the next frame, or update this specification to match the fixed BANNER_WIDTH behavior and remove the conflicting resize and width-test requirements.
🤖 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.
Outside diff comments:
In `@docs/superpowers/specs/2026-07-12-cli-banner-animation-design.md`:
- Line 34: Revise the banner rendering flow around animationFrameForRuntime() to
apply terminal-relative centering on every frame: calculate left padding from
the current terminal column count and frame width, then prepend the same
indentation to every Logo, particle, and tagline line, including the final
static frame. Ensure terminal resizes recalculate alignment on the next frame,
or update this specification to match the fixed BANNER_WIDTH behavior and remove
the conflicting resize and width-test requirements.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: bc1cfa4a-3006-45ba-9671-5c891f5935f5
📒 Files selected for processing (1)
docs/superpowers/specs/2026-07-12-cli-banner-animation-design.md
✨ Summary
🎯 Scope
init,status,doctor,update)assets/skills/,assets/skills-zh/)assets/skills/comet/scripts/)🧪 Testing
pnpm buildpnpm lintpnpm run lint:architecturepnpm format:checkpnpm testpnpm test -- test/domains/comet-classic/comet-scripts.test.ts✅ Checklist
fix: handle project-scope initREADME.md,README-zh.md, orCONTRIBUTING.mdCHANGELOG.mdis updated when behavior changesassets/manifest.jsonand relevant tests👀 Notes for Reviewers
Summary by Sourcery
Introduce a branded, animated CLI banner for
comet initand align CLI/package branding around a new tagline while keeping JSON and non-interactive output stable.New Features:
comet initruns.Enhancements:
comet initto await the banner before printing version information and reuse the shared tagline constant in the main CLI description.Documentation:
Tests:
Summary by CodeRabbit
New Features
comet initin compatible interactive terminals, with centered logo over the tagline and a timed multi-phase reveal.NO_COLOR, or non-ANSI environments.Documentation
Tests