Skip to content

Add onboarding tour for new users#138

Open
YPC0813 wants to merge 1 commit intosorosave-protocol:mainfrom
YPC0813:feature/onboarding-tour
Open

Add onboarding tour for new users#138
YPC0813 wants to merge 1 commit intosorosave-protocol:mainfrom
YPC0813:feature/onboarding-tour

Conversation

@YPC0813
Copy link
Copy Markdown

@YPC0813 YPC0813 commented Apr 18, 2026

Summary

Implements guided tour for new users using react-joyride.

Changes

  • Add react-joyride dependency
  • Create OnboardingTour.tsx component with 5 guided steps
  • Add tour IDs to key UI elements:
    • Connect Wallet button
    • Groups link
    • Create Group link
    • Join Group button
    • Contribute button
  • First-visit auto-start with localStorage persistence
  • Replay button in navbar Help menu

Acceptance Criteria

  • ✅ Step-by-step tour using react-joyride
  • ✅ Covers: wallet connection, browsing groups, joining a group, contributing
  • ✅ Shows on first visit, dismissable
  • ✅ Option to replay from settings/help menu

Test Plan

  1. Visit app for first time (clear localStorage)
  2. Tour should auto-start
  3. Walk through all 5 steps
  4. Click Help in navbar to restart tour

Closes #72

- Add react-joyride for guided tour
- Create OnboardingTour.tsx component
- Tour covers: wallet connect, browse groups, create group, join group, contribute
- First-visit auto-start with localStorage persistence
- Replay button in navbar Help menu
- Add tour IDs to key UI elements

Acceptance criteria met:
✅ Step-by-step tour using react-joyride
✅ Covers wallet connection, browsing groups, joining a group, contributing
✅ Shows on first visit, dismissable
✅ Option to replay from settings/help menu
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.

Add onboarding tour for new users

1 participant