From 91433c5a6e1555997989630f1ee60ba5d27bc7ea Mon Sep 17 00:00:00 2001
From: 13bfrancis <40218571+13bfrancis@users.noreply.github.com>
Date: Thu, 18 Jan 2024 16:06:02 -0500
Subject: [PATCH 1/6] finish overhaul of routing

---
 .../ui/src/pages/form/form-breadcrumbs.ts     |  3 +-
 src/services/ui/src/router.tsx                | 62 +++++++++++--------
 src/services/ui/src/routes.ts                 | 35 -----------
 src/services/ui/src/utils/crumbs.ts           |  5 +-
 4 files changed, 40 insertions(+), 65 deletions(-)
 delete mode 100644 src/services/ui/src/routes.ts

diff --git a/src/services/ui/src/pages/form/form-breadcrumbs.ts b/src/services/ui/src/pages/form/form-breadcrumbs.ts
index 1cb2042734..00cf1d0775 100644
--- a/src/services/ui/src/pages/form/form-breadcrumbs.ts
+++ b/src/services/ui/src/pages/form/form-breadcrumbs.ts
@@ -1,3 +1,4 @@
+import { Route } from "@/components/Routing/types";
 import { optionCrumbsFromPath } from "@/pages/create/create-breadcrumbs";
 import { submissionFormCrumb } from "@/utils/crumbs";
 
@@ -7,6 +8,6 @@ export const formCrumbsFromPath = (path: string) => {
   const previousOptionsCrumbs = [...optionCrumbsFromPath(path)];
   return [
     ...previousOptionsCrumbs,
-    submissionFormCrumb(path, previousOptionsCrumbs.length),
+    submissionFormCrumb(path as Route, previousOptionsCrumbs.length),
   ];
 };
diff --git a/src/services/ui/src/router.tsx b/src/services/ui/src/router.tsx
index f3cdae9e17..ff654cde6e 100644
--- a/src/services/ui/src/router.tsx
+++ b/src/services/ui/src/router.tsx
@@ -1,78 +1,86 @@
-import { createBrowserRouter } from "react-router-dom";
+import { RouteObject, createBrowserRouter } from "react-router-dom";
 import * as P from "@/pages";
 import { loader as rootLoader } from "@/pages/welcome";
 import { dashboardLoader } from "@/pages/dashboard";
 import "@/api/amplifyConfig";
 import * as C from "@/components";
 import { QueryClient } from "@tanstack/react-query";
