diff --git a/src/App.jsx b/src/App.jsx index a00b8ff..84aa6c0 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -5,12 +5,13 @@ import React, { useState, useCallback, useMemo, useEffect } from "react"; import _ from "lodash"; import MainMenu from "./components/MainMenu"; import NavBar from "./components/NavBar"; -import { matchPath, Router, useLocation } from "@reach/router"; +import { navigate, Router, useLocation } from "@reach/router"; import { useSelector } from "react-redux"; import useMatchSomeRoute from "./hooks/useMatchSomeRoute"; import NotificationsModal from "./components/NotificationsModal"; import "./styles/main.module.scss"; -import { checkOnboardingPath } from "./utils"; +import { checkOnboarding, checkProfileCreationDate } from "./utils"; +import { getOnboardingChecklist } from "./services/auth"; const App = () => { // all menu options @@ -50,12 +51,21 @@ const App = () => { }, [isSideBarDisabled]); useEffect(() => { - if (matchPath("onboard/*", location.pathname)) { - setHideSwitchTools(true); - } else { - setHideSwitchTools(false); - } - }, [location]); + (async () => { + if (auth?.profile && checkProfileCreationDate(auth?.profile)) { + const { profile, tokenV3 } = auth; + + const response = await getOnboardingChecklist(profile?.handle, tokenV3); + const onboardingPath = checkOnboarding(response); + if (onboardingPath) { + setHideSwitchTools(true); + navigate(onboardingPath); + } else { + setHideSwitchTools(false); + } + } + })(); + }, [auth]); return ( <> diff --git a/src/services/auth.js b/src/services/auth.js index a3a0c30..59c1613 100644 --- a/src/services/auth.js +++ b/src/services/auth.js @@ -125,3 +125,15 @@ export function authenticate(store) { } }); } + +/** + * Get the onboarding checklist data to know completed steps + */ +export function getOnboardingChecklist(username, userTokenV3) { + const fetcher = getFetcher(userTokenV3); + return fetcher( + `${config.API.V5}/members/${username}/traits?traitIds=onboarding_checklist` + ) + .then((res) => res.json()) + .then((res) => ({ data: res || [] })); +} diff --git a/src/utils/index.js b/src/utils/index.js index f57717d..62b2786 100644 --- a/src/utils/index.js +++ b/src/utils/index.js @@ -47,3 +47,66 @@ export const login = () => { export const businessLogin = () => { window.location = getBusinessLoginUrl(); }; + +/** + * Check Onboarding API + * + * @param resp {Object} User trait object + * + * @returns {boolean | string} + */ +export function checkOnboarding(resp) { + if (resp?.data.length === 0) { + return false; + } + const data = resp?.data.filter( + (item) => item.traitId === "onboarding_checklist" + )[0].traits.data[0].profile_completed; + if (data.status === "completed") { + return false; + } + + for (const item in data.metadata) { + if (data.metadata[item]) { + return false; + } + } + + const steps = { + "/onboard/": ["profile_picture", "skills"], + "/onboard/contact-details": ["country"], + "/onboard/payments-setup": [], + "/onboard/build-my-profile": ["bio", "work", "education", "language"], + }; + if (data.status === "pending_at_user") { + const flags = Object.keys(data.metadata); + for (const step of Object.keys(steps)) { + for (const flag of steps[step]) { + if (flags.indexOf(flag) >= 0 && !data.metadata[flag]) { + return step; + } + } + } + } + return false; +} + +/** + * Checks If current user's profile creation time + * + * @param profile {Object} user profile + * + * @returns {boolean} + */ +export const checkProfileCreationDate = (profile) => { + const thresholdDate = moment( + config.PROFILE_CREATION_DATE_THRESHOLD, + "YYYY-MM-DD" + ); + + if (profile?.createdAt) { + return thresholdDate.isBefore(moment(profile?.createdAt)); + } + + return false; +};