Add support section with contact and faq pages

frontend-react/src/App.tsx

@@ -32,8 +32,6 @@ import Spinner from "./components/Spinner";
 import Submissions from "./pages/submissions/Submissions";
 import { GettingStartedPublicHealthDepartments } from "./pages/getting-started/public-health-departments";
 import { GettingStartedTestingFacilities } from "./pages/getting-started/testing-facilities";
-import { SupportFaq } from "./pages/support/faq";
-import { SupportContact } from "./pages/support/contact";
 import { AdminMain } from "./pages/admin/AdminMain";
 import { AdminOrgEdit } from "./pages/admin/AdminOrgEdit";
 import { EditReceiverSettings } from "./components/Admin/EditReceiverSettings";
@@ -48,6 +46,7 @@ import { DAPHeader } from "./components/header/DAPHeader";
 import ValueSetsIndex from "./pages/admin/value-set-editor/ValueSetsIndex";
 import SessionProvider from "./contexts/SessionContext";
 import BuiltForYouIndex from "./pages/built-for-you/BuiltForYouIndex";
+import SupportIndex from "./pages/support/SupportIndex";
 import InternalUserGuides from "./pages/admin/InternalUserGuides";
 
 const OKTA_AUTH = new OktaAuth(oktaAuthConfig);
@@ -158,6 +157,10 @@ const App = () => {
                                     path="/built-for-you"
                                     component={BuiltForYouIndex}
                                 />
+                                <Route
+                                    path="/support"
+                                    component={SupportIndex}
+                                />
                                 <AuthorizedRoute
                                     path="/daily-data"
                                     authorize={PERMISSIONS.RECEIVER}

frontend-react/src/components/header/ReportStreamHeader.tsx

@@ -18,6 +18,7 @@ import {
     FeatureFlagName,
 } from "../../pages/misc/FeatureFlags";
 import { BuiltForYouDropdown } from "../../pages/built-for-you/BuiltForYouIndex";
+import { SupportDropdown } from "../../pages/support/SupportIndex";
 
 import { SignInOrUser } from "./SignInOrUser";
 import {
@@ -34,7 +35,11 @@ export const ReportStreamHeader = () => {
     const { authState } = useOktaAuth();
     const { memberships } = useSessionContext();
     const [expanded, setExpanded] = useState(false);
-    let itemsMenu = [<GettingStartedDropdown />, <HowItWorksDropdown />];
+    let itemsMenu = [
+        <GettingStartedDropdown />,
+        <HowItWorksDropdown />,
+        <SupportDropdown />,
+    ];
 
     const toggleMobileNav = (): void =>
         setExpanded((prvExpanded) => !prvExpanded);

frontend-react/src/content/support/contact.md

@@ -0,0 +1,3 @@
+# Contact us
+
+Foo baz bar

frontend-react/src/content/support/faq.md

@@ -0,0 +1,3 @@
+# Frequently asked questions
+
+yo

frontend-react/src/pages/support/SupportIndex.tsx

@@ -0,0 +1,28 @@
+import React from "react";
+
+import { MarkdownDirectory } from "../../components/Markdown/MarkdownDirectory";
+import StaticPageFromDirectories from "../../components/Markdown/StaticPageFromDirectories";
+import faq from "../../content/support/faq.md";
+import contact from "../../content/support/contact.md";
+import DropdownNav from "../../components/header/DropdownNav";
+
+/* This controls the content for Support
+ *
+ * visit: https://reportstream.cdc.gov/admin/guides/create-markdown-pages
+ * for mor info on how to edit this directory */
+export const SUPPORT: MarkdownDirectory[] = [
+    new MarkdownDirectory("Frequently asked questions", "faq", [faq]),
+    new MarkdownDirectory("Contact", "contact", [contact]),
+];
+
+/* This generates the navigation item for Built For You
+ * Import and use this in ReportStreamHeader */
+export const SupportDropdown = () => {
+    return (
+        <DropdownNav label="Support" root="/support" directories={SUPPORT} />
+    );
+};
+
+/* Creates the page and side-nav from your directory array */
+const SupportIndex = () => <StaticPageFromDirectories directories={SUPPORT} />;
+export default SupportIndex;