diff --git a/packages/website/package.json b/packages/website/package.json
index c57498005..199972992 100644
--- a/packages/website/package.json
+++ b/packages/website/package.json
@@ -53,6 +53,7 @@
     "react-dom": "^16.13.1",
     "react-dropzone": "^11.0.3",
     "react-ga4": "^2.1.0",
+    "react-helmet-async": "^2.0.5",
     "react-hook-form": "^7.41.5",
     "react-jwt": "^1.1.8",
     "react-leaflet": "^2.7.0",
diff --git a/packages/website/src/assets/img/helmet/Dashboard.jpg b/packages/website/src/assets/img/helmet/Dashboard.jpg
new file mode 100644
index 000000000..2fa83a8d7
Binary files /dev/null and b/packages/website/src/assets/img/helmet/Dashboard.jpg differ
diff --git a/packages/website/src/assets/img/helmet/Map.jpg b/packages/website/src/assets/img/helmet/Map.jpg
new file mode 100644
index 000000000..d400bc315
Binary files /dev/null and b/packages/website/src/assets/img/helmet/Map.jpg differ
diff --git a/packages/website/src/assets/img/helmet/Startpage.jpg b/packages/website/src/assets/img/helmet/Startpage.jpg
new file mode 100644
index 000000000..3bf4a14ad
Binary files /dev/null and b/packages/website/src/assets/img/helmet/Startpage.jpg differ
diff --git a/packages/website/src/assets/img/helmet/Tracker.jpg b/packages/website/src/assets/img/helmet/Tracker.jpg
new file mode 100644
index 000000000..61f894ccd
Binary files /dev/null and b/packages/website/src/assets/img/helmet/Tracker.jpg differ
diff --git a/packages/website/src/index.tsx b/packages/website/src/index.tsx
index 2e0b850cf..0e9567942 100644
--- a/packages/website/src/index.tsx
+++ b/packages/website/src/index.tsx
@@ -9,6 +9,7 @@ import { decodeToken } from 'react-jwt';
 import { Provider } from 'react-redux';
 import { SnackbarProvider } from 'notistack';
 import { getAuth, onAuthStateChanged } from 'firebase/auth';
+import { HelmetProvider } from 'react-helmet-async';
 import App from './layout/App';
 import { store } from './store/configure';
 import * as serviceWorker from './serviceWorker';
