Skip to content

Feat built onboarding steps into one#31

Merged
codebestia merged 5 commits intoSpherre-Labs:mainfrom
davedumto:feat-built-onboarding-steps-into-one
Mar 27, 2025
Merged

Feat built onboarding steps into one#31
codebestia merged 5 commits intoSpherre-Labs:mainfrom
davedumto:feat-built-onboarding-steps-into-one

Conversation

@davedumto
Copy link
Contributor

@davedumto davedumto commented Mar 25, 2025

Description

This PR refactors the onboarding flow from a multi-page routing approach to a single-page design with state management. The new implementation eliminates page reloads between steps while maintaining the same user experience and visual design. Additionally, all static/hardcoded data has been replaced with dynamic values that flow through the entire onboarding process.

Related Issue

Fixes #21 - Refactor onboarding flow to single page and implement dynamic data

Type of Change

  • Bug fix
  • New feature
  • Refactor
  • Documentation update
  • Other (please describe)

How Has This Been Tested?

  • Unit tests
  • Integration tests
  • Manual tests
    • Tested all form inputs
    • Verified data persistence between steps
    • Checked form validation on each step
    • Confirmed progress indicator animations
    • Tested loading states during simulated API calls

Checklist:

  • I have read the contributing guidelines.
  • I have updated the documentation (if applicable).
  • My changes do not break existing functionality.
  • I have added tests that cover my changes (if applicable).
  • All new and existing tests pass.
  • I have included screenshots or GIFs to demonstrate the changes (if applicable).

Screenshots (if applicable)

##Step one on the same route
Screenshot 2025-03-25 at 18 40 13

##Step two on the same route
Screenshot 2025-03-25 at 18 41 19

##Step three on the same route
Screenshot 2025-03-25 at 18 43 23

Additional Notes

This implementation provides several benefits:

  1. Improved user experience with smoother transitions between steps
  2. Enhanced data persistence - all form data is maintained in a central state
  3. Added animated progress indicators that provide visual feedback during step transitions
  4. Replaced hardcoded UI elements with dynamic data from form inputs
  5. Added loading states for better feedback during asynchronous operations

The refactoring was done with an emphasis on maintaining the existing visual design while improving the underlying architecture. Placeholder code has been added for icon imports that will be replaced with actual assets.

@codebestia codebestia self-requested a review March 27, 2025 11:03
@codebestia
Copy link
Member

GM @davedumto
Good job so far
Please format your code and then it will be ready for merge.

@codebestia
Copy link
Member

run npm run prettier

@davedumto
Copy link
Contributor Author

@codebestia kindly look through it now

Copy link
Member

@codebestia codebestia left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!
Hello @davedumto
Thank you for your contibution.

@codebestia codebestia merged commit 00b7425 into Spherre-Labs:main Mar 27, 2025
1 of 2 checks passed
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.

REFACTOR ONBOARDING PAGES TO SINGLE PAGE AND DYNAMIC DATA

2 participants