TCA-1285 , TCA-1286 - redirect old urls to new ones

Author: vas3a

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

@@ -4,3 +4,4 @@ export * from './route-context-data.model'
 export { default as routeContext } from './route.context'
 export * from './route.provider'
 export * from './router.utils'
+export * from './rewrite'

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

@@ -0,0 +1,24 @@
+import { get } from 'lodash'
+import { FC } from 'react'
+import { Navigate, Params, useParams } from 'react-router-dom'
+
+export interface RewriteProps {
+    to: string
+}
+
+/**
+ * Extends react-router-dom Navigate component to support rewriting of urls
+ * Eg. or rewrite rules:
+ * - /learn/* -> /* (redirects all learn pages to root)
+ */
+export const Rewrite: FC<RewriteProps> = props => {
+    const params: Params = useParams()
+    const rewriteTo: string = props.to.replace(
+        /(:[a-z0-9*]+)|\*/ig,
+        (match: string) => get(params, match.replace(':', ''), ''),
+    )
+
+    return (
+        <Navigate to={rewriteTo} />
+    )
+}

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

@@ -1,5 +1,5 @@
 import { AppSubdomain, EnvironmentConfig } from '../../config'
-import { authUrlLogin, lazyLoad, LazyLoadedComponent, PlatformRoute } from '../../lib'
+import { authUrlLogin, lazyLoad, LazyLoadedComponent, PlatformRoute, Rewrite } from '../../lib'
 
 import { toolTitle } from './Learn'
 import { LearnConfig } from './learn-config'
@@ -23,7 +23,7 @@ const MyCertificate: LazyLoadedComponent = lazyLoad(() => import('./course-certi
 const UserCertificate: LazyLoadedComponent = lazyLoad(() => import('./course-certificate'), 'UserCertificate')
 const FreeCodeCamp: LazyLoadedComponent = lazyLoad(() => import('./free-code-camp'), 'FreeCodeCamp')
 const MyLearning: LazyLoadedComponent = lazyLoad(() => import('./my-learning'), 'MyLearning')
-const LandingLearn: LazyLoadedComponent = lazyLoad(() => import('./Learn'))
+const LearnRootPage: LazyLoadedComponent = lazyLoad(() => import('./Learn'))
 const UserTCACertificate: LazyLoadedComponent = lazyLoad(() => import('./tca-certificate'), 'CertificateView')
 
 const ValidateTCACertificate: LazyLoadedComponent
@@ -131,7 +131,7 @@ export function getTCACertificateUrl(
 export function getTCACertificationValidationUrl(
     completionUuid: string,
 ): string {
-    return `${absoluteRootRoute}/${completionUuid}`
+    return `${absoluteRootRoute}/certificate/${completionUuid}`
 }
 
 export function getTCAUserCertificationUrl(
@@ -151,6 +151,15 @@ export function getAuthenticateAndEnrollRoute(): string {
     return `${authUrlLogin()}${encodeURIComponent(LEARN_PATHS.tcaEnroll)}`
 }
 
+const oldUrlRedirectRoute: ReadonlyArray<PlatformRoute> = EnvironmentConfig.SUBDOMAIN === AppSubdomain.tca ? [
+    {
+        children: [],
+        element: <Rewrite to='/*' />,
+        id: 'redirect-old-url',
+        route: '/learn/*',
+    },
+] : []
+
 export const learnRoutes: ReadonlyArray<PlatformRoute> = [
     {
         children: [
@@ -225,7 +234,7 @@ export const learnRoutes: ReadonlyArray<PlatformRoute> = [
                 children: [],
                 element: <ValidateTCACertificate />,
                 id: 'Hiring manager view - uuid param',
-                route: ':completionUuid',
+                route: 'certificate/:completionUuid',
             },
             {
                 children: [],
@@ -239,9 +248,10 @@ export const learnRoutes: ReadonlyArray<PlatformRoute> = [
                 id: 'Giring manager preview',
                 route: 'tca-certifications/:certification/preview',
             },
+            ...oldUrlRedirectRoute,
         ],
         domain: AppSubdomain.tca,
-        element: <LandingLearn />,
+        element: <LearnRootPage />,
         id: toolTitle,
         route: rootRoute,
     },

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

@@ -1,6 +1,6 @@
 import { Navigate } from 'react-router-dom'
 
-import { contactSupportPath, lazyLoad, LazyLoadedComponent, PlatformRoute } from '../../lib'
+import { contactSupportPath, lazyLoad, LazyLoadedComponent, PlatformRoute, Rewrite } from '../../lib'
 import { AppSubdomain, EnvironmentConfig } from '../../config'
 
 import { dashboardRouteId, intakeFormsRouteId, toolTitle } from './Work'
@@ -49,6 +49,15 @@ export function workDetailRoute(workId: string, tab?: 'solutions' | 'messages'):
     return `${selfServiceRootRoute}/work-items/${workId}${!!tab ? `?tab=${tab}` : ''}`
 }
 
+const oldUrlRedirectRoute: ReadonlyArray<PlatformRoute> = EnvironmentConfig.SUBDOMAIN === AppSubdomain.work ? [
+    {
+        children: [],
+        element: <Rewrite to='/*' />,
+        id: 'redirect-old-url',
+        route: '/work/*',
+    },
+] : []
+
 export const workRoutes: ReadonlyArray<PlatformRoute> = [
     {
         element: <WorkNotLoggedIn />,
@@ -122,9 +131,14 @@ export const workRoutes: ReadonlyArray<PlatformRoute> = [
         element: <Navigate to={dashboardRoute} />,
         route: `${selfServiceRootRoute}/dashboard`,
     },
+    {
+        element: <Navigate to={selfServiceStartRoute} />,
+        route: selfServiceRootRoute,
+    },
     {
         children: [],
         element: <Navigate to={contactSupportPath} />,
         route: `${contactSupportPath}`,
     },
+    ...oldUrlRedirectRoute,
 ]