Skip to content

feat: bottom-left help guide widget#5844

Open
rebelchris wants to merge 6 commits intomainfrom
feat/help-guide-widget
Open

feat: bottom-left help guide widget#5844
rebelchris wants to merge 6 commits intomainfrom
feat/help-guide-widget

Conversation

@rebelchris
Copy link
Copy Markdown
Contributor

@rebelchris rebelchris commented Apr 9, 2026

Summary

  • Adds a floating help guide widget in the bottom-left corner for contextual user guidance
  • Expanded state: shows one tip at a time with title, description, tag, CTA button, and prev/next navigation to browse all items. Clickable step indicators to jump between tips. Items marked "Done" when CTA is clicked
  • Minimized state: compact ? button with pending count badge. Opens a popover listing all items split into "Suggested for you" (pending) and "Completed" sections
  • Uses mock data for demo purposes — production would swap in a per-user API
  • Polished design: animated gradient accent bar, glassmorphism, slide animations, icon glow, CTA shimmer, notification pulse
  • Dev-only reset button in the popover for easy testing

Test plan

  • Verify widget appears bottom-left for authenticated desktop users
  • Click CTA to complete a tip, confirm "Done" badge appears and item moves to completed in popover
  • Use prev/next arrows and clickable step indicators to browse between tips
  • Click X to minimize, verify ? button appears with pending count
  • Click ? to open popover, verify pending/completed sections
  • Click a popover item to expand the widget at that item
  • Refresh page — state persists via localStorage
  • Use "Reset widget (dev)" in popover to clear state
  • Verify widget does not render on mobile or for unauthenticated users

🤖 Generated with Claude Code

Preview domain

https://feat-help-guide-widget.preview.app.daily.dev

rebelchris and others added 2 commits April 9, 2026 15:38
Introduces a floating help widget (bottom-left) that surfaces personalized
tips, new features, and next actions. Users can browse items with prev/next
navigation, click CTAs to complete them, and minimize to a compact "?" button
with a popover showing pending/completed items. Uses mock data for demo.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@vercel
Copy link
Copy Markdown

vercel bot commented Apr 9, 2026

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

Project Deployment Actions Updated (UTC)
daily-webapp Ready Ready Preview Apr 9, 2026 2:18pm
1 Skipped Deployment
Project Deployment Actions Updated (UTC)
storybook Ignored Ignored Apr 9, 2026 2:18pm

Request Review

Use opaque bg-background-popover for expanded card readability.
Glass effect (92% opacity + backdrop-blur) kept on ? button and popover.
Bump z-index to z-max to stay above sidebar.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
rebelchris and others added 3 commits April 9, 2026 16:09
Move HelpWidget from floating fixed position into the sidebar, pinned
below the scroll area. Collapsed sidebar shows icon trigger, expanded
shows inline preview card. Detail card and popover pop out to the right.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Override SidebarScrollWrapper h-full with flex-1 min-h-0 so the
help widget pinned below it gets layout space.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add relative positioning to detail card container so the absolute
accent bar clips within the rounded overflow-hidden box.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
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