Skip to content

feat: add footer message with typewriter tips next to assistant logo#830

Merged
miurla merged 1 commit intomainfrom
feat/chat-footer-message
Apr 15, 2026
Merged

feat: add footer message with typewriter tips next to assistant logo#830
miurla merged 1 commit intomainfrom
feat/chat-footer-message

Conversation

@miurla
Copy link
Copy Markdown
Owner

@miurla miurla commented Apr 15, 2026

Summary

  • Display a disclaimer message ("Morphic can make mistakes...") next to the assistant logo after stream completion, with a typewriter animation
  • After the disclaimer, cycle through randomized keyboard shortcut tips (Tips: ⌘+Shift+O New chat, etc.) with typewriter in/out animations
  • 15-second idle pause between tip rotations for a non-intrusive experience

Implementation

  • hooks/use-typewriter-cycle.ts — Reusable typewriter state machine hook (init → typing-in → visible → typing-out → switching → idle → ...)
  • lib/footer-tips.ts — Tips data definitions, lazy initialization (SSR-safe), and shuffle utility
  • components/chat-footer-message.tsx — Lightweight UI component composing the hook and data
  • components/chat-messages.tsx — Integration alongside AnimatedLogo

Test plan

  • Verify disclaimer appears with typewriter animation after stream completes
  • Verify disclaimer types out after 5 seconds, then idle pause before first tip
  • Verify tips rotate in random order with keyboard shortcut badges
  • Verify tips show correct modifier key per OS (⌘ on Mac, Ctrl on Windows)
  • Verify no flicker during tip transitions
  • Verify component resets when a new stream starts
  • Run bun lint, bun typecheck, bun format:check

Show a disclaimer message and rotating keyboard shortcut tips next to
the assistant logo at the bottom of the message list. Text appears with
a character-by-character typewriter animation, cycles through randomized
tips with idle pauses between them.

- Add `useTypewriterCycle` hook for reusable typewriter state machine
- Add `lib/footer-tips.ts` for tips data and shuffle utility
- Add `ChatFooterMessage` component for rendering
- Integrate into `chat-messages.tsx` alongside AnimatedLogo
@vercel
Copy link
Copy Markdown

vercel bot commented Apr 15, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
morphic Ready Ready Preview, Comment Apr 15, 2026 10:23pm

@miurla miurla merged commit 9b4d1b9 into main Apr 15, 2026
8 checks passed
@miurla miurla deleted the feat/chat-footer-message branch April 15, 2026 23:45
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