EA-9267 - Add support and placeholders for IT+CT+DT Docs

.github/workflows/index.yml

@@ -40,7 +40,7 @@ jobs:
 
       # Runs a single command using the runners shell
       - name: Index Posts
-        run: npm run build:index:momentum && npm run build:index:support
+        run: npm run build:index:momentum && npm run build:index:support && npm run build:index:analyst
         env:
           NEXT_PUBLIC_ALGOLIA_APP_ID: ${{secrets.NEXT_PUBLIC_ALGOLIA_APP_ID}}
           ALGOLIA_SEARCH_ADMIN_KEY: ${{secrets.ALGOLIA_SEARCH_ADMIN_KEY}}

components/site/analystHomePageContent.tsx

@@ -0,0 +1,75 @@
+import React from 'react';
+import { Feedback } from '@sparkpost/matchbox-icons';
+import Link from 'next/link';
+import BaseHomePageContent, { SimpleStyledLink } from './baseHomePageContent';
+
+/* #Content */
+const gettingStarted = {
+  title: 'Getting Started',
+  desc: 'Welcome to Analyst! Get familiar with our product and explore its features:',
+  content: [
+    {
+      url: '/analyst/general/',
+      title: 'General',
+      desc: 'General platform definitions & common account-level inquiries',
+      linkText: 'Learn More',
+    },
+    {
+      url: '/analyst/inbox-and-design-tracker/',
+      title: 'Inbox Tracker & Design Tracker',
+      desc: 'A collection of How-To Guides',
+      linkText: 'Learn More',
+    },
+    {
+      url: '/analyst/competitive-tracker/',
+      title: 'Competitve Tracker',
+      desc: 'Guides for optimizing your use of Competitive Tracker',
+      linkText: 'Learn More',
+    },
+    {
+      url: '/analyst/sfmc/',
+      title: 'Salesforce Marketing Cloud Integration',
+      desc: 'A set of guides on the installation and integration of the Inbox Tracker application',
+      linkText: 'Learn More',
+    },
+    {
+      url: '/analyst/privacy-gdpr/',
+      title: 'Privacy & GDPR',
+      desc: 'We’re committed to keeping your private information private, your data protected and secure and being transparent about our practices',
+      linkText: 'Learn More',
+    },
+    {
+      url: 'https://api.edatasource.com/docs',
+      title: 'API Docs',
+      desc: 'Check out our full API reference.',
+      linkText: 'View Documentation',
+    },
+  ],
+};
+
+const help = {
+  title: "Questions? We're here to help.",
+  desc: 'We’re always happy to help with code or other questions you might have!',
+  desc2: (
+    <>
+      To find the best resource for your question and fastest resolution, check out our
+      <Link href="/" passHref>
+        <SimpleStyledLink $inlineBlock={true}>how to get help guide</SimpleStyledLink>
+      </Link>
+    </>
+  ),
+  content: [
+    { text: 'Submit a ticket', url: 'mailto:support@emailanalyst.com', Icon: Feedback },
+  ],
+};
+
+const AnalystHomePageContent = () => {
+  return (
+    <BaseHomePageContent
+      gettingStarted={gettingStarted}
+      help={help}
+    />
+  );
+};
+
+export default AnalystHomePageContent;

components/site/analystLayout.tsx

@@ -0,0 +1,24 @@
+import Layout from './layout';
+import { NavigationItemProps } from './baseNavigation';
+import AnalystNavigation from 'components/site/analystNavigation';
+
+type LayoutProps = {
+  children?: React.ReactNode;
+  navigationData?: NavigationItemProps[];
+};
+
+const AnalystLayout = (props: LayoutProps): JSX.Element => {
+  const { children, navigationData } = props;
+  return (
+    <Layout
+      hideDrawerButtons={true}
+      navigationComponent={
+        <AnalystNavigation data={navigationData} title="Analyst Documentation" titleLink="/analyst" />
+      }
+    >
+      {children}
+    </Layout>
+  );
+};
+
+export default AnalystLayout;

components/site/analystNavigation.tsx

@@ -0,0 +1,69 @@
+import React from 'react';
+import Link from 'next/link';
+import { Box } from '@sparkpost/matchbox';
+import {
+  DeviceHub,
+  Feedback,
+} from '@sparkpost/matchbox-icons';
+import useStatus from 'hooks/useStatus';
+import BaseNavigation, { NavigationProps, StyledLink, StatusColorMap } from './baseNavigation';
+
+const AnalystNavigation = (props: NavigationProps): JSX.Element | null => {
+  const { data = [], title, titleLink } = props;
+  const { status } = useStatus();
+
+  return (
+    <BaseNavigation data={data} title={title} titleLink={titleLink}>
+      <Box py="450" mt="450" borderTop="400">
+        <Link href="mailto:support@emailanalyst.com" passHref>
+          <StyledLink>
+            <Box px="500">
+              <Feedback size={20} />
+              <Box as="span" pl="300">
+                Submit a Ticket
+              </Box>
+            </Box>
+          </StyledLink>
+        </Link>
+
+        <Link href="https://api.edatasource.com/" passHref>
+          <StyledLink target="_blank" rel="noreferrer">
+            <Box px="500">
+              <DeviceHub size={20} />
+              <Box as="span" pl="300">
+                API Docs
+              </Box>
+            </Box>
+          </StyledLink>
+        </Link>
+
+        <Link href="http://status.edatasource.com/" passHref>
+          <StyledLink target="_blank" rel="noreferrer">
+            <Box px="500">
+              {/* Placeholder until Circle icon is added to Matchbox */}
+              <Box
+                as="span"
+                display="inline-block"
+                width="20px"
+                height="20px"
+                verticalAlign="middle"
+              >
+                <Box
+                  width="16px"
+                  height="16px"
+                  backgroundColor={StatusColorMap[status]}
+                  borderRadius="50%"
+                />
+              </Box>
+              <Box as="span" pl="300">
+                Service Status
+              </Box>
+            </Box>
+          </StyledLink>
+        </Link>
+      </Box>
+    </BaseNavigation>
+  );
+};
+
+export default AnalystNavigation;