@@ -57,7 +58,9 @@ ReactDOM.render(
   <>
     <Provider store={store}>
       <SnackbarProvider maxSnack={3}>
-        <App />
+        <HelmetProvider>
+          <App />
+        </HelmetProvider>
       </SnackbarProvider>
     </Provider>
   </>,
diff --git a/packages/website/src/routes/About/index.tsx b/packages/website/src/routes/About/index.tsx
index 52e6541a9..f1d34b6b3 100644
--- a/packages/website/src/routes/About/index.tsx
+++ b/packages/website/src/routes/About/index.tsx
@@ -7,10 +7,12 @@ import {
   CardMedia,
 } from '@material-ui/core';
 import classNames from 'classnames';
+import { Helmet } from 'react-helmet-async';
 
 import NavBar from 'common/NavBar';
 import Footer from 'common/Footer';
 
+import Startpage from '../../assets/img/helmet/Startpage.jpg';
 import peter from '../../assets/img/peter.jpg';
 import caesar from '../../assets/img/caesar.jpg';
 import eric from '../../assets/img/eric.jpg';
@@ -18,6 +20,27 @@ import eric from '../../assets/img/eric.jpg';
 const About = ({ classes }: AboutProps) => {
   return (
     <>
+      <Helmet>
+        <title>About Us - Aqualink</title>
+        <meta
+          name="description"
+          content="Learn about Aqualink's mission, our team,
+         and our efforts in ocean conservation technology."
+        />
+        <meta property="og:image" content={Startpage} />
+        <meta
+          property="og:image:alt"
+          content="This image displays the interactive 
+        Aqualink map and the Aqualink dashboard, which are the main two parts of 
+        the Aqualink platform for coastal ocean monitoring. You can explore all of 
+        the Aqualink sites around the globe in the interactive map. The map has four 
+        layers where you can toggle between standard view, heat stress, sea surface 
+        temperature, and SST Anomaly. Each site has a dashboard that allows you to 
+        monitor your reef. It includes a map, survey feature, satellite data with 
+        wind, wave, and temperature data, heat stress alerts for coral bleaching, 
+        and graphs. "
+        />
+      </Helmet>
       <NavBar searchLocation={false} />
       <div>
         <div className="page-container">
diff --git a/packages/website/src/routes/Buoy/index.tsx b/packages/website/src/routes/Buoy/index.tsx
index 1925990a3..671a34168 100644
--- a/packages/website/src/routes/Buoy/index.tsx
+++ b/packages/website/src/routes/Buoy/index.tsx
@@ -6,16 +6,39 @@ import {
   Typography,
   Theme,
 } from '@material-ui/core';
+import { Helmet } from 'react-helmet-async';
 
 import NavBar from 'common/NavBar';
 import Footer from 'common/Footer';
 
 import fullDiagramBuoy from '../../assets/img/fulldiag3_1.svg';
 import fullDiagramInfra from '../../assets/img/fulldiag3.svg';
+import buoy from '../../assets/img/landing-page/buoy.jpg';
 
 const Buoy = ({ classes }: BuoyProps) => {
   return (
     <>
+      <Helmet>
+        <title>
+          Aqualink Smart Buoy | Real-time seafloor &amp; sea surface temperature
+          &amp; sea surface temperature
+        </title>
+        <meta
+          name="description"
+          content="Aqualink's solar-powered smart 
+        buoys collect temperature, wind & wave. Measuring real-time data from 
+        seafloor and sea surface. Monitor marine ecosystems."
+        />
+        <meta property="og:image" content={buoy} />
+        <meta
+          property="og:image:alt"
+          content="This image displays the 
+        Aqualink Smart Buoy which is also known as Smart Mooring Spotter. This 
+        Smart buoy is powered by solar panels and transmits data in real-time over 
+        the air. It collects wind, wave, barometric pressure and temperature 
+        from seafloor and sea surface."
+        />
+      </Helmet>
       <NavBar searchLocation={false} />
       <div className={classes.root} id="bloc-6">
         <div className="container bloc-md">
diff --git a/packages/website/src/routes/Drones/index.tsx b/packages/website/src/routes/Drones/index.tsx
index 55335a634..29d5ec2e8 100644
--- a/packages/website/src/routes/Drones/index.tsx
+++ b/packages/website/src/routes/Drones/index.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
 import { Box } from '@material-ui/core';
+import { Helmet } from 'react-helmet-async';
 
 import NavBar from 'common/NavBar';
 import Footer from 'common/Footer';
@@ -16,6 +17,21 @@ import dronebottom from '../../assets/img/dronebottom.jpg';
 
 const Drones = () => (
   <>
+    <Helmet>
+      <title>Aqualink Drone | An Autonomous Surface Vehicle</title>
+      <meta
+        name="description"
+        content="Explore Aqualink's underwater drone 
+      technology for ocean conservation, monitoring marine ecosystems to help 
+      protect and preserve our oceans."
+      />
+      <meta property="og:image" content={dronepersp} />
+      <meta
+        property="og:image:alt"
+        content="This image display the Aqualink drone, 
+      which is an affordable Autonomous Surface Vehicle (ASV)"
+      />
+    </Helmet>
     <NavBar searchLocation={false} />
     <Box py={6}>
       {/* Main container */}
diff --git a/packages/website/src/routes/Faq/index.tsx b/packages/website/src/routes/Faq/index.tsx
index e84145924..4def3c50e 100644
--- a/packages/website/src/routes/Faq/index.tsx
+++ b/packages/website/src/routes/Faq/index.tsx
@@ -6,13 +6,35 @@ import {
   Typography,
   CardMedia,
 } from '@material-ui/core';
+import { Helmet } from 'react-helmet-async';
 
 import NavBar from 'common/NavBar';
 import Footer from 'common/Footer';
 
+import Dashboard from '../../assets/img/helmet/Dashboard.jpg';
+
 const Faq = ({ classes }: FaqProps) => {
   return (
     <>
+      <Helmet>
+        <title>
+          Aqualink FAQ | Common Questions About Our Ocean Monitoring Platform
+        </title>
+        <meta
+          name="description"
+          content="Answers to frequently asked questions about 
+        Aqualink's real-time ocean monitoring system, reef data, how to use the 
+        platform, and how to monitor your reef."
+        />
+        <meta property="og:image" content={Dashboard} />
+        <meta
+          property="og:image:alt"
+          content="The images display the Aqualink 
+        dashboard, which allows you to monitor your reef. It includes a map, 
+        survey feature, satellite data with wind, wave, and temperature data, 
+        heat stress alerts for coral bleaching, and graphs."
+        />
+      </Helmet>
       <NavBar searchLocation={false} />
       <div>
         {/* Main container */}
diff --git a/packages/website/src/routes/HomeMap/index.tsx b/packages/website/src/routes/HomeMap/index.tsx
index 77baf2bf4..3f7c908f0 100644
--- a/packages/website/src/routes/HomeMap/index.tsx
+++ b/packages/website/src/routes/HomeMap/index.tsx
@@ -9,6 +9,7 @@ import {
   withStyles,
   WithStyles,
 } from '@material-ui/core';
+import { Helmet } from 'react-helmet-async';
 import SwipeableBottomSheet from 'react-swipeable-bottom-sheet';
 import { sitesRequest, sitesListSelector } from 'store/Sites/sitesListSlice';
 import { siteRequest } from 'store/Sites/selectedSiteSlice';
@@ -20,6 +21,8 @@ import HomepageNavBar from 'common/NavBar';
 import SiteTable from './SiteTable';
 import HomepageMap from './Map';
 
+import Map from '../../assets/img/helmet/Map.jpg';
+
 enum QueryParamKeys {
   SITE_ID = 'site_id',
   ZOOM_LEVEL = 'zoom',
@@ -105,6 +108,27 @@ const Homepage = ({ classes }: HomepageProps) => {
 
   return (
     <>
+      <Helmet>
+        <title>
+          Aqualink Map | Interactive Ocean Monitoring for Marine Ecosystems
+        </title>
+        <meta
+          name="description"
+          content="Aqualink's interactive map displays live 
+        ocean data for reef health and ocean temperatures globally. View ocean Heat 
+        Stress, Heatwave, and SST Anomaly."
+        />
+        <meta property="og:image" content={Map} />
+        <meta
+          property="og:image:alt"
+          content="This image displays the interactive Aqualink 
+        map where you can explore all of the Aqualink sites around the globe. Each site has 
+        a dashboard where site managers monitor their local reefs with in situ data and 
+        survey collections combined with satellite data. The map has four layers where you 
+        can toggle between standard view, heat stress, sea surface temperature, and SST 
+        Anomaly."
+        />
+      </Helmet>
       <div role="presentation" onClick={isDrawerOpen ? toggleDrawer : () => {}}>
         <HomepageNavBar searchLocation geocodingEnabled />
       </div>
diff --git a/packages/website/src/routes/Landing/index.tsx b/packages/website/src/routes/Landing/index.tsx
index f34dd6768..445d766c7 100644
--- a/packages/website/src/routes/Landing/index.tsx
+++ b/packages/website/src/routes/Landing/index.tsx
@@ -16,6 +16,7 @@ import {
 } from '@material-ui/core';
 import ArrowDownwardIcon from '@material-ui/icons/ArrowDownward';
 import { Link } from 'react-router-dom';
+import { Helmet } from 'react-helmet-async';
 
 import classNames from 'classnames';
 import NavBar from 'common/NavBar';
@@ -25,6 +26,8 @@ import Card from './Card';
 import landingPageImage from '../../assets/img/landing-page/header.jpg';
 import { cardTitles } from './titles';
 
+import Startpage from '../../assets/img/helmet/Startpage.jpg';
+
 interface LandingPageButton {
   label: string;
   to: string;
@@ -73,6 +76,30 @@ const LandingPage = ({ classes }: LandingPageProps) => {
 
   return (
     <>
+      <Helmet>
+        <title>
+          Aqualink Ocean Monitoring for Marine Ecosystems. Free &amp; open
+        </title>
+        <meta
+          name="description"
+          content="Aqualink is a data management platform 
+        for marine ecosystems. Integrate data from sensors and surveys to give 
+        you an instant view of your ecosystem. Free"
+        />
+        <meta property="og:image" content={Startpage} />
+        <meta
+          property="og:image:alt"
+          content="This image displays the interactive 
+        Aqualink map and the Aqualink dashboard, which are the main two parts of 
+        the Aqualink platform for coastal ocean monitoring. You can explore all of 
+        the Aqualink sites around the globe in the interactive map. The map has 
+        four layers where you can toggle between standard view, heat stress, sea 
+        surface temperature, and SST Anomaly. Each site has a dashboard that allows 
+        you to monitor your reef. It includes a map, survey feature, satellite data 
+        with wind, wave, and temperature data, heat stress alerts for coral 
+        bleaching, and graphs."
+        />
+      </Helmet>
       <NavBar routeButtons searchLocation={false} />
       {scrollPosition === 0 && isMobile && (
         <Box
diff --git a/packages/website/src/routes/RegisterSite/index.tsx b/packages/website/src/routes/RegisterSite/index.tsx
index 2869db4d0..9bca73809 100644
--- a/packages/website/src/routes/RegisterSite/index.tsx
+++ b/packages/website/src/routes/RegisterSite/index.tsx
@@ -20,6 +20,7 @@ import {
 } from '@material-ui/core';
 import Alert from '@material-ui/lab/Alert';
 import { useSelector, useDispatch } from 'react-redux';
+import { Helmet } from 'react-helmet-async';
 
 import { userInfoSelector, getSelf } from 'store/User/userSlice';
 import validators from 'helpers/validators';
@@ -30,6 +31,8 @@ import SignInDialog from 'common/SignInDialog';
 import siteServices from 'services/siteServices';
 import LocationMap from './LocationMap';
 
+import Dashboard from '../../assets/img/helmet/Dashboard.jpg';
+
 interface FormElement {
   id: string;
   label: string;
@@ -173,6 +176,25 @@ const Apply = ({ classes }: ApplyProps) => {
   return (
     <>
       {newSiteId && <Navigate to={`/sites/${newSiteId}`} replace />}
+      <Helmet>
+        <title>
+          Register sites on Aqualink and receive dashboards with real-time data
+        </title>
+        <meta
+          name="description"
+          content="Register the reef you want to monitor 
+        in 1 minute. Your dashboard will come with real-time temperature, wind, 
+        and wave data. Add surveys and data publicly."
+        />
+        <meta property="og:image" content={Dashboard} />
+        <meta
+          property="og:image:alt"
+          content="The images display the Aqualink 
+        dashboard, which allows you to monitor your reef. It includes a map, 
+        survey feature, satellite data with wind, wave, and temperature data, 
+        heat stress alerts for coral bleaching, and graphs."
+        />
+      </Helmet>
       <NavBar searchLocation={false} />
       <Box className={classes.boxBar} height="100%" pt={4}>
         <Container>
diff --git a/packages/website/src/routes/SiteRoutes/Site/__snapshots__/index.test.tsx.snap b/packages/website/src/routes/SiteRoutes/Site/__snapshots__/index.test.tsx.snap
deleted file mode 100644
index 77e731112..000000000
--- a/packages/website/src/routes/SiteRoutes/Site/__snapshots__/index.test.tsx.snap
+++ /dev/null
@@ -1,6128 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Site Detail Page should render with given state from Redux store: snapshot-with-data 1`] = `
-<div>
-  <mock-appbar
-    classname="NavBar-appBar-274 NavBar-appBarXs-276"
-    color="primary"
-    position="static"
-  >
-    <mock-toolbar
-      classname="NavBar-toolbar-277"
-    >
-      <mock-drawer
-        anchor="left"
-        classes="[object Object]"
-        open="false"
-      >
-        <mock-iconbutton
-          style="align-self: flex-end; margin-right: 5px; margin-top: 5px; color: white;"
-        >
-          <mock-clear />
-        </mock-iconbutton>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-288"
-          href="/"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Home
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-288"
-          href="/map"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Map
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-288"
-          href="/register"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Register a site
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <mock-link
-          aria-disabled="false"
-          classname="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-288"
-          href="https://highlights.aqualink.org"
-          role="button"
-          tabindex="0"
-          target="_blank"
-          to=""
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Highlighted Sites
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </mock-link>
-        <mock-link
-          aria-disabled="false"
-          classname="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-288"
-          href="https://bristlemouth.aqualink.org"
-          role="button"
-          tabindex="0"
-          target="_blank"
-          to=""
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Bristlemouth Explorer
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </mock-link>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-288"
-          href="/tracker"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Track a heatwave
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-288"
-          href="/about"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              About
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-288"
-          href="/faq"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Faq
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-288"
-          href="/buoy"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Buoy
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-288"
-          href="/drones"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Drone
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <mock-box
-          margintop="auto"
-          padding="25px"
-        >
-          <mock-typography
-            variant="subtitle1"
-          >
-            Aqualink is open-source (MIT)
-            <br />
-            Join us and contribute!
-          </mock-typography>
-          <div
-            class="MuiButtonGroup-root MuiButtonGroup-contained"
-            role="group"
-          >
-            <a
-              aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButtonGroup-grouped MuiButtonGroup-groupedHorizontal MuiButtonGroup-groupedContained MuiButtonGroup-groupedContainedHorizontal MuiButtonGroup-groupedContained MenuDrawer-contributeButton-287"
-              href="https://github.com/aqualinkorg/aqualink-app"
-              tabindex="0"
-              target="_blank"
-            >
-              <span
-                class="MuiButton-label"
-              >
-                <span
-                  class="MuiButton-startIcon MuiButton-iconSizeMedium"
-                >
-                  <mock-github />
-                </span>
-                GitHub
-              </span>
-              <span
-                class="MuiTouchRipple-root"
-              />
-            </a>
-            <a
-              aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButtonGroup-grouped MuiButtonGroup-groupedHorizontal MuiButtonGroup-groupedContained MuiButtonGroup-groupedContainedHorizontal MuiButtonGroup-groupedContained MenuDrawer-contributeButton-287"
-              href="https://ovio.org/project/aqualinkorg/aqualink-app"
-              tabindex="0"
-              target="_blank"
-            >
-              <span
-                class="MuiButton-label"
-              >
-                <img
-                  alt="Ovio Logo"
-                  src="ovio_logo.png"
-                />
-              </span>
-              <span
-                class="MuiTouchRipple-root"
-              />
-            </a>
-          </div>
-        </mock-box>
-      </mock-drawer>
-      <div
-        class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-      >
-        <div
-          class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-4 MuiGrid-grid-sm-2 MuiGrid-grid-md-6"
-        >
-          <mock-box
-            alignitems="center"
-            display="flex"
-            flexwrap="nowrap"
-          >
-            <mock-iconbutton
-              color="inherit"
-              edge="start"
-            >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
-                />
-              </svg>
-            </mock-iconbutton>
-            <mock-link
-              classname="NavBar-navBarLink-275"
-              href="/map"
-            >
-              <mock-typography
-                color="textPrimary"
-                variant="h4"
-              >
-                Aqua
-              </mock-typography>
-              <mock-typography
-                style="color: rgb(138, 198, 222);"
-                variant="h4"
-              >
-                link
-              </mock-typography>
-            </mock-link>
-          </mock-box>
-        </div>
-        <mock-hidden
-          xsdown="true"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-sm-4 MuiGrid-grid-md-3"
-          >
-            <div
-              class="Search-searchBar-289"
-            >
-              <div
-                class="Search-searchBarIcon-290"
-              >
-                <mock-iconbutton
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-              <div
-                class="Search-searchBarText-291"
-              >
-                <div
-                  aria-expanded="false"
-                  class="MuiAutocomplete-root Search-searchBarInput-292 MuiAutocomplete-hasClearIcon MuiAutocomplete-hasPopupIcon"
-                  role="combobox"
-                >
-                  <div
-                    class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                  >
-                    <div
-                      class="MuiInputBase-root MuiOutlinedInput-root MuiAutocomplete-inputRoot MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-adornedEnd MuiOutlinedInput-adornedEnd"
-                    >
-                      <input
-                        aria-autocomplete="list"
-                        aria-invalid="false"
-                        autocapitalize="none"
-                        autocomplete="off"
-                        class="MuiInputBase-input MuiOutlinedInput-input MuiAutocomplete-input MuiAutocomplete-inputFocused MuiInputBase-inputAdornedEnd MuiOutlinedInput-inputAdornedEnd"
-                        id="location"
-                        placeholder="Search"
-                        spellcheck="false"
-                        type="text"
-                        value=""
-                      />
-                      <div
-                        class="MuiAutocomplete-endAdornment"
-                      >
-                        <mock-iconbutton
-                          aria-label="Clear"
-                          classname="MuiAutocomplete-clearIndicator"
-                          tabindex="-1"
-                          title="Clear"
-                        >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
-                            focusable="false"
-                            viewBox="0 0 24 24"
-                          >
-                            <path
-                              d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                            />
-                          </svg>
-                        </mock-iconbutton>
-                        <mock-iconbutton
-                          aria-label="Open"
-                          classname="MuiAutocomplete-popupIndicator"
-                          disabled="false"
-                          tabindex="-1"
-                          title="Open"
-                        >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root"
-                            focusable="false"
-                            viewBox="0 0 24 24"
-                          >
-                            <path
-                              d="M7 10l5 5 5-5z"
-                            />
-                          </svg>
-                        </mock-iconbutton>
-                      </div>
-                      <fieldset
-                        aria-hidden="true"
-                        class="PrivateNotchedOutline-root-295 MuiOutlinedInput-notchedOutline"
-                        style="padding-left: 8px;"
-                      >
-                        <legend
-                          class="PrivateNotchedOutline-legend-296"
-                          style="width: 0.01px;"
-                        >
-                          <span>
-                            ​
-                          </span>
-                        </legend>
-                      </fieldset>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </mock-hidden>
-        <div
-          class="MuiGrid-root NavBar-languageUserWrapper-285 MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-flex-end MuiGrid-grid-xs-8 MuiGrid-grid-sm-4 MuiGrid-grid-md-3"
-        >
-          <mock-tooltip
-            title="Translate"
-          >
-            <mock-iconbutton
-              style="color: white;"
-            >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zm6.93 6h-2.95c-.32-1.25-.78-2.45-1.38-3.56 1.84.63 3.37 1.91 4.33 3.56zM12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96zM4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2 0 .68.06 1.34.14 2H4.26zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56-1.84-.63-3.37-1.9-4.33-3.56zm2.95-8H5.08c.96-1.66 2.49-2.93 4.33-3.56C8.81 5.55 8.35 6.75 8.03 8zM12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96zM14.34 14H9.66c-.09-.66-.16-1.32-.16-2 0-.68.07-1.35.16-2h4.68c.09.65.16 1.32.16 2 0 .68-.07 1.34-.16 2zm.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95c-.96 1.65-2.49 2.93-4.33 3.56zM16.36 14c.08-.66.14-1.32.14-2 0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2h-3.38z"
-                />
-              </svg>
-            </mock-iconbutton>
-          </mock-tooltip>
-          <mock-box
-            alignitems="center"
-            display="flex"
-            flexwrap="nowrap"
-          >
-            Mock User
-            <mock-iconbutton
-              classname="NavBar-button-284"
-            >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root NavBar-expandIcon-283"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"
-                />
-              </svg>
-            </mock-iconbutton>
-            <mock-menu
-              classname="NavBar-userMenu-280"
-              keepmounted="true"
-              menulistprops="[object Object]"
-              open="false"
-              popoverclasses="[object Object]"
-            >
-              <mock-divider
-                classname="NavBar-userMenuDivider-279"
-              />
-              <a
-                class="NavBar-menuItemLink-282"
-                href="/dashboard"
-              >
-                <mock-menuitem
-                  classname="NavBar-menuItem-281"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
-                  >
-                    <div
-                      class="MuiGrid-root MuiGrid-item"
-                    >
-                      <svg
-                        aria-hidden="true"
-                        class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
-                        focusable="false"
-                        viewBox="0 0 24 24"
-                      >
-                        <path
-                          d="M5 5h4v6H5zm10 8h4v6h-4zM5 17h4v2H5zM15 5h4v2h-4z"
-                          opacity=".3"
-                        />
-                        <path
-                          d="M3 13h8V3H3v10zm2-8h4v6H5V5zm8 16h8V11h-8v10zm2-8h4v6h-4v-6zM13 3v6h8V3h-8zm6 4h-4V5h4v2zM3 21h8v-6H3v6zm2-4h4v2H5v-2z"
-                        />
-                      </svg>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item"
-                    >
-                      Dashboard
-                    </div>
-                  </div>
-                </mock-menuitem>
-              </a>
-              <mock-divider
-                classname="NavBar-userMenuDivider-279"
-              />
-              <mock-menuitem
-                classname="NavBar-menuItem-281"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-item"
-                  >
-                    <svg
-                      aria-hidden="true"
-                      class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
-                      focusable="false"
-                      viewBox="0 0 24 24"
-                    >
-                      <path
-                        d="M13 3h-2v10h2V3zm4.83 2.17l-1.42 1.42C17.99 7.86 19 9.81 19 12c0 3.87-3.13 7-7 7s-7-3.13-7-7c0-2.19 1.01-4.14 2.58-5.42L6.17 5.17C4.23 6.82 3 9.26 3 12c0 4.97 4.03 9 9 9s9-4.03 9-9c0-2.74-1.23-5.18-3.17-6.83z"
-                      />
-                    </svg>
-                  </div>
-                  <div
-                    class="MuiGrid-root MuiGrid-item"
-                  >
-                    Logout
-                  </div>
-                </div>
-              </mock-menuitem>
-            </mock-menu>
-          </mock-box>
-        </div>
-        <mock-hidden
-          smup="true"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-            style="margin: 0px; padding-top: 0px;"
-          >
-            <div
-              class="Search-searchBar-289"
-            >
-              <div
-                class="Search-searchBarIcon-290"
-              >
-                <mock-iconbutton
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-              <div
-                class="Search-searchBarText-291"
-              >
-                <div
-                  aria-expanded="false"
-                  class="MuiAutocomplete-root Search-searchBarInput-292 MuiAutocomplete-hasClearIcon MuiAutocomplete-hasPopupIcon"
-                  role="combobox"
-                >
-                  <div
-                    class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                  >
-                    <div
-                      class="MuiInputBase-root MuiOutlinedInput-root MuiAutocomplete-inputRoot MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-adornedEnd MuiOutlinedInput-adornedEnd"
-                    >
-                      <input
-                        aria-autocomplete="list"
-                        aria-invalid="false"
-                        autocapitalize="none"
-                        autocomplete="off"
-                        class="MuiInputBase-input MuiOutlinedInput-input MuiAutocomplete-input MuiAutocomplete-inputFocused MuiInputBase-inputAdornedEnd MuiOutlinedInput-inputAdornedEnd"
-                        id="location"
-                        placeholder="Search"
-                        spellcheck="false"
-                        type="text"
-                        value=""
-                      />
-                      <div
-                        class="MuiAutocomplete-endAdornment"
-                      >
-                        <mock-iconbutton
-                          aria-label="Clear"
-                          classname="MuiAutocomplete-clearIndicator"
-                          tabindex="-1"
-                          title="Clear"
-                        >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
-                            focusable="false"
-                            viewBox="0 0 24 24"
-                          >
-                            <path
-                              d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                            />
-                          </svg>
-                        </mock-iconbutton>
-                        <mock-iconbutton
-                          aria-label="Open"
-                          classname="MuiAutocomplete-popupIndicator"
-                          disabled="false"
-                          tabindex="-1"
-                          title="Open"
-                        >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root"
-                            focusable="false"
-                            viewBox="0 0 24 24"
-                          >
-                            <path
-                              d="M7 10l5 5 5-5z"
-                            />
-                          </svg>
-                        </mock-iconbutton>
-                      </div>
-                      <fieldset
-                        aria-hidden="true"
-                        class="PrivateNotchedOutline-root-295 MuiOutlinedInput-notchedOutline"
-                        style="padding-left: 8px;"
-                      >
-                        <legend
-                          class="PrivateNotchedOutline-legend-296"
-                          style="width: 0.01px;"
-                        >
-                          <span>
-                            ​
-                          </span>
-                        </legend>
-                      </fieldset>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </mock-hidden>
-      </div>
-    </mock-toolbar>
-  </mock-appbar>
-  <mock-dialog
-    maxwidth="xs"
-    open="false"
-    scroll="body"
-    transitionprops="[object Object]"
-  >
-    <mock-card>
-      <div
-        class="MuiCardHeader-root RegisterDialog-dialogHeader-300"
-      >
-        <div
-          class="MuiCardHeader-content"
-        >
-          <mock-typography
-            classname="MuiCardHeader-title"
-            component="span"
-            display="block"
-            variant="h5"
-          >
-            <div
-              class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-            >
-              <div
-                class="MuiGrid-root MuiGrid-item"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-container"
-                >
-                  <mock-typography
-                    variant="h4"
-                  >
-                    Aqua
-                  </mock-typography>
-                  <mock-typography
-                    classname="RegisterDialog-dialogHeaderSecondPart-301"
-                    variant="h4"
-                  >
-                    link
-                  </mock-typography>
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-item"
-              >
-                <mock-iconbutton
-                  classname="RegisterDialog-closeButton-299"
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-            </div>
-          </mock-typography>
-        </div>
-      </div>
-      <mock-cardcontent>
-        <div
-          class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-center MuiGrid-grid-xs-12"
-        >
-          <div
-            class="MuiGrid-root RegisterDialog-dialogContentTitle-302 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-10"
-          >
-            <div
-              class="MuiGrid-root MuiGrid-item"
-            >
-              <mock-typography
-                color="textSecondary"
-                variant="h5"
-              >
-                Create an account
-              </mock-typography>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-10"
-          >
-            <form
-              class="RegisterDialog-form-303"
-            >
-              <div
-                class="MuiGrid-root RegisterDialog-textFieldWrapper-304 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="firstName"
-                    id="firstName-label"
-                  >
-                    First Name
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input RegisterDialog-textField-305"
-                      id="firstName"
-                      name="firstName"
-                      placeholder="First Name"
-                      type="text"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-295 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-297"
-                      >
-                        <span>
-                          First Name
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root RegisterDialog-textFieldWrapper-304 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="lastName"
-                    id="lastName-label"
-                  >
-                    Last Name
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input RegisterDialog-textField-305"
-                      id="lastName"
-                      name="lastName"
-                      placeholder="Last Name"
-                      type="text"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-295 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-297"
-                      >
-                        <span>
-                          Last Name
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root RegisterDialog-textFieldWrapper-304 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="organization"
-                    id="organization-label"
-                  >
-                    Organization
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input RegisterDialog-textField-305"
-                      id="organization"
-                      name="organization"
-                      placeholder="Organization"
-                      type="text"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-295 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-297"
-                      >
-                        <span>
-                          Organization
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root RegisterDialog-textFieldWrapper-304 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="emailAddress"
-                    id="emailAddress-label"
-                  >
-                    Email Address
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input RegisterDialog-textField-305"
-                      id="emailAddress"
-                      name="emailAddress"
-                      placeholder="Email Address"
-                      type="text"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-295 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-297"
-                      >
-                        <span>
-                          Email Address
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root RegisterDialog-textFieldWrapper-304 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="password"
-                    id="password-label"
-                  >
-                    Password
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input RegisterDialog-textField-305"
-                      id="password"
-                      name="password"
-                      placeholder="Password"
-                      type="password"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-295 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-297"
-                      >
-                        <span>
-                          Password
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                >
-                  <mock-checkbox
-                    checked="false"
-                    classname="RegisterDialog-termsCheckbox-308"
-                    color="primary"
-                  />
-                </div>
-                <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-10 MuiGrid-grid-sm-11"
-                >
-                  <mock-box>
-                    <mock-typography
-                      classname="RegisterDialog-formText-306"
-                      color="textSecondary"
-                      variant="subtitle1"
-                    >
-                      I have read the
-                       
-                      <a
-                        class="RegisterDialog-termsLink-309"
-                        href="/terms"
-                      >
-                        Terms and Conditions
-                      </a>
-                    </mock-typography>
-                  </mock-box>
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root RegisterDialog-button-307 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <button
-                  class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-containedSizeLarge MuiButton-sizeLarge Mui-disabled MuiButton-fullWidth Mui-disabled"
-                  disabled=""
-                  tabindex="-1"
-                  type="submit"
-                >
-                  <span
-                    class="MuiButton-label"
-                  >
-                    CREATE ACCOUNT
-                  </span>
-                </button>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <mock-typography
-                  classname="RegisterDialog-formText-306"
-                  color="textSecondary"
-                  variant="subtitle1"
-                >
-                  Have an account?
-                   
-                  <button
-                    class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary"
-                    tabindex="0"
-                    type="button"
-                  >
-                    <span
-                      class="MuiButton-label"
-                    >
-                      SIGN IN
-                    </span>
-                    <span
-                      class="MuiTouchRipple-root"
-                    />
-                  </button>
-                </mock-typography>
-              </div>
-            </form>
-          </div>
-        </div>
-      </mock-cardcontent>
-    </mock-card>
-  </mock-dialog>
-  <mock-dialog
-    maxwidth="xs"
-    open="false"
-    transitionprops="[object Object]"
-  >
-    <mock-card
-      elevation="0"
-    >
-      <div
-        class="MuiCardHeader-root SignInDialog-dialogHeader-311"
-      >
-        <div
-          class="MuiCardHeader-content"
-        >
-          <mock-typography
-            classname="MuiCardHeader-title"
-            component="span"
-            display="block"
-            variant="h5"
-          >
-            <div
-              class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-            >
-              <div
-                class="MuiGrid-root MuiGrid-item"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-container"
-                >
-                  <mock-typography
-                    variant="h4"
-                  >
-                    Aqua
-                  </mock-typography>
-                  <mock-typography
-                    classname="SignInDialog-dialogHeaderSecondPart-312"
-                    variant="h4"
-                  >
-                    link
-                  </mock-typography>
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-item"
-              >
-                <mock-iconbutton
-                  classname="SignInDialog-closeButton-310"
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-            </div>
-          </mock-typography>
-        </div>
-      </div>
-      <div
-        class="MuiCollapse-root MuiCollapse-hidden"
-        style="min-height: 0px;"
-      >
-        <div
-          class="MuiCollapse-wrapper"
-        >
-          <div
-            class="MuiCollapse-wrapperInner"
-          >
-            <div
-              class="MuiPaper-root MuiAlert-root MuiAlert-standardSuccess MuiPaper-elevation0"
-              role="alert"
-            >
-              <div
-                class="MuiAlert-icon"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.76,4 13.5,4.11 14.2, 4.31L15.77,2.74C14.61,2.26 13.34,2 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0, 0 22,12M7.91,10.08L6.5,11.5L11,16L21,6L19.59,4.58L11,13.17L7.91,10.08Z"
-                  />
-                </svg>
-              </div>
-              <div
-                class="MuiAlert-message"
-              >
-                Password reset email sent to .
-              </div>
-              <div
-                class="MuiAlert-action"
-              >
-                <mock-iconbutton
-                  aria-label="close"
-                  color="inherit"
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <mock-cardcontent>
-        <div
-          class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-center MuiGrid-grid-xs-12"
-        >
-          <div
-            class="MuiGrid-root SignInDialog-dialogContentTitle-313 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-10"
-          >
-            <div
-              class="MuiGrid-root MuiGrid-item"
-            >
-              <mock-typography
-                color="textSecondary"
-                variant="h5"
-              >
-                Sign In
-              </mock-typography>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-10"
-          >
-            <form
-              class="SignInDialog-form-314"
-            >
-              <div
-                class="MuiGrid-root SignInDialog-textFieldWrapper-315 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="emailAddress"
-                    id="emailAddress-label"
-                  >
-                    Email Address
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input SignInDialog-textField-316"
-                      id="emailAddress"
-                      name="emailAddress"
-                      placeholder="Email Address"
-                      type="text"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-295 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-297"
-                      >
-                        <span>
-                          Email Address
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root SignInDialog-textFieldWrapper-315 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="password"
-                    id="password-label"
-                  >
-                    Password
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input SignInDialog-textField-316"
-                      id="password"
-                      name="password"
-                      placeholder="Password"
-                      type="password"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-295 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-297"
-                      >
-                        <span>
-                          Password
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <button
-                  class="MuiButtonBase-root MuiButton-root MuiButton-text SignInDialog-forgotPasswordButton-319"
-                  tabindex="0"
-                  type="button"
-                >
-                  <span
-                    class="MuiButton-label"
-                  >
-                    <mock-typography
-                      color="textSecondary"
-                      variant="subtitle2"
-                    >
-                      Forgot your password?
-                    </mock-typography>
-                  </span>
-                  <span
-                    class="MuiTouchRipple-root"
-                  />
-                </button>
-              </div>
-              <div
-                class="MuiGrid-root SignInDialog-button-318 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <button
-                  class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-containedSizeLarge MuiButton-sizeLarge MuiButton-fullWidth"
-                  tabindex="0"
-                  type="submit"
-                >
-                  <span
-                    class="MuiButton-label"
-                  >
-                    SIGN IN
-                  </span>
-                  <span
-                    class="MuiTouchRipple-root"
-                  />
-                </button>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <mock-typography
-                  classname="SignInDialog-formText-317"
-                  color="textSecondary"
-                  variant="subtitle1"
-                >
-                  Don't have an account?
-                   
-                  <button
-                    class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary"
-                    tabindex="0"
-                    type="button"
-                  >
-                    <span
-                      class="MuiButton-label"
-                    >
-                      SIGN UP
-                    </span>
-                    <span
-                      class="MuiTouchRipple-root"
-                    />
-                  </button>
-                </mock-typography>
-              </div>
-            </form>
-          </div>
-        </div>
-      </mock-cardcontent>
-    </mock-card>
-  </mock-dialog>
-  <div
-    class="MuiContainer-root MuiContainer-maxWidthLg"
-  >
-    <mock-box
-      margintop="2rem"
-    >
-      <div
-        class="MuiCollapse-root MuiCollapse-hidden"
-        style="min-height: 0px;"
-      >
-        <div
-          class="MuiCollapse-wrapper"
-        >
-          <div
-            class="MuiCollapse-wrapperInner"
-          >
-            <div
-              class="MuiPaper-root MuiAlert-root MuiAlert-standardSuccess MuiPaper-elevation0"
-              role="alert"
-            >
-              <div
-                class="MuiAlert-icon"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.76,4 13.5,4.11 14.2, 4.31L15.77,2.74C14.61,2.26 13.34,2 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0, 0 22,12M7.91,10.08L6.5,11.5L11,16L21,6L19.59,4.58L11,13.17L7.91,10.08Z"
-                  />
-                </svg>
-              </div>
-              <div
-                class="MuiAlert-message"
-              >
-                Something went wrong
-              </div>
-              <div
-                class="MuiAlert-action"
-              >
-                <mock-iconbutton
-                  color="inherit"
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div
-        class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-      >
-        <div
-          class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-align-items-xs-center"
-          >
-            <div
-              class="MuiGrid-root SiteNavBar-headerButtonWrapper-328 MuiGrid-item"
-            >
-              <mock-iconbutton
-                aria-label="menu"
-                color="primary"
-                component="[object Object]"
-                edge="start"
-                to="/map"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="MuiSvgIcon-root"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
-                  />
-                </svg>
-              </mock-iconbutton>
-            </div>
-            <div
-              class="MuiGrid-root SiteNavBar-headerWrapper-329 MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-item MuiGrid-align-items-xs-center"
-            >
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-grid-xs-12 MuiGrid-grid-md-8"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                  >
-                    <div
-                      class="MuiGrid-root SiteNavBar-siteNameWrapper-330 MuiGrid-item"
-                    >
-                      <mock-typography
-                        variant="h4"
-                      >
-                        Hawaii
-                      </mock-typography>
-                    </div>
-                    <div
-                      class="MuiGrid-root SiteNavBar-headerButtonWrapper-328 MuiGrid-item"
-                    >
-                      <mock-tooltip
-                        arrow="true"
-                        placement="top"
-                        title="Add to your dashboard"
-                      >
-                        <mock-iconbutton
-                          classname="CollectionButton-root-331"
-                          disabled="false"
-                        >
-                          <svg
-                            color="#3f51b5"
-                          >
-                            watch.svg
-                          </svg>
-                        </mock-iconbutton>
-                      </mock-tooltip>
-                    </div>
-                  </div>
-                </div>
-                <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-                >
-                  <mock-typography
-                    variant="h6"
-                  >
-                    Managed by Some organization
-                  </mock-typography>
-                </div>
-                <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-                >
-                  <mock-typography
-                    variant="subtitle1"
-                  >
-                    Last surveyed: Sep 10, 2020
-                  </mock-typography>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </mock-box>
-    <div>
-      <mock-box
-        mt="1.5rem"
-      >
-        <div
-          class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-2 MuiGrid-align-items-xs-flex-end MuiGrid-justify-content-xs-space-between"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-md-6"
-          >
-            <div
-              class="MuiGrid-root makeStyles-row-344 MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-flex-end MuiGrid-grid-xs-12"
-            >
-              <mock-box
-                classname="Title-root-349"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-item"
-                    style="margin-right: 1rem;"
-                  >
-                    <mock-typography
-                      classname=""
-                      variant="subtitle2"
-                    >
-                      LAT: 0.000
-                    </mock-typography>
-                  </div>
-                  <div
-                    class="MuiGrid-root MuiGrid-item"
-                    style="margin-right: 0px;"
-                  >
-                    <mock-typography
-                      classname=""
-                      variant="subtitle2"
-                    >
-                      LONG: 0.000
-                    </mock-typography>
-                  </div>
-                </div>
-              </mock-box>
-            </div>
-            <div
-              class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-            >
-              <div
-                class="makeStyles-container-345"
-              >
-                <mock-map
-                  polygon="[object Object]"
-                  siteid="1"
-                  surveypoints=""
-                />
-              </div>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-md-6"
-          >
-            <div
-              class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-            >
-              <div
-                class="makeStyles-container-345"
-              >
-                <mock-featuredmedia
-                  featuredimage="image-url"
-                  siteid="1"
-                  surveyid="46"
-                />
-              </div>
-            </div>
-          </div>
-        </div>
-        <div
-          class="MuiGrid-root makeStyles-metricsWrapper-342 MuiGrid-container MuiGrid-spacing-xs-2 MuiGrid-justify-content-xs-space-between"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3"
-          >
-            <div
-              class="makeStyles-card-332"
-            >
-              <mock-card
-                classname="Satellite-root-365"
-                style="background-color: rgb(8, 91, 163);"
-              >
-                <div
-                  class="MuiCardHeader-root Satellite-header-360"
-                >
-                  <div
-                    class="MuiCardHeader-content"
-                  >
-                    <mock-typography
-                      classname="MuiCardHeader-title"
-                      component="span"
-                      display="block"
-                      variant="h5"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-container"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-item"
-                        >
-                          <mock-typography
-                            classname="Satellite-cardTitle-359"
-                            variant="h6"
-                          >
-                            SATELLITE OBSERVATION
-                          </mock-typography>
-                        </div>
-                      </div>
-                    </mock-typography>
-                  </div>
-                </div>
-                <mock-cardcontent
-                  classname="Satellite-content-366"
-                >
-                  <mock-box
-                    display="flex"
-                    flexgrow="1"
-                    p="1rem"
-                  >
-                    <div
-                      class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="Satellite-contentTextTitles-361"
-                          variant="subtitle2"
-                        >
-                          SURFACE TEMP
-                        </mock-typography>
-                        <mock-tooltip
-                          title=""
-                        >
-                          <mock-typography
-                            classname="Satellite-contentTextValues-362"
-                            variant="h3"
-                          >
-                            - -°C
-                          </mock-typography>
-                        </mock-tooltip>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="Satellite-contentTextTitles-361"
-                          variant="subtitle2"
-                        >
-                          HISTORICAL MAX
-                        </mock-typography>
-                        <mock-tooltip
-                          title="Historical maximum monthly average over the past 20 years"
-                        >
-                          <mock-typography
-                            classname="Satellite-contentTextValues-362"
-                            variant="h3"
-                          >
-                            0.0°C
-                          </mock-typography>
-                        </mock-tooltip>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="Satellite-contentTextTitles-361"
-                          variant="subtitle2"
-                        >
-                          DEGREE HEATING WEEKS
-                        </mock-typography>
-                        <mock-tooltip
-                          title="Degree Heating Weeks - a measure of the amount of time above the 20 year historical maximum temperatures"
-                        >
-                          <mock-typography
-                            classname="Satellite-contentTextValues-362"
-                            variant="h3"
-                          >
-                            0.0
-                          </mock-typography>
-                        </mock-tooltip>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="Satellite-contentTextTitles-361"
-                          variant="subtitle2"
-                        >
-                          SST ANOMALY
-                        </mock-typography>
-                        <mock-tooltip
-                          title="Difference between current SST and longterm average"
-                        >
-                          <mock-typography
-                            classname="Satellite-contentTextValues-362"
-                            variant="h3"
-                          >
-                            - -°C
-                          </mock-typography>
-                        </mock-tooltip>
-                      </div>
-                    </div>
-                  </mock-box>
-                  <div
-                    class="MuiGrid-root MuiGrid-container"
-                  >
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(8, 91, 163); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          0
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(12, 157, 165); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          2
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(117, 180, 114); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          4
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(123, 217, 37); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          6
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(193, 229, 34); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          8
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(229, 187, 43); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          10
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(230, 121, 40); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          12
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(232, 79, 46); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          14
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(216, 69, 36); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          16
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(128, 58, 32); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          18
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(185, 41, 68); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          20
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(128, 48, 126); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          25
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                  </div>
-                  <div
-                    class="MuiGrid-root makeStyles-updateInfo-367 false MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-                  >
-                    <div
-                      class="MuiGrid-root makeStyles-dateInfoWrapper-371 makeStyles-dateInfoWrapper-498 MuiGrid-item MuiGrid-grid-xs-8"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-item"
-                        >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root makeStyles-updateIcon-369 MuiSvgIcon-fontSizeSmall"
-                            focusable="false"
-                            viewBox="0 0 24 24"
-                          >
-                            <path
-                              d="M21 10.12h-6.78l2.74-2.82c-2.73-2.7-7.15-2.8-9.88-.1-2.73 2.71-2.73 7.08 0 9.79s7.15 2.71 9.88 0C18.32 15.65 19 14.08 19 12.1h2c0 1.98-.88 4.55-2.64 6.29-3.51 3.48-9.21 3.48-12.72 0-3.5-3.47-3.53-9.11-.02-12.58s9.14-3.47 12.65 0L21 3v7.12zM12.5 8v4.25l3.5 2.08-.72 1.21L11 13V8h1.5z"
-                            />
-                          </svg>
-                        </div>
-                        <div
-                          class="MuiGrid-root makeStyles-dateInfo-372 MuiGrid-item"
-                        >
-                          <mock-box
-                            display="flex"
-                            flexdirection="column"
-                            width="100%"
-                          >
-                            <mock-typography
-                              classname="makeStyles-updateInfoText-370"
-                              variant="caption"
-                            >
-                              No data available
-                            </mock-typography>
-                            <mock-typography
-                              classname="makeStyles-updateInfoText-370"
-                              variant="caption"
-                            >
-                              Updated daily
-                            </mock-typography>
-                          </mock-box>
-                        </div>
-                      </div>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-4"
-                      style="display: flex; justify-content: flex-end;"
-                    >
-                      <div
-                        class="MuiGrid-root makeStyles-chip-374 makeStyles-chip-499 MuiGrid-item"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                        >
-                          <button
-                            class="MuiButtonBase-root MuiButton-root MuiButton-text makeStyles-button-379"
-                            tabindex="0"
-                            type="button"
-                          >
-                            <span
-                              class="MuiButton-label"
-                            >
-                              <a
-                                class="makeStyles-link-377"
-                                href="https://coralreefwatch.noaa.gov/"
-                                rel="noopener noreferrer"
-                                target="_blank"
-                              >
-                                <mock-typography
-                                  classname="makeStyles-chipText-375"
-                                >
-                                  NOAA
-                                </mock-typography>
-                                <img
-                                  alt="sensor-type"
-                                  class="makeStyles-sensorImage-378"
-                                  src="satellite.svg"
-                                />
-                              </a>
-                            </span>
-                            <span
-                              class="MuiTouchRipple-root"
-                            />
-                          </button>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </mock-cardcontent>
-              </mock-card>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3"
-          >
-            <div
-              class="makeStyles-card-332"
-            >
-              <mock-card
-                classname="Sensor-root-390"
-              >
-                <div
-                  class="MuiCardHeader-root Sensor-header-385"
-                >
-                  <div
-                    class="MuiCardHeader-content"
-                  >
-                    <mock-typography
-                      classname="MuiCardHeader-title"
-                      component="span"
-                      display="block"
-                      variant="h5"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-container"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-item"
-                        >
-                          <mock-typography
-                            classname="Sensor-cardTitle-384"
-                            variant="h6"
-                          >
-                            BUOY OBSERVATION
-                          </mock-typography>
-                        </div>
-                      </div>
-                    </mock-typography>
-                  </div>
-                </div>
-                <mock-cardcontent
-                  classname="Sensor-content-392"
-                >
-                  <div
-                    style="display: grid; gap: 1rem; grid-template-areas: 'value0 image' 'spacer1 image' 'value1 image'; padding: 1rem;"
-                  >
-                    <div
-                      style="grid-area: value0;"
-                    >
-                      <mock-typography
-                        classname="Sensor-contentTextTitles-386"
-                        variant="subtitle2"
-                      >
-                        TEMP AT 1m
-                      </mock-typography>
-                      <mock-typography
-                        classname="Sensor-contentTextValues-387"
-                        variant="h3"
-                      >
-                        - -°C
-                      </mock-typography>
-                    </div>
-                    <div
-                      style="grid-area: value1;"
-                    >
-                      <mock-typography
-                        classname="Sensor-contentTextTitles-386"
-                        variant="subtitle2"
-                      >
-                        TEMP AT DEPTH
-                      </mock-typography>
-                      <mock-typography
-                        classname="Sensor-contentTextValues-387"
-                        variant="h3"
-                      >
-                        - -°C
-                      </mock-typography>
-                    </div>
-                    <div
-                      style="grid-area: spacer1; display: inherit; min-height: 2em;"
-                    />
-                    <div
-                      style="grid-area: spacer2; display: inherit;"
-                    />
-                    <div
-                      style="grid-area: image; position: relative;"
-                    >
-                      <img
-                        alt="sensor"
-                        height="150"
-                        src="sensor.svg"
-                        style="position: absolute; bottom: 0px;"
-                        width="auto"
-                      />
-                    </div>
-                    <div
-                      style="grid-area: value4; display: flex; align-items: flex-end;"
-                    />
-                  </div>
-                  <div
-                    class="MuiGrid-root Sensor-noSensorAlert-393 MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                  >
-                    <mock-typography
-                      variant="h6"
-                    >
-                      No Live Telemetry
-                    </mock-typography>
-                  </div>
-                </mock-cardcontent>
-              </mock-card>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3"
-          >
-            <div
-              class="makeStyles-card-332"
-            >
-              <mock-card
-                classname="Bleaching-root-405"
-              >
-                <div
-                  class="MuiCardHeader-root Bleaching-header-400"
-                >
-                  <div
-                    class="MuiCardHeader-content"
-                  >
-                    <mock-typography
-                      classname="MuiCardHeader-title"
-                      component="span"
-                      display="block"
-                      variant="h5"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-container"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-                        >
-                          <mock-typography
-                            classname="Bleaching-cardTitle-399"
-                            color="textSecondary"
-                            variant="h6"
-                          >
-                            HEAT STRESS ALERT LEVEL
-                          </mock-typography>
-                        </div>
-                      </div>
-                    </mock-typography>
-                  </div>
-                </div>
-                <mock-cardcontent
-                  classname="Bleaching-contentWrapper-406"
-                >
-                  <div
-                    class="MuiGrid-root Bleaching-content-407 MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-align-content-xs-space-between MuiGrid-justify-content-xs-center MuiGrid-grid-xs-12"
-                  >
-                    <img
-                      alt="alert-level"
-                      class="Bleaching-alertImage-408"
-                      src="alert_nostress.svg"
-                    />
-                    <div
-                      class="MuiGrid-root makeStyles-updateInfo-367 makeStyles-withMargin-368 MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-                    >
-                      <div
-                        class="MuiGrid-root makeStyles-dateInfoWrapper-371 makeStyles-dateInfoWrapper-504 MuiGrid-item MuiGrid-grid-xs-8"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                        >
-                          <div
-                            class="MuiGrid-root MuiGrid-item"
-                          >
-                            <svg
-                              aria-hidden="true"
-                              class="MuiSvgIcon-root makeStyles-updateIcon-369 MuiSvgIcon-fontSizeSmall"
-                              focusable="false"
-                              viewBox="0 0 24 24"
-                            >
-                              <path
-                                d="M21 10.12h-6.78l2.74-2.82c-2.73-2.7-7.15-2.8-9.88-.1-2.73 2.71-2.73 7.08 0 9.79s7.15 2.71 9.88 0C18.32 15.65 19 14.08 19 12.1h2c0 1.98-.88 4.55-2.64 6.29-3.51 3.48-9.21 3.48-12.72 0-3.5-3.47-3.53-9.11-.02-12.58s9.14-3.47 12.65 0L21 3v7.12zM12.5 8v4.25l3.5 2.08-.72 1.21L11 13V8h1.5z"
-                              />
-                            </svg>
-                          </div>
-                          <div
-                            class="MuiGrid-root makeStyles-dateInfo-372 MuiGrid-item"
-                          >
-                            <mock-box
-                              display="flex"
-                              flexdirection="column"
-                              width="100%"
-                            >
-                              <mock-typography
-                                classname="makeStyles-updateInfoText-370"
-                                variant="caption"
-                              >
-                                No data available
-                              </mock-typography>
-                              <mock-typography
-                                classname="makeStyles-updateInfoText-370"
-                                variant="caption"
-                              >
-                                Updated daily
-                              </mock-typography>
-                            </mock-box>
-                          </div>
-                        </div>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-4"
-                        style="display: flex; justify-content: flex-end;"
-                      >
-                        <div
-                          class="MuiGrid-root makeStyles-chip-374 makeStyles-chip-505 MuiGrid-item"
-                        >
-                          <div
-                            class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                          >
-                            <button
-                              class="MuiButtonBase-root MuiButton-root MuiButton-text makeStyles-button-379"
-                              tabindex="0"
-                              type="button"
-                            >
-                              <span
-                                class="MuiButton-label"
-                              >
-                                <a
-                                  class="makeStyles-link-377"
-                                  href="https://coralreefwatch.noaa.gov/product/5km/index_5km_baa-max-7d.php"
-                                  rel="noopener noreferrer"
-                                  target="_blank"
-                                >
-                                  <mock-typography
-                                    classname="makeStyles-chipText-375"
-                                  >
-                                    NOAA CRW
-                                  </mock-typography>
-                                </a>
-                              </span>
-                              <span
-                                class="MuiTouchRipple-root"
-                              />
-                            </button>
-                          </div>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </mock-cardcontent>
-              </mock-card>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3"
-          >
-            <div
-              class="makeStyles-card-332"
-            >
-              <mock-card
-                classname="makeStyles-root-420"
-              >
-                <mock-cardcontent
-                  classname="makeStyles-contentWrapper-424"
-                >
-                  <div
-                    class="MuiGrid-root makeStyles-content-425 MuiGrid-container MuiGrid-item MuiGrid-align-content-xs-space-between MuiGrid-justify-content-xs-center MuiGrid-grid-xs-12"
-                  >
-                    <div
-                      class="MuiGrid-root makeStyles-paddingContainer-423 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                    >
-                      <mock-typography
-                        classname="makeStyles-cardTitle-414 makeStyles-coloredText-421"
-                        variant="h6"
-                      >
-                        WIND
-                      </mock-typography>
-                      <img
-                        alt="wind"
-                        class="makeStyles-titleImages-422"
-                        src="wind.svg"
-                      />
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-paddingContainer-423 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="makeStyles-contentTextTitles-416"
-                          color="textSecondary"
-                          variant="subtitle2"
-                        >
-                          SPEED
-                        </mock-typography>
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                        >
-                          <mock-typography
-                            classname="makeStyles-contentTextValues-417"
-                            color="textSecondary"
-                            variant="h3"
-                          >
-                            - -
-                          </mock-typography>
-                        </div>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="makeStyles-contentTextTitles-416"
-                          color="textSecondary"
-                          variant="subtitle2"
-                        >
-                          DIRECTION
-                        </mock-typography>
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                        >
-                          <mock-typography
-                            classname="makeStyles-contentTextValues-417"
-                            color="textSecondary"
-                            variant="h3"
-                          >
-                            - -
-                          </mock-typography>
-                        </div>
-                      </div>
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-paddingContainer-423 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                    >
-                      <mock-typography
-                        classname="makeStyles-cardTitle-414 makeStyles-coloredText-421"
-                        variant="h6"
-                      >
-                        WAVES
-                      </mock-typography>
-                      <img
-                        alt="waves"
-                        class="makeStyles-titleImages-422"
-                        src="waves.svg"
-                      />
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-paddingContainer-423 MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-space-between MuiGrid-grid-xs-12"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-lg-4"
-                      >
-                        <mock-typography
-                          classname="makeStyles-contentTextTitles-416"
-                          color="textSecondary"
-                          variant="subtitle2"
-                        >
-                          HEIGHT
-                        </mock-typography>
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                        >
-                          <mock-typography
-                            classname="makeStyles-contentTextValues-417"
-                            color="textSecondary"
-                            variant="h3"
-                          >
-                            - -
-                          </mock-typography>
-                        </div>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-lg-3"
-                      >
-                        <mock-typography
-                          classname="makeStyles-contentTextTitles-416"
-                          color="textSecondary"
-                          variant="subtitle2"
-                        >
-                          PERIOD
-                        </mock-typography>
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                        >
-                          <mock-typography
-                            classname="makeStyles-contentTextValues-417"
-                            color="textSecondary"
-                            variant="h3"
-                          >
-                            - -
-                          </mock-typography>
-                        </div>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-lg-5"
-                      >
-                        <mock-typography
-                          classname="makeStyles-contentTextTitles-416"
-                          color="textSecondary"
-                          variant="subtitle2"
-                        >
-                          DIRECTION
-                        </mock-typography>
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                        >
-                          <mock-typography
-                            classname="makeStyles-contentTextValues-417"
-                            color="textSecondary"
-                            variant="h3"
-                          >
-                            - -
-                          </mock-typography>
-                        </div>
-                      </div>
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-updateInfo-367 false MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-                    >
-                      <div
-                        class="MuiGrid-root makeStyles-dateInfoWrapper-371 makeStyles-dateInfoWrapper-510 MuiGrid-item MuiGrid-grid-xs-8"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                        >
-                          <div
-                            class="MuiGrid-root MuiGrid-item"
-                          >
-                            <svg
-                              aria-hidden="true"
-                              class="MuiSvgIcon-root makeStyles-updateIcon-369 MuiSvgIcon-fontSizeSmall"
-                              focusable="false"
-                              viewBox="0 0 24 24"
-                            >
-                              <path
-                                d="M21 10.12h-6.78l2.74-2.82c-2.73-2.7-7.15-2.8-9.88-.1-2.73 2.71-2.73 7.08 0 9.79s7.15 2.71 9.88 0C18.32 15.65 19 14.08 19 12.1h2c0 1.98-.88 4.55-2.64 6.29-3.51 3.48-9.21 3.48-12.72 0-3.5-3.47-3.53-9.11-.02-12.58s9.14-3.47 12.65 0L21 3v7.12zM12.5 8v4.25l3.5 2.08-.72 1.21L11 13V8h1.5z"
-                              />
-                            </svg>
-                          </div>
-                          <div
-                            class="MuiGrid-root makeStyles-dateInfo-372 MuiGrid-item"
-                          >
-                            <mock-box
-                              display="flex"
-                              flexdirection="column"
-                              width="100%"
-                            >
-                              <mock-typography
-                                classname="makeStyles-updateInfoText-370"
-                                variant="caption"
-                              >
-                                No data available
-                              </mock-typography>
-                              <mock-typography
-                                classname="makeStyles-updateInfoText-370"
-                                variant="caption"
-                              >
-                                Updated every 6 hours
-                              </mock-typography>
-                            </mock-box>
-                          </div>
-                        </div>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-4"
-                        style="display: flex; justify-content: flex-end;"
-                      >
-                        <div
-                          class="MuiGrid-root makeStyles-chip-374 makeStyles-chip-511 MuiGrid-item"
-                        >
-                          <div
-                            class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                          >
-                            <button
-                              class="MuiButtonBase-root MuiButton-root MuiButton-text makeStyles-button-379"
-                              tabindex="0"
-                              type="button"
-                            >
-                              <span
-                                class="MuiButton-label"
-                              >
-                                <a
-                                  class="makeStyles-link-377"
-                                  href="https://www.ncdc.noaa.gov/data-access/model-data/model-datasets/global-forcast-system-gfs"
-                                  rel="noopener noreferrer"
-                                  target="_blank"
-                                >
-                                  <mock-typography
-                                    classname="makeStyles-chipText-375"
-                                  >
-                                    SOFAR MODEL
-                                  </mock-typography>
-                                </a>
-                              </span>
-                              <span
-                                class="MuiTouchRipple-root"
-                              />
-                            </button>
-                          </div>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </mock-cardcontent>
-              </mock-card>
-            </div>
-          </div>
-        </div>
-        <mock-box
-          mt="2rem"
-        >
-          <div>
-            <mock-box
-              classname="makeStyles-graphtTitleWrapper-434"
-            >
-              <mock-typography
-                classname="makeStyles-graphTitle-435"
-                variant="h6"
-              >
-                HEAT STRESS ANALYSIS (°C)
-              </mock-typography>
-            </mock-box>
-            <div
-              class="makeStyles-chart-433"
-            >
-              <mock-line
-                data="[object Object]"
-                options="[object Object]"
-              />
-            </div>
-            <mock-multiplesensorscharts
-              disablegutters="true"
-              hasadditionalsensordata="false"
-              site="[object Object]"
-              surveysfiltered="false"
-            />
-          </div>
-          <mock-dialog
-            fullwidth="true"
-            open="false"
-          >
-            <mock-dialogtitle
-              classname="Dialog-dialogTitle-449"
-              disabletypography="true"
-            >
-              <mock-typography
-                variant="h4"
-              >
-                Delete undefined
-              </mock-typography>
-            </mock-dialogtitle>
-            <mock-dialogcontent
-              dividers="true"
-            >
-              <mock-typography
-                color="textSecondary"
-              >
-                Are you sure you want to delete this survey point? It will be deleted across all surveys.
-              </mock-typography>
-            </mock-dialogcontent>
-            <mock-dialogactions>
-              <button
-                class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedSecondary MuiButton-containedSizeSmall MuiButton-sizeSmall"
-                tabindex="0"
-                type="button"
-              >
-                <span
-                  class="MuiButton-label"
-                >
-                  No
-                </span>
-                <span
-                  class="MuiTouchRipple-root"
-                />
-              </button>
-              <button
-                class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-containedSizeSmall MuiButton-sizeSmall"
-                tabindex="0"
-                type="button"
-              >
-                <span
-                  class="MuiButton-label"
-                >
-                  Yes
-                </span>
-                <span
-                  class="MuiTouchRipple-root"
-                />
-              </button>
-            </mock-dialogactions>
-          </mock-dialog>
-          <div
-            class="MuiGrid-root makeStyles-root-440 MuiGrid-container MuiGrid-spacing-xs-2 MuiGrid-justify-content-xs-center"
-          >
-            <mock-box
-              bgcolor="#f5f6f6"
-              height="100%"
-              position="absolute"
-              zindex="-1"
-            />
-            <div
-              class="MuiGrid-root makeStyles-surveyWrapper-441 MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-item MuiGrid-align-items-xs-baseline MuiGrid-justify-content-xs-space-between MuiGrid-grid-xs-11 MuiGrid-grid-lg-12"
-            >
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-center MuiGrid-grid-md-12 MuiGrid-grid-lg-3"
-              >
-                <mock-typography
-                  classname="makeStyles-title-442"
-                >
-                  Survey History
-                </mock-typography>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-grid-md-12 MuiGrid-grid-lg-5"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-item"
-                >
-                  <mock-typography
-                    classname="makeStyles-subTitle-451"
-                    variant="h6"
-                  >
-                    Survey Point:
-                  </mock-typography>
-                </div>
-                <div
-                  class="MuiGrid-root makeStyles-selectorWrapper-452 MuiGrid-item"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center"
-                  >
-                    <div
-                      class="MuiGrid-root MuiGrid-item"
-                    >
-                      <div
-                        class="MuiInputBase-root MuiInput-root MuiInput-underline makeStyles-selector-453"
-                      >
-                        <div
-                          aria-haspopup="listbox"
-                          aria-labelledby="survey-point survey-point"
-                          class="MuiSelect-root MuiSelect-select MuiSelect-selectMenu MuiInputBase-input MuiInput-input"
-                          id="survey-point"
-                          role="button"
-                          tabindex="0"
-                        >
-                          All
-                        </div>
-                        <input
-                          aria-hidden="true"
-                          class="MuiSelect-nativeInput"
-                          name="survey-point"
-                          tabindex="-1"
-                          value="All"
-                        />
-                        <svg
-                          aria-hidden="true"
-                          class="MuiSvgIcon-root MuiSelect-icon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
-                        >
-                          <path
-                            d="M7 10l5 5 5-5z"
-                          />
-                        </svg>
-                        <mock-menu
-                          anchorel="[object HTMLDivElement]"
-                          id="menu-survey-point"
-                          menulistprops="[object Object]"
-                          open="false"
-                          paperprops="[object Object]"
-                        >
-                          <mock-menuitem
-                            aria-selected="true"
-                            data-value="All"
-                            role="option"
-                            selected="true"
-                          >
-                            <mock-typography
-                              classname="makeStyles-menuItem-455"
-                              variant="h6"
-                            >
-                              All
-                            </mock-typography>
-                          </mock-menuitem>
-                        </mock-menu>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center MuiGrid-grid-md-12 MuiGrid-grid-lg-4"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-item"
-                >
-                  <mock-typography
-                    classname="makeStyles-subTitle-443"
-                    variant="h6"
-                  >
-                    Observation:
-                  </mock-typography>
-                </div>
-                <div
-                  class="MuiGrid-root makeStyles-selectorWrapper-444 MuiGrid-item"
-                >
-                  <div
-                    class="MuiFormControl-root makeStyles-formControl-445"
-                  >
-                    <div
-                      class="MuiInputBase-root MuiInput-root MuiInput-underline makeStyles-selectedItem-446 MuiInputBase-formControl MuiInput-formControl"
-                    >
-                      <div
-                        aria-haspopup="listbox"
-                        aria-labelledby="survey-observation survey-observation"
-                        class="MuiSelect-root MuiSelect-select MuiSelect-selectMenu MuiInputBase-input MuiInput-input makeStyles-textField-448"
-                        id="survey-observation"
-                        role="button"
-                        tabindex="0"
-                      >
-                        <mock-typography
-                          classname="makeStyles-menuItem-447"
-                          variant="h6"
-                        >
-                          Any
-                        </mock-typography>
-                      </div>
-                      <input
-                        aria-hidden="true"
-                        class="MuiSelect-nativeInput"
-                        name="survey-observation"
-                        tabindex="-1"
-                        value="any"
-                      />
-                      <svg
-                        aria-hidden="true"
-                        class="MuiSvgIcon-root MuiSelect-icon"
-                        focusable="false"
-                        viewBox="0 0 24 24"
-                      >
-                        <path
-                          d="M7 10l5 5 5-5z"
-                        />
-                      </svg>
-                      <mock-menu
-                        anchorel="[object HTMLDivElement]"
-                        id="menu-survey-observation"
-                        menulistprops="[object Object]"
-                        open="false"
-                        paperprops="[object Object]"
-                      >
-                        <mock-menuitem
-                          aria-selected="true"
-                          data-value="any"
-                          role="option"
-                          selected="true"
-                        >
-                          <mock-typography
-                            classname="makeStyles-menuItem-447"
-                            variant="h6"
-                          >
-                            Any
-                          </mock-typography>
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-447"
-                          data-value="healthy"
-                          role="option"
-                          selected="false"
-                          title="Appears healthy"
-                        >
-                          Appears healthy
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-447"
-                          data-value="possible-disease"
-                          role="option"
-                          selected="false"
-                          title="Showing possible signs of disease"
-                        >
-                          Showing possible signs of disease
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-447"
-                          data-value="evident-disease"
-                          role="option"
-                          selected="false"
-                          title="Signs of disease are evident"
-                        >
-                          Signs of disease are evident
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-447"
-                          data-value="mortality"
-                          role="option"
-                          selected="false"
-                          title="Signs of mortality are evident"
-                        >
-                          Signs of mortality are evident
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-447"
-                          data-value="environmental"
-                          role="option"
-                          selected="false"
-                          title="Signs of environmental disturbance are evident (e.g. storm damage)"
-                        >
-                          Signs of environmental disturbance are evident (e.g. storm damage)
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-447"
-                          data-value="anthropogenic"
-                          role="option"
-                          selected="false"
-                          title="Signs of anthropogenic disturbance are evident (e.g.,fishing gear, trampling)"
-                        >
-                          Signs of anthropogenic disturbance are evident (e.g.,fishing gear, trampling)
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-447"
-                          data-value="invasive-species"
-                          role="option"
-                          selected="false"
-                          title="Signs of damage from invasive species"
-                        >
-                          Signs of damage from invasive species
-                        </mock-menuitem>
-                      </mock-menu>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div
-              class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-center MuiGrid-grid-xs-11 MuiGrid-grid-lg-12"
-            >
-              <div
-                class="SurveyTimeline-root-460"
-              >
-                <mock-hidden
-                  mddown="true"
-                >
-                  <ul
-                    class="MuiTimeline-root MuiTimeline-alignLeft"
-                  >
-                    <li
-                      class="MuiTimelineItem-root MuiTimelineItem-alignLeft makeStyles-timelineItem-469"
-                    >
-                      <div
-                        class="MuiTimelineOppositeContent-root MuiTimelineItem-oppositeContent makeStyles-timelineOppositeContent-470"
-                      >
-                        <mock-typography
-                          classname="makeStyles-dates-462"
-                          variant="h6"
-                        >
-                          09/10/2020
-                        </mock-typography>
-                      </div>
-                      <div
-                        class="MuiTimelineSeparator-root"
-                      >
-                        <hr
-                          class="makeStyles-connector-473"
-                        />
-                        <span
-                          class="MuiTimelineDot-root makeStyles-dot-474 MuiTimelineDot-outlinedGrey"
-                        />
-                        <hr
-                          class="makeStyles-connector-473"
-                        />
-                      </div>
-                      <div
-                        class="MuiTimelineContent-root MuiTimelineItem-content makeStyles-surveyCardWrapper-464"
-                      >
-                        <div
-                          class="MuiPaper-root makeStyles-surveyCard-522 MuiPaper-elevation0 MuiPaper-rounded"
-                        >
-                          <div
-                            class="MuiGrid-root MuiGrid-container MuiGrid-justify-content-xs-space-between"
-                            style="height: 100%;"
-                          >
-                            <div
-                              class="MuiGrid-root makeStyles-cardImageWrapper-526 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-md-5"
-                            >
-                              <a
-                                href="/sites/1/survey_details/46"
-                              >
-                                <div
-                                  class="MuiCardMedia-root makeStyles-cardImage-523"
-                                  style="background-image: url(image-url);"
-                                />
-                              </a>
-                            </div>
-                            <div
-                              class="MuiGrid-root makeStyles-infoWrapper-527 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-md-7"
-                            >
-                              <div
-                                class="MuiGrid-root makeStyles-info-532 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                              >
-                                <div
-                                  class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-grid-xs-12"
-                                >
-                                  <mock-typography
-                                    classname="makeStyles-cardFields-524"
-                                    variant="h6"
-                                  >
-                                    User:
-                                  </mock-typography>
-                                  <mock-typography
-                                    classname="makeStyles-cardValues-525 makeStyles-valuesWithMargin-530"
-                                    variant="h6"
-                                  >
-                                    Joe Doe
-                                  </mock-typography>
-                                </div>
-                                <div
-                                  class="MuiGrid-root makeStyles-commentsWrapper-528 MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-flex-start MuiGrid-grid-xs-12"
-                                >
-                                  <div
-                                    class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-                                    style="height: 80%;"
-                                  >
-                                    <mock-typography
-                                      classname="makeStyles-cardFields-524"
-                                      variant="h6"
-                                    >
-                                      Comments:
-                                    </mock-typography>
-                                    <mock-typography
-                                      classname="makeStyles-cardValues-525 makeStyles-comments-529"
-                                      variant="h6"
-                                    >
-                                      No comments
-                                    </mock-typography>
-                                  </div>
-                                </div>
-                                <div
-                                  class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-grid-xs-12"
-                                >
-                                  <mock-typography
-                                    classname="makeStyles-cardFields-524"
-                                    variant="h6"
-                                  >
-                                    Temp:
-                                  </mock-typography>
-                                  <mock-typography
-                                    classname="makeStyles-cardValues-525 makeStyles-valuesWithMargin-530"
-                                    variant="h6"
-                                  >
-                                    10.0 °C
-                                  </mock-typography>
-                                </div>
-                                <div
-                                  class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between MuiGrid-grid-xs-12"
-                                >
-                                  <div
-                                    class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-10"
-                                  >
-                                    <a
-                                      href="/sites/1/survey_details/46"
-                                      style="text-decoration: none;"
-                                    >
-                                      <button
-                                        class="MuiButtonBase-root MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-outlinedSizeSmall MuiButton-sizeSmall"
-                                        tabindex="0"
-                                        type="button"
-                                      >
-                                        <span
-                                          class="MuiButton-label"
-                                        >
-                                          VIEW DETAILS
-                                        </span>
-                                        <span
-                                          class="MuiTouchRipple-root"
-                                        />
-                                      </button>
-                                    </a>
-                                  </div>
-                                </div>
-                              </div>
-                            </div>
-                          </div>
-                        </div>
-                      </div>
-                    </li>
-                  </ul>
-                </mock-hidden>
-                <mock-hidden
-                  lgup="true"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                  >
-                    <div
-                      class="MuiGrid-root makeStyles-surveyWrapper-485 MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-center MuiGrid-grid-xs-12"
-                    >
-                      <div
-                        class="MuiGrid-root makeStyles-dateWrapper-476 MuiGrid-item MuiGrid-grid-xs-11"
-                      >
-                        <mock-typography
-                          classname="makeStyles-dates-477"
-                          variant="h6"
-                        >
-                          09/10/2020
-                        </mock-typography>
-                      </div>
-                      <div
-                        class="MuiGrid-root makeStyles-surveyCardWrapper-479 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                      >
-                        <div
-                          class="MuiPaper-root makeStyles-surveyCard-522 MuiPaper-elevation0 MuiPaper-rounded"
-                        >
-                          <div
-                            class="MuiGrid-root MuiGrid-container MuiGrid-justify-content-xs-space-between"
-                            style="height: 100%;"
-                          >
-                            <div
-                              class="MuiGrid-root makeStyles-cardImageWrapper-526 MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-md-5"
-                            >
-                              <a
-                                href="/sites/1/survey_details/46"
-                              >
-                                <div
-                                  class="MuiCardMedia-root makeStyles-cardImage-523"
-                                  style="background-image: url(image-url);"
-                                />
-                              </a>
-                            </div>
-                            <div
-                              class="MuiGrid-root makeStyles-infoWrapper-527 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-md-7"
-                            >
-                              <div
-                                class="MuiGrid-root makeStyles-info-532 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                              >
-                                <div
-                                  class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-grid-xs-12"
-                                >
-                                  <mock-typography
-                                    classname="makeStyles-cardFields-524"
-                                    variant="h6"
-                                  >
-                                    User:
-                                  </mock-typography>
-                                  <mock-typography
-                                    classname="makeStyles-cardValues-525 makeStyles-valuesWithMargin-530"
-                                    variant="h6"
-                                  >
-                                    Joe Doe
-                                  </mock-typography>
-                                </div>
-                                <div
-                                  class="MuiGrid-root makeStyles-commentsWrapper-528 MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-flex-start MuiGrid-grid-xs-12"
-                                >
-                                  <div
-                                    class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-                                    style="height: 80%;"
-                                  >
-                                    <mock-typography
-                                      classname="makeStyles-cardFields-524"
-                                      variant="h6"
-                                    >
-                                      Comments:
-                                    </mock-typography>
-                                    <mock-typography
-                                      classname="makeStyles-cardValues-525 makeStyles-comments-529"
-                                      variant="h6"
-                                    >
-                                      No comments
-                                    </mock-typography>
-                                  </div>
-                                </div>
-                                <div
-                                  class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-grid-xs-12"
-                                >
-                                  <mock-typography
-                                    classname="makeStyles-cardFields-524"
-                                    variant="h6"
-                                  >
-                                    Temp:
-                                  </mock-typography>
-                                  <mock-typography
-                                    classname="makeStyles-cardValues-525 makeStyles-valuesWithMargin-530"
-                                    variant="h6"
-                                  >
-                                    10.0 °C
-                                  </mock-typography>
-                                </div>
-                                <div
-                                  class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between MuiGrid-grid-xs-12"
-                                >
-                                  <div
-                                    class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-10"
-                                  >
-                                    <a
-                                      href="/sites/1/survey_details/46"
-                                      style="text-decoration: none;"
-                                    >
-                                      <button
-                                        class="MuiButtonBase-root MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-outlinedSizeSmall MuiButton-sizeSmall"
-                                        tabindex="0"
-                                        type="button"
-                                      >
-                                        <span
-                                          class="MuiButton-label"
-                                        >
-                                          VIEW DETAILS
-                                        </span>
-                                        <span
-                                          class="MuiTouchRipple-root"
-                                        />
-                                      </button>
-                                    </a>
-                                  </div>
-                                </div>
-                              </div>
-                            </div>
-                          </div>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </mock-hidden>
-              </div>
-            </div>
-          </div>
-        </mock-box>
-      </mock-box>
-    </div>
-  </div>
-  <mock-appbar
-    classname="Footer-appBar-486"
-    position="static"
-  >
-    <mock-toolbar>
-      <div
-        class="MuiGrid-root MuiGrid-container MuiGrid-justify-content-xs-center"
-      >
-        <div
-          class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-10"
-        >
-          <mock-link
-            classname="Footer-navBarLink-487"
-            href="/map"
-          >
-            <mock-typography
-              color="textPrimary"
-              variant="h4"
-            >
-              Aqua
-            </mock-typography>
-            <mock-typography
-              style="color: rgb(138, 198, 222);"
-              variant="h4"
-            >
-              link
-            </mock-typography>
-          </mock-link>
-        </div>
-      </div>
-    </mock-toolbar>
-  </mock-appbar>
-</div>
-`;
-
-exports[`Site Detail Page should render with given state from Redux store: snapshot-with-no-data 1`] = `
-<div>
-  <mock-appbar
-    classname="NavBar-appBar-3 NavBar-appBarXs-5"
-    color="primary"
-    position="static"
-  >
-    <mock-toolbar
-      classname="NavBar-toolbar-6"
-    >
-      <mock-drawer
-        anchor="left"
-        classes="[object Object]"
-        open="false"
-      >
-        <mock-iconbutton
-          style="align-self: flex-end; margin-right: 5px; margin-top: 5px; color: white;"
-        >
-          <mock-clear />
-        </mock-iconbutton>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-17"
-          href="/"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Home
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-17"
-          href="/map"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Map
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-17"
-          href="/register"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Register a site
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <mock-link
-          aria-disabled="false"
-          classname="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-17"
-          href="https://highlights.aqualink.org"
-          role="button"
-          tabindex="0"
-          target="_blank"
-          to=""
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Highlighted Sites
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </mock-link>
-        <mock-link
-          aria-disabled="false"
-          classname="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-17"
-          href="https://bristlemouth.aqualink.org"
-          role="button"
-          tabindex="0"
-          target="_blank"
-          to=""
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Bristlemouth Explorer
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </mock-link>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-17"
-          href="/tracker"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Track a heatwave
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-17"
-          href="/about"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              About
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-17"
-          href="/faq"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Faq
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-17"
-          href="/buoy"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Buoy
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <a
-          aria-disabled="false"
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MenuDrawer-menuDrawerButton-17"
-          href="/drones"
-          role="button"
-          tabindex="0"
-        >
-          <span
-            class="MuiButton-label"
-          >
-            <mock-typography
-              style="text-transform: uppercase;"
-              variant="h6"
-            >
-              Drone
-            </mock-typography>
-          </span>
-          <span
-            class="MuiTouchRipple-root"
-          />
-        </a>
-        <mock-box
-          margintop="auto"
-          padding="25px"
-        >
-          <mock-typography
-            variant="subtitle1"
-          >
-            Aqualink is open-source (MIT)
-            <br />
-            Join us and contribute!
-          </mock-typography>
-          <div
-            class="MuiButtonGroup-root MuiButtonGroup-contained"
-            role="group"
-          >
-            <a
-              aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButtonGroup-grouped MuiButtonGroup-groupedHorizontal MuiButtonGroup-groupedContained MuiButtonGroup-groupedContainedHorizontal MuiButtonGroup-groupedContained MenuDrawer-contributeButton-16"
-              href="https://github.com/aqualinkorg/aqualink-app"
-              tabindex="0"
-              target="_blank"
-            >
-              <span
-                class="MuiButton-label"
-              >
-                <span
-                  class="MuiButton-startIcon MuiButton-iconSizeMedium"
-                >
-                  <mock-github />
-                </span>
-                GitHub
-              </span>
-              <span
-                class="MuiTouchRipple-root"
-              />
-            </a>
-            <a
-              aria-disabled="false"
-              class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButtonGroup-grouped MuiButtonGroup-groupedHorizontal MuiButtonGroup-groupedContained MuiButtonGroup-groupedContainedHorizontal MuiButtonGroup-groupedContained MenuDrawer-contributeButton-16"
-              href="https://ovio.org/project/aqualinkorg/aqualink-app"
-              tabindex="0"
-              target="_blank"
-            >
-              <span
-                class="MuiButton-label"
-              >
-                <img
-                  alt="Ovio Logo"
-                  src="ovio_logo.png"
-                />
-              </span>
-              <span
-                class="MuiTouchRipple-root"
-              />
-            </a>
-          </div>
-        </mock-box>
-      </mock-drawer>
-      <div
-        class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-      >
-        <div
-          class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-4 MuiGrid-grid-sm-2 MuiGrid-grid-md-6"
-        >
-          <mock-box
-            alignitems="center"
-            display="flex"
-            flexwrap="nowrap"
-          >
-            <mock-iconbutton
-              color="inherit"
-              edge="start"
-            >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"
-                />
-              </svg>
-            </mock-iconbutton>
-            <mock-link
-              classname="NavBar-navBarLink-4"
-              href="/map"
-            >
-              <mock-typography
-                color="textPrimary"
-                variant="h4"
-              >
-                Aqua
-              </mock-typography>
-              <mock-typography
-                style="color: rgb(138, 198, 222);"
-                variant="h4"
-              >
-                link
-              </mock-typography>
-            </mock-link>
-          </mock-box>
-        </div>
-        <mock-hidden
-          xsdown="true"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-sm-4 MuiGrid-grid-md-3"
-          >
-            <div
-              class="Search-searchBar-18"
-            >
-              <div
-                class="Search-searchBarIcon-19"
-              >
-                <mock-iconbutton
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-              <div
-                class="Search-searchBarText-20"
-              >
-                <div
-                  aria-expanded="false"
-                  class="MuiAutocomplete-root Search-searchBarInput-21 MuiAutocomplete-hasClearIcon MuiAutocomplete-hasPopupIcon"
-                  role="combobox"
-                >
-                  <div
-                    class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                  >
-                    <div
-                      class="MuiInputBase-root MuiOutlinedInput-root MuiAutocomplete-inputRoot MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-adornedEnd MuiOutlinedInput-adornedEnd"
-                    >
-                      <input
-                        aria-autocomplete="list"
-                        aria-invalid="false"
-                        autocapitalize="none"
-                        autocomplete="off"
-                        class="MuiInputBase-input MuiOutlinedInput-input MuiAutocomplete-input MuiAutocomplete-inputFocused MuiInputBase-inputAdornedEnd MuiOutlinedInput-inputAdornedEnd"
-                        id="location"
-                        placeholder="Search"
-                        spellcheck="false"
-                        type="text"
-                        value=""
-                      />
-                      <div
-                        class="MuiAutocomplete-endAdornment"
-                      >
-                        <mock-iconbutton
-                          aria-label="Clear"
-                          classname="MuiAutocomplete-clearIndicator"
-                          tabindex="-1"
-                          title="Clear"
-                        >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
-                            focusable="false"
-                            viewBox="0 0 24 24"
-                          >
-                            <path
-                              d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                            />
-                          </svg>
-                        </mock-iconbutton>
-                        <mock-iconbutton
-                          aria-label="Open"
-                          classname="MuiAutocomplete-popupIndicator"
-                          disabled="false"
-                          tabindex="-1"
-                          title="Open"
-                        >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root"
-                            focusable="false"
-                            viewBox="0 0 24 24"
-                          >
-                            <path
-                              d="M7 10l5 5 5-5z"
-                            />
-                          </svg>
-                        </mock-iconbutton>
-                      </div>
-                      <fieldset
-                        aria-hidden="true"
-                        class="PrivateNotchedOutline-root-24 MuiOutlinedInput-notchedOutline"
-                        style="padding-left: 8px;"
-                      >
-                        <legend
-                          class="PrivateNotchedOutline-legend-25"
-                          style="width: 0.01px;"
-                        >
-                          <span>
-                            ​
-                          </span>
-                        </legend>
-                      </fieldset>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </mock-hidden>
-        <div
-          class="MuiGrid-root NavBar-languageUserWrapper-14 MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-flex-end MuiGrid-grid-xs-8 MuiGrid-grid-sm-4 MuiGrid-grid-md-3"
-        >
-          <mock-tooltip
-            title="Translate"
-          >
-            <mock-iconbutton
-              style="color: white;"
-            >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zm6.93 6h-2.95c-.32-1.25-.78-2.45-1.38-3.56 1.84.63 3.37 1.91 4.33 3.56zM12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96zM4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2 0 .68.06 1.34.14 2H4.26zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56-1.84-.63-3.37-1.9-4.33-3.56zm2.95-8H5.08c.96-1.66 2.49-2.93 4.33-3.56C8.81 5.55 8.35 6.75 8.03 8zM12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96zM14.34 14H9.66c-.09-.66-.16-1.32-.16-2 0-.68.07-1.35.16-2h4.68c.09.65.16 1.32.16 2 0 .68-.07 1.34-.16 2zm.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95c-.96 1.65-2.49 2.93-4.33 3.56zM16.36 14c.08-.66.14-1.32.14-2 0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2h-3.38z"
-                />
-              </svg>
-            </mock-iconbutton>
-          </mock-tooltip>
-          <mock-box
-            alignitems="center"
-            display="flex"
-            flexwrap="nowrap"
-          >
-            Mock User
-            <mock-iconbutton
-              classname="NavBar-button-13"
-            >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root NavBar-expandIcon-12"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"
-                />
-              </svg>
-            </mock-iconbutton>
-            <mock-menu
-              classname="NavBar-userMenu-9"
-              keepmounted="true"
-              menulistprops="[object Object]"
-              open="false"
-              popoverclasses="[object Object]"
-            >
-              <mock-divider
-                classname="NavBar-userMenuDivider-8"
-              />
-              <a
-                class="NavBar-menuItemLink-11"
-                href="/dashboard"
-              >
-                <mock-menuitem
-                  classname="NavBar-menuItem-10"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
-                  >
-                    <div
-                      class="MuiGrid-root MuiGrid-item"
-                    >
-                      <svg
-                        aria-hidden="true"
-                        class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
-                        focusable="false"
-                        viewBox="0 0 24 24"
-                      >
-                        <path
-                          d="M5 5h4v6H5zm10 8h4v6h-4zM5 17h4v2H5zM15 5h4v2h-4z"
-                          opacity=".3"
-                        />
-                        <path
-                          d="M3 13h8V3H3v10zm2-8h4v6H5V5zm8 16h8V11h-8v10zm2-8h4v6h-4v-6zM13 3v6h8V3h-8zm6 4h-4V5h4v2zM3 21h8v-6H3v6zm2-4h4v2H5v-2z"
-                        />
-                      </svg>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item"
-                    >
-                      Dashboard
-                    </div>
-                  </div>
-                </mock-menuitem>
-              </a>
-              <mock-divider
-                classname="NavBar-userMenuDivider-8"
-              />
-              <mock-menuitem
-                classname="NavBar-menuItem-10"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-item"
-                  >
-                    <svg
-                      aria-hidden="true"
-                      class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
-                      focusable="false"
-                      viewBox="0 0 24 24"
-                    >
-                      <path
-                        d="M13 3h-2v10h2V3zm4.83 2.17l-1.42 1.42C17.99 7.86 19 9.81 19 12c0 3.87-3.13 7-7 7s-7-3.13-7-7c0-2.19 1.01-4.14 2.58-5.42L6.17 5.17C4.23 6.82 3 9.26 3 12c0 4.97 4.03 9 9 9s9-4.03 9-9c0-2.74-1.23-5.18-3.17-6.83z"
-                      />
-                    </svg>
-                  </div>
-                  <div
-                    class="MuiGrid-root MuiGrid-item"
-                  >
-                    Logout
-                  </div>
-                </div>
-              </mock-menuitem>
-            </mock-menu>
-          </mock-box>
-        </div>
-        <mock-hidden
-          smup="true"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-            style="margin: 0px; padding-top: 0px;"
-          >
-            <div
-              class="Search-searchBar-18"
-            >
-              <div
-                class="Search-searchBarIcon-19"
-              >
-                <mock-iconbutton
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-              <div
-                class="Search-searchBarText-20"
-              >
-                <div
-                  aria-expanded="false"
-                  class="MuiAutocomplete-root Search-searchBarInput-21 MuiAutocomplete-hasClearIcon MuiAutocomplete-hasPopupIcon"
-                  role="combobox"
-                >
-                  <div
-                    class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                  >
-                    <div
-                      class="MuiInputBase-root MuiOutlinedInput-root MuiAutocomplete-inputRoot MuiInputBase-fullWidth MuiInputBase-formControl MuiInputBase-adornedEnd MuiOutlinedInput-adornedEnd"
-                    >
-                      <input
-                        aria-autocomplete="list"
-                        aria-invalid="false"
-                        autocapitalize="none"
-                        autocomplete="off"
-                        class="MuiInputBase-input MuiOutlinedInput-input MuiAutocomplete-input MuiAutocomplete-inputFocused MuiInputBase-inputAdornedEnd MuiOutlinedInput-inputAdornedEnd"
-                        id="location"
-                        placeholder="Search"
-                        spellcheck="false"
-                        type="text"
-                        value=""
-                      />
-                      <div
-                        class="MuiAutocomplete-endAdornment"
-                      >
-                        <mock-iconbutton
-                          aria-label="Clear"
-                          classname="MuiAutocomplete-clearIndicator"
-                          tabindex="-1"
-                          title="Clear"
-                        >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall"
-                            focusable="false"
-                            viewBox="0 0 24 24"
-                          >
-                            <path
-                              d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                            />
-                          </svg>
-                        </mock-iconbutton>
-                        <mock-iconbutton
-                          aria-label="Open"
-                          classname="MuiAutocomplete-popupIndicator"
-                          disabled="false"
-                          tabindex="-1"
-                          title="Open"
-                        >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root"
-                            focusable="false"
-                            viewBox="0 0 24 24"
-                          >
-                            <path
-                              d="M7 10l5 5 5-5z"
-                            />
-                          </svg>
-                        </mock-iconbutton>
-                      </div>
-                      <fieldset
-                        aria-hidden="true"
-                        class="PrivateNotchedOutline-root-24 MuiOutlinedInput-notchedOutline"
-                        style="padding-left: 8px;"
-                      >
-                        <legend
-                          class="PrivateNotchedOutline-legend-25"
-                          style="width: 0.01px;"
-                        >
-                          <span>
-                            ​
-                          </span>
-                        </legend>
-                      </fieldset>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </mock-hidden>
-      </div>
-    </mock-toolbar>
-  </mock-appbar>
-  <mock-dialog
-    maxwidth="xs"
-    open="false"
-    scroll="body"
-    transitionprops="[object Object]"
-  >
-    <mock-card>
-      <div
-        class="MuiCardHeader-root RegisterDialog-dialogHeader-29"
-      >
-        <div
-          class="MuiCardHeader-content"
-        >
-          <mock-typography
-            classname="MuiCardHeader-title"
-            component="span"
-            display="block"
-            variant="h5"
-          >
-            <div
-              class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-            >
-              <div
-                class="MuiGrid-root MuiGrid-item"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-container"
-                >
-                  <mock-typography
-                    variant="h4"
-                  >
-                    Aqua
-                  </mock-typography>
-                  <mock-typography
-                    classname="RegisterDialog-dialogHeaderSecondPart-30"
-                    variant="h4"
-                  >
-                    link
-                  </mock-typography>
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-item"
-              >
-                <mock-iconbutton
-                  classname="RegisterDialog-closeButton-28"
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-            </div>
-          </mock-typography>
-        </div>
-      </div>
-      <mock-cardcontent>
-        <div
-          class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-center MuiGrid-grid-xs-12"
-        >
-          <div
-            class="MuiGrid-root RegisterDialog-dialogContentTitle-31 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-10"
-          >
-            <div
-              class="MuiGrid-root MuiGrid-item"
-            >
-              <mock-typography
-                color="textSecondary"
-                variant="h5"
-              >
-                Create an account
-              </mock-typography>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-10"
-          >
-            <form
-              class="RegisterDialog-form-32"
-            >
-              <div
-                class="MuiGrid-root RegisterDialog-textFieldWrapper-33 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="firstName"
-                    id="firstName-label"
-                  >
-                    First Name
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input RegisterDialog-textField-34"
-                      id="firstName"
-                      name="firstName"
-                      placeholder="First Name"
-                      type="text"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-24 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-26"
-                      >
-                        <span>
-                          First Name
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root RegisterDialog-textFieldWrapper-33 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="lastName"
-                    id="lastName-label"
-                  >
-                    Last Name
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input RegisterDialog-textField-34"
-                      id="lastName"
-                      name="lastName"
-                      placeholder="Last Name"
-                      type="text"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-24 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-26"
-                      >
-                        <span>
-                          Last Name
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root RegisterDialog-textFieldWrapper-33 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="organization"
-                    id="organization-label"
-                  >
-                    Organization
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input RegisterDialog-textField-34"
-                      id="organization"
-                      name="organization"
-                      placeholder="Organization"
-                      type="text"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-24 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-26"
-                      >
-                        <span>
-                          Organization
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root RegisterDialog-textFieldWrapper-33 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="emailAddress"
-                    id="emailAddress-label"
-                  >
-                    Email Address
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input RegisterDialog-textField-34"
-                      id="emailAddress"
-                      name="emailAddress"
-                      placeholder="Email Address"
-                      type="text"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-24 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-26"
-                      >
-                        <span>
-                          Email Address
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root RegisterDialog-textFieldWrapper-33 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="password"
-                    id="password-label"
-                  >
-                    Password
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input RegisterDialog-textField-34"
-                      id="password"
-                      name="password"
-                      placeholder="Password"
-                      type="password"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-24 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-26"
-                      >
-                        <span>
-                          Password
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                >
-                  <mock-checkbox
-                    checked="false"
-                    classname="RegisterDialog-termsCheckbox-37"
-                    color="primary"
-                  />
-                </div>
-                <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-10 MuiGrid-grid-sm-11"
-                >
-                  <mock-box>
-                    <mock-typography
-                      classname="RegisterDialog-formText-35"
-                      color="textSecondary"
-                      variant="subtitle1"
-                    >
-                      I have read the
-                       
-                      <a
-                        class="RegisterDialog-termsLink-38"
-                        href="/terms"
-                      >
-                        Terms and Conditions
-                      </a>
-                    </mock-typography>
-                  </mock-box>
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root RegisterDialog-button-36 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <button
-                  class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-containedSizeLarge MuiButton-sizeLarge Mui-disabled MuiButton-fullWidth Mui-disabled"
-                  disabled=""
-                  tabindex="-1"
-                  type="submit"
-                >
-                  <span
-                    class="MuiButton-label"
-                  >
-                    CREATE ACCOUNT
-                  </span>
-                </button>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <mock-typography
-                  classname="RegisterDialog-formText-35"
-                  color="textSecondary"
-                  variant="subtitle1"
-                >
-                  Have an account?
-                   
-                  <button
-                    class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary"
-                    tabindex="0"
-                    type="button"
-                  >
-                    <span
-                      class="MuiButton-label"
-                    >
-                      SIGN IN
-                    </span>
-                    <span
-                      class="MuiTouchRipple-root"
-                    />
-                  </button>
-                </mock-typography>
-              </div>
-            </form>
-          </div>
-        </div>
-      </mock-cardcontent>
-    </mock-card>
-  </mock-dialog>
-  <mock-dialog
-    maxwidth="xs"
-    open="false"
-    transitionprops="[object Object]"
-  >
-    <mock-card
-      elevation="0"
-    >
-      <div
-        class="MuiCardHeader-root SignInDialog-dialogHeader-40"
-      >
-        <div
-          class="MuiCardHeader-content"
-        >
-          <mock-typography
-            classname="MuiCardHeader-title"
-            component="span"
-            display="block"
-            variant="h5"
-          >
-            <div
-              class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-            >
-              <div
-                class="MuiGrid-root MuiGrid-item"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-container"
-                >
-                  <mock-typography
-                    variant="h4"
-                  >
-                    Aqua
-                  </mock-typography>
-                  <mock-typography
-                    classname="SignInDialog-dialogHeaderSecondPart-41"
-                    variant="h4"
-                  >
-                    link
-                  </mock-typography>
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-item"
-              >
-                <mock-iconbutton
-                  classname="SignInDialog-closeButton-39"
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-            </div>
-          </mock-typography>
-        </div>
-      </div>
-      <div
-        class="MuiCollapse-root MuiCollapse-hidden"
-        style="min-height: 0px;"
-      >
-        <div
-          class="MuiCollapse-wrapper"
-        >
-          <div
-            class="MuiCollapse-wrapperInner"
-          >
-            <div
-              class="MuiPaper-root MuiAlert-root MuiAlert-standardSuccess MuiPaper-elevation0"
-              role="alert"
-            >
-              <div
-                class="MuiAlert-icon"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.76,4 13.5,4.11 14.2, 4.31L15.77,2.74C14.61,2.26 13.34,2 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0, 0 22,12M7.91,10.08L6.5,11.5L11,16L21,6L19.59,4.58L11,13.17L7.91,10.08Z"
-                  />
-                </svg>
-              </div>
-              <div
-                class="MuiAlert-message"
-              >
-                Password reset email sent to .
-              </div>
-              <div
-                class="MuiAlert-action"
-              >
-                <mock-iconbutton
-                  aria-label="close"
-                  color="inherit"
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <mock-cardcontent>
-        <div
-          class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-center MuiGrid-grid-xs-12"
-        >
-          <div
-            class="MuiGrid-root SignInDialog-dialogContentTitle-42 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-10"
-          >
-            <div
-              class="MuiGrid-root MuiGrid-item"
-            >
-              <mock-typography
-                color="textSecondary"
-                variant="h5"
-              >
-                Sign In
-              </mock-typography>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-10"
-          >
-            <form
-              class="SignInDialog-form-43"
-            >
-              <div
-                class="MuiGrid-root SignInDialog-textFieldWrapper-44 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="emailAddress"
-                    id="emailAddress-label"
-                  >
-                    Email Address
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input SignInDialog-textField-45"
-                      id="emailAddress"
-                      name="emailAddress"
-                      placeholder="Email Address"
-                      type="text"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-24 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-26"
-                      >
-                        <span>
-                          Email Address
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root SignInDialog-textFieldWrapper-44 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <div
-                  class="MuiFormControl-root MuiTextField-root MuiFormControl-fullWidth"
-                >
-                  <label
-                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined"
-                    data-shrink="false"
-                    for="password"
-                    id="password-label"
-                  >
-                    Password
-                  </label>
-                  <div
-                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-fullWidth MuiInputBase-formControl"
-                  >
-                    <input
-                      aria-invalid="false"
-                      class="MuiInputBase-input MuiOutlinedInput-input SignInDialog-textField-45"
-                      id="password"
-                      name="password"
-                      placeholder="Password"
-                      type="password"
-                      value=""
-                    />
-                    <fieldset
-                      aria-hidden="true"
-                      class="PrivateNotchedOutline-root-24 MuiOutlinedInput-notchedOutline"
-                    >
-                      <legend
-                        class="PrivateNotchedOutline-legendLabelled-26"
-                      >
-                        <span>
-                          Password
-                        </span>
-                      </legend>
-                    </fieldset>
-                  </div>
-                  
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <button
-                  class="MuiButtonBase-root MuiButton-root MuiButton-text SignInDialog-forgotPasswordButton-48"
-                  tabindex="0"
-                  type="button"
-                >
-                  <span
-                    class="MuiButton-label"
-                  >
-                    <mock-typography
-                      color="textSecondary"
-                      variant="subtitle2"
-                    >
-                      Forgot your password?
-                    </mock-typography>
-                  </span>
-                  <span
-                    class="MuiTouchRipple-root"
-                  />
-                </button>
-              </div>
-              <div
-                class="MuiGrid-root SignInDialog-button-47 MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <button
-                  class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-containedSizeLarge MuiButton-sizeLarge MuiButton-fullWidth"
-                  tabindex="0"
-                  type="submit"
-                >
-                  <span
-                    class="MuiButton-label"
-                  >
-                    SIGN IN
-                  </span>
-                  <span
-                    class="MuiTouchRipple-root"
-                  />
-                </button>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-              >
-                <mock-typography
-                  classname="SignInDialog-formText-46"
-                  color="textSecondary"
-                  variant="subtitle1"
-                >
-                  Don't have an account?
-                   
-                  <button
-                    class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary"
-                    tabindex="0"
-                    type="button"
-                  >
-                    <span
-                      class="MuiButton-label"
-                    >
-                      SIGN UP
-                    </span>
-                    <span
-                      class="MuiTouchRipple-root"
-                    />
-                  </button>
-                </mock-typography>
-              </div>
-            </form>
-          </div>
-        </div>
-      </mock-cardcontent>
-    </mock-card>
-  </mock-dialog>
-  <div
-    class="MuiContainer-root Site-noDataWrapper-2 MuiContainer-maxWidthLg"
-  >
-    <mock-box
-      margintop="2rem"
-    >
-      <div
-        class="MuiCollapse-root MuiCollapse-hidden"
-        style="min-height: 0px;"
-      >
-        <div
-          class="MuiCollapse-wrapper"
-        >
-          <div
-            class="MuiCollapse-wrapperInner"
-          >
-            <div
-              class="MuiPaper-root MuiAlert-root MuiAlert-standardSuccess MuiPaper-elevation0"
-              role="alert"
-            >
-              <div
-                class="MuiAlert-icon"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4C12.76,4 13.5,4.11 14.2, 4.31L15.77,2.74C14.61,2.26 13.34,2 12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0, 0 22,12M7.91,10.08L6.5,11.5L11,16L21,6L19.59,4.58L11,13.17L7.91,10.08Z"
-                  />
-                </svg>
-              </div>
-              <div
-                class="MuiAlert-message"
-              >
-                Something went wrong
-              </div>
-              <div
-                class="MuiAlert-action"
-              >
-                <mock-iconbutton
-                  color="inherit"
-                  size="small"
-                >
-                  <svg
-                    aria-hidden="true"
-                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit"
-                    focusable="false"
-                    viewBox="0 0 24 24"
-                  >
-                    <path
-                      d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"
-                    />
-                  </svg>
-                </mock-iconbutton>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div
-        class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-      >
-        <div
-          class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-align-items-xs-center"
-          >
-            <div
-              class="MuiGrid-root SiteNavBar-headerButtonWrapper-57 MuiGrid-item"
-            >
-              <mock-iconbutton
-                aria-label="menu"
-                color="primary"
-                component="[object Object]"
-                edge="start"
-                to="/map"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="MuiSvgIcon-root"
-                  focusable="false"
-                  viewBox="0 0 24 24"
-                >
-                  <path
-                    d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"
-                  />
-                </svg>
-              </mock-iconbutton>
-            </div>
-            <div
-              class="MuiGrid-root SiteNavBar-headerWrapper-58 MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-item MuiGrid-align-items-xs-center"
-            >
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-grid-xs-12 MuiGrid-grid-md-8"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                  >
-                    <div
-                      class="MuiGrid-root SiteNavBar-siteNameWrapper-59 MuiGrid-item"
-                    >
-                      <mock-typography
-                        variant="h4"
-                      >
-                        Hawaii
-                      </mock-typography>
-                    </div>
-                    <div
-                      class="MuiGrid-root SiteNavBar-headerButtonWrapper-57 MuiGrid-item"
-                    >
-                      <mock-tooltip
-                        arrow="true"
-                        placement="top"
-                        title="Add to your dashboard"
-                      >
-                        <mock-iconbutton
-                          classname="CollectionButton-root-60"
-                          disabled="false"
-                        >
-                          <svg
-                            color="#3f51b5"
-                          >
-                            watch.svg
-                          </svg>
-                        </mock-iconbutton>
-                      </mock-tooltip>
-                    </div>
-                  </div>
-                </div>
-                <div
-                  class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-                >
-                  <mock-typography
-                    variant="h6"
-                  >
-                    Managed by Some organization
-                  </mock-typography>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </mock-box>
-    <mock-box
-      mt="1.3rem"
-    >
-      <div
-        class="MuiPaper-root MuiAlert-root MuiAlert-standardInfo MuiPaper-elevation0"
-        role="alert"
-      >
-        <div
-          class="MuiAlert-icon"
-        >
-          <svg
-            aria-hidden="true"
-            class="MuiSvgIcon-root MuiSvgIcon-fontSizeInherit"
-            focusable="false"
-            viewBox="0 0 24 24"
-          >
-            <path
-              d="M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20, 12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10, 10 0 0,0 12,2M11,17H13V11H11V17Z"
-            />
-          </svg>
-        </div>
-        <div
-          class="MuiAlert-message"
-        >
-          <div>
-            Welcome to your virtual site, data is loading, please come back in a few hours. This site will be visible publicly as soon as it has been approved by the Aqualink team. If your site is not located in the ocean or sea, please click on "EDIT SITE DETAILS" to place it correctly. For any questions, contact
-             
-            <a
-              href="mailto:info@aqualink.org"
-            >
-              info@aqualink.org
-            </a>
-            . To learn more, watch this
-             
-            <a
-              href="https://www.youtube.com/watch?v=EQZ3HiPevTY"
-            >
-              5-minute video
-            </a>
-             
-            to see what you can do with Aqualink.
-          </div>
-        </div>
-      </div>
-    </mock-box>
-    <div>
-      <mock-box
-        mt="1.5rem"
-      >
-        <div
-          class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-2 MuiGrid-align-items-xs-flex-end MuiGrid-justify-content-xs-space-between"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-md-6"
-          >
-            <div
-              class="MuiGrid-root makeStyles-row-73 MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-flex-end MuiGrid-grid-xs-12"
-            >
-              <mock-box
-                classname="Title-root-78"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-item"
-                    style="margin-right: 1rem;"
-                  >
-                    <mock-typography
-                      classname=""
-                      variant="subtitle2"
-                    >
-                      LAT: 0.000
-                    </mock-typography>
-                  </div>
-                  <div
-                    class="MuiGrid-root MuiGrid-item"
-                    style="margin-right: 0px;"
-                  >
-                    <mock-typography
-                      classname=""
-                      variant="subtitle2"
-                    >
-                      LONG: 0.000
-                    </mock-typography>
-                  </div>
-                </div>
-              </mock-box>
-            </div>
-            <div
-              class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-            >
-              <div
-                class="makeStyles-container-74"
-              >
-                <mock-map
-                  polygon="[object Object]"
-                  siteid="1"
-                  surveypoints=""
-                />
-              </div>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-md-6"
-          >
-            <div
-              class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-            >
-              <div
-                class="makeStyles-container-74"
-              >
-                <mock-featuredmedia
-                  siteid="1"
-                />
-              </div>
-            </div>
-          </div>
-        </div>
-        <div
-          class="MuiGrid-root makeStyles-metricsWrapper-71 MuiGrid-container MuiGrid-spacing-xs-2 MuiGrid-justify-content-xs-space-between"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3"
-          >
-            <div
-              class="makeStyles-card-61"
-            >
-              <mock-card
-                classname="Satellite-root-94"
-                style="background-color: rgb(8, 91, 163);"
-              >
-                <div
-                  class="MuiCardHeader-root Satellite-header-89"
-                >
-                  <div
-                    class="MuiCardHeader-content"
-                  >
-                    <mock-typography
-                      classname="MuiCardHeader-title"
-                      component="span"
-                      display="block"
-                      variant="h5"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-container"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-item"
-                        >
-                          <mock-typography
-                            classname="Satellite-cardTitle-88"
-                            variant="h6"
-                          >
-                            SATELLITE OBSERVATION
-                          </mock-typography>
-                        </div>
-                      </div>
-                    </mock-typography>
-                  </div>
-                </div>
-                <mock-cardcontent
-                  classname="Satellite-content-95"
-                >
-                  <mock-box
-                    display="flex"
-                    flexgrow="1"
-                    p="1rem"
-                  >
-                    <div
-                      class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="Satellite-contentTextTitles-90"
-                          variant="subtitle2"
-                        >
-                          SURFACE TEMP
-                        </mock-typography>
-                        <mock-tooltip
-                          title=""
-                        >
-                          <mock-typography
-                            classname="Satellite-contentTextValues-91"
-                            variant="h3"
-                          >
-                            - -°C
-                          </mock-typography>
-                        </mock-tooltip>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="Satellite-contentTextTitles-90"
-                          variant="subtitle2"
-                        >
-                          HISTORICAL MAX
-                        </mock-typography>
-                        <mock-tooltip
-                          title="Historical maximum monthly average over the past 20 years"
-                        >
-                          <mock-typography
-                            classname="Satellite-contentTextValues-91"
-                            variant="h3"
-                          >
-                            0.0°C
-                          </mock-typography>
-                        </mock-tooltip>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="Satellite-contentTextTitles-90"
-                          variant="subtitle2"
-                        >
-                          DEGREE HEATING WEEKS
-                        </mock-typography>
-                        <mock-tooltip
-                          title="Degree Heating Weeks - a measure of the amount of time above the 20 year historical maximum temperatures"
-                        >
-                          <mock-typography
-                            classname="Satellite-contentTextValues-91"
-                            variant="h3"
-                          >
-                            0.0
-                          </mock-typography>
-                        </mock-tooltip>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="Satellite-contentTextTitles-90"
-                          variant="subtitle2"
-                        >
-                          SST ANOMALY
-                        </mock-typography>
-                        <mock-tooltip
-                          title="Difference between current SST and longterm average"
-                        >
-                          <mock-typography
-                            classname="Satellite-contentTextValues-91"
-                            variant="h3"
-                          >
-                            - -°C
-                          </mock-typography>
-                        </mock-tooltip>
-                      </div>
-                    </div>
-                  </mock-box>
-                  <div
-                    class="MuiGrid-root MuiGrid-container"
-                  >
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(8, 91, 163); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          0
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(12, 157, 165); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          2
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(117, 180, 114); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          4
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(123, 217, 37); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          6
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(193, 229, 34); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          8
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(229, 187, 43); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          10
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(230, 121, 40); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          12
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(232, 79, 46); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          14
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(216, 69, 36); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          16
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(128, 58, 32); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          18
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(185, 41, 68); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          20
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-1"
-                      style="background-color: rgb(128, 48, 126); height: 2rem;"
-                    >
-                      <mock-box
-                        textalign="center"
-                      >
-                        <mock-typography
-                          align="center"
-                          variant="caption"
-                        >
-                          25
-                        </mock-typography>
-                      </mock-box>
-                    </div>
-                  </div>
-                  <div
-                    class="MuiGrid-root makeStyles-updateInfo-96 false MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-                  >
-                    <div
-                      class="MuiGrid-root makeStyles-dateInfoWrapper-100 makeStyles-dateInfoWrapper-102 MuiGrid-item MuiGrid-grid-xs-8"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-item"
-                        >
-                          <svg
-                            aria-hidden="true"
-                            class="MuiSvgIcon-root makeStyles-updateIcon-98 MuiSvgIcon-fontSizeSmall"
-                            focusable="false"
-                            viewBox="0 0 24 24"
-                          >
-                            <path
-                              d="M21 10.12h-6.78l2.74-2.82c-2.73-2.7-7.15-2.8-9.88-.1-2.73 2.71-2.73 7.08 0 9.79s7.15 2.71 9.88 0C18.32 15.65 19 14.08 19 12.1h2c0 1.98-.88 4.55-2.64 6.29-3.51 3.48-9.21 3.48-12.72 0-3.5-3.47-3.53-9.11-.02-12.58s9.14-3.47 12.65 0L21 3v7.12zM12.5 8v4.25l3.5 2.08-.72 1.21L11 13V8h1.5z"
-                            />
-                          </svg>
-                        </div>
-                        <div
-                          class="MuiGrid-root makeStyles-dateInfo-101 MuiGrid-item"
-                        >
-                          <mock-box
-                            display="flex"
-                            flexdirection="column"
-                            width="100%"
-                          >
-                            <mock-typography
-                              classname="makeStyles-updateInfoText-99"
-                              variant="caption"
-                            >
-                              No data available
-                            </mock-typography>
-                            <mock-typography
-                              classname="makeStyles-updateInfoText-99"
-                              variant="caption"
-                            >
-                              Updated daily
-                            </mock-typography>
-                          </mock-box>
-                        </div>
-                      </div>
-                    </div>
-                    <div
-                      class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-4"
-                      style="display: flex; justify-content: flex-end;"
-                    >
-                      <div
-                        class="MuiGrid-root makeStyles-chip-103 makeStyles-chip-109 MuiGrid-item"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                        >
-                          <button
-                            class="MuiButtonBase-root MuiButton-root MuiButton-text makeStyles-button-108"
-                            tabindex="0"
-                            type="button"
-                          >
-                            <span
-                              class="MuiButton-label"
-                            >
-                              <a
-                                class="makeStyles-link-106"
-                                href="https://coralreefwatch.noaa.gov/"
-                                rel="noopener noreferrer"
-                                target="_blank"
-                              >
-                                <mock-typography
-                                  classname="makeStyles-chipText-104"
-                                >
-                                  NOAA
-                                </mock-typography>
-                                <img
-                                  alt="sensor-type"
-                                  class="makeStyles-sensorImage-107"
-                                  src="satellite.svg"
-                                />
-                              </a>
-                            </span>
-                            <span
-                              class="MuiTouchRipple-root"
-                            />
-                          </button>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </mock-cardcontent>
-              </mock-card>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3"
-          >
-            <div
-              class="makeStyles-card-61"
-            >
-              <mock-card
-                classname="Sensor-root-119"
-              >
-                <div
-                  class="MuiCardHeader-root Sensor-header-114"
-                >
-                  <div
-                    class="MuiCardHeader-content"
-                  >
-                    <mock-typography
-                      classname="MuiCardHeader-title"
-                      component="span"
-                      display="block"
-                      variant="h5"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-container"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-item"
-                        >
-                          <mock-typography
-                            classname="Sensor-cardTitle-113"
-                            variant="h6"
-                          >
-                            BUOY OBSERVATION
-                          </mock-typography>
-                        </div>
-                      </div>
-                    </mock-typography>
-                  </div>
-                </div>
-                <mock-cardcontent
-                  classname="Sensor-content-121"
-                >
-                  <div
-                    style="display: grid; gap: 1rem; grid-template-areas: 'value0 image' 'spacer1 image' 'value1 image'; padding: 1rem;"
-                  >
-                    <div
-                      style="grid-area: value0;"
-                    >
-                      <mock-typography
-                        classname="Sensor-contentTextTitles-115"
-                        variant="subtitle2"
-                      >
-                        TEMP AT 1m
-                      </mock-typography>
-                      <mock-typography
-                        classname="Sensor-contentTextValues-116"
-                        variant="h3"
-                      >
-                        - -°C
-                      </mock-typography>
-                    </div>
-                    <div
-                      style="grid-area: value1;"
-                    >
-                      <mock-typography
-                        classname="Sensor-contentTextTitles-115"
-                        variant="subtitle2"
-                      >
-                        TEMP AT DEPTH
-                      </mock-typography>
-                      <mock-typography
-                        classname="Sensor-contentTextValues-116"
-                        variant="h3"
-                      >
-                        - -°C
-                      </mock-typography>
-                    </div>
-                    <div
-                      style="grid-area: spacer1; display: inherit; min-height: 2em;"
-                    />
-                    <div
-                      style="grid-area: spacer2; display: inherit;"
-                    />
-                    <div
-                      style="grid-area: image; position: relative;"
-                    >
-                      <img
-                        alt="sensor"
-                        height="150"
-                        src="sensor.svg"
-                        style="position: absolute; bottom: 0px;"
-                        width="auto"
-                      />
-                    </div>
-                    <div
-                      style="grid-area: value4; display: flex; align-items: flex-end;"
-                    />
-                  </div>
-                  <div
-                    class="MuiGrid-root Sensor-noSensorAlert-122 MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                  >
-                    <mock-typography
-                      variant="h6"
-                    >
-                      No Live Telemetry
-                    </mock-typography>
-                  </div>
-                </mock-cardcontent>
-              </mock-card>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3"
-          >
-            <div
-              class="makeStyles-card-61"
-            >
-              <mock-card
-                classname="Bleaching-root-134"
-              >
-                <div
-                  class="MuiCardHeader-root Bleaching-header-129"
-                >
-                  <div
-                    class="MuiCardHeader-content"
-                  >
-                    <mock-typography
-                      classname="MuiCardHeader-title"
-                      component="span"
-                      display="block"
-                      variant="h5"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-container"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12"
-                        >
-                          <mock-typography
-                            classname="Bleaching-cardTitle-128"
-                            color="textSecondary"
-                            variant="h6"
-                          >
-                            HEAT STRESS ALERT LEVEL
-                          </mock-typography>
-                        </div>
-                      </div>
-                    </mock-typography>
-                  </div>
-                </div>
-                <mock-cardcontent
-                  classname="Bleaching-contentWrapper-135"
-                >
-                  <div
-                    class="MuiGrid-root Bleaching-content-136 MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-align-content-xs-space-between MuiGrid-justify-content-xs-center MuiGrid-grid-xs-12"
-                  >
-                    <img
-                      alt="alert-level"
-                      class="Bleaching-alertImage-137"
-                      src="alert_nostress.svg"
-                    />
-                    <div
-                      class="MuiGrid-root makeStyles-updateInfo-96 makeStyles-withMargin-97 MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-                    >
-                      <div
-                        class="MuiGrid-root makeStyles-dateInfoWrapper-100 makeStyles-dateInfoWrapper-138 MuiGrid-item MuiGrid-grid-xs-8"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                        >
-                          <div
-                            class="MuiGrid-root MuiGrid-item"
-                          >
-                            <svg
-                              aria-hidden="true"
-                              class="MuiSvgIcon-root makeStyles-updateIcon-98 MuiSvgIcon-fontSizeSmall"
-                              focusable="false"
-                              viewBox="0 0 24 24"
-                            >
-                              <path
-                                d="M21 10.12h-6.78l2.74-2.82c-2.73-2.7-7.15-2.8-9.88-.1-2.73 2.71-2.73 7.08 0 9.79s7.15 2.71 9.88 0C18.32 15.65 19 14.08 19 12.1h2c0 1.98-.88 4.55-2.64 6.29-3.51 3.48-9.21 3.48-12.72 0-3.5-3.47-3.53-9.11-.02-12.58s9.14-3.47 12.65 0L21 3v7.12zM12.5 8v4.25l3.5 2.08-.72 1.21L11 13V8h1.5z"
-                              />
-                            </svg>
-                          </div>
-                          <div
-                            class="MuiGrid-root makeStyles-dateInfo-101 MuiGrid-item"
-                          >
-                            <mock-box
-                              display="flex"
-                              flexdirection="column"
-                              width="100%"
-                            >
-                              <mock-typography
-                                classname="makeStyles-updateInfoText-99"
-                                variant="caption"
-                              >
-                                No data available
-                              </mock-typography>
-                              <mock-typography
-                                classname="makeStyles-updateInfoText-99"
-                                variant="caption"
-                              >
-                                Updated daily
-                              </mock-typography>
-                            </mock-box>
-                          </div>
-                        </div>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-4"
-                        style="display: flex; justify-content: flex-end;"
-                      >
-                        <div
-                          class="MuiGrid-root makeStyles-chip-103 makeStyles-chip-139 MuiGrid-item"
-                        >
-                          <div
-                            class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                          >
-                            <button
-                              class="MuiButtonBase-root MuiButton-root MuiButton-text makeStyles-button-108"
-                              tabindex="0"
-                              type="button"
-                            >
-                              <span
-                                class="MuiButton-label"
-                              >
-                                <a
-                                  class="makeStyles-link-106"
-                                  href="https://coralreefwatch.noaa.gov/product/5km/index_5km_baa-max-7d.php"
-                                  rel="noopener noreferrer"
-                                  target="_blank"
-                                >
-                                  <mock-typography
-                                    classname="makeStyles-chipText-104"
-                                  >
-                                    NOAA CRW
-                                  </mock-typography>
-                                </a>
-                              </span>
-                              <span
-                                class="MuiTouchRipple-root"
-                              />
-                            </button>
-                          </div>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </mock-cardcontent>
-              </mock-card>
-            </div>
-          </div>
-          <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 MuiGrid-grid-md-3"
-          >
-            <div
-              class="makeStyles-card-61"
-            >
-              <mock-card
-                classname="makeStyles-root-149"
-              >
-                <mock-cardcontent
-                  classname="makeStyles-contentWrapper-153"
-                >
-                  <div
-                    class="MuiGrid-root makeStyles-content-154 MuiGrid-container MuiGrid-item MuiGrid-align-content-xs-space-between MuiGrid-justify-content-xs-center MuiGrid-grid-xs-12"
-                  >
-                    <div
-                      class="MuiGrid-root makeStyles-paddingContainer-152 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                    >
-                      <mock-typography
-                        classname="makeStyles-cardTitle-143 makeStyles-coloredText-150"
-                        variant="h6"
-                      >
-                        WIND
-                      </mock-typography>
-                      <img
-                        alt="wind"
-                        class="makeStyles-titleImages-151"
-                        src="wind.svg"
-                      />
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-paddingContainer-152 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="makeStyles-contentTextTitles-145"
-                          color="textSecondary"
-                          variant="subtitle2"
-                        >
-                          SPEED
-                        </mock-typography>
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                        >
-                          <mock-typography
-                            classname="makeStyles-contentTextValues-146"
-                            color="textSecondary"
-                            variant="h3"
-                          >
-                            - -
-                          </mock-typography>
-                        </div>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-6"
-                      >
-                        <mock-typography
-                          classname="makeStyles-contentTextTitles-145"
-                          color="textSecondary"
-                          variant="subtitle2"
-                        >
-                          DIRECTION
-                        </mock-typography>
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                        >
-                          <mock-typography
-                            classname="makeStyles-contentTextValues-146"
-                            color="textSecondary"
-                            variant="h3"
-                          >
-                            - -
-                          </mock-typography>
-                        </div>
-                      </div>
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-paddingContainer-152 MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                    >
-                      <mock-typography
-                        classname="makeStyles-cardTitle-143 makeStyles-coloredText-150"
-                        variant="h6"
-                      >
-                        WAVES
-                      </mock-typography>
-                      <img
-                        alt="waves"
-                        class="makeStyles-titleImages-151"
-                        src="waves.svg"
-                      />
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-paddingContainer-152 MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-space-between MuiGrid-grid-xs-12"
-                    >
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-lg-4"
-                      >
-                        <mock-typography
-                          classname="makeStyles-contentTextTitles-145"
-                          color="textSecondary"
-                          variant="subtitle2"
-                        >
-                          HEIGHT
-                        </mock-typography>
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                        >
-                          <mock-typography
-                            classname="makeStyles-contentTextValues-146"
-                            color="textSecondary"
-                            variant="h3"
-                          >
-                            - -
-                          </mock-typography>
-                        </div>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-lg-3"
-                      >
-                        <mock-typography
-                          classname="makeStyles-contentTextTitles-145"
-                          color="textSecondary"
-                          variant="subtitle2"
-                        >
-                          PERIOD
-                        </mock-typography>
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                        >
-                          <mock-typography
-                            classname="makeStyles-contentTextValues-146"
-                            color="textSecondary"
-                            variant="h3"
-                          >
-                            - -
-                          </mock-typography>
-                        </div>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-lg-5"
-                      >
-                        <mock-typography
-                          classname="makeStyles-contentTextTitles-145"
-                          color="textSecondary"
-                          variant="subtitle2"
-                        >
-                          DIRECTION
-                        </mock-typography>
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-baseline"
-                        >
-                          <mock-typography
-                            classname="makeStyles-contentTextValues-146"
-                            color="textSecondary"
-                            variant="h3"
-                          >
-                            - -
-                          </mock-typography>
-                        </div>
-                      </div>
-                    </div>
-                    <div
-                      class="MuiGrid-root makeStyles-updateInfo-96 false MuiGrid-container MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-space-between"
-                    >
-                      <div
-                        class="MuiGrid-root makeStyles-dateInfoWrapper-100 makeStyles-dateInfoWrapper-160 MuiGrid-item MuiGrid-grid-xs-8"
-                      >
-                        <div
-                          class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                        >
-                          <div
-                            class="MuiGrid-root MuiGrid-item"
-                          >
-                            <svg
-                              aria-hidden="true"
-                              class="MuiSvgIcon-root makeStyles-updateIcon-98 MuiSvgIcon-fontSizeSmall"
-                              focusable="false"
-                              viewBox="0 0 24 24"
-                            >
-                              <path
-                                d="M21 10.12h-6.78l2.74-2.82c-2.73-2.7-7.15-2.8-9.88-.1-2.73 2.71-2.73 7.08 0 9.79s7.15 2.71 9.88 0C18.32 15.65 19 14.08 19 12.1h2c0 1.98-.88 4.55-2.64 6.29-3.51 3.48-9.21 3.48-12.72 0-3.5-3.47-3.53-9.11-.02-12.58s9.14-3.47 12.65 0L21 3v7.12zM12.5 8v4.25l3.5 2.08-.72 1.21L11 13V8h1.5z"
-                              />
-                            </svg>
-                          </div>
-                          <div
-                            class="MuiGrid-root makeStyles-dateInfo-101 MuiGrid-item"
-                          >
-                            <mock-box
-                              display="flex"
-                              flexdirection="column"
-                              width="100%"
-                            >
-                              <mock-typography
-                                classname="makeStyles-updateInfoText-99"
-                                variant="caption"
-                              >
-                                No data available
-                              </mock-typography>
-                              <mock-typography
-                                classname="makeStyles-updateInfoText-99"
-                                variant="caption"
-                              >
-                                Updated every 6 hours
-                              </mock-typography>
-                            </mock-box>
-                          </div>
-                        </div>
-                      </div>
-                      <div
-                        class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-4"
-                        style="display: flex; justify-content: flex-end;"
-                      >
-                        <div
-                          class="MuiGrid-root makeStyles-chip-103 makeStyles-chip-161 MuiGrid-item"
-                        >
-                          <div
-                            class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center"
-                          >
-                            <button
-                              class="MuiButtonBase-root MuiButton-root MuiButton-text makeStyles-button-108"
-                              tabindex="0"
-                              type="button"
-                            >
-                              <span
-                                class="MuiButton-label"
-                              >
-                                <a
-                                  class="makeStyles-link-106"
-                                  href="https://www.ncdc.noaa.gov/data-access/model-data/model-datasets/global-forcast-system-gfs"
-                                  rel="noopener noreferrer"
-                                  target="_blank"
-                                >
-                                  <mock-typography
-                                    classname="makeStyles-chipText-104"
-                                  >
-                                    SOFAR MODEL
-                                  </mock-typography>
-                                </a>
-                              </span>
-                              <span
-                                class="MuiTouchRipple-root"
-                              />
-                            </button>
-                          </div>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </mock-cardcontent>
-              </mock-card>
-            </div>
-          </div>
-        </div>
-        <mock-box
-          mt="2rem"
-        >
-          <div>
-            <mock-box
-              classname="makeStyles-graphtTitleWrapper-163"
-            >
-              <mock-typography
-                classname="makeStyles-graphTitle-164"
-                variant="h6"
-              >
-                HEAT STRESS ANALYSIS (°C)
-              </mock-typography>
-            </mock-box>
-            <div
-              class="makeStyles-chart-162"
-            >
-              <mock-line
-                data="[object Object]"
-                options="[object Object]"
-              />
-            </div>
-            <mock-multiplesensorscharts
-              disablegutters="true"
-              hasadditionalsensordata="false"
-              site="[object Object]"
-              surveysfiltered="false"
-            />
-          </div>
-          <mock-dialog
-            fullwidth="true"
-            open="false"
-          >
-            <mock-dialogtitle
-              classname="Dialog-dialogTitle-178"
-              disabletypography="true"
-            >
-              <mock-typography
-                variant="h4"
-              >
-                Delete undefined
-              </mock-typography>
-            </mock-dialogtitle>
-            <mock-dialogcontent
-              dividers="true"
-            >
-              <mock-typography
-                color="textSecondary"
-              >
-                Are you sure you want to delete this survey point? It will be deleted across all surveys.
-              </mock-typography>
-            </mock-dialogcontent>
-            <mock-dialogactions>
-              <button
-                class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedSecondary MuiButton-containedSizeSmall MuiButton-sizeSmall"
-                tabindex="0"
-                type="button"
-              >
-                <span
-                  class="MuiButton-label"
-                >
-                  No
-                </span>
-                <span
-                  class="MuiTouchRipple-root"
-                />
-              </button>
-              <button
-                class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-containedSizeSmall MuiButton-sizeSmall"
-                tabindex="0"
-                type="button"
-              >
-                <span
-                  class="MuiButton-label"
-                >
-                  Yes
-                </span>
-                <span
-                  class="MuiTouchRipple-root"
-                />
-              </button>
-            </mock-dialogactions>
-          </mock-dialog>
-          <div
-            class="MuiGrid-root makeStyles-root-169 MuiGrid-container MuiGrid-spacing-xs-2 MuiGrid-justify-content-xs-center"
-          >
-            <mock-box
-              bgcolor="#f5f6f6"
-              height="100%"
-              position="absolute"
-              zindex="-1"
-            />
-            <div
-              class="MuiGrid-root makeStyles-surveyWrapper-170 MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-item MuiGrid-align-items-xs-baseline MuiGrid-justify-content-xs-space-between MuiGrid-grid-xs-11 MuiGrid-grid-lg-12"
-            >
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-center MuiGrid-grid-md-12 MuiGrid-grid-lg-3"
-              >
-                <mock-typography
-                  classname="makeStyles-title-171"
-                >
-                  Survey History
-                </mock-typography>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-grid-md-12 MuiGrid-grid-lg-5"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-item"
-                >
-                  <mock-typography
-                    classname="makeStyles-subTitle-180"
-                    variant="h6"
-                  >
-                    Survey Point:
-                  </mock-typography>
-                </div>
-                <div
-                  class="MuiGrid-root makeStyles-selectorWrapper-181 MuiGrid-item"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-container MuiGrid-align-items-xs-center"
-                  >
-                    <div
-                      class="MuiGrid-root MuiGrid-item"
-                    >
-                      <div
-                        class="MuiInputBase-root MuiInput-root MuiInput-underline makeStyles-selector-182"
-                      >
-                        <div
-                          aria-haspopup="listbox"
-                          aria-labelledby="survey-point survey-point"
-                          class="MuiSelect-root MuiSelect-select MuiSelect-selectMenu MuiInputBase-input MuiInput-input"
-                          id="survey-point"
-                          role="button"
-                          tabindex="0"
-                        >
-                          All
-                        </div>
-                        <input
-                          aria-hidden="true"
-                          class="MuiSelect-nativeInput"
-                          name="survey-point"
-                          tabindex="-1"
-                          value="All"
-                        />
-                        <svg
-                          aria-hidden="true"
-                          class="MuiSvgIcon-root MuiSelect-icon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
-                        >
-                          <path
-                            d="M7 10l5 5 5-5z"
-                          />
-                        </svg>
-                        <mock-menu
-                          anchorel="[object HTMLDivElement]"
-                          id="menu-survey-point"
-                          menulistprops="[object Object]"
-                          open="false"
-                          paperprops="[object Object]"
-                        >
-                          <mock-menuitem
-                            aria-selected="true"
-                            data-value="All"
-                            role="option"
-                            selected="true"
-                          >
-                            <mock-typography
-                              classname="makeStyles-menuItem-184"
-                              variant="h6"
-                            >
-                              All
-                            </mock-typography>
-                          </mock-menuitem>
-                        </mock-menu>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-              <div
-                class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-1 MuiGrid-item MuiGrid-align-items-xs-center MuiGrid-justify-content-xs-center MuiGrid-grid-md-12 MuiGrid-grid-lg-4"
-              >
-                <div
-                  class="MuiGrid-root MuiGrid-item"
-                >
-                  <mock-typography
-                    classname="makeStyles-subTitle-172"
-                    variant="h6"
-                  >
-                    Observation:
-                  </mock-typography>
-                </div>
-                <div
-                  class="MuiGrid-root makeStyles-selectorWrapper-173 MuiGrid-item"
-                >
-                  <div
-                    class="MuiFormControl-root makeStyles-formControl-174"
-                  >
-                    <div
-                      class="MuiInputBase-root MuiInput-root MuiInput-underline makeStyles-selectedItem-175 MuiInputBase-formControl MuiInput-formControl"
-                    >
-                      <div
-                        aria-haspopup="listbox"
-                        aria-labelledby="survey-observation survey-observation"
-                        class="MuiSelect-root MuiSelect-select MuiSelect-selectMenu MuiInputBase-input MuiInput-input makeStyles-textField-177"
-                        id="survey-observation"
-                        role="button"
-                        tabindex="0"
-                      >
-                        <mock-typography
-                          classname="makeStyles-menuItem-176"
-                          variant="h6"
-                        >
-                          Any
-                        </mock-typography>
-                      </div>
-                      <input
-                        aria-hidden="true"
-                        class="MuiSelect-nativeInput"
-                        name="survey-observation"
-                        tabindex="-1"
-                        value="any"
-                      />
-                      <svg
-                        aria-hidden="true"
-                        class="MuiSvgIcon-root MuiSelect-icon"
-                        focusable="false"
-                        viewBox="0 0 24 24"
-                      >
-                        <path
-                          d="M7 10l5 5 5-5z"
-                        />
-                      </svg>
-                      <mock-menu
-                        anchorel="[object HTMLDivElement]"
-                        id="menu-survey-observation"
-                        menulistprops="[object Object]"
-                        open="false"
-                        paperprops="[object Object]"
-                      >
-                        <mock-menuitem
-                          aria-selected="true"
-                          data-value="any"
-                          role="option"
-                          selected="true"
-                        >
-                          <mock-typography
-                            classname="makeStyles-menuItem-176"
-                            variant="h6"
-                          >
-                            Any
-                          </mock-typography>
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-176"
-                          data-value="healthy"
-                          role="option"
-                          selected="false"
-                          title="Appears healthy"
-                        >
-                          Appears healthy
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-176"
-                          data-value="possible-disease"
-                          role="option"
-                          selected="false"
-                          title="Showing possible signs of disease"
-                        >
-                          Showing possible signs of disease
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-176"
-                          data-value="evident-disease"
-                          role="option"
-                          selected="false"
-                          title="Signs of disease are evident"
-                        >
-                          Signs of disease are evident
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-176"
-                          data-value="mortality"
-                          role="option"
-                          selected="false"
-                          title="Signs of mortality are evident"
-                        >
-                          Signs of mortality are evident
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-176"
-                          data-value="environmental"
-                          role="option"
-                          selected="false"
-                          title="Signs of environmental disturbance are evident (e.g. storm damage)"
-                        >
-                          Signs of environmental disturbance are evident (e.g. storm damage)
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-176"
-                          data-value="anthropogenic"
-                          role="option"
-                          selected="false"
-                          title="Signs of anthropogenic disturbance are evident (e.g.,fishing gear, trampling)"
-                        >
-                          Signs of anthropogenic disturbance are evident (e.g.,fishing gear, trampling)
-                        </mock-menuitem>
-                        <mock-menuitem
-                          classname="makeStyles-menuItem-176"
-                          data-value="invasive-species"
-                          role="option"
-                          selected="false"
-                          title="Signs of damage from invasive species"
-                        >
-                          Signs of damage from invasive species
-                        </mock-menuitem>
-                      </mock-menu>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div
-              class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-justify-content-xs-center MuiGrid-grid-xs-11 MuiGrid-grid-lg-12"
-            >
-              <div
-                class="SurveyTimeline-root-189"
-              >
-                <mock-hidden
-                  mddown="true"
-                >
-                  <ul
-                    class="MuiTimeline-root MuiTimeline-alignLeft"
-                  />
-                </mock-hidden>
-                <mock-hidden
-                  lgup="true"
-                >
-                  <div
-                    class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-12"
-                  />
-                </mock-hidden>
-              </div>
-            </div>
-          </div>
-        </mock-box>
-      </mock-box>
-    </div>
-  </div>
-  <mock-appbar
-    classname="Footer-appBar-215"
-    position="static"
-  >
-    <mock-toolbar>
-      <div
-        class="MuiGrid-root MuiGrid-container MuiGrid-justify-content-xs-center"
-      >
-        <div
-          class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-xs-10"
-        >
-          <mock-link
-            classname="Footer-navBarLink-216"
-            href="/map"
-          >
-            <mock-typography
-              color="textPrimary"
-              variant="h4"
-            >
-              Aqua
-            </mock-typography>
-            <mock-typography
-              style="color: rgb(138, 198, 222);"
-              variant="h4"
-            >
-              link
-            </mock-typography>
-          </mock-link>
-        </div>
-      </div>
-    </mock-toolbar>
-  </mock-appbar>
-</div>
-`;
diff --git a/packages/website/src/routes/SiteRoutes/Site/index.tsx b/packages/website/src/routes/SiteRoutes/Site/index.tsx
index 89dae1400..e6c44bfe3 100644
--- a/packages/website/src/routes/SiteRoutes/Site/index.tsx
+++ b/packages/website/src/routes/SiteRoutes/Site/index.tsx
@@ -26,6 +26,7 @@ import {
   surveysRequest,
   surveyListSelector,
 } from 'store/Survey/surveyListSlice';
+import { Helmet } from 'react-helmet-async';
 import { userInfoSelector } from 'store/User/userSlice';
 import { User } from 'store/User/types';
 import { oceanSenseConfig } from 'constants/oceanSenseConfig';
@@ -44,6 +45,8 @@ import { DateTime } from 'luxon-extensions';
 import SiteInfo from './SiteInfo';
 import NotFoundPage from '../../NotFound/index';
 
+import Dashboard from '../../../assets/img/helmet/Dashboard.jpg';
+
 const getAlertMessage = (
   user: User | null,
   siteId: string,
@@ -212,6 +215,23 @@ const Site = ({ classes }: SiteProps) => {
 
   return (
     <>
+      <Helmet>
+        <title>Monitoring ${siteDetails?.name} | Aqualink Dashboard</title>
+        <meta
+          name="description"
+          content={`View real-time data for 
+            ${siteDetails?.name}, including reef health, water temperature, wind, 
+            and wave conditions. Monitor marine ecosystems with Aqualink.`}
+        />
+        <meta property="og:image" content={Dashboard} />
+        <meta
+          property="og:image:alt"
+          content="The images display the Aqualink 
+        dashboard, which allows you to monitor your reef. It includes a map, 
+        survey feature, satellite data with wind, wave, and temperature data, 
+        heat stress alerts for coral bleaching, and graphs."
+        />
+      </Helmet>
       <SiteNavBar searchLocation />
       {!siteLoading && !siteDetails ? (
         <NotFoundPage />
diff --git a/packages/website/src/routes/Tracker/index.tsx b/packages/website/src/routes/Tracker/index.tsx
index 6f4e15d7e..e26e1a09a 100644
--- a/packages/website/src/routes/Tracker/index.tsx
+++ b/packages/website/src/routes/Tracker/index.tsx
@@ -11,6 +11,7 @@ import {
   makeStyles,
 } from '@material-ui/core';
 import { Link } from 'react-router-dom';
+import { Helmet } from 'react-helmet-async';
 
 import { useImageAspectRatio } from 'hooks/useImageAspectRatio';
 import { isPositiveNumber } from 'helpers/numberUtils';
@@ -18,6 +19,7 @@ import NavBar from 'common/NavBar';
 import Footer from 'common/Footer';
 import FootPrintImage from './FootPrintImage';
 
+import TrackerImage from '../../assets/img/helmet/Tracker.jpg';
 import hero from '../../assets/img/tracker-page/hero.png';
 import image1 from '../../assets/img/tracker-page/image1.png';
 import image2 from '../../assets/img/tracker-page/image2.png';
@@ -122,7 +124,7 @@ const useStyles = makeStyles((theme: Theme) =>
   }),
 );
 
-interface TrackerProps {
+interface ImageProps {
   shouldShowNav?: boolean;
   shouldShowFooter?: boolean;
 }
@@ -146,6 +148,26 @@ const Tracker = ({
   return (
     <>
       {shouldShowNav && <NavBar searchLocation={false} />}
+      <Helmet>
+        <title>
+          Tracking Ocean Heat Waves and Coral Bleaching Globally and Locally
+        </title>
+        <meta
+          name="description"
+          content="Track ocean Heat Waves and Heat Stress 
+        on Aqualink. Access global data and surveys for coral bleaching and coral 
+        reef health tracking."
+        />
+        <meta property="og:image" content={TrackerImage} />
+        <meta
+          property="og:image:alt"
+          content="This image is a screenshot of 
+        the Aqualink map where we're tracking marine heatwaves through the heat 
+        stress layer on the map. The map indicate where heat stress is occurring 
+        and how long the area has been exposed to warmer waters. This is the most 
+        accurate way to track heat waves and bleaching events on a global scale."
+        />
+      </Helmet>
       <Box className={classes.hero}>
         <CardMedia className={classes.image} image={hero} />
         <Container className={classes.titleWrapper}>
diff --git a/yarn.lock b/yarn.lock
index 0b455adc1..8b79bf952 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -12108,6 +12108,13 @@ interpret@^1.0.0:
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.4.0.tgz#665ab8bc4da27a774a40584e812e3e0fa45b1a1e"
   integrity sha512-agE4QfB2Lkp9uICn7BAqoscw4SZP9kTE2hxiFI3jBPmXJfdqiahTbUuKGsMoN2GtqL9AxhYioAcVvgsb1HvRbA==
 
+invariant@^2.2.4:
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
+  integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==
+  dependencies:
+    loose-envify "^1.0.0"
+
 ip-regex@^4.1.0:
   version "4.3.0"
   resolved "https://registry.yarnpkg.com/ip-regex/-/ip-regex-4.3.0.tgz#687275ab0f57fa76978ff8f4dddc8a23d5990db5"
@@ -17577,11 +17584,25 @@ react-event-listener@^0.6.0:
     prop-types "^15.6.0"
     warning "^4.0.1"
 
+react-fast-compare@^3.2.2:
+  version "3.2.2"
+  resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.2.tgz#929a97a532304ce9fee4bcae44234f1ce2c21d49"
+  integrity sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==
+
 react-ga4@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/react-ga4/-/react-ga4-2.1.0.tgz#56601f59d95c08466ebd6edfbf8dede55c4678f9"
   integrity sha512-ZKS7PGNFqqMd3PJ6+C2Jtz/o1iU9ggiy8Y8nUeksgVuvNISbmrQtJiZNvC/TjDsqD0QlU5Wkgs7i+w9+OjHhhQ==
 
+react-helmet-async@^2.0.5:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/react-helmet-async/-/react-helmet-async-2.0.5.tgz#cfc70cd7bb32df7883a8ed55502a1513747223ec"
+  integrity sha512-rYUYHeus+i27MvFE+Jaa4WsyBKGkL6qVgbJvSBoX8mbsWoABJXdEO0bZyi0F6i+4f0NuIb8AvqPMj3iXFHkMwg==
+  dependencies:
+    invariant "^2.2.4"
+    react-fast-compare "^3.2.2"
+    shallowequal "^1.1.0"
+
 react-hook-form@^7.41.5:
   version "7.43.9"
   resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-7.43.9.tgz#84b56ac2f38f8e946c6032ccb760e13a1037c66d"
@@ -18783,6 +18804,11 @@ shallow-equal@^1.2.1:
   resolved "https://registry.yarnpkg.com/shallow-equal/-/shallow-equal-1.2.1.tgz#4c16abfa56043aa20d050324efa68940b0da79da"
   integrity sha512-S4vJDjHHMBaiZuT9NPb616CSmLf618jawtv3sufLl6ivK8WocjAo58cXwbRV1cgqxH0Qbv+iUt6m05eqEa2IRA==
 
+shallowequal@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
+  integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
+
 shapefile@~0.6.6:
   version "0.6.6"
   resolved "https://registry.yarnpkg.com/shapefile/-/shapefile-0.6.6.tgz#6fee152b9fb2b1c85f690285b692fb68c95a5f4f"
@@ -19361,16 +19387,7 @@ string-natural-compare@^3.0.1:
   resolved "https://registry.yarnpkg.com/string-natural-compare/-/string-natural-compare-3.0.1.tgz#7a42d58474454963759e8e8b7ae63d71c1e7fdf4"
   integrity sha512-n3sPwynL1nwKi3WJ6AIsClwBMa0zTi54fn2oLU6ndfTSIO05xaznjSf15PcBZU6FNWbmN5Q6cxT4V5hGvB4taw==
 
-"string-width-cjs@npm:string-width@^4.2.0":
-  version "4.2.3"
-  resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
-  integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
-  dependencies:
-    emoji-regex "^8.0.0"
-    is-fullwidth-code-point "^3.0.0"
-    strip-ansi "^6.0.1"
-
-"string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.2, string-width@^4.2.3:
+"string-width-cjs@npm:string-width@^4.2.0", "string-width@^1.0.2 || 2 || 3 || 4", string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.2, string-width@^4.2.3:
   version "4.2.3"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
   integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -19465,7 +19482,7 @@ stringify-object@^3.3.0:
     is-obj "^1.0.1"
     is-regexp "^1.0.0"
 
-"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
+"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1:
   version "6.0.1"
   resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
   integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
@@ -19486,13 +19503,6 @@ strip-ansi@^5.1.0:
   dependencies:
     ansi-regex "^4.1.0"
 
-strip-ansi@^6.0.0, strip-ansi@^6.0.1:
-  version "6.0.1"
-  resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-6.0.1.tgz#9e26c63d30f53443e9489495b2105d37b67a85d9"
-  integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
-  dependencies:
-    ansi-regex "^5.0.1"
-
 strip-ansi@^7.0.1:
   version "7.0.1"
   resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-7.0.1.tgz#61740a08ce36b61e50e65653f07060d000975fb2"
@@ -21371,7 +21381,7 @@ workbox-window@6.5.4:
     "@types/trusted-types" "^2.0.2"
     workbox-core "6.5.4"
 
-"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0":
+"wrap-ansi-cjs@npm:wrap-ansi@^7.0.0", wrap-ansi@^7.0.0:
   version "7.0.0"
   resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
   integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
@@ -21389,15 +21399,6 @@ wrap-ansi@^6.0.1, wrap-ansi@^6.2.0:
     string-width "^4.1.0"
     strip-ansi "^6.0.0"
 
-wrap-ansi@^7.0.0:
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43"
-  integrity sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==
-  dependencies:
-    ansi-styles "^4.0.0"
-    string-width "^4.1.0"
-    strip-ansi "^6.0.0"
-
 wrap-ansi@^8.1.0:
   version "8.1.0"
   resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-8.1.0.tgz#56dc22368ee570face1b49819975d9b9a5ead214"