PROD-2730 reg source from active tool -> dev

src-ts/config/constants.ts

@@ -1,4 +1,5 @@
 export enum ToolTitle {
+    learn = 'Learn',
     settings = 'Account Settings',
     work = 'Work',
 }

src-ts/header/tool-selectors/tool-selectors-wide/tool-selector-wide/ToolSelectorWide.tsx

@@ -6,6 +6,7 @@ import {
     PlatformRoute,
     routeContext,
     RouteContextData,
+    routeIsActiveTool,
 } from '../../../../lib'
 import '../../../../lib/styles/index.scss'
 
@@ -19,15 +20,14 @@ const ToolSelectorWide: FC<ToolSelectorWideProps> = (props: ToolSelectorWideProp
 
     const {
         getPathFromRoute,
-        isActiveTool,
         isRootRoute,
     }: RouteContextData = useContext(routeContext)
 
     const activePath: string = useLocation().pathname
     const toolRoute: PlatformRoute = props.route
     const toolPath: string = getPathFromRoute(toolRoute)
     const baseClass: string = 'tool-selector-wide'
-    const isActive: boolean = isActiveTool(activePath, toolRoute)
+    const isActive: boolean = routeIsActiveTool(activePath, toolRoute)
     const activeIndicatorClass: string = `${baseClass}-${isActive ? '' : 'in'}active`
 
     // the tool link should be usable for all active routes except the home page

src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-not-logged-in/ProfileNotLoggedIn.tsx

@@ -1,12 +1,26 @@
-import { FC } from 'react'
+import { FC, useContext } from 'react'
+import { Location, useLocation } from 'react-router-dom'
 
-import { authUrlLogin, authUrlSignup, Button } from '../../../../../lib'
+import {
+    authUrlLogin,
+    Button,
+    routeContext,
+    RouteContextData,
+} from '../../../../../lib'
 import '../../../../../lib/styles/index.scss'
 
 import styles from './ProfileNotLoggedIn.module.scss'
 
 const ProfileNotLoggedIn: FC<{}> = () => {
 
+    const routeData: RouteContextData = useContext(routeContext)
+    const location: Location = useLocation()
+
+    function signUp(): void {
+        const signupUrl: string = routeData.getSignupUrl(location.pathname, routeData.toolsRoutes)
+        window.location.href = signupUrl
+    }
+
     return (
         <>
             <Button
@@ -15,15 +29,15 @@ const ProfileNotLoggedIn: FC<{}> = () => {
                 label='Log In'
                 size='md'
                 tabIndex={-1}
-                url={authUrlLogin}
+                url={authUrlLogin()}
             />
             <Button
                 buttonStyle='tertiary'
                 className={styles.signup}
                 label='Sign Up'
                 size='md'
                 tabIndex={-1}
-                url={authUrlSignup}
+                onClick={signUp}
             />
         </>
     )

src-ts/lib/functions/authentication-functions/authentication-reg-source.enum.ts

@@ -0,0 +1,3 @@
+export enum AuthenticationRegistrationSource {
+    work = 'selfService',
+}

src-ts/lib/functions/authentication-functions/authentication-url.config.ts

@@ -1,9 +1,16 @@
 import { EnvironmentConfig } from '../../../config'
 
+import { AuthenticationRegistrationSource } from './authentication-reg-source.enum'
+
 export const authentication: string = EnvironmentConfig.URL.ACCOUNTS_APP_CONNECTOR
 
-export const login: string = `${authentication}?retUrl=${encodeURIComponent(window.location.href.match(/[^?]*/)?.[0] || window.location.host)}`
+export function login(returnUrl?: string): string {
+    const retUrl: string = returnUrl ?? window.location.href.match(/[^?]*/)?.[0] ?? window.location.host
+    return `${authentication}?retUrl=${encodeURIComponent(retUrl)}`
+}
 
 export const logout: string = `${authentication}?logout=true&retUrl=${encodeURIComponent('https://' + window.location.host)}`
 
-export const signup: string = `${login}&regSource=tcBusiness&mode=signUp`
+export function signup(returnUrl?: string, regSource?: AuthenticationRegistrationSource): string {
+    return `${login(returnUrl)}&mode=signUp${!!regSource ? `&regSource=${regSource}` : ''}`
+}

src-ts/lib/functions/authentication-functions/authentication.functions.ts

@@ -2,9 +2,11 @@ import cookies from 'browser-cookies'
 import { configureConnector, decodeToken, getFreshToken } from 'tc-auth-lib'
 
 import { User } from '../../../../types/tc-auth-lib'
-import { EnvironmentConfig } from '../../../config'
+import { EnvironmentConfig, ToolTitle } from '../../../config'
+import { PlatformRoute } from '../../route-provider'
 import { logError } from '../logging-functions'
 
+import { AuthenticationRegistrationSource } from './authentication-reg-source.enum'
 import { authentication as authenticationUrl } from './authentication-url.config'
 import { CookieKeys } from './cookie-keys.enum'
 
@@ -20,6 +22,21 @@ configureConnector({
     mockToken: undefined,
 })
 
+export function getRegistrationSource(activeTool: PlatformRoute | undefined): AuthenticationRegistrationSource | undefined {
+
+    switch (activeTool?.title) {
+
+        // currently, there is no reg source for members
+        case ToolTitle.learn:
+            return
+
+        // currently, the work tool and the platform
+        // landing page use the reg source of selfService
+        default:
+            return AuthenticationRegistrationSource.work
+    }
+}
+
 export async function initializeAsync(): Promise<string | undefined> {
     return getFreshToken()
         .then((tokenV3: string) => {

src-ts/lib/functions/authentication-functions/index.ts

@@ -1,7 +1,11 @@
+export * from './authentication-reg-source.enum'
 export {
     authentication as authUrl,
     login as authUrlLogin,
     logout as authUrlLogout,
     signup as authUrlSignup,
 } from './authentication-url.config'
-export { initializeAsync as authInitializeAsync } from './authentication.functions'
+export {
+    getRegistrationSource as authGetRegistrationSource,
+    initializeAsync as authInitializeAsync,
+} from './authentication.functions'

src-ts/lib/functions/index.ts

@@ -1,4 +1,6 @@
 export {
+    AuthenticationRegistrationSource,
+    authGetRegistrationSource,
     authUrl,
     authUrlLogin,
     authUrlLogout,

src-ts/lib/index.ts

@@ -10,7 +10,6 @@ export {
     authUrl,
     authUrlLogin,
     authUrlLogout,
-    authUrlSignup,
     fileCreateFromCanvas,
     fileDownloadBlob,
     fileDownloadCanvasAsImage,

src-ts/lib/route-provider/index.ts

@@ -1,3 +1,4 @@
+export * from './route-functions'
 export * from './platform-route.model'
 export * from './route-context-data.model'
 export { default as routeContext } from './route.context'

src-ts/lib/route-provider/route-context-data.model.ts

@@ -9,8 +9,8 @@ export interface RouteContextData {
     getPath: (routeTitle: string) => string
     getPathFromRoute: (route: PlatformRoute) => string
     getRouteElement: (route: PlatformRoute) => JSX.Element
+    getSignupUrl: (currentLocation: string, toolRoutes: Array<PlatformRoute>, returnUrl?: string) => string
     initialized: boolean
-    isActiveTool: (activePath: string, toolRoute: PlatformRoute) => boolean
     isRootRoute: (activePath: string) => boolean
     rootLoggedInRoute: string
     rootLoggedOutFC: FC<{}>

src-ts/lib/route-provider/route-functions/index.ts

@@ -0,0 +1,4 @@
+export {
+    getSignupUrl as routeGetSignupUrl,
+    isActiveTool as routeIsActiveTool,
+} from './route.functions'

src-ts/lib/route-provider/route-functions/route.functions.ts

@@ -0,0 +1,31 @@
+import {
+    AuthenticationRegistrationSource,
+    authGetRegistrationSource,
+    authUrlSignup,
+} from '../../functions'
+import { PlatformRoute } from '../platform-route.model'
+
+// NOTE: this function ties together routes and auth,
+// so one could make an argument that it should be
+// part of the auth functions and be provided by the
+// profile provider; however, the routes are already
+// dependent on the profile context, so I didn't want to
+// make the profile context also dependent on the routes.
+export function getSignupUrl(
+    currentLocation: string,
+    toolRoutes: Array<PlatformRoute>,
+    returnUrl?: string
+): string {
+
+    // figure out the current tool so we can assign the correct reg source
+    const activeTool: PlatformRoute | undefined = toolRoutes.find(tool => isActiveTool(currentLocation, tool))
+    const regSource: AuthenticationRegistrationSource | undefined
+        = authGetRegistrationSource(activeTool)
+
+    return authUrlSignup(returnUrl, regSource)
+}
+
+export function isActiveTool(activePath: string, toolRoute: PlatformRoute): boolean {
+    return !!activePath.startsWith(toolRoute.route)
+        || !!toolRoute.alternativePaths?.some(path => activePath.startsWith(path))
+}

src-ts/lib/route-provider/route.context.tsx

@@ -9,8 +9,8 @@ export const defaultRouteContextData: RouteContextData = {
     getPath: () => '',
     getPathFromRoute: () => '',
     getRouteElement: () => <></>,
+    getSignupUrl: () => '',
     initialized: false,
-    isActiveTool: () => false,
     isRootRoute: () => false,
     rootLoggedInRoute: '',
     rootLoggedOutFC: () => <></>,

src-ts/lib/route-provider/route.provider.tsx

@@ -16,6 +16,7 @@ import { profileContext, ProfileContextData } from '../profile-provider'
 import { PlatformRoute } from './platform-route.model'
 import { RequireAuthProvider } from './require-auth-provider'
 import { RouteContextData } from './route-context-data.model'
+import { routeGetSignupUrl, routeIsActiveTool } from './route-functions'
 import { default as routeContext, defaultRouteContextData } from './route.context'
 
 interface RouteProviderProps {
@@ -61,7 +62,7 @@ export const RouteProvider: FC<RouteProviderProps> = (props: RouteProviderProps)
                         (!route.customerOnly || !!profile?.isCustomer)
                         && (!route.memberOnly || !!profile?.isMember)
                     )
-                    || isActiveTool(location.pathname, route)
+                    || routeIsActiveTool(location.pathname, route)
                 )
             )
 
@@ -83,8 +84,8 @@ export const RouteProvider: FC<RouteProviderProps> = (props: RouteProviderProps)
             getPath,
             getPathFromRoute,
             getRouteElement,
+            getSignupUrl: routeGetSignupUrl,
             initialized,
-            isActiveTool,
             isRootRoute: isRootRoute(loggedInRoot, props.rootLoggedOut),
             rootLoggedInRoute: loggedInRoot,
             rootLoggedOutFC: props.rootLoggedOutFC,
@@ -123,7 +124,7 @@ export const RouteProvider: FC<RouteProviderProps> = (props: RouteProviderProps)
         const routeElement: JSX.Element = !route.authRequired
             ? route.element
             : (
-                <RequireAuthProvider loginUrl={authUrlLogin}>
+                <RequireAuthProvider loginUrl={authUrlLogin()}>
                     {route.element}
                 </RequireAuthProvider>
             )
@@ -159,13 +160,6 @@ export const RouteProvider: FC<RouteProviderProps> = (props: RouteProviderProps)
     )
 }
 
-function isActiveTool(activePath: string, toolRoute: PlatformRoute): boolean {
-    return !!(
-        activePath.startsWith(toolRoute.route)
-        || toolRoute.alternativePaths?.some(path => activePath.startsWith(path))
-    )
-}
-
 function isRootRoute(rootLoggedIn: string | undefined, rootLoggedOut: string): (activePath: string) => boolean {
     return (activePath: string) => {
         return [rootLoggedIn, rootLoggedOut].some(route => activePath === route)

src-ts/tools/learn/Learn.tsx

@@ -1,12 +1,13 @@
 import { FC, useContext } from 'react'
 import { Outlet, Routes } from 'react-router-dom'
 
+import { ToolTitle } from '../../config'
 import {
     routeContext,
     RouteContextData,
 } from '../../lib'
 
-export const toolTitle: string = 'Learn'
+export const toolTitle: string = ToolTitle.learn
 
 const Learn: FC<{}> = () => {
 

src-ts/tools/learn/learn.routes.tsx

@@ -50,7 +50,7 @@ export enum LEARN_PATHS {
 }
 
 export function getAuthenticateAndStartCourseRoute(): string {
-    return `${authUrlLogin}${encodeURIComponent(`?${LEARN_PATHS.startCourseRouteFlag}`)}`
+    return `${authUrlLogin()}${encodeURIComponent(`?${LEARN_PATHS.startCourseRouteFlag}`)}`
 }
 
 export const rootRoute: string = LEARN_PATHS.root

src-ts/tools/work/Work.tsx

@@ -8,6 +8,7 @@ import {
     clearAutoSavedForm,
     clearCachedChallengeId
 } from '../../../src/autoSaveBeforeLogin'
+import { ToolTitle } from '../../config'
 import {
     ButtonProps,
     ContentLayout,
@@ -21,7 +22,7 @@ import {
 import { WorkProvider } from './work-lib'
 import { selfServiceRootRoute, selfServiceStartRoute } from './work.routes'
 
-export const toolTitle: string = 'Work'
+export const toolTitle: string = ToolTitle.work
 export const dashboardTitle: string = `${toolTitle} Dashboard`
 
 const Work: FC<{}> = () => {
@@ -58,7 +59,7 @@ const Work: FC<{}> = () => {
     return (
         <ContentLayout
             buttonConfig={buttonConfig}
-            title={'My Work'}
+            title='My Work'
         >
             <WorkProvider>
                 <Outlet />

src-ts/tools/work/work-login-prompt/WorkLoginPrompt.tsx

@@ -1,24 +1,24 @@
-import { FC } from 'react'
-import { useParams } from 'react-router-dom'
+import { FC, useContext } from 'react'
+import { Location, useLocation, useParams } from 'react-router-dom'
 
 import {
-    authUrl,
     authUrlLogin,
-    authUrlSignup,
     Button,
+    routeContext,
+    RouteContextData,
 } from '../../../lib'
 
 import styles from './WorkLoginPrompt.module.scss'
 
 const WorkLoginPrompt: FC = () => {
 
+    const routeData: RouteContextData = useContext(routeContext)
+    const location: Location = useLocation()
     const customReturnUrl: string | undefined = useParams().retUrl
 
-    let urlLogIn: string = authUrlLogin
-    let urlSignUp: string = authUrlSignup
-    if (customReturnUrl) {
-        urlLogIn = `${authUrl}?retUrl=${encodeURIComponent(customReturnUrl)}`
-        urlSignUp = `${urlLogIn}&regSource=tcBusiness&mode=signUp`
+    function signUp(): void {
+        const signUpUrl: string = routeData.getSignupUrl(location.pathname, routeData.toolsRoutes, customReturnUrl)
+        window.location.href = signUpUrl
     }
 
     return (
@@ -36,12 +36,12 @@ const WorkLoginPrompt: FC = () => {
                     <div className={styles['btn']}>
                         <Button
                             label='LOG IN'
-                            url={urlLogIn}
+                            url={authUrlLogin(customReturnUrl)}
                         />
                         <span className={styles['separator']}>OR</span>
                         <Button
                             label='SIGN UP'
-                            url={urlSignUp}
+                            onClick={signUp}
                         />
                     </div>
                 </div>