-import { ROUTES } from "@/routes";
+import { type Route } from "./components/Routing/types";
 export const queryClient = new QueryClient();
 
 export const router = createBrowserRouter([
   {
-    path: ROUTES.HOME,
+    path: "/",
     element: <C.Layout />,
     children: [
-      { path: ROUTES.HOME, index: true, element: <P.Welcome /> },
+      { path: "/", index: true, element: <P.Welcome /> },
       {
-        path: ROUTES.DASHBOARD,
+        path: "/dashboard",
         element: <P.Dashboard />,
         loader: dashboardLoader(queryClient),
       },
-      { path: ROUTES.DETAILS, element: <P.Details /> },
-      { path: ROUTES.FAQ, element: <P.Faq /> },
+      { path: "/details", element: <P.Details /> },
+      { path: "/faq", element: <P.Faq /> },
       {
-        path: ROUTES.NEW_SUBMISSION_OPTIONS,
+        path: "/new-submission",
         element: <P.NewSubmissionInitialOptions />,
       },
       {
-        path: ROUTES.SPA_SUBMISSION_OPTIONS,
+        path: "/new-submission/spa",
         element: <P.SPASubmissionOptions />,
       },
       {
-        path: ROUTES.WAIVER_SUBMISSION_OPTIONS,
+        path: "/new-submission/waiver",
         element: <P.WaiverSubmissionOptions />,
       },
       {
-        path: ROUTES.B_WAIVER_SUBMISSION_OPTIONS,
+        path: "/new-submission/waiver/b",
         element: <P.BWaiverSubmissionOptions />,
       },
       {
-        path: ROUTES.B4_WAIVER_OPTIONS,
+        path: "/new-submission/waiver/b/b4",
         element: <P.B4WaiverSubmissionOptions />,
       },
       {
-        path: ROUTES.BCAP_WAIVER_OPTIONS,
+        path: "/new-submission/waiver/b/capitated",
         element: <P.BCapWaiverSubmissionOptions />,
       },
       {
-        path: ROUTES.MEDICAID_SPA_SUB_OPTIONS,
+        path: "/new-submission/spa/medicaid",
         element: <P.MedicaidSPASubmissionOptions />,
       },
       {
-        path: ROUTES.CHIP_SPA_SUB_OPTIONS,
+        path: "/new-submission/spa/chip",
         element: <P.ChipSPASubmissionOptions />,
       },
       {
-        path: ROUTES.MEDICAID_ABP_LANDING,
+        path: "/new-submission/spa/medicaid/landing/medicaid-abp",
         element: <P.MedicaidABPLandingPage />,
       },
       {
-        path: ROUTES.MEDICAID_ELIGIBILITY_LANDING,
+        path: "/new-submission/spa/medicaid/landing/medicaid-eligibility",
         element: <P.MedicaidEligibilityLandingPage />,
       },
       {
-        path: ROUTES.CHIP_ELIGIBILITY_LANDING,
+        path: "/new-submission/spa/chip/landing/chip-eligibility",
         element: <P.CHIPEligibilityLandingPage />,
       },
-      { path: ROUTES.MEDICAID_NEW, element: <P.MedicaidSpaFormPage /> },
-      { path: ROUTES.CHIP_NEW, element: <P.ChipSpaFormPage /> },
-      { path: ROUTES.ACTION, element: <P.ActionFormIndex /> },
-      { path: ROUTES.WEBFORMS, element: <C.Webforms /> },
-      { path: ROUTES.WEBFORM, element: <C.Webform /> },
-      { path: ROUTES.PROFILE, element: <P.Profile /> },
-      { path: ROUTES.ABPGUIDE, element: <P.ABPGuide /> },
-    ],
+      // {
+      //   path: "/new-submission/waiver/b/create",
+      //   element: <P.Waiver1915BFormPage />,
+      // },
+      { path: "/new-submission/spa/medicaid/create", element: <P.MedicaidSpaFormPage /> },
+      { path: "/new-submission/spa/chip/create", element: <P.ChipSpaFormPage /> },
+      { path: "/action/:id/:type", element: <P.ActionFormIndex /> },
+      { path: "/webforms", element: <C.Webforms /> },
+      { path: "/webform/:id/:version", element: <C.Webform /> },
+      { path: "/profile", element: <P.Profile /> },
+      { path: "/guides/abp", element: <P.ABPGuide /> },
+    ] satisfies TypedRouteObject[],
     loader: rootLoader(queryClient),
   },
-]);
+] satisfies TypedRouteObject[]);
+
+type TypedRouteObject = RouteObject & {
+  path: Route;
+};
diff --git a/src/services/ui/src/routes.ts b/src/services/ui/src/routes.ts
deleted file mode 100644
index 88935db5cf..0000000000
--- a/src/services/ui/src/routes.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-/** TODO: Implement enum values where `to` or `href` is currently just a string. */
-export enum ROUTES {
-  HOME = "/",
-  DASHBOARD = "/dashboard",
-  DETAILS = "/details",
-  FAQ = "/faq",
-  PROFILE = "/profile",
-  // New Submission Routes
-  // Can stand to be reduced with dynamic segments (KH)
-  NEW_SUBMISSION_OPTIONS = "/new-submission",
-  SPA_SUBMISSION_OPTIONS = "/new-submission/spa",
-  MEDICAID_SPA_SUB_OPTIONS = "/new-submission/spa/medicaid",
-  CHIP_SPA_SUB_OPTIONS = "/new-submission/spa/chip",
-  WAIVER_SUBMISSION_OPTIONS = "/new-submission/waiver",
-  B_WAIVER_SUBMISSION_OPTIONS = "/new-submission/waiver/b",
-  B4_WAIVER_OPTIONS = "/new-submission/waiver/b/b4",
-  BCAP_WAIVER_OPTIONS = "/new-submission/waiver/b/capitated",
-  MEDICAID_ABP_LANDING = "/new-submission/spa/medicaid/landing/medicaid-abp",
-  MEDICAID_ELIGIBILITY_LANDING = "/new-submission/spa/medicaid/landing/medicaid-eligibility",
-  CHIP_ELIGIBILITY_LANDING = "/new-submission/spa/chip/landing/chip-eligibility",
-  ACTION = "/action/:id/:type",
-  CREATE = "/create",
-  MEDICAID_NEW = "/new-submission/spa/medicaid/create",
-  CHIP_NEW = "/new-submission/spa/chip/create",
-  WEBFORMS = "/webforms",
-  WEBFORM = "/webform/:id/:version",
-  GUIDES = "/guides",
-  ABPGUIDE = "/guides/abp",
-}
-
-export enum FAQ_SECTION {
-  SYSTEM = "system",
-}
-
-export const FAQ_TARGET = "faq-target" as const;
diff --git a/src/services/ui/src/utils/crumbs.ts b/src/services/ui/src/utils/crumbs.ts
index 497f1354ec..7c03c35aa1 100644
--- a/src/services/ui/src/utils/crumbs.ts
+++ b/src/services/ui/src/utils/crumbs.ts
@@ -2,6 +2,7 @@ import { ROUTES } from "@/routes";
 import { BreadCrumbConfig } from "@/components";
 import { mapActionLabel, mapSubmissionCrumb } from "@/utils/labelMappers";
 import { Action } from "shared-types";
