Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

50-Squad-Kai-Onboarding #105

Open
wants to merge 42 commits into
base: develop
Choose a base branch
from
Open

50-Squad-Kai-Onboarding #105

wants to merge 42 commits into from

Conversation

Cosmodocus
Copy link
Contributor

@Cosmodocus Cosmodocus commented Aug 16, 2024 •
edited
Loading

Description

Squad-50's completed Kai Onboarding project includes:

  1. Onboarding Routing Logic: Directs users to the onboarding process based on a status flag in their user documents.
  2. Dynamic Progress bar & Checklist: Displays current step and remaining steps in the onboarding process.
  3. Profile Setup Form: Built with react-hook-form to collect and store user data in Firestore for future expeditions.
  4. System Configuration: Allows users to save their boolean states in Firestore with a toggle component.
  5. Polished UI: Matches the Figma design closely for a modern, refined look.

Full feature showcase & explanation video:https://www.loom.com/share/53026aed93dd42b6b35c0f91f5531c35

Test Link: kai-onboarding.web.app

NoSQL Database Schema:

image

Type of change

  • New feature (non-breaking change which adds functionality)
  • This change requires a documentation update

How Has This Been Tested?

  • Test A: Verified routing logic for new users. Ensured that upon signup, they receive the boolean flag that appropriately routes them to the onboarding process. Once completed, they are redirected to the home page.
  • Test B: Ensured that existing users who never had the flag added to their account, and would have previously skipped the signup/login screen, are now correctly redirected to the onboarding process.
  • Test C: Confirmed that form management is fully functional. The regex validation works as expected for all form fields, and user data is collected and stored correctly to the firestore database.
  • Test D: Verified that user data is temporarily stored throughout the onboarding process, allowing users to revise their choices before finalizing. Data is merged with their user profile only after the process is complete.
  • Test E: Ensured that the Progress Bar syncs accurately with the current page, correctly displaying the user’s current step in the onboarding process.
  • Test F: Confirmed that the user's profile image is uploaded to Firebase Storage only after the entire onboarding process is complete, ensuring better maintainability and accessibility.

Cosmodocus and others added 30 commits July 22, 2024 13:22
@Cosmodocus
welcome-page first initialization
07735de
@Cosmodocus
Boilerplate for OnboardingLayout files
96a5d42
@Cosmodocus
more boilerplate and file structuring
15b7e2e
@Cosmodocus
resolved toolId & onboarding dynamic routing conflicts
02b04ef
@Cosmodocus
Boilerplate code for onboarding hook & redux
e4639e5
@Cosmodocus
Initialized mock data and tons of boilerplate screens including the w…
c4acdc0 
…elcome screen
@Cosmodocus
minor changes
54d1a39
@harrisblog
Optimized the radial gradient background and progress bar position.
e23caa2
@harrisblog
Built Profile Setup page's UI.
8fdede7
@harrisblog
Added validation error handling. Abstracted InputWrapper and ProfileT…
d994dee 
…extField components from ProfileSetupForm. Integrated form data with userSlice.
@pleroux64
profileset up with new redux
7b40234
@pleroux64
profile set up with userslice updated
eff084a
@pleroux64
profile set up with userslice updated
02c67e5
@pleroux64
testDemo with logs
3fc82f9
@pleroux64
ES1, ES2, and ES5 Merged
46cb2e9
@harrisblog
Fixed the Drag&Drop bug. Keep the UI consistent.
55afe55
@celsolopez14
Implements Complete Page for OnBoarding. Dynamically looks for the la…
ca48f03 
…st step to hide/unhide progress bar.
@eprim7
added the system config and final steps page
319edc0
@Cosmodocus
Merge branch 'es3-system-config-final-steps' into kai-onboarding-demo
224878d
@harrisblog
Fixed the routing logic bug.
ca1b1d0
@harrisblog
Fixed the not being able to be redirected to the onboarding page afte…
b2d3da0 
…r signup and back to home page after finishing the onboarding bug.
@harrisblog
Fixed the not being able to be redirected to the home page when it's …
1ef67b8 
…in the onboarding page and users are already finished bug.
@harrisblog
Added a loader to the onboarding page.
d4fad49
@pleroux64
added image uploading feature
54795c9
@pleroux64
removed unnecesary comments
8eb5e1d
@celsolopez14
Implements ProgressBar/CheckList refactor. Renaming of ProgressBar/Ch…
421f3b2 
…eckList components.
@celsolopez14
Merge branch 'kai-onboarding-demo' of https://github.com/Cosmodocus/k…
383bd8b 
…ai-platform into kai-onboarding-demo
@harrisblog
Made profile box able to display image and abstracted all the fields'…
1e9c133 
… rules to onboarding.js file under regex directory.
@pleroux64
only saves image when onboardingcomplege
92fc79c
@eprim7
abstracted styling
32ea332
eprim7 and others added 8 commits August 14, 2024 12:35
@bkb-Git
Copy link
Contributor

bkb-Git commented Aug 27, 2024

@Cosmodocus Consider consolidating the social media links to a single map object called socialMedia. You can also rename the field X to something clearer like Xhandle and as for the profile field, it seems a bit generic, what exactly are we storing there, if it's the user profile photo we may want to rename that as well. Finally for these fields pushNotifs, emailNotifs, reminder, they can be consolidated to into a map object notificationSettings

pleroux64 and others added 3 commits September 3, 2024 14:37
@pleroux64
Made notification and social media variables into maps, renamed varia…
99471c4 
…bles
@pleroux64
changed variable named
caf243f
@Cosmodocus
Notification and Social Media variable mappings (#2)
5c1cae8 
When you complete onboarding, you should see the notification variables
and the social media variables mapped together like this


![62F7149E-D030-4849-BB61-BC57B10BB64D](https://github.com/user-attachments/assets/12f6c3db-e467-4276-b4f2-6a602bc98569)

It has been tested if only some of the variables are chosen, in which
case the rest will be null
@Cosmodocus
Copy link
Contributor Author

Cosmodocus commented Sep 9, 2024 •
edited
Loading

@bkb-Git

@Cosmodocus Consider consolidating the social media links to a single map object called socialMedia. You can also rename the field X to something clearer like Xhandle and as for the profile field, it seems a bit generic, what exactly are we storing there, if it's the user profile photo we may want to rename that as well. Finally for these fields pushNotifs, emailNotifs, reminder, they can be consolidated to into a map object notificationSettings

Issue resolved and database schema updated.

@yunusj yunusj mentioned this pull request Oct 24, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
6 participants
@Cosmodocus @bkb-Git @harrisblog @pleroux64 @celsolopez14 @eprim7