Merge branch 'master' into 2114-vulnerability-code-2023_07_24-6-and-9

backend/package.json

@@ -61,13 +61,13 @@
     "debug": "^4.3.4",
     "dockerode": "^3.3.1",
     "dotenv": "^16.0",
-    "eslint": "^7.10.0",
+    "eslint": "^8.46.0",
     "eslint-config-prettier": "^6.12.0",
-    "eslint-plugin-prettier": "^3.1.4",
+    "eslint-plugin-prettier": "^5.0.0",
     "jest": "^27",
     "json-schema-to-typescript": "^12.0",
     "nock": "^13.0.4",
-    "prettier": "^2.1.2",
+    "prettier": "^3.0.0",
     "sentencer": "^0.2.1",
     "serverless": "^3.30",
     "serverless-domain-manager": "^7.0",

frontend/package.json

@@ -6,7 +6,7 @@
     "node": ">=18.0.0"
   },
   "dependencies": {
-    "@aws-amplify/ui-react": "^4.3.6",
+    "@aws-amplify/ui-react": "^5.0.6",
     "@elastic/react-search-ui": "^1.18.2",
     "@elastic/react-search-ui-views": "^1.20.2",
     "@jonkoops/matomo-tracker-react": "^0.7.0",
@@ -45,7 +45,7 @@
     "resolve-url-loader": "^5.0.0",
     "universal-cookie": "^4.0.4",
     "uswds": "^2.13.3",
-    "web-vitals": "^2.1.4"
+    "web-vitals": "^3.4.0"
   },
   "overrides": {
     "@mattiasbuelens/web-streams-polyfill": "npm:web-streams-polyfill",

frontend/src/App.tsx

@@ -33,7 +33,8 @@ import {
   Domains,
   Reports
 } from 'pages';
-import { CrossfeedFooter, Layout, RouteGuard } from 'components';
+import { Layout, RouteGuard } from 'components';
+import { CrossfeedFooter } from './components/Footer';
 import './styles.scss';
 import { Authenticator } from '@aws-amplify/ui-react';
 API.configure({

frontend/src/components/Footer/Footer.tsx

@@ -0,0 +1,69 @@
+import React from 'react';
+import { Box, Grid, Link } from '@material-ui/core';
+import { useAuthContext } from 'context';
+import logo from '../../assets/crossfeed.svg';
+import { useFooterStyles } from './style';
+
+export const CrossfeedFooter: React.FC = (props) => {
+  const { logout } = useAuthContext();
+  const footerClasses = useFooterStyles(props);
+  return (
+    <Box className={footerClasses.footerBox}>
+      <Grid className={footerClasses.footerContainer} container>
+        <Grid className={footerClasses.footerLogo} item xs={12} sm={2}>
+          <Link href="/">
+            <img src={logo} alt="Crossfeed Icon Navigate Home" />
+          </Link>
+        </Grid>
+        <Grid className={footerClasses.footerNavItem} item xs={12} sm={2}>
+          <p>
+            <Link className={footerClasses.footerNavLink} href="/">
+              Home
+            </Link>
+          </p>
+        </Grid>
+        <Grid className={footerClasses.footerNavItem} item xs={12} sm={2}>
+          <p>
+            <Link
+              className={footerClasses.footerNavLink}
+              href="https://docs.crossfeed.cyber.dhs.gov/"
+            >
+              Documentation
+            </Link>
+          </p>
+        </Grid>
+        <Grid className={footerClasses.footerNavItem} item xs={12} sm={2}>
+          <p>
+            <Link
+              className={footerClasses.footerNavLink}
+              href="https://www.cisa.gov"
+            >
+              CISA Homepage
+            </Link>
+          </p>
+        </Grid>
+        <Grid className={footerClasses.footerNavItem} item xs={12} sm={2}>
+          <p>
+            <Link
+              className={footerClasses.footerNavLink}
+              href="mailto:[email protected]"
+            >
+              Contact Us
+            </Link>
+          </p>
+        </Grid>
+        <Grid className={footerClasses.footerNavItem} item xs={12} sm={2}>
+          <p>
+            <Link
+              className={footerClasses.footerNavLink}
+              href="/"
+              onClick={logout}
+            >
+              Logout
+            </Link>
+          </p>
+        </Grid>
+      </Grid>
+    </Box>
+  );
+};

frontend/src/components/Footer/index.ts

@@ -0,0 +1 @@
+export * from './Footer';

frontend/src/components/Footer/style.ts

@@ -0,0 +1,34 @@
+import { makeStyles } from '@material-ui/core';
+
+export const useFooterStyles = makeStyles((theme) => ({
+  footerBox: {
+    position: 'absolute',
+    bottom: 0,
+    width: '100%',
+    backgroundColor: theme.palette.primary.main
+  },
+  footerContainer: {
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    margin: '0 auto',
+    maxWidth: '1444px'
+  },
+  footerLogo: {
+    display: 'flex',
+    justifyContent: 'center',
+    height: '100%'
+  },
+  footerNavItem: {
+    display: 'flex',
+    justifyContent: 'center',
+    padding: '0.5rem',
+    borderLeft: '1px solid white',
+    gridColumn: 'span 2'
+  },
+  footerNavLink: {
+    color: 'white',
+    alwaysUnderline: 'true',
+    alignItems: 'center'
+  }
+}));

frontend/src/components/index.ts

@@ -19,4 +19,3 @@ export * from './AutoCompletedResults';
 export * from './FacetFilter';
 export * from './Subnav';
 export * from './ModalToggleButton';
-export * from './Footer';