+import { Route } from "@/components/Routing/types";
 
 export const dashboardCrumb: BreadCrumbConfig = {
   displayText: "Dashboard",
@@ -23,10 +24,10 @@ export const actionCrumb = (action: Action, id: string): BreadCrumbConfig => ({
 });
 
 export const submissionFormCrumb = (
-  path: string,
+  path: Route,
   idx: number
 ): BreadCrumbConfig => ({
-  displayText: mapSubmissionCrumb(path as ROUTES),
+  displayText: mapSubmissionCrumb(path),
   order: idx,
   to: path,
 });

From 19e7b1551444ba7908c944e80b1918844a2cefae Mon Sep 17 00:00:00 2001
From: 13bfrancis <40218571+13bfrancis@users.noreply.github.com>
Date: Fri, 19 Jan 2024 10:14:18 -0500
Subject: [PATCH 2/6] fix type errors

---
 src/services/ui/src/components/Layout/index.tsx              | 5 ++---
 .../pages/create/external-landing/ExternalAppLandingPage.tsx | 3 +--
 src/services/ui/src/pages/faq/content/oneMACFAQContent.tsx   | 2 +-
 src/services/ui/src/pages/form/chip-form.tsx                 | 3 +--
 src/services/ui/src/pages/form/content.tsx                   | 5 ++---
 src/services/ui/src/pages/form/medicaid-form.tsx             | 3 +--
 src/services/ui/src/pages/welcome/index.tsx                  | 3 +--
 src/services/ui/src/utils/crumbs.ts                          | 3 +--
 8 files changed, 10 insertions(+), 17 deletions(-)

diff --git a/src/services/ui/src/components/Layout/index.tsx b/src/services/ui/src/components/Layout/index.tsx
index 899c9cc2b9..1447361810 100644
--- a/src/services/ui/src/components/Layout/index.tsx
+++ b/src/services/ui/src/components/Layout/index.tsx
@@ -8,7 +8,6 @@ import { Auth } from "aws-amplify";
 import { AwsCognitoOAuthOpts } from "@aws-amplify/auth/lib-esm/types";
 import { Footer } from "../Footer";
 import { UsaBanner } from "../UsaBanner";
-import { FAQ_TARGET } from "@/routes";
 import { useUserContext } from "../Context/userContext";
 import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
 import config from "@/config";
@@ -182,7 +181,7 @@ const ResponsiveNav = ({ isDesktop }: ResponsiveNavProps) => {
         {getLinks(!!data.user, role).map((link) => (
           <NavLink
             to={link.link}
-            target={link.link === "/faq" ? FAQ_TARGET : undefined}
+            target={link.link === "/faq" ? "_blank" : "_self"}
             key={link.name}
             className={setClassBasedOnNav}
           >
@@ -227,7 +226,7 @@ const ResponsiveNav = ({ isDesktop }: ResponsiveNavProps) => {
                 <Link
                   className="block py-2 pl-3 pr-4 text-white rounded"
                   to={link.link}
-                  target={link.link === "/faq" ? FAQ_TARGET : undefined}
+                  target={link.link === "/faq" ? "_blank" : "_self"}
                 >
                   {link.name}
                 </Link>
diff --git a/src/services/ui/src/pages/create/external-landing/ExternalAppLandingPage.tsx b/src/services/ui/src/pages/create/external-landing/ExternalAppLandingPage.tsx
index ef33e9e454..18b59df9e1 100644
--- a/src/services/ui/src/pages/create/external-landing/ExternalAppLandingPage.tsx
+++ b/src/services/ui/src/pages/create/external-landing/ExternalAppLandingPage.tsx
@@ -4,7 +4,6 @@ import { Link } from "@/components/Routing";
 import { PropsWithChildren, ReactElement } from "react";
 import { SimplePageTitle } from "@/pages/create/create-options";
 import { SimplePageContainer } from "@/components";
-import { FAQ_SECTION } from "@/routes";
 import { BreadCrumbs } from "@/components/BreadCrumb";
 import { optionCrumbsFromPath } from "@/pages/create/create-breadcrumbs";
 export enum EXTERNAL_APP {
@@ -34,7 +33,7 @@ const FAQHelperText = () => (
         className="text-sky-600 hover:text-sky-800 underline"
         target={"_faq"}
         path="/faq"
-        hash={FAQ_SECTION.SYSTEM}
+        hash={"system"}
       >
         Crosswalk from Paper-based State Plan to MACPro and MMDL
       </Link>{" "}
diff --git a/src/services/ui/src/pages/faq/content/oneMACFAQContent.tsx b/src/services/ui/src/pages/faq/content/oneMACFAQContent.tsx
index 2a64c163a6..fd3fb3acdf 100644
--- a/src/services/ui/src/pages/faq/content/oneMACFAQContent.tsx
+++ b/src/services/ui/src/pages/faq/content/oneMACFAQContent.tsx
@@ -31,7 +31,7 @@ export const oneMACFAQContent: FAQContent[] = [
         anchorText: "system",
         question: "Which system should I use for my state’s submission?",
         answerJSX: (
-          <section id={FAQ_SECTION.SYSTEM}>
+          <section id={"system"}>
             <p>
               Check which system to submit your state plan in with this
               crosswalk training document.
diff --git a/src/services/ui/src/pages/form/chip-form.tsx b/src/services/ui/src/pages/form/chip-form.tsx
index 4eac08b26f..7ba013f194 100644
--- a/src/services/ui/src/pages/form/chip-form.tsx
+++ b/src/services/ui/src/pages/form/chip-form.tsx
@@ -12,7 +12,6 @@ import {
   SimplePageContainer,
 } from "@/components";
 import * as Inputs from "@/components/Inputs";
-import { FAQ_TARGET } from "@/routes";
 import { PlanType } from "shared-types";
 import {
   zAttachmentOptional,
@@ -105,7 +104,7 @@ export const ChipForm = () => {
                     </Inputs.FormLabel>
                     <Link
                       to="/faq/#spa-id-format"
-                      target={FAQ_TARGET}
+                      target={"_blank"}
                       rel="noopener noreferrer"
                       className="text-blue-700 hover:underline"
                     >
diff --git a/src/services/ui/src/pages/form/content.tsx b/src/services/ui/src/pages/form/content.tsx
index 28137640c8..f1dac7df09 100644
--- a/src/services/ui/src/pages/form/content.tsx
+++ b/src/services/ui/src/pages/form/content.tsx
@@ -1,5 +1,4 @@
 import { Link } from "react-router-dom";
-import { FAQ_TARGET } from "@/routes";
 import { RequiredIndicator } from "@/components/Inputs";
 import { Alert } from "@/components";
 import { Info } from "lucide-react";
@@ -50,7 +49,7 @@ export const AttachmentsSizeTypesDesc = ({
       {
         <Link
           to={faqLink}
-          target={FAQ_TARGET}
+          target={"_blank"}
           rel="noopener noreferrer"
           className="text-blue-700 hover:underline"
         >
@@ -66,7 +65,7 @@ export const AttachmentsSizeTypesDesc = ({
       {
         <Link
           to="/faq/#acceptable-file-formats"
-          target={FAQ_TARGET}
+          target={"_blank"}
           rel="noopener noreferrer"
           className="text-blue-700 hover:underline"
         >
diff --git a/src/services/ui/src/pages/form/medicaid-form.tsx b/src/services/ui/src/pages/form/medicaid-form.tsx
index 3cf9b9ee63..224e85a51a 100644
--- a/src/services/ui/src/pages/form/medicaid-form.tsx
+++ b/src/services/ui/src/pages/form/medicaid-form.tsx
@@ -12,7 +12,6 @@ import {
   SimplePageContainer,
   SectionCard,
 } from "@/components";
-import { FAQ_TARGET } from "@/routes";
 import { submit } from "@/api/submissionService";
 import { PlanType } from "shared-types";
 import {
@@ -110,7 +109,7 @@ export const MedicaidForm = () => {
                     </Inputs.FormLabel>
                     <Link
                       to="/faq/#spa-id-format"
-                      target={FAQ_TARGET}
+                      target={"_blank"}
                       rel="noopener noreferrer"
                       className="text-blue-700 hover:underline"
                     >
diff --git a/src/services/ui/src/pages/welcome/index.tsx b/src/services/ui/src/pages/welcome/index.tsx
index b219d86ace..4bf7fabaa6 100644
--- a/src/services/ui/src/pages/welcome/index.tsx
+++ b/src/services/ui/src/pages/welcome/index.tsx
@@ -5,7 +5,6 @@ import { QueryClient } from "@tanstack/react-query";
 import { getUser } from "@/api/useGetUser";
 import { Link } from "@/components/Routing";
 import { Button } from "@/components/Inputs";
-import { FAQ_TARGET } from "@/routes";
 
 export const loader = (queryClient: QueryClient) => {
   return async () => {
@@ -191,7 +190,7 @@ export const Welcome = () => {
         <div className="flex justify-around items-center text-xl px-10 py-4 max-w-screen-xl mx-auto">
           <h4>Do you have questions or need support?</h4>
           <Button asChild>
-            <Link path={"/faq"} target={FAQ_TARGET}>
+            <Link path={"/faq"} target={"_blank"}>
               View FAQ
             </Link>
           </Button>
diff --git a/src/services/ui/src/utils/crumbs.ts b/src/services/ui/src/utils/crumbs.ts
index 7c03c35aa1..cc0ec1b9e7 100644
--- a/src/services/ui/src/utils/crumbs.ts
+++ b/src/services/ui/src/utils/crumbs.ts
@@ -1,4 +1,3 @@
-import { ROUTES } from "@/routes";
 import { BreadCrumbConfig } from "@/components";
 import { mapActionLabel, mapSubmissionCrumb } from "@/utils/labelMappers";
 import { Action } from "shared-types";
@@ -8,7 +7,7 @@ export const dashboardCrumb: BreadCrumbConfig = {
   displayText: "Dashboard",
   order: 1,
   default: true,
-  to: ROUTES.DASHBOARD,
+  to: "/dashboard",
 };
 
 export const detailsCrumb = (id: string): BreadCrumbConfig => ({

From 148efcb59da1812badb87fe17a37e58d24d7468a Mon Sep 17 00:00:00 2001
From: 13bfrancis <40218571+13bfrancis@users.noreply.github.com>
Date: Fri, 19 Jan 2024 10:38:50 -0500
Subject: [PATCH 3/6] fix type error

---
 src/services/ui/src/pages/faq/content/oneMACFAQContent.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/services/ui/src/pages/faq/content/oneMACFAQContent.tsx b/src/services/ui/src/pages/faq/content/oneMACFAQContent.tsx
index fd3fb3acdf..640995805a 100644
--- a/src/services/ui/src/pages/faq/content/oneMACFAQContent.tsx
+++ b/src/services/ui/src/pages/faq/content/oneMACFAQContent.tsx
@@ -4,7 +4,6 @@ import IDMInstructionsforOneMACUsers from "../../../assets/onboarding/IDMInstruc
 import OneMACIDMGuide from "../../../assets/onboarding/OneMACIDMGuide.pdf";
 import OneMACStateUserGuide from "../../../assets/onboarding/OneMACStateUserGuide.pdf";
 import OneMACCMSUserGuide from "../../../assets/onboarding/OneMACCMSUserGuide.pdf";
-import { FAQ_SECTION } from "@/routes";
 import { FILE_TYPES } from "shared-types/uploads";
 
 type QuestionAnswer = {

From 022641e48614d3207acf39ddfbd35ca1c5b961cd Mon Sep 17 00:00:00 2001
From: 13bfrancis <40218571+13bfrancis@users.noreply.github.com>
Date: Fri, 19 Jan 2024 13:20:10 -0500
Subject: [PATCH 4/6] fix issue?

---
 src/services/ui/src/components/Routing/consts.ts | 1 +
 src/services/ui/src/pages/form/chip-form.tsx     | 3 ++-
 src/services/ui/src/pages/form/content.tsx       | 5 +++--
 src/services/ui/src/pages/form/medicaid-form.tsx | 3 ++-
 src/services/ui/src/pages/welcome/index.tsx      | 3 ++-
 5 files changed, 10 insertions(+), 5 deletions(-)
 create mode 100644 src/services/ui/src/components/Routing/consts.ts

diff --git a/src/services/ui/src/components/Routing/consts.ts b/src/services/ui/src/components/Routing/consts.ts
new file mode 100644
index 0000000000..c9e051cf53
--- /dev/null
+++ b/src/services/ui/src/components/Routing/consts.ts
@@ -0,0 +1 @@
+export const FAQ_TAB = "faq-tab";
diff --git a/src/services/ui/src/pages/form/chip-form.tsx b/src/services/ui/src/pages/form/chip-form.tsx
index 7ba013f194..17eaf8587a 100644
--- a/src/services/ui/src/pages/form/chip-form.tsx
+++ b/src/services/ui/src/pages/form/chip-form.tsx
@@ -21,6 +21,7 @@ import {
 import * as Content from "@/pages/form/content";
 import { ModalProvider, useModalContext } from "@/pages/form/modals";
 import { formCrumbsFromPath } from "@/pages/form/form-breadcrumbs";
+import { FAQ_TAB } from "@/components/Routing/consts";
 
 const formSchema = z.object({
   id: zSpaIdSchema,
@@ -104,7 +105,7 @@ export const ChipForm = () => {
                     </Inputs.FormLabel>
                     <Link
                       to="/faq/#spa-id-format"
-                      target={"_blank"}
+                      target={FAQ_TAB}
                       rel="noopener noreferrer"
                       className="text-blue-700 hover:underline"
                     >
diff --git a/src/services/ui/src/pages/form/content.tsx b/src/services/ui/src/pages/form/content.tsx
index f1dac7df09..eea8f592cf 100644
--- a/src/services/ui/src/pages/form/content.tsx
+++ b/src/services/ui/src/pages/form/content.tsx
@@ -2,6 +2,7 @@ import { Link } from "react-router-dom";
 import { RequiredIndicator } from "@/components/Inputs";
 import { Alert } from "@/components";
 import { Info } from "lucide-react";
+import { FAQ_TAB } from "@/components/Routing/consts";
 
 export const FormIntroText = () => (
   <div>
@@ -49,7 +50,7 @@ export const AttachmentsSizeTypesDesc = ({
       {
         <Link
           to={faqLink}
-          target={"_blank"}
+          target={FAQ_TAB}
           rel="noopener noreferrer"
           className="text-blue-700 hover:underline"
         >
@@ -65,7 +66,7 @@ export const AttachmentsSizeTypesDesc = ({
       {
         <Link
           to="/faq/#acceptable-file-formats"
-          target={"_blank"}
+          target={FAQ_TAB}
           rel="noopener noreferrer"
           className="text-blue-700 hover:underline"
         >
diff --git a/src/services/ui/src/pages/form/medicaid-form.tsx b/src/services/ui/src/pages/form/medicaid-form.tsx
index 224e85a51a..9303c04682 100644
--- a/src/services/ui/src/pages/form/medicaid-form.tsx
+++ b/src/services/ui/src/pages/form/medicaid-form.tsx
@@ -21,6 +21,7 @@ import {
 } from "@/pages/form/zod";
 import { ModalProvider, useModalContext } from "@/pages/form/modals";
 import { formCrumbsFromPath } from "@/pages/form/form-breadcrumbs";
+import { FAQ_TAB } from "@/components/Routing/consts";
 
 const formSchema = z.object({
   id: zSpaIdSchema,
@@ -109,7 +110,7 @@ export const MedicaidForm = () => {
                     </Inputs.FormLabel>
                     <Link
                       to="/faq/#spa-id-format"
-                      target={"_blank"}
+                      target={FAQ_TAB}
                       rel="noopener noreferrer"
                       className="text-blue-700 hover:underline"
                     >
diff --git a/src/services/ui/src/pages/welcome/index.tsx b/src/services/ui/src/pages/welcome/index.tsx
index 4bf7fabaa6..d24399f979 100644
--- a/src/services/ui/src/pages/welcome/index.tsx
+++ b/src/services/ui/src/pages/welcome/index.tsx
@@ -5,6 +5,7 @@ import { QueryClient } from "@tanstack/react-query";
 import { getUser } from "@/api/useGetUser";
 import { Link } from "@/components/Routing";
 import { Button } from "@/components/Inputs";
+import { FAQ_TAB } from "@/components/Routing/consts";
 
 export const loader = (queryClient: QueryClient) => {
   return async () => {
@@ -190,7 +191,7 @@ export const Welcome = () => {
         <div className="flex justify-around items-center text-xl px-10 py-4 max-w-screen-xl mx-auto">
           <h4>Do you have questions or need support?</h4>
           <Button asChild>
-            <Link path={"/faq"} target={"_blank"}>
+            <Link path={"/faq"} target={FAQ_TAB}>
               View FAQ
             </Link>
           </Button>

From 1462deff044f92893f4a344450ba83c253f33090 Mon Sep 17 00:00:00 2001
From: 13bfrancis <40218571+13bfrancis@users.noreply.github.com>
Date: Fri, 19 Jan 2024 13:25:14 -0500
Subject: [PATCH 5/6] add missing target for faq

---
 src/services/ui/src/components/Layout/index.tsx                | 3 ++-
 .../pages/create/external-landing/ExternalAppLandingPage.tsx   | 3 ++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/services/ui/src/components/Layout/index.tsx b/src/services/ui/src/components/Layout/index.tsx
index 1447361810..a3a31f5795 100644
--- a/src/services/ui/src/components/Layout/index.tsx
+++ b/src/services/ui/src/components/Layout/index.tsx
@@ -12,6 +12,7 @@ import { useUserContext } from "../Context/userContext";
 import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
 import config from "@/config";
 import { useNavigate } from "../Routing";
+import { FAQ_TAB } from "../Routing/consts";
 
 const getLinks = (isAuthenticated: boolean, role?: boolean) => {
   const isProd = window && window.location.hostname === "mako.cms.gov";
@@ -181,7 +182,7 @@ const ResponsiveNav = ({ isDesktop }: ResponsiveNavProps) => {
         {getLinks(!!data.user, role).map((link) => (
           <NavLink
             to={link.link}
-            target={link.link === "/faq" ? "_blank" : "_self"}
+            target={link.link === "/faq" ? FAQ_TAB : "_self"}
             key={link.name}
             className={setClassBasedOnNav}
           >
diff --git a/src/services/ui/src/pages/create/external-landing/ExternalAppLandingPage.tsx b/src/services/ui/src/pages/create/external-landing/ExternalAppLandingPage.tsx
index 18b59df9e1..e00c3233f9 100644
--- a/src/services/ui/src/pages/create/external-landing/ExternalAppLandingPage.tsx
+++ b/src/services/ui/src/pages/create/external-landing/ExternalAppLandingPage.tsx
@@ -6,6 +6,7 @@ import { SimplePageTitle } from "@/pages/create/create-options";
 import { SimplePageContainer } from "@/components";
 import { BreadCrumbs } from "@/components/BreadCrumb";
 import { optionCrumbsFromPath } from "@/pages/create/create-breadcrumbs";
+import { FAQ_TAB } from "@/components/Routing/consts";
 export enum EXTERNAL_APP {
   MAC_PRO = "https://www.medicaid.gov/resources-for-states/medicaid-and-chip-program-macpro-portal/index.html#MACPro",
   MMDL = "https://wms-mmdl.cms.gov/MMDL/faces/portal.jsp",
@@ -31,7 +32,7 @@ const FAQHelperText = () => (
       {/* TODO: Get desired FAQ `target` from Wale */}
       <Link
         className="text-sky-600 hover:text-sky-800 underline"
-        target={"_faq"}
+        target={FAQ_TAB}
         path="/faq"
         hash={"system"}
       >

From de0cb86e29f548078ce9bf3488ee88286f173f68 Mon Sep 17 00:00:00 2001
From: 13bfrancis <40218571+13bfrancis@users.noreply.github.com>
Date: Fri, 19 Jan 2024 13:27:30 -0500
Subject: [PATCH 6/6] fix last one hopefully

---
 src/services/ui/src/components/Layout/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/services/ui/src/components/Layout/index.tsx b/src/services/ui/src/components/Layout/index.tsx
index a3a31f5795..ea86f87fe8 100644
--- a/src/services/ui/src/components/Layout/index.tsx
+++ b/src/services/ui/src/components/Layout/index.tsx
@@ -227,7 +227,7 @@ const ResponsiveNav = ({ isDesktop }: ResponsiveNavProps) => {
                 <Link
                   className="block py-2 pl-3 pr-4 text-white rounded"
                   to={link.link}
-                  target={link.link === "/faq" ? "_blank" : "_self"}
+                  target={link.link === "/faq" ? FAQ_TAB : "_self"}
                 >
                   {link.name}
                 </Link>