diff --git a/.github/workflows/cypress.yml b/.github/workflows/cypress.yml
new file mode 100644
index 00000000..c8ea3b21
--- /dev/null
+++ b/.github/workflows/cypress.yml
@@ -0,0 +1,83 @@
+name: Cypress Tests
+run-name: "Cypress E2E testing for SPARC Portal"
+
+on:
+  workflow_dispatch:
+  pull_request_target:
+    types: [opened, synchronize, reopened]
+    branches: [master, main]
+
+env:
+  CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
+  CYPRESS_PROJECT_ID: ${{ secrets.CYPRESS_PROJECT_ID }}
+  ALGOLIA_API_KEY: ${{ secrets.ALGOLIA_API_KEY }}
+  ALGOLIA_APP_ID: ${{ secrets.ALGOLIA_APP_ID }}
+  ALGOLIA_INDEX: ${{ secrets.ALGOLIA_INDEX }}
+  AWS_USER_POOL_ID: ${{ secrets.AWS_USER_POOL_ID }}
+  AWS_USER_POOL_WEB_CLIENT_ID: ${{ secrets.AWS_USER_POOL_WEB_CLIENT_ID }}
+  BIOLUCIDA_PASSWORD: ${{ secrets.BIOLUCIDA_PASSWORD }}
+  BIOLUCIDA_USERNAME: ${{ secrets.BIOLUCIDA_USERNAME }}
+  BITLY_ACCESS_TOKEN: ${{ secrets.BITLY_ACCESS_TOKEN }}
+  BLACKFYNN_API_SECRET: ${{ secrets.BLACKFYNN_API_SECRET }}
+  BLACKFYNN_API_TOKEN: ${{ secrets.BLACKFYNN_API_TOKEN }}
+  BLACKFYNN_CONCEPTS_API_HOST: ${{ secrets.BLACKFYNN_CONCEPTS_API_HOST }}
+  CTF_API_HOST: ${{ secrets.CTF_API_HOST }}
+  CTF_CDA_ACCESS_TOKEN: ${{ secrets.CTF_CDA_ACCESS_TOKEN }}
+  CTF_SPACE_ID: ${{ secrets.CTF_SPACE_ID }}
+  DEPLOY_ENV: ${{ secrets.DEPLOY_ENV }}
+  DISABLE_REDIRECT_SSL: ${{ secrets.DISABLE_REDIRECT_SSL }}
+  FLATMAP_API_HOST: ${{ secrets.FLATMAP_API_HOST }}
+  LOGIN_API_URL: ${{ secrets.LOGIN_API_URL }}
+  NODE_ENV: ${{ secrets.NODE_ENV }}
+  NPM_CONFIG_PRODUCTION: ${{ secrets.NPM_CONFIG_PRODUCTION }}
+  OSPARC_HOST: ${{ secrets.OSPARC_HOST }}
+  PORTAL_API_HOST: ${{ secrets.PORTAL_API_HOST }}
+  RECAPTCHA_SECRET_KEY: ${{ secrets.RECAPTCHA_SECRET_KEY }}
+  RECAPTCHA_SITE_KEY: ${{ secrets.RECAPTCHA_SITE_KEY }}
+  ROOT_URL: ${{ secrets.ROOT_URL }}
+  SHOW_FUNDING_FACET: ${{ secrets.SHOW_FUNDING_FACET }}
+  SHOW_HIERARCHAL_FACETS: ${{ secrets.SHOW_HIERARCHAL_FACETS }}
+  SHOW_LOGIN_FEATURE: ${{ secrets.SHOW_LOGIN_FEATURE }}
+  SHOW_METRICS: ${{ secrets.SHOW_METRICS }}
+  SHOW_OSPARC_TAB: ${{ secrets.SHOW_OSPARC_TAB }}
+  SHOW_TIMESERIES_VIEWER: ${{ secrets.SHOW_TIMESERIES_VIEWER }}
+  SPARC_PORTAL_USER_ID: ${{ secrets.SPARC_PORTAL_USER_ID }}
+  SPARC_PORTAL_USER_SECRET: ${{ secrets.SPARC_PORTAL_USER_SECRET }}
+
+jobs:
+   e2e-testing:
+    runs-on: ubuntu-latest
+    steps:
+      - run: echo "event name is:" ${{ github.event_name }} 
+      - uses: actions-cool/check-user-permission@main
+        if: github.event_name == 'pull_request_target'
+        id: checkUser
+        with:
+          require: 'write'
+          username: ${{ github.event.pull_request.user.name }}
+      - name: Checkout
+        if: github.event_name == 'pull_request_target' && steps.checkUser.outputs.require-result == 'true'
+        uses: actions/checkout@v3
+        with:
+          ref: ${{ github.event.pull_request.head.sha }}
+      - name: Checkout
+        if: github.event_name == 'workflow_dispatch'
+        uses: actions/checkout@v3
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 14.17.6
+      - name: Run e2e tests
+        if: github.event_name == 'workflow_dispatch' || steps.checkUser.outputs.require-result == 'true'
+        uses: cypress-io/github-action@v6
+        with:
+          build: yarn build
+          start: yarn start
+          wait-on: ${{ secrets.ROOT_URL }}
+          command: yarn test-run-e2e
+      - name: Skip tests
+        if: github.event_name == 'pull_request_target' && steps.checkUser.outputs.require-result == 'false'
+        uses: actions/github-script@v3
+        with:
+          script: |
+              core.setFailed('Pull request is opened by an user without write permission, tests are skipped for security reason')
diff --git a/.gitignore b/.gitignore
index 0a43ecae..c2c5154b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -109,3 +109,6 @@ sw.*
 
 # Certifact files
 .certs/
+
+test/cypress/videos
+test/cypress/downloads
diff --git a/assets/3d-map.png b/assets/3d-map.png
new file mode 100644
index 00000000..80657ac6
Binary files /dev/null and b/assets/3d-map.png differ
diff --git a/assets/_layout.scss b/assets/_layout.scss
index 78041da8..3e7d8198 100644
--- a/assets/_layout.scss
+++ b/assets/_layout.scss
@@ -17,8 +17,4 @@
   border: 1px solid #dcdfe6;
   margin: 1em 0;
   padding: 1em;
-  @media (min-width: 48em) {
-    margin: 2.5em 0;
-   padding: 2em;
-}
 }
diff --git a/assets/_viewer.scss b/assets/_viewer.scss
index 08313759..55c13da8 100644
--- a/assets/_viewer.scss
+++ b/assets/_viewer.scss
@@ -4,6 +4,7 @@
   border-bottom: 1px solid #dbdfe6;
   flex-direction: column;
   font-size: 0.875em;
+  line-height: 1.5rem;
   display: flex;
   padding: 1rem 0.625rem;
   @media (min-width: 48em) {
diff --git a/assets/ac-map.png b/assets/ac-map.png
new file mode 100644
index 00000000..bf93767a
Binary files /dev/null and b/assets/ac-map.png differ
diff --git a/assets/fc-map.png b/assets/fc-map.png
new file mode 100644
index 00000000..bed5df88
Binary files /dev/null and b/assets/fc-map.png differ
diff --git a/assets/sparcLogoFast.gif b/assets/sparcLogoFast.gif
new file mode 100644
index 00000000..b64cc659
Binary files /dev/null and b/assets/sparcLogoFast.gif differ
diff --git a/components/AlternativeSearchResults/AlternativeSearchResultsNews.vue b/components/AlternativeSearchResults/AlternativeSearchResultsNews.vue
new file mode 100644
index 00000000..a1e5dcb4
--- /dev/null
+++ b/components/AlternativeSearchResults/AlternativeSearchResultsNews.vue
@@ -0,0 +1,123 @@
+<template>
+  <!-- Alternative search suggestions NNOTE that this is currently just copy and pasted from /data/index.vue -->
+  <div v-if="searchHasAltResults && this.$route.query.search" class="mt-24">
+    <br />
+    <template v-if="!searchHadResults">
+      No results were found for <strong><i>{{ this.$route.query.search }}</i></strong>.
+    </template>
+    The following results were discovered for the other categories:
+    <br />
+    <br />
+    <template v-for="dataType in dataTypes">
+      <dd v-if="resultCounts[dataType] > 0" :key="dataType">
+        <nuxt-link
+          :to="{
+            name: `news-and-events-${dataType}`,
+            query: {
+              ...$route.query
+            }
+          }"
+        >
+          {{ resultCounts[dataType] }} result{{
+            resultCounts[dataType] > 1 ? 's' : ''
+          }}
+        </nuxt-link>
+        - {{ humanReadableDataTypesLookup[dataType] }}
+      </dd>
+    </template>
+  </div>
+</template>
+
+<script>
+import {
+  fetchNews,
+  fetchEvents,
+  fetchCommunitySpotlightItems
+} from '@/pages/news-and-events/model.ts'
+
+import createClient from '@/plugins/contentful.js'
+
+const client = createClient()
+
+function getLastUrlSegment(path) {
+  return path
+    .split('/')
+    .filter(Boolean)
+    .pop()
+}
+
+export default {
+  name: 'AlternativeSearchResultsNews',
+  props: {
+    searchHadResults: {
+      type: Boolean,
+      default: true
+    }
+  },
+  data: function() {
+    return {
+      searchHasAltResults: false,
+      dataTypes: ['news', 'events', 'community-spotlight'],
+      humanReadableDataTypesLookup: {
+        news: 'News',
+        events: 'Events',
+        'community-spotlight': 'Community Spotlight'
+      },
+      functionLookup: {
+        news: fetchNews,
+        events: fetchEvents,
+        'community-spotlight': fetchCommunitySpotlightItems
+      },
+      resultCounts: {
+        news: 0,
+        events: 0,
+        'community-spotlight': 0
+      },
+      fetchNews: fetchNews,
+      fetchEvents: fetchEvents,
+      fetchCommunitySpotlightItems: fetchCommunitySpotlightItems
+    }
+  },
+  computed: {
+    dataTypeSeleced: function() {
+      return getLastUrlSegment(this.$route.path)
+    }
+  },
+  methods: {
+    retrieveAltTotals: function() {
+      this.searchHasAltResults = false
+      for (let key in this.resultCounts) {
+        // reset reults list
+        this.resultCounts[key] = 0
+      }
+      let altSearchTypes = this.dataTypes.filter(
+        e => e !== this.dataTypeSeleced
+      ) // Remove from list of data types
+
+      altSearchTypes.forEach(type => {
+        // Search on each data type remaining
+        this.retrieveAltTotal(type)
+      })
+    },
+    retrieveAltTotal: function(category) {
+      this.functionLookup[category]( // dynamically call the function
+        client,
+        this.$route.query.search,
+        undefined,
+        undefined,
+        undefined
+      )
+        .then(resp => {
+          this.resultCounts[category] = resp.total
+          resp.total > 0 ? (this.searchHasAltResults = true) : null
+        })
+        .catch(err => {
+          console.log('Error in alternative Search results call:', err)
+          this.resultCounts[category] = 0
+        })
+    }
+  }
+}
+</script>
+
+<style></style>
diff --git a/components/AlternativeSearchResults/AlternativeSearchResultsResources.vue b/components/AlternativeSearchResults/AlternativeSearchResultsResources.vue
new file mode 100644
index 00000000..fdc343e3
--- /dev/null
+++ b/components/AlternativeSearchResults/AlternativeSearchResultsResources.vue
@@ -0,0 +1,118 @@
+<template>
+  <!-- Alternative search suggestions NNOTE that this is currently just copy and pasted from /data/index.vue -->
+  <div v-if="searchHasAltResults && this.$route.query.search" class="mt-24">
+    <br />
+    <template v-if="!searchHadResults">
+      No results were found for <strong><i>{{ this.$route.query.search }}</i></strong>.
+    </template>
+    The following results were discovered for the other categories:
+    <br />
+    <br />
+    <template v-for="dataType in dataTypes">
+      <dd v-if="resultCounts[dataType] > 0" :key="dataType">
+        <nuxt-link
+          :to="{
+            name: `resources-${dataType}`,
+            query: {
+              ...$route.query
+            }
+          }"
+        >
+          {{ resultCounts[dataType] }} result{{
+            resultCounts[dataType] > 1 ? 's' : ''
+          }}
+        </nuxt-link>
+        - {{ humanReadableDataTypesLookup[dataType] }}
+      </dd>
+    </template>
+  </div>
+</template>
+
+<script>
+import { fetchResources } from '@/pages/resources/utils.ts'
+
+function getLastUrlSegment(path) {
+  return path
+    .split('/')
+    .filter(Boolean)
+    .pop()
+}
+
+export default {
+  name: 'AlternativeSearchResults',
+  props: {
+    searchHadResults: {
+      type: Boolean,
+      default: true
+    }
+  },
+  data: function() {
+    return {
+      searchHasAltResults: false,
+      dataTypes: [
+        'biological',
+        'databases',
+        'devices',
+        'information-services',
+        'software'
+      ],
+      humanReadableDataTypesLookup: {
+        biological: 'Biologicals',
+        databases: 'Data and Models',
+        devices: 'Devices',
+        'information-services': 'Information Services',
+        software: 'Software'
+      },
+      resultCounts: {
+        biological: 0,
+        databases: 0,
+        devices: 0,
+        'information-services': 0,
+        software: 0
+      }
+    }
+  },
+  computed: {
+    dataTypeSeleced: function() {
+      return getLastUrlSegment(this.$route.path)
+    }
+  },
+  methods: {
+    retrieveAltTotals: function() {
+      this.searchHasAltResults = false
+      for (let key in this.resultCounts) {
+        // reset reults list
+        this.resultCounts[key] = 0
+      }
+      let altSearchTypes = this.dataTypes.filter(
+        e => e !== this.dataTypeSeleced
+      ) // Remove from list of data types
+
+      altSearchTypes.forEach(type => {
+        // Search on each data type remaining
+        this.retrieveAltTotal(type)
+      })
+    },
+    retrieveAltTotal: function(category) {
+      fetchResources(
+        this.humanReadableDataTypesLookup[category], // needed as human readable is used for contentful
+        this.$route.query.search,
+        undefined,
+        undefined,
+        10,
+        0
+      )
+        .then(resp => {
+          this.resultCounts[category] = resp.total
+          resp.total > 0 ? (this.searchHasAltResults = true) : null
+        })
+        .catch(err => {
+          console.log('Error in alternative Search results call:', err)
+          this.resultCounts[category] = 0
+        })
+    }
+  }
+}
+</script>
+
+<style></style>
diff --git a/components/BfDownloadFile/BfDownloadFile.vue b/components/BfDownloadFile/BfDownloadFile.vue
index 9e0b5c08..35da6e68 100644
--- a/components/BfDownloadFile/BfDownloadFile.vue
+++ b/components/BfDownloadFile/BfDownloadFile.vue
@@ -65,6 +65,7 @@
 </template>
 
 <script>
+import { propOr } from 'ramda'
 import StorageMetrics from '@/mixins/bf-storage-metrics'
 
 const DEFAULT_ARCHIVE_NAME = 'sparc-portal-data'
@@ -189,6 +190,20 @@ export default {
       this.$nextTick(() => {
         this.$refs.zipForm.submit() // eslint-disable-line no-undef
       })
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'download_dataset_files',
+        files: propOr('', 'paths', payload),
+        file_name: "",
+        file_path: "",
+        file_type: "",
+        category: "",
+        dataset_id: this.dataset.id,
+        version_id: this.dataset.version,
+        doi: this.dataset.doi,
+        citation_type: "",
+        location: ""
+      })
       this.closeConfirmDownload()
     },
 
diff --git a/components/BiolucidaViewer/BiolucidaViewer.vue b/components/BiolucidaViewer/BiolucidaViewer.vue
index caf333e7..ea012dd8 100644
--- a/components/BiolucidaViewer/BiolucidaViewer.vue
+++ b/components/BiolucidaViewer/BiolucidaViewer.vue
@@ -2,9 +2,28 @@
   <div class="biolucida-viewer">
     <template v-if="data.status !== 'error'">
       <el-row class="mb-2 justify-space-between" type="flex">
-        <bf-button class="ml-8 btn-copy-permalink-solid" @click="launchViewer">
-          View in 3D
-        </bf-button>
+        <div>
+          <el-button class="ml-8" @click="launchViewer">
+            <sparc-tooltip
+              placement="bottom-center"
+              content="Open in Biolucida desktop application"
+            >
+              <div slot="item">
+                View in 3D
+              </div>
+            </sparc-tooltip>
+          </el-button>
+          <el-button class="ml-8" @click="launchNL360C">
+            <sparc-tooltip
+              placement="top-center"
+              content="Open in Neurolucida 360 Cloud"
+            >
+              <div slot="item">
+                View in Neurolucida 360
+              </div>
+            </sparc-tooltip>
+          </el-button>
+        </div>
         <client-only>
           <button class="btn-copy-permalink" @click="queryView">
             <sparc-tooltip placement="bottom-center" content="Copy Link">
@@ -19,6 +38,11 @@
         </client-only>
       </el-row>
       <iframe ref="biolucida" :src="data.share_link" @load="biolucidaLoaded" />
+      <biolucida-viewer-metadata
+        :biolucidaData="data"
+        :datasetInfo="datasetInfo"
+        :file="file"
+      />
     </template>
     <p v-else class="error">
       Sorry, an error has occurred
@@ -29,13 +53,14 @@
 <script>
 import { successMessage, failMessage } from '@/utils/notification-messages'
 
-import BfButton from '@/components/shared/BfButton/BfButton.vue'
+import BiolucidaViewerMetadata from '@/components/ViewersMetadata/BiolucidaViewerMetadata.vue'
+import biolucida from '~/services/biolucida'
 
 export default {
   name: 'BiolucidaViewer',
 
   components: {
-    BfButton
+    BiolucidaViewerMetadata,
   },
 
   props: {
@@ -47,11 +72,21 @@ export default {
           blv_link: '',
           share_link: '',
           status: '',
-          location: ''
+          location: '',
+          web_neurolucida_link: ''
         }
       }
-    }
+    },
+    file: {
+      type: Object,
+      default: () => {}
+    },
+    datasetInfo: {
+      type: Object,
+      default: () => {}
+    },
   },
+
   mounted() {
     window.addEventListener('message', this.receiveMessage)
   },
@@ -62,6 +97,32 @@ export default {
     launchViewer() {
       window.open(this.data.blv_link, '_blank')
     },
+    launchNL360C() {
+      biolucida
+        .fetchNeurolucida360Url({
+          applicationRequest: 'NL360',
+          userID: 'SPARCPortal',
+          sessionContext: this.data.web_neurolucida_link
+        })
+        .then(response => {
+          if (response.data.url) {
+            window.open(response.data.url, '_blank')
+          } else {
+            this.$message(
+              failMessage(
+                'Unable to open image with Neurlucida 360 Cloud at this time.'
+              )
+            )
+          }
+        })
+        .catch(() => {
+          this.$message(
+            failMessage(
+              'Unable to open image with Neurlucida 360 Cloud at this time.'
+            )
+          )
+        })
+    },
     queryView() {
       this.$refs.biolucida.contentWindow.postMessage(
         'getImgPos',
diff --git a/components/Breadcrumb/Breadcrumb.vue b/components/Breadcrumb/Breadcrumb.vue
index 3aaf00e4..4738ca88 100644
--- a/components/Breadcrumb/Breadcrumb.vue
+++ b/components/Breadcrumb/Breadcrumb.vue
@@ -7,7 +7,7 @@
         </nuxt-link>
         >
       </template>
-      {{ title }}
+      <span class="title" v-html="parseMarkdown(title)"/>
     </div>
   </div>
 </template>
@@ -16,10 +16,13 @@
 import Vue from 'vue'
 
 import { Methods, Props } from './model'
+import marked from '@/mixins/marked/index'
 
 export default Vue.extend<never, Methods, never, Props>({
   name: 'Breadcrumb',
 
+  mixins: [marked],
+
   props: {
     breadcrumb: {
       type: Array,
@@ -29,11 +32,11 @@ export default Vue.extend<never, Methods, never, Props>({
       type: String,
       default: ''
     }
-  },
+  }
 })
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 @import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
 
 .breadcrumb {
@@ -43,5 +46,16 @@ export default Vue.extend<never, Methods, never, Props>({
     text-decoration: none;
     color: $darkBlue;
   }
+  & sup {
+    vertical-align: baseline;
+    position: relative;
+    top: -0.4em;
+  }
+}
+::v-deep .title {
+  display: inline-block;
+  p {
+    margin: 0;
+  }
 }
 </style>
diff --git a/components/CallToAction/CallToAction.vue b/components/CallToAction/CallToAction.vue
new file mode 100644
index 00000000..e742dea5
--- /dev/null
+++ b/components/CallToAction/CallToAction.vue
@@ -0,0 +1,29 @@
+<template>
+  <div>
+    <div v-html="parseMarkdown(data.description)" />
+    <a v-if="data.title" :href="data.url" @click="data.url == null && $emit('click')">
+      <el-button class="call-to-action-btn">{{ data.title }}</el-button>
+    </a>
+  </div>
+</template>
+
+<script>
+import MarkedMixin from '@/mixins/marked'
+
+export default {
+  name: 'CallToAction',
+  mixins: [MarkedMixin],
+
+  props: {
+    data: {
+      type: Object
+    }
+  }
+}
+</script>
+<style scoped>
+.call-to-action-btn {
+  font-size: 24px;
+  padding: 1.2rem 1.8rem;
+}
+</style>
diff --git a/components/Charts/BarChart.vue b/components/Charts/BarChart.vue
new file mode 100644
index 00000000..547cce78
--- /dev/null
+++ b/components/Charts/BarChart.vue
@@ -0,0 +1,25 @@
+<script>
+import { Bar, mixins } from 'vue-chartjs'
+import ChartDataLabels from 'chartjs-plugin-datalabels';
+const { reactiveProp } = mixins;
+
+export default {
+  extends: Bar,
+  mixins: [reactiveProp],
+  name: 'BarChart',
+  props: {
+    chartData: {
+      type: Object,
+      default: () => {}
+    },
+    chartOptions: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  mounted() {
+    this.addPlugin(ChartDataLabels)
+    this.renderChart(this.chartData, this.chartOptions)
+  }
+}
+</script>
diff --git a/components/CitationDetails/CitationDetails.vue b/components/CitationDetails/CitationDetails.vue
index b8eb960c..679a114d 100644
--- a/components/CitationDetails/CitationDetails.vue
+++ b/components/CitationDetails/CitationDetails.vue
@@ -10,7 +10,7 @@
       option of different formats, under the Cite tab of each dataset page. For
       more Information, please see our
       <a
-        href="https://sparc.science/help/1lmX4FWezRPTCOfGsBATnt"
+        href="https://docs.sparc.science/docs/instructions-for-sparc-investigators-to-cite-their-datasets-in-manuscripts-1"
         target="_blank"
       >
         Help page
@@ -134,6 +134,20 @@ export default {
      */
     handleCitationCopy: function(citationType) {
       this.$copyText(citationType.citationText).then(() => {
+        this.$gtm.push({
+          event: 'interaction_event',
+          event_name: 'copy_citation_button_click',
+          dataset_id: this.$route.params.datasetId,
+          citation_type: citationType.label,
+          category: "",
+          version_id: "",
+          doi: "",
+          location: "",
+          files: "",
+          file_name: "",
+          file_path: "",
+          file_type: "",     
+        })
         this.$message(
           successMessage(
             `${citationType.label} citation copied to clipboard.`
diff --git a/components/CommunitySpotlight/CommunitySpotlightItem.vue b/components/CommunitySpotlight/CommunitySpotlightItem.vue
index d311cb1a..76336d83 100644
--- a/components/CommunitySpotlight/CommunitySpotlightItem.vue
+++ b/components/CommunitySpotlight/CommunitySpotlightItem.vue
@@ -1,36 +1,31 @@
 <template>
   <div class="story-result">
-    <div>
-      <div class="banner-wrapper">
-        <client-only
+    <div class="banner-wrapper">
+        <iframe
           v-if="story.fields.youtubeUrl"
           placeholder="Loading video ..."
-        >
-          <iframe
-            class="banner-asset"
-            :src="embeddedVideoSrc"
-            allowfullscreen
-            allowtransparency
-            allow="autoplay"
-            frameBorder="0"
-          />
-        </client-only>
-        <img
-          v-else-if="story.fields.files && story.fields.files[0].fields.file.contentType.includes('image')"
           class="banner-asset"
-          :src="story.fields.files[0].fields.file.url"
-          :alt="story.fields.files[0].description"
+          :src="embeddedVideoSrc"
+          allowfullscreen
+          allowtransparency
+          allow="autoplay"
+          frameBorder="0"
         />
-        <video
-          v-else-if="story.fields.files && story.fields.files[0].fields.file.contentType.includes('video')"
-          class="banner-asset"
-          controls=""
-          autoplay="false"
-          name="media"
-        >
-          <source :src="story.fields.files[0].fields.file.url" :type="story.fields.files[0].fields.file.contentType">
-        </video>
-      </div>
+      <img
+        v-else-if="story.fields.files && story.fields.files[0].fields.file.contentType.includes('image')"
+        class="banner-asset"
+        :src="story.fields.files[0].fields.file.url"
+        :alt="story.fields.files[0].description"
+      />
+      <video
+        v-else-if="story.fields.files && story.fields.files[0].fields.file.contentType.includes('video')"
+        class="banner-asset"
+        controls=""
+        autoplay="false"
+        name="media"
+      >
+        <source :src="story.fields.files[0].fields.file.url" :type="story.fields.files[0].fields.file.contentType">
+      </video>
     </div>
     <div class="story-text">
       <div class="link1 mb-8">
@@ -60,7 +55,7 @@
         </tr>
         <tr>
           <td class="property-name-column">
-            Anatomical Structure(s)
+            Focus
           </td>
           <td>
             {{ anatomicalStructureText }}
@@ -100,24 +95,20 @@ export default {
 
 .banner-wrapper {
   position: relative;
-  padding-bottom: 56.25%; /* 16:9 */
-  height: 0;
   width: 12rem;
+  height: auto;
 }
 
 .banner-wrapper .banner-asset {
-  position: absolute;
-  top: 0;
-  left: 0;
   width: 100%;
   height: auto;
+  object-fit: contain;
 }
 
 .story-result {
   display: flex;
   flex-wrap: wrap;
-  gap: 2rem;
-  min-height: 10.875rem;
+  gap: 1rem;
   width: 100%;
 }
 
@@ -141,7 +132,6 @@ export default {
   }
   border: none;
   padding: 0;
-  padding-bottom: 1rem;
 }
 // The outermost bottom border of the table. Element UI adds psuedo elements to create the bottom table border that we must hide to remove
 table:not([class^='el-table__'])::before {
diff --git a/components/CommunitySpotlight/CommunitySpotlightListings.vue b/components/CommunitySpotlight/CommunitySpotlightListings.vue
index 684ffeb7..7028188e 100644
--- a/components/CommunitySpotlight/CommunitySpotlightListings.vue
+++ b/components/CommunitySpotlight/CommunitySpotlightListings.vue
@@ -16,7 +16,7 @@
         name: linkLocation
       }"
     >
-      {{ linkText }} &gt;
+      {{ linkText }}
     </nuxt-link>
   </div>
 </template>
@@ -63,7 +63,7 @@ export default {
     // The community spotlight item component needs to use the properties off the actual success stories/fireside chats
     getLinkedItem(communitySpotlightItem) {
       const linkedItem = pathOr('', ['fields','linkedItem'], communitySpotlightItem)
-      const anatomicalStructure = pathOr('', ['fields','anatomicalStructure'], communitySpotlightItem)
+      const anatomicalStructures = pathOr('', ['fields','anatomicalStructure'], communitySpotlightItem)
       const spotlightTypeId = pathOr('', ['fields','itemType'], communitySpotlightItem)
       const spotlightType = SPOTLIGHT_TYPE_MAPPING.find(item => {
         return item.id == spotlightTypeId
@@ -71,7 +71,7 @@ export default {
       return {
         ...linkedItem,
         spotlightType,
-        anatomicalStructure
+        anatomicalStructures
       }
     }
   }
@@ -91,15 +91,11 @@ export default {
 .btn-load-more {
   background: none;
   border: none;
-  color: $darkBlue;
+  color: $purple;
   cursor: pointer;
   display: block;
-  font-size: 1rem;
-  font-weight: 700;
   padding: 0;
-  &:hover,
-  &:active {
-    text-decoration: underline;
-  }
+  font-weight: 500;
+  text-decoration: underline;
 }
 </style>
diff --git a/components/CommunitySpotlightForm/CommunitySpotlightForm.vue b/components/CommunitySpotlightForm/CommunitySpotlightForm.vue
deleted file mode 100644
index 29dba10a..00000000
--- a/components/CommunitySpotlightForm/CommunitySpotlightForm.vue
+++ /dev/null
@@ -1,203 +0,0 @@
-<template>
-  <el-form
-    ref="submitForm"
-    label-position="top"
-    :model="form"
-    :rules="formRules"
-    :hide-required-asterisk="true"
-  >
-    <el-form-item prop="name" label="Your name">
-      <el-input v-model="form.name" placeholder="Enter your name" />
-    </el-form-item>
-
-    <el-form-item prop="email" label="Email address">
-      <el-input v-model="form.email" placeholder="Enter your email address" type="email" />
-    </el-form-item>
-
-    <hr/>
-
-    <el-form-item prop="title" label="Title">
-      <el-input v-model="form.title" placeholder="Enter a title for your success story / fireside chat" />
-    </el-form-item>
-
-    <el-form-item prop="summary" label="Summary">
-      <el-input
-        v-model="form.summary"
-        type="textarea"
-        :rows="3"
-        placeholder="Tell us some details about your success story / fireside chat"
-      />
-    </el-form-item>
-
-    <hr/>
-
-    <el-form-item prop="fileAttachment" label="File Upload">
-      <div class="body4 mb-8"><i>To help other users understand your research, an image or video can really help. We recommend images of 1200px by 675px and videos at 16:9.</i></div>
-      <el-upload
-        ref="fileUploader"
-        action=""
-        :limit="limit"
-        :auto-upload="false"
-        :on-remove="onRemove"
-        :on-change="onUploadChange"
-        :before-remove="beforeRemove" >
-        <el-button slot="trigger" class="secondary">Select file</el-button>
-        <div slot="tip" class="el-upload__tip">jpeg/png/mp4 file with a size less than 5MB</div>
-      </el-upload>
-    </el-form-item>
-
-    <el-form-item prop="url" label="Supporting Information">
-      <el-input placeholder="Enter URL" v-model="form.url">
-        <template slot="prepend">Http://</template>
-      </el-input>
-    </el-form-item>
-
-    <hr/>
-
-    <div class="body4 mb-16"><i>Before your story is published on the SPARC Portal, it will be reviewed. The reviewer may contact you to clarify or seek additional information.</i></div>
-
-    <el-form-item class="submit-button">
-      <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
-        Submit
-      </el-button>
-      <p v-if="hasError" class="error">
-        An error has occurred, please try again.
-      </p>
-    </el-form-item>
-  </el-form>
-</template>
-
-<script>
-
-import FileUploadMixin from '@/mixins/file-upload/index'
-import { propOr } from 'ramda'
-
-export default {
-  name: 'CommunitySpotlightForm',
-
-  mixins: [FileUploadMixin],
-
-  data() {
-    return {
-      allowVideos: true,
-      hasError: false,
-      form: {
-        name: '',
-        email: '',
-        title: '',
-        summary: '',
-        url: '',
-      },
-      isSubmitting: false,
-      formRules: {
-        email: [
-          {
-            required: true,
-            message: 'Please enter your email',
-            type: 'email',
-            trigger: 'blur'
-          }
-        ],
-        name: [
-          {
-            required: true,
-            message: 'Please enter your name',
-            trigger: 'blur',
-          }
-        ],
-        title: [
-          {
-            required: true,
-            message: 'Please enter a title',
-            trigger: 'blur',
-          }
-        ],
-        summary: [
-          {
-            required: true,
-            message: 'Please enter a summary',
-            trigger: 'change'
-          }
-        ]
-      }
-    }
-  },
-
-  mounted() {
-    // Reset form fields when showing the form
-    this.$refs.submitForm.resetFields()
-    this.hasError = false
-  },
-
-  methods: {
-    /**
-     * Submit the form and validate
-     */
-    onSubmit() {
-      this.hasError = false
-
-      this.$refs.submitForm.validate(valid => {
-        if (!valid) {
-          return
-        }
-        this.sendForm()
-      })
-    },
-
-    /**
-     * Send form to endpoint
-     */
-    sendForm() {
-      this.isSubmitting = true
-      const fileName = propOr('', 'name', this.file)
-      const description = `
-        <b>Contact Information</b><br><br>
-        <b>Name:</b><br>${this.form.name}<br><br>
-        <b>E-mail:</b><br>${this.form.email}<br><br>
-        <b>Community Spotlight Details:</b><br><br>
-        <b>Title:</b><br>${this.form.title}<br><br>
-        <b>Summary:</b><br>${this.form.summary}<br><br>
-        ${fileName != '' ? `<b>File Attachment:</b><br>${fileName}<br><br>` : ''}
-        <b>Supporting Information URL:</b><br>${this.form.url == '' ? 'N/A' : this.form.url}
-      `
-
-      let formData = new FormData()
-      formData.append("type", "communitySpotlight")
-      formData.append("title", `Spotlight Submission - ${this.form.title}`)
-      formData.append("description", description)
-      formData.append("userEmail", this.form.email)
-      if (propOr('', 'name', this.file) != '') {
-        formData.append("attachment", this.file, this.file.name)
-      }  
-      this.$axios
-        .post(`${process.env.portal_api}/tasks`, formData)
-        .then(() => {
-          this.$emit('submit', this.form.name)
-        })
-        .catch(() => {
-          this.hasError = true
-        })
-        .finally(() => {
-          this.isSubmitting = false
-        })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
-.submit-button {
-  text-align: right;
-  margin-bottom: 0 !important;
-}
-hr {
-  border-top: none;
-  border-width: 2px;
-  border-color: $lineColor1;
-  margin: 2.5rem 0;
-}
-.error {
-  color: $danger;
-}
-</style>
diff --git a/components/ConfirmationModal/ConfirmationModal.vue b/components/ConfirmationModal/ConfirmationModal.vue
new file mode 100644
index 00000000..2654fc6c
--- /dev/null
+++ b/components/ConfirmationModal/ConfirmationModal.vue
@@ -0,0 +1,73 @@
+<template>
+  <large-modal
+    v-if="modalVisible"
+    :visible="modalVisible"
+    @close-download-dialog="modalVisible = false"
+  >
+    <div slot="mainContent">
+      <h2>Confirmation required</h2>
+      <slot name="confirmation-body"/>
+      <div class="buttons-container">
+        <span><el-button class="secondary" @click="confirmationCancelled">Cancel</el-button></span>
+        <span><el-button class="danger" @click="confirmationAccepted">Remove</el-button></span>
+      </div>
+    </div>
+  </large-modal>
+</template>
+
+<script>
+export default {
+  name: 'ConfirmationModal',
+
+  data: function() {
+    return {
+      modalVisible: false,
+      form: {
+        detailedDescription: '',
+        shortDescription: '',
+      },
+      isSubmitting: false,
+    }
+  },
+  props: {
+    showModal: {
+      type: Boolean,
+      default: false
+    }
+  },
+  watch: {
+    showModal: {
+      handler: function(show) {
+        if (show) {
+          this.modalVisible = true
+        } else {
+          this.modalVisible = false
+        }
+      }
+    },
+    modalVisible: {
+      handler: function(show) {
+        if (!show) {
+          this.$emit('modal-closed')
+        }
+      }
+    },
+  },
+  methods: {
+    confirmationAccepted() {
+      this.$emit('confirmed', true)
+    },
+    confirmationCancelled() {
+      this.$emit('cancelled', true)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+.buttons-container {
+  text-align: right;
+}
+</style>
diff --git a/components/ContactUsForms/BugForm/BugForm.vue b/components/ContactUsForms/BugForm/BugForm.vue
index f24d9044..01938966 100644
--- a/components/ContactUsForms/BugForm/BugForm.vue
+++ b/components/ContactUsForms/BugForm/BugForm.vue
@@ -1,74 +1,38 @@
 <template>
   <el-form
-    ref="contactForm"
+    ref="submitForm"
     label-position="top"
     :model="form"
     :rules="formRules"
     :hide-required-asterisk="true"
   >
-    <el-form-item
-      prop="typeOfUser"
-      label="What type of user are you? *"
-    >
-      <el-select
-        v-model="form.typeOfUser"
-        placeholder="Select one"
-        :popper-append-to-body="false"
-      >
-        <el-option
-          v-for="typeOfUserOption in questionOptions.typeOfUser"
-          :key="typeOfUserOption"
-          :label="typeOfUserOption"
-          :value="typeOfUserOption"
-        />
-      </el-select>
-    </el-form-item>
-
-    <el-form-item
-      prop="pageOrResource"
-      label="Is this about a specific page or resource?"
-    >
-      <el-select
-        v-model="form.pageOrResource"
-        placeholder="Select one"
-        :popper-append-to-body="false"
-      >
-        <el-option
-          v-for="pageOrResource in questionOptions.pageOrResource"
-          :key="pageOrResource"
-          :label="pageOrResource"
-          :value="pageOrResource"
-        />
-      </el-select>
-    </el-form-item>
-
-    <el-form-item prop="pageUrl" label="Provide the problematic page's URL">
+    <el-form-item prop="pageUrl" label="Please provide the specific page URL">
       <el-input v-model="form.pageUrl" placeholder="URL">
         <template slot="prepend">Http://</template>
       </el-input>
     </el-form-item>
 
     <el-form-item
-      prop="title"
+      prop="shortDescription"
       label="Provide a short description of what you were doing *"
     >
       <el-input
-        v-model="form.title"
+        v-model="form.shortDescription"
         placeholder="(Example: When I click <this button>, <this happens>.)"
       />
     </el-form-item>
 
-    <el-form-item prop="description" label="Provide a detailed description *">
+    <el-form-item prop="detailedDescription" label="Provide a detailed description *">
       <el-input
-        v-model="form.description"
+        v-model="form.detailedDescription"
         type="textarea"
         :rows="3"
         placeholder="Please provide specific steps so our team can reproduce your experience in order to resolve the issue."
       />
     </el-form-item>
-
-    <el-form-item prop="fileAttachment" label="File Attachment">
-      <div class="body4 mb-8"><i>Feel free to attach a screenshot to help us better understand the problem. We recommend images of 600px by 600px.</i></div>
+    
+    <el-form-item class="file-upload" prop="fileAttachment" label="File Upload">
+      <div class="body4 mb-8"><i>To help others understand your issue an image can really help.</i></div>
       <el-upload
         ref="fileUploader"
         action=""
@@ -78,46 +42,22 @@
         :on-remove="onRemove"
         :before-remove="beforeRemove" >
         <el-button slot="trigger" class="secondary">Select file</el-button>
-        <div slot="tip" class="el-upload__tip">jpg/png file with a size less than 5MB</div>
+        <span slot="tip" class="el-upload__tip ml-16">jpg/png file with a size less than 5MB</span>
       </el-upload>
     </el-form-item>
 
-    <el-form-item
-      prop="howToImprove"
-      label="How would you like this experience to improve? *"
-      class="mb-0"
-    >
-      <el-input
-        v-model="form.howToImprove"
-        type="textarea"
-        :rows="3"
-        placeholder="Description here"
-      />
-    </el-form-item>
-
-    <el-form-item prop="firstName" label="First Name" class="mt-16">
-      <el-input v-model="form.firstName" placeholder="First name here" />
-    </el-form-item>
+    <hr/>
 
-    <el-form-item prop="lastName" label="Last Name">
-      <el-input v-model="form.lastName" placeholder="Last name here" />
-    </el-form-item>
+    <user-contact-form-item showFollowUpOption v-model="form.user"/>
 
-    <el-form-item prop="email" label="Email" class="mb-0">
-      <el-input v-model="form.email" placeholder="Email here" type="email" />
-    </el-form-item>
+    <hr/>
 
-    <el-form-item prop="shouldFollowUp" class="mt-16 mb-0">
-      <el-checkbox v-model="form.shouldFollowUp">
-        <span class="body1">Let me know when you resolve this issue</span>
-      </el-checkbox>
-    </el-form-item>
+    <div class="heading2">
+      Please check the box to proceed
+    </div>
+    <recaptcha class="recaptcha my-16 pl-16"/>
 
-    <el-form-item prop="shouldSubscribe">
-      <el-checkbox v-model="form.shouldSubscribe">
-        <span class="body1">Subscribe to the SPARC Newsletter</span>
-      </el-checkbox>
-    </el-form-item>
+    <hr/>
 
     <el-form-item>
       <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
@@ -131,81 +71,74 @@
 </template>
 
 <script>
-import { typeOfUser, pageOrResource } from '../questions'
 import NewsletterMixin from '../NewsletterMixin'
 import FileUploadMixin from '@/mixins/file-upload/index'
+import RecaptchaMixin from '@/mixins/recaptcha/index'
+import UserContactFormItem from '../UserContactFormItem.vue'
 import { propOr } from 'ramda'
+import { mapGetters } from 'vuex'
+import { loadForm, populateFormWithUserData, saveForm } from '~/pages/data/utils'
 
 export default {
   name: 'BugForm',
 
-  mixins: [NewsletterMixin, FileUploadMixin],
+  mixins: [NewsletterMixin, FileUploadMixin, RecaptchaMixin],
+
+  components: {
+    UserContactFormItem
+  },
 
   data() {
     return {
       form: {
-        typeOfUser: '',
-        pageOrResource: '',
-        title: '',
-        description: '',
-        howToImprove: '',
-        shouldFollowUp: false,
-        firstName: '',
-        lastName: '',
-        email: '',
-        shouldSubscribe: false,
-        pageUrl: ''
-      },
-      questionOptions: {
-        typeOfUser,
-        pageOrResource
+        pageUrl: '',
+        shortDescription: '',
+        detailedDescription: '',
+        user: {
+          typeOfUser: '',
+          firstName: this.firstName,
+          lastName: this.lastName,
+          email: this.profileEmail,
+          sendCopy: true,
+          shouldFollowUp: true,
+          shouldSubscribe: false,
+        }
       },
       isSubmitting: false,
       formRules: {
-        typeOfUser: [
-          {
-            required: true,
-            message: 'Please select one',
-            trigger: 'change'
-          }
-        ],
-
-        email: [
-          {
-            message: 'Please enter your email',
-            type: 'email',
-            trigger: 'blur',
-            validator: this.validateEmail
-          }
-        ],
-
-        firstName: [
-          {
-            required: false,
-            message: 'Please enter your first name',
-            trigger: 'blur',
-            validator: this.validateForNewsletter
-          }
-        ],
-
-        lastName: [
-          {
-            required: false,
-            message: 'Please enter your last name',
-            trigger: 'blur',
-            validator: this.validateForNewsletter
-          }
-        ],
-
-        title: [
-          {
-            required: true,
-            message: 'Please enter a description',
-            trigger: 'change'
-          }
-        ],
-
-        description: [
+        user: {
+            typeOfUser: [
+            {
+              required: true,
+              message: 'Please select one',
+              trigger: 'change'
+            }
+          ],
+          email: [
+            {
+              required: true,
+              message: 'Please enter your email',
+              type: 'email',
+              trigger: 'blur',
+            }
+          ],
+          firstName: [
+            {
+              required: true,
+              message: 'Please enter your first name',
+              trigger: 'blur',
+            }
+          ],
+          lastName: [
+            {
+              required: true,
+              message: 'Please enter your last name',
+              trigger: 'blur',
+            }
+          ]
+        },
+
+        shortDescription: [
           {
             required: true,
             message: 'Please enter a description',
@@ -213,64 +146,45 @@ export default {
           }
         ],
 
-        howToImprove: [
+        detailedDescription: [
           {
             required: true,
             message: 'Please enter a description',
             trigger: 'change'
           }
         ],
-
-        pageUrl: [
-          {
-            required: true,
-            message: "Please enter the problematic page's URL",
-            trigger: 'change',
-            validator: this.validateUrl
-          }
-        ]
       }
     }
   },
 
   computed: {
+    ...mapGetters('user', ['firstName', 'lastName', 'profileEmail']),
     bugSourceUrl() {
       return this.$route.query.source_url
-    }
+    },
   },
 
   mounted() {
     // Reset form fields when showing the form
-    this.$refs.contactForm.resetFields()
+    this.$refs.submitForm.resetFields()
     this.hasError = false
 
     if (this.bugSourceUrl != undefined) {
       const fullUrl = process.env.ROOT_URL + this.bugSourceUrl
-      this.form.pageUrl = 'www.' + fullUrl.replace(/^https?:\/\//, '')
+      this.form.pageUrl = fullUrl.replace(/^https?:\/\//, '')
     }
-  },
-
-  methods: {
-    /**
-     * Submit the form and validate
-     */
-    onSubmit() {
-      this.hasError = false
-      this.$refs.contactForm.validate(valid => {
-        if (!valid) {
-          return
-        }
-        this.sendForm()
-      })
-    },
 
-    validateEmail: function(rule, value, callback) {
-      if (this.form.shouldFollowUp && value === '') {
-        callback(new Error(rule.message))
+    const form = loadForm()
+    if (form) {
+      this.form = {
+        ...this.form,
+        ...form
       }
-      callback()
-    },
+    }
+    populateFormWithUserData(this.form, this.firstName, this.lastName, this.profileEmail)
+  },
 
+  methods: {
     validateUrl: function(rule, value, callback) {
       if (!value.includes('.') || value.lastIndexOf('.') == value.length - 1 || value.indexOf('.') == 0) {
         callback(new Error(rule.message))
@@ -281,34 +195,38 @@ export default {
     /**
      * Send form to endpoint
      */
-    sendForm() {
+    async sendForm() {
       this.isSubmitting = true
       const fileName = propOr('', 'name', this.file)
       const description = `
-        <b>What type of user are you?</b><br>${this.form.typeOfUser}<br><br>
-        <b>Is this about a specific page or resource?</b><br>${this.form.pageOrResource}${this.form.pageUrl ? ' - ' + this.form.pageUrl : ''}<br><br>
-        <b>Description</b><br>${this.form.description}<br><br>
+        <b>Problematic page URL:</b><br>${this.form.pageUrl ? this.form.pageUrl : 'N/A'}<br><br>
+        <b>Short description:</b><br>${this.form.shortDescription}<br><br>
+        <b>Detailed Description</b><br>${this.form.detailedDescription}<br><br>
         ${fileName != '' ? `<b>File Attachment:</b><br>${fileName}<br><br>` : ''}
-        <b>How would you like this experience to improve?</b><br>${this.form.howToImprove}<br><br>
-        <b>Let me know when you resolve this issue</b><br>${this.form.shouldFollowUp ? 'Yes' : 'No'}<br><br>
-        <b>Email</b><br>${this.form.email}
+        <b>What type of user are you?</b><br>${this.form.user.typeOfUser}<br><br>
+        <b>I'd like updates about this submission:</b><br>${this.form.user.shouldFollowUp ? 'Yes' : 'No'}<br><br>
+        <b>Name:</b><br>${this.form.user.firstName} ${this.form.user.lastName}<br><br>
+        <b>Email:</b><br>${this.form.user.email}
       `
       let formData = new FormData();
       formData.append("type", "bug")
-      formData.append("title", this.form.title)
+      formData.append("sendCopy", this.form.user.sendCopy)
+      formData.append("title", `SPARC Bug Submission: ${this.form.shortDescription}`)
       formData.append("description", description)
-      formData.append("userEmail", this.form.email)
+      formData.append("userEmail", this.form.user.email)
       if (propOr('', 'name', this.file) != ''){
         formData.append("attachment", this.file, this.file.name)
       }
+      // Save form to sessionStorage
+      saveForm(this.form)
 
-      this.$axios
+      await this.$axios
         .post(`${process.env.portal_api}/tasks`, formData)
         .then(() => {
-          if (this.form.shouldSubscribe) {
-            this.subscribeToNewsletter(this.form.email, this.form.firstName, this.form.lastName)
+          if (this.form.user.shouldSubscribe) {
+            this.subscribeToNewsletter(this.form.user.email, this.form.user.firstName, this.form.user.lastName)
           } else {
-            this.$emit('submit')
+            this.$emit('submit', this.form.user.firstName)
           }
         })
         .catch(() => {
@@ -318,14 +236,46 @@ export default {
           this.isSubmitting = false
         })
     }
+  },
+
+  watch: {
+    firstName() {
+      this.form.user.firstName = this.firstName
+    },
+    lastName() {
+      this.form.user.lastName = this.lastName
+    },
+    profileEmail() {
+      this.form.user.email = this.profileEmail
+    }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-@import '../../../assets/_variables.scss';
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
 
+.submit-button {
+  text-align: left;
+  margin-bottom: 0 !important;
+}
+hr {
+  border-top: none;
+  border-left: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+  margin: 2rem 0;
+}
 .error {
-  color: $facial;
+  color: $danger;
+}
+.recaptcha {
+  display: flex;
+  justify-content: left;
+}
+::v-deep .file-upload {
+  .el-form-item__label {
+    margin-bottom: .3rem;
+  }
 }
 </style>
diff --git a/components/ContactUsForms/CommunitySpotlightForm/CommunitySpotlightForm.vue b/components/ContactUsForms/CommunitySpotlightForm/CommunitySpotlightForm.vue
new file mode 100644
index 00000000..4dbe49cd
--- /dev/null
+++ b/components/ContactUsForms/CommunitySpotlightForm/CommunitySpotlightForm.vue
@@ -0,0 +1,271 @@
+<template>
+  <el-form
+    ref="submitForm"
+    label-position="top"
+    :model="form"
+    :rules="formRules"
+    :hide-required-asterisk="true"
+  >
+    <el-form-item prop="title" label="Title *">
+      <el-input v-model="form.title" placeholder="Enter a title for your story" />
+    </el-form-item>
+
+    <el-form-item prop="summary" label="Summary *">
+      <el-input
+        v-model="form.summary"
+        type="textarea"
+        :rows="3"
+        placeholder="Tell us some details about your story"
+      />
+    </el-form-item>
+
+    <hr/>
+
+    <el-form-item class="file-upload" prop="fileAttachment" label="Image Upload">
+      <div class="body4 mb-8"><i>To help others understand your story, an image can really help. We recommend images of 600px by 600px.</i></div>
+      <el-upload
+        ref="fileUploader"
+        action=""
+        :limit="limit"
+        :auto-upload="false"
+        :on-change="onUploadChange"
+        :on-remove="onRemove"
+        :before-remove="beforeRemove" >
+        <el-button slot="trigger" class="secondary">Select file</el-button>
+        <span slot="tip" class="el-upload__tip ml-16">jpg/png file with a size less than 5MB</span>
+      </el-upload>
+    </el-form-item>
+
+    <el-form-item prop="supportingLinks" label="Supporting Information">
+      <url-list v-model="form.supportingLinks" @add-link="addSupportingLink" placeholder="Enter URL">
+        <template slot="prepend">Http://</template>
+      </url-list>
+    </el-form-item>
+
+    <hr/>
+
+    <user-contact-form-item v-model="form.user"/>
+
+    <hr/>
+
+    <div class="heading2">
+      Please check the box to proceed
+    </div>
+    <recaptcha class="recaptcha my-16 pl-16"/>
+
+    <hr/>
+
+    <div class="body4 mb-16"><i>Before your story is published on the SPARC Portal, it will be reviewed. The reviewer may contact you to clarify or seek additional information.</i></div>
+
+    <el-form-item class="submit-button">
+      <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
+        Submit
+      </el-button>
+      <p v-if="hasError" class="error">
+        An error has occurred, please try again.
+      </p>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+import FileUploadMixin from '@/mixins/file-upload/index'
+import RecaptchaMixin from '@/mixins/recaptcha/index'
+import NewsletterMixin from '@/components/ContactUsForms/NewsletterMixin'
+import UserContactFormItem from '../UserContactFormItem.vue'
+import UrlList from '@/components/Url/UrlList.vue'
+import { propOr, isEmpty } from 'ramda'
+import { mapGetters } from 'vuex'
+import { loadForm, populateFormWithUserData, saveForm } from '~/pages/data/utils'
+
+export default {
+  name: 'CommunitySpotlightForm',
+
+  mixins: [FileUploadMixin, RecaptchaMixin, NewsletterMixin],
+
+  components: {
+    UrlList,
+    UserContactFormItem
+  },
+
+  data() {
+    return {
+      allowVideos: true,
+      hasError: false,
+      form: {
+        title: '',
+        summary: '',
+        supportingLinks: [''],
+        user: {
+          typeOfUser: '',
+          firstName: this.firstName,
+          lastName: this.lastName,
+          email: this.profileEmail,
+          sendCopy: true,
+          shouldFollowUp: true,
+          shouldSubscribe: false,
+        }
+      },
+      isSubmitting: false,
+      formRules: {
+        user: {
+          email: [
+            {
+              required: true,
+              message: 'Please enter your email',
+              type: 'email',
+              trigger: 'blur',
+            }
+          ],
+          firstName: [
+            {
+              required: true,
+              message: 'Please enter your first name',
+              trigger: 'blur',
+            }
+          ],
+          lastName: [
+            {
+              required: true,
+              message: 'Please enter your last name',
+              trigger: 'blur',
+            }
+          ]
+        },
+        title: [
+          {
+            required: true,
+            message: 'Please enter a title',
+            trigger: 'blur',
+          }
+        ],
+        summary: [
+          {
+            required: true,
+            message: 'Please enter a summary',
+            trigger: 'change'
+          }
+        ]
+      }
+    }
+  },
+
+  mounted() {
+    // Reset form fields when showing the form
+    this.$refs.submitForm.resetFields()
+    this.hasError = false
+    const form = loadForm()
+    if (form) {
+      this.form = {
+        ...this.form,
+        ...form
+      }
+    }
+    populateFormWithUserData(this.form, this.firstName, this.lastName, this.profileEmail)
+  },
+
+  computed: {
+    supportingLinksText: function() {
+      let message = ''
+      this.form.supportingLinks.forEach(link => {
+        if (!isEmpty(link))
+          message += `${link}<br>`
+      })
+      return isEmpty(message) ? 'N/A<br>' : message
+    },
+    ...mapGetters('user', ['firstName', 'lastName', 'profileEmail'])
+  },
+
+  methods: {
+    addSupportingLink() {
+      this.form.supportingLinks.push('')
+    },
+    /**
+     * Send form to endpoint
+     */
+    async sendForm() {
+      this.isSubmitting = true
+      const fileName = propOr('', 'name', this.file)
+      const description = `
+        <b>Contact Information</b><br><br>
+        <b>First Name:</b><br>${this.form.user.firstName}<br><br>
+        <b>Last Name:</b><br>${this.form.user.lastName}<br><br>
+        <b>E-mail:</b><br>${this.form.user.email}<br><br>
+        <b>Story Details:</b><br><br>
+        <b>Title:</b><br>${this.form.title}<br><br>
+        <b>Summary:</b><br>${this.form.summary}<br><br>
+        ${fileName != '' ? `<b>File Attachment:</b><br>${fileName}<br><br>` : ''}
+        <b>Supporting Information links:</b><br>${this.supportingLinksText}<br>
+      `
+
+      let formData = new FormData()
+      formData.append("type", "communitySpotlight")
+      formData.append("sendCopy", this.form.user.sendCopy)
+      formData.append("title", `SPARC Story Submission: ${this.form.title}`)
+      formData.append("description", description)
+      formData.append("userEmail", this.form.user.email)
+      if (propOr('', 'name', this.file) != '') {
+        formData.append("attachment", this.file, this.file.name)
+      }  
+
+      // Save form to sessionStorage
+      saveForm(this.form)
+
+      await this.$axios
+        .post(`${process.env.portal_api}/tasks`, formData)
+        .then(() => {
+          if (this.form.user.shouldSubscribe) {
+            this.subscribeToNewsletter(this.form.user.email, this.form.user.firstName, this.form.user.lastName)
+          } else {
+            this.$emit('submit', this.form.user.firstName)
+          }
+        })
+        .catch(() => {
+          this.hasError = true
+        })
+        .finally(() => {
+          this.isSubmitting = false
+        })
+    }
+  },
+
+  watch: {
+    firstName() {
+      this.form.user.firstName = this.firstName
+    },
+    lastName() {
+      this.form.user.lastName = this.lastName
+    },
+    profileEmail() {
+      this.form.user.email = this.profileEmail
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+.submit-button {
+  text-align: left;
+  margin-bottom: 0 !important;
+}
+hr {
+  border-top: none;
+  border-left: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+  margin: 2rem 0;
+}
+.error {
+  color: $danger;
+}
+.recaptcha {
+  display: flex;
+  justify-content: left;
+}
+::v-deep .file-upload {
+  .el-form-item__label {
+    margin-bottom: .3rem;
+  }
+}
+</style>
diff --git a/components/ContactUsForms/FeedbackForm/FeedbackForm.vue b/components/ContactUsForms/FeedbackForm/FeedbackForm.vue
new file mode 100644
index 00000000..821cc681
--- /dev/null
+++ b/components/ContactUsForms/FeedbackForm/FeedbackForm.vue
@@ -0,0 +1,248 @@
+<template>
+  <el-form
+    ref="submitForm"
+    label-position="top"
+    :model="form"
+    :rules="formRules"
+    :hide-required-asterisk="true"
+  >
+    <el-form-item
+      prop="pageOrResource"
+      label="What area of the SPARC Portal is this related to?"
+    >
+      <el-select
+        v-model="form.pageOrResource"
+        placeholder="Select one"
+        :popper-append-to-body="false"
+      >
+        <el-option
+          v-for="area in areasOfSparc"
+          :key="area"
+          :label="area"
+          :value="area"
+        />
+      </el-select>
+    </el-form-item>
+
+    <el-form-item
+      prop="shortDescription"
+      label="Provide a short description of your feedback *"
+    >
+      <el-input
+        v-model="form.shortDescription"
+        placeholder="(Example: I think it would be great to <your idea>)"
+      />
+    </el-form-item>
+
+    <el-form-item prop="detailedDescription" label="Provide a detailed description *">
+      <el-input
+        v-model="form.detailedDescription"
+        type="textarea"
+        :rows="3"
+        placeholder="Provide a detailed description of your feedback"
+      />
+    </el-form-item>
+
+    <hr/>
+
+    <user-contact-form-item v-model="form.user" showFollowUpOption/>
+
+    <hr/>
+
+    <div class="heading2">
+      Please check the box to proceed
+    </div>
+    <recaptcha class="recaptcha my-16 pl-16"/>
+
+    <hr/>
+
+    <el-form-item>
+      <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
+        Submit
+      </el-button>
+      <p v-if="hasError" class="error">
+        An error has occurred, please try again.
+      </p>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+import NewsletterMixin from '../NewsletterMixin'
+import RecaptchaMixin from '@/mixins/recaptcha/index'
+import UserContactFormItem from '../UserContactFormItem.vue'
+import { mapState, mapGetters } from 'vuex'
+import { loadForm, populateFormWithUserData, saveForm } from '~/pages/data/utils'
+
+export default {
+  name: 'FeedbackForm',
+
+  mixins: [NewsletterMixin, RecaptchaMixin],
+
+  components: {
+    UserContactFormItem
+  },
+
+  data() {
+    return {
+      form: {
+        pageOrResource: '',
+        detailedDescription: '',
+        shortDescription: '',
+        user: {
+          typeOfUser: '',
+          firstName: this.firstName,
+          lastName: this.lastName,
+          email: this.profileEmail,
+          sendCopy: true,
+          shouldFollowUp: true,
+          shouldSubscribe: false,
+        }
+      },
+      isSubmitting: false,
+      formRules: {
+        user: {
+          typeOfUser: [
+            {
+              required: true,
+              message: 'Please select one',
+              trigger: 'change'
+            }
+          ],
+          email: [
+            {
+              required: true,
+              message: 'Please enter your email',
+              type: 'email',
+              trigger: 'blur',
+            }
+          ],
+          firstName: [
+            {
+              required: true,
+              message: 'Please enter your first name',
+              trigger: 'blur',
+            }
+          ],
+          lastName: [
+            {
+              required: true,
+              message: 'Please enter your last name',
+              trigger: 'blur',
+            }
+          ]
+        },
+        shortDescription: [
+          {
+            required: true,
+            message: 'Please enter a description',
+            trigger: 'change'
+          }
+        ],
+        detailedDescription: [
+          {
+            required: true,
+            message: 'Please enter a description',
+            trigger: 'change'
+          }
+        ],
+      }
+    }
+  },
+
+  computed: {
+    ...mapState('pages/contact-us', {
+      areasOfSparc: state => state.formOptions.areasOfSparc
+    }),
+    ...mapGetters('user', ['firstName', 'lastName', 'profileEmail'])
+  },
+
+  mounted() {
+    // Reset form fields when showing the form
+    this.hasError = false
+    this.$refs.submitForm.resetFields()
+    const form = loadForm()
+    if (form) {
+      this.form = {
+        ...this.form,
+        ...form
+      }
+    }
+    populateFormWithUserData(this.form, this.firstName, this.lastName, this.profileEmail)
+  },
+
+  methods: {
+    /**
+     * Send form to endpoint
+     */
+    async sendForm() {
+      this.isSubmitting = true
+      const description = `
+        <b>What area of the SPARC Portal is this related to?</b><br>${this.form.pageOrResource}<br><br>
+        <b>Short description:</b><br>${this.form.shortDescription}<br><br>
+        <b>Detailed description:</b><br>${this.form.detailedDescription}<br><br>
+        <b>What type of user are you?</b><br>${this.form.user.typeOfUser}<br><br>
+        <b>Name:</b><br>${this.form.user.firstName} ${this.form.user.lastName}<br><br>
+        <b>Email:</b><br>${this.form.user.email}<br><br>
+        <b>I'd like updates about this submission:</b><br>${this.form.user.shouldFollowUp ? 'Yes' : 'No'}
+      `
+      let formData = new FormData();
+      formData.append("type", "feedback")
+      formData.append("sendCopy", this.form.user.sendCopy)
+      formData.append("title", `SPARC Feedback Submission: ${this.form.shortDescription}`)
+      formData.append("description", description)
+      formData.append("userEmail", this.form.user.email)
+
+      // Save form to sessionStorage
+      saveForm(this.form)
+
+      await this.$axios
+        .post(`${process.env.portal_api}/tasks`, formData)
+        .then(() => {
+          if (this.form.user.shouldSubscribe) {
+            this.subscribeToNewsletter(this.form.user.email, this.form.user.firstName, this.form.user.lastName)
+          } else {
+            this.$emit('submit', this.form.firstName)
+          }
+        })
+        .catch(() => {
+          this.hasError = true
+        })
+        .finally(() => {
+          this.isSubmitting = false
+        })
+    }
+  },
+
+  watch: {
+    firstName() {
+      this.form.user.firstName = this.firstName
+    },
+    lastName() {
+      this.form.user.lastName = this.lastName
+    },
+    profileEmail() {
+      this.form.user.email = this.profileEmail
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+hr {
+  border-top: none;
+  border-left: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+  margin: 2rem 0;
+}
+.error {
+  color: $danger;
+}
+.recaptcha {
+  display: flex;
+  justify-content: left;
+}
+</style>
diff --git a/components/ContactUsForms/GeneralForm/GeneralForm.vue b/components/ContactUsForms/GeneralForm/GeneralForm.vue
index 4958a94b..834fc597 100644
--- a/components/ContactUsForms/GeneralForm/GeneralForm.vue
+++ b/components/ContactUsForms/GeneralForm/GeneralForm.vue
@@ -1,45 +1,43 @@
 <template>
   <el-form
-    ref="contactForm"
+    ref="submitForm"
     label-position="top"
     :model="form"
     :rules="formRules"
     :hide-required-asterisk="true"
   >
     <el-form-item
-      prop="typeOfUser"
-      label="What type of user are you? *"
+      prop="pageOrResource"
+      label="Is this about a specific page or resource? *"
     >
       <el-select
-        v-model="form.typeOfUser"
+        v-model="form.pageOrResource"
         placeholder="Select one"
         :popper-append-to-body="false"
       >
         <el-option
-          v-for="typeOfUserOption in questionOptions.typeOfUser"
-          :key="typeOfUserOption"
-          :label="typeOfUserOption"
-          :value="typeOfUserOption"
+          v-for="area in areasOfSparc"
+          :key="area"
+          :label="area"
+          :value="area"
         />
       </el-select>
     </el-form-item>
 
+    <el-form-item prop="pageUrl" label="Please provide the specific page URL">
+      <el-input v-model="form.pageUrl" placeholder="URL">
+        <template slot="prepend">Http://</template>
+      </el-input>
+    </el-form-item>
+
     <el-form-item
-      prop="pageOrResource"
-      label="Is this about a specific page or resource?"
+      prop="description"
+      label="Provide a short description of your inquiry *"
     >
-      <el-select
-        v-model="form.pageOrResource"
-        placeholder="Select one"
-        :popper-append-to-body="false"
-      >
-        <el-option
-          v-for="pageOrResource in questionOptions.pageOrResource"
-          :key="pageOrResource"
-          :label="pageOrResource"
-          :value="pageOrResource"
-        />
-      </el-select>
+      <el-input
+        v-model="form.description"
+        placeholder="(Example: I have a question about <area of inquiry>)"
+      />
     </el-form-item>
 
     <el-form-item prop="message" label="Your question or comment *">
@@ -47,27 +45,22 @@
         v-model="form.message"
         type="textarea"
         :rows="3"
-        placeholder="Description here"
+        placeholder="Enter your question or comment"
       />
     </el-form-item>
 
-    <el-form-item prop="firstName" label="First Name">
-      <el-input v-model="form.firstName" placeholder="First name here" />
-    </el-form-item>
+    <hr />
 
-    <el-form-item prop="lastName" label="Last Name">
-      <el-input v-model="form.lastName" placeholder="Last name here" />
-    </el-form-item>
+    <user-contact-form-item showFollowUpOption v-model="form.user"/>
 
-    <el-form-item prop="email" label="Email *" class="mb-0">
-      <el-input v-model="form.email" placeholder="Email here" type="email" />
-    </el-form-item>
+    <hr />
 
-    <el-form-item prop="shouldSubscribe" class="mt-16">
-      <el-checkbox v-model="form.shouldSubscribe">
-        <span class="body1">Subscribe to the SPARC Newsletter</span>
-      </el-checkbox>
-    </el-form-item>
+    <div class="heading2">
+      Please check the box to proceed
+    </div>
+    <recaptcha class="recaptcha my-16 pl-16"/>
+
+    <hr/>
 
     <el-form-item>
       <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
@@ -81,121 +74,160 @@
 </template>
 
 <script>
-import { typeOfUser, pageOrResource } from '../questions'
 import NewsletterMixin from '../NewsletterMixin'
+import RecaptchaMixin from '@/mixins/recaptcha/index'
+import UserContactFormItem from '../UserContactFormItem.vue'
+import { mapState, mapGetters } from 'vuex'
+import { loadForm, populateFormWithUserData, saveForm } from '~/pages/data/utils'
 
 export default {
   name: 'GeneralForm',
 
-  mixins: [NewsletterMixin],
+  mixins: [NewsletterMixin, RecaptchaMixin],
+
+  components: {
+    UserContactFormItem
+  },
 
   data() {
     return {
       form: {
-        typeOfUser: '',
+        description: '',
+        pageUrl: '',
         pageOrResource: '',
         message: '',
-        firstName: '',
-        lastName: '',
-        email: '',
-        shouldSubscribe: false
-      },
-      questionOptions: {
-        typeOfUser,
-        pageOrResource
+        user: {
+          typeOfUser: '',
+          firstName: this.firstName,
+          lastName: this.lastName,
+          email: this.profileEmail,
+          sendCopy: true,
+          shouldFollowUp: true,
+          shouldSubscribe: false,
+        }
       },
       isSubmitting: false,
       formRules: {
-        typeOfUser: [
+        user: {
+          typeOfUser: [
+            {
+              required: true,
+              message: 'Please select one',
+              trigger: 'change'
+            }
+          ],
+          email: [
+            {
+              required: true,
+              message: 'Please enter your email',
+              type: 'email',
+              trigger: 'blur',
+            }
+          ],
+          firstName: [
+            {
+              required: true,
+              message: 'Please enter your first name',
+              trigger: 'blur',
+            }
+          ],
+          lastName: [
+            {
+              required: true,
+              message: 'Please enter your last name',
+              trigger: 'blur',
+            }
+          ]
+        },
+        description: [
           {
             required: true,
-            message: 'Please select one',
+            message: 'Please enter a description',
             trigger: 'change'
           }
         ],
-
-        email: [
+        pageOrResource: [
           {
             required: true,
-            message: 'Please enter your email',
-            type: 'email',
-            trigger: 'blur'
-          }
-        ],
-
-        firstName: [
-          {
-            required: true,
-            message: 'Please enter your first name',
-            trigger: 'blur',
-            validator: this.validateForNewsletter
-          }
-        ],
-
-        lastName: [
-          {
-            required: true,
-            message: 'Please enter your last name',
-            trigger: 'blur',
-            validator: this.validateForNewsletter
+            message: 'Please select an option',
+            trigger: 'change'
           }
         ],
-
         message: [
           {
             required: true,
             message: 'Please enter a message',
             trigger: 'change'
           }
-        ]
+        ],
       }
     }
   },
 
+  computed: {
+    ...mapState('pages/contact-us', {
+      areasOfSparc: state => state.formOptions.areasOfSparc
+    }),
+    ...mapGetters('user', ['firstName', 'lastName', 'profileEmail'])
+  },
+
   mounted() {
     // Reset form fields when showing the form
-    this.$refs.contactForm.resetFields()
+    this.$refs.submitForm.resetFields()
     this.hasError = false
+    const form = loadForm()
+    if (form) {
+      this.form = {
+        ...this.form,
+        ...form
+      }
+    }
+    populateFormWithUserData(this.form, this.firstName, this.lastName, this.profileEmail)
   },
 
   methods: {
-    /**
-     * Submit the form and validate
-     */
-    onSubmit() {
-      this.hasError = false
-
-      this.$refs.contactForm.validate(valid => {
-        if (!valid) {
-          return
-        }
-        this.sendForm()
-      })
+    validateEmail: function(rule, value, callback) {
+      if (value === '') {
+        callback(new Error(rule.message))
+      }
+      callback()
     },
 
+    validateUrl: function(rule, value, callback) {
+      if (!value.includes('.') || value.lastIndexOf('.') == value.length - 1 || value.indexOf('.') == 0) {
+        callback(new Error(rule.message))
+      }
+      callback()
+    },
     /**
      * Send form to endpoint
      */
-    sendForm() {
+    async sendForm() {
       this.isSubmitting = true
+      const description = `
+        <b>Is this about a specific page or resource?</b><br>${this.form.pageOrResource}<br><br>
+        <b>Your question or comment?</b><br>${this.form.message}<br><br>
+        <b>Name:</b><br>${this.form.user.firstName} ${this.form.user.lastName}<br><br>
+        <b>Email:</b><br>${this.form.user.email}<br><br>
+        <b>I'd like updates about this submission:</b><br>${this.form.user.shouldFollowUp ? 'Yes' : 'No'}
+      `
+      let formData = new FormData();
+      formData.append("type", "general")
+      formData.append("sendCopy", this.form.user.sendCopy)
+      formData.append("title", `SPARC Question or Inquiry Submission: ${this.form.description}`)
+      formData.append("description", description)
+      formData.append("userEmail", this.form.user.email)
 
-      this.$axios
-        .post(`${process.env.portal_api}/contact`, {
-          name: `${this.form.firstName} ${this.form.lastName}`,
-          email: this.form.email,
-          message: `
-            What type of user are you?<br>${this.form.typeOfUser}
-            <br><br>Is this about a specific page or resource?
-            <br>${this.form.pageOrResource}
-            <br><br>Message
-            <br>${this.form.message}
-          `
-        })
+      // Save form to sessionStorage
+      saveForm(this.form)
+
+      await this.$axios
+        .post(`${process.env.portal_api}/tasks`, formData)
         .then(() => {
-          if (this.form.shouldSubscribe) {
-            this.subscribeToNewsletter(this.form.email, this.form.firstName, this.form.lastName)
+          if (this.form.user.shouldSubscribe) {
+            this.subscribeToNewsletter(this.form.user.email, this.form.user.firstName, this.form.user.lastName)
           } else {
-            this.$emit('submit', this.form.firstName)
+            this.$emit('submit', this.form.user.firstName)
           }
         })
         .catch(() => {
@@ -205,14 +237,46 @@ export default {
           this.isSubmitting = false
         })
     }
+  },
+
+  watch: {
+    firstName() {
+      this.form.user.firstName = this.firstName
+    },
+    lastName() {
+      this.form.user.lastName = this.lastName
+    },
+    profileEmail() {
+      this.form.user.email = this.profileEmail
+    }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-@import '../../../assets/_variables.scss';
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
 
+.submit-button {
+  text-align: left;
+  margin-bottom: 0 !important;
+}
+hr {
+  border-top: none;
+  border-left: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+  margin: 2rem 0;
+}
 .error {
-  color: $facial;
+  color: $danger;
+}
+.recaptcha {
+  display: flex;
+  justify-content: left;
+}
+::v-deep .file-upload {
+  .el-form-item__label {
+    margin-bottom: .3rem;
+  }
 }
 </style>
diff --git a/components/ContactUsForms/InterestForm/InterestForm.vue b/components/ContactUsForms/InterestForm/InterestForm.vue
new file mode 100644
index 00000000..c1a6ba6d
--- /dev/null
+++ b/components/ContactUsForms/InterestForm/InterestForm.vue
@@ -0,0 +1,251 @@
+<template>
+  <el-form
+    ref="submitForm"
+    label-position="top"
+    :model="form"
+    :rules="formRules"
+    :hide-required-asterisk="true"
+  >
+    <el-form-item
+      class="service-categories vertical-content mt-32"
+      prop="serviceCategories"
+      label="What service(s) are you interested in? *"
+    >
+      <div class="body4 mb-4"><i>Select all that apply.</i></div>
+      <client-only>
+        <sparc-checkbox
+          v-for="service in services"
+          v-model="form.serviceCategories"
+          :key="service"
+          :label="service"
+          :display="service"
+        />
+      </client-only> 
+    </el-form-item>
+
+    <el-form-item prop="additionalInfo" label="Additional Information">
+      <el-input
+        v-model="form.additionalInfo"
+        type="textarea"
+        :rows="3"
+        placeholder="Please provide any additional information regarding your service request"
+      />
+    </el-form-item>
+
+    <hr/>
+
+    <user-contact-form-item showFollowUpOption v-model="form.user" />
+
+    <hr/>
+
+    <div class="heading2">
+      Please check the box to proceed
+    </div>
+    <recaptcha class="recaptcha my-16 pl-16"/>
+
+    <hr/>
+
+    <el-form-item>
+      <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
+        Submit
+      </el-button>
+      <p v-if="hasError" class="error">
+        An error has occurred, please try again.
+      </p>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+import NewsletterMixin from '../NewsletterMixin'
+import RecaptchaMixin from '@/mixins/recaptcha/index'
+import UserContactFormItem from '../UserContactFormItem.vue'
+import { isEmpty } from 'ramda'
+import { mapState, mapGetters } from 'vuex'
+import { loadForm, populateFormWithUserData, saveForm } from '~/pages/data/utils'
+
+export default {
+  name: 'InterestForm',
+
+  mixins: [NewsletterMixin, RecaptchaMixin],
+
+  components: {
+    UserContactFormItem
+  },
+
+  data() {
+    return {
+      form: {
+        serviceCategories: [],
+        additionalInfo:'',
+        user: {
+          typeOfUser: '',
+          firstName: this.firstName,
+          lastName: this.lastName,
+          email: this.profileEmail,
+          sendCopy: true,
+          shouldFollowUp: true,
+          shouldSubscribe: false,
+        }
+      },
+      isSubmitting: false,
+      formRules: {
+        user: {
+          typeOfUser: [
+            {
+              required: true,
+              message: 'Please select one',
+              trigger: 'change'
+            }
+          ],
+          email: [
+            {
+              required: true,
+              message: 'Please enter your email',
+              type: 'email',
+              trigger: 'blur',
+            }
+          ],
+          firstName: [
+            {
+              required: true,
+              message: 'Please enter your first name',
+              trigger: 'blur',
+            }
+          ],
+          lastName: [
+            {
+              required: true,
+              message: 'Please enter your last name',
+              trigger: 'blur',
+            }
+          ]
+        },
+        serviceCategories: [
+          {
+            required: true,
+            message: 'Please select at least one',
+            trigger: 'change'
+          }
+        ]
+      }
+    }
+  },
+
+  computed: {
+    ...mapState('pages/contact-us', {
+      services: state => state.formOptions.services
+    }),
+    ...mapGetters('user', ['firstName', 'lastName', 'profileEmail'])
+  },
+
+  mounted() {
+    // Reset form fields when showing the form
+    this.$refs.submitForm.resetFields()
+    this.hasError = false
+    const form = loadForm()
+    if (form) {
+      this.form = {
+        ...this.form,
+        ...form
+      }
+    }
+    populateFormWithUserData(this.form, this.firstName, this.lastName, this.profileEmail)
+  },
+
+  methods: {
+    /**
+     * Send form to endpoint
+     */
+    async sendForm() {
+      this.isSubmitting = true
+      const description = `
+        <b>What services(s) are you interested in?</b><br>${this.form.serviceCategories}<br><br>
+        <b>Additional Information:</b><br>${isEmpty(this.form.additionalInfo) ? 'N/A' : this.form.additionalInfo}<br><br>
+        <b>What type of user are you?</b><br>${this.form.user.typeOfUser}<br><br>
+        <b>Name:</b><br>${this.form.user.firstName} ${this.form.user.lastName}<br><br>
+        <b>Email:</b><br>${this.form.user.email}<br><br>
+        <b>I'd like updates about this submission:</b><br>${this.form.user.shouldFollowUp ? 'Yes' : 'No'}
+      `
+      let formData = new FormData();
+      formData.append("type", "interest")
+      formData.append("sendCopy", this.form.user.sendCopy)
+      formData.append("title", `SPARC Service Request`)
+      formData.append("description", description)
+      formData.append("userEmail", this.form.user.email)
+
+      // Save form to sessionStorage
+      saveForm(this.form)
+
+      await this.$axios
+        .post(`${process.env.portal_api}/tasks`, formData)
+        .then(() => {
+          if (this.form.user.shouldSubscribe) {
+            this.subscribeToNewsletter(this.form.user.email, this.form.user.firstName, this.form.user.lastName)
+          } else {
+            this.$emit('submit', this.form.user.firstName)
+          }
+        })
+        .catch(() => {
+          this.hasError = true
+        })
+        .finally(() => {
+          this.isSubmitting = false
+        })
+    }
+  },
+
+  watch: {
+    firstName() {
+      this.form.user.firstName = this.firstName
+    },
+    lastName() {
+      this.form.user.lastName = this.lastName
+    },
+    profileEmail() {
+      this.form.user.email = this.profileEmail
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+hr {
+  border-top: none;
+  border-left: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+  margin: 2rem 0;
+}
+.error {
+  color: $danger;
+}
+.recaptcha {
+  display: flex;
+  justify-content: left;
+}
+::v-deep .vertical-content {
+  .el-form-item__content {
+    display: flex;
+    flex-direction: column;
+    .el-radio {
+      line-height: 25px;
+      padding-left: 2rem;
+    }
+  }
+}
+::v-deep .service-categories {
+  .el-form-item__content {
+    .el-checkbox {
+      padding-left: 2rem;
+      margin: 0;
+      line-height: 25px;
+    }
+  }
+  .el-form-item__label {
+    margin-bottom: .3rem;
+  }
+}
+</style>
diff --git a/components/ContactUsForms/NewsAndEventsForm/NewsAndEventsForm.vue b/components/ContactUsForms/NewsAndEventsForm/NewsAndEventsForm.vue
new file mode 100644
index 00000000..5cf275a3
--- /dev/null
+++ b/components/ContactUsForms/NewsAndEventsForm/NewsAndEventsForm.vue
@@ -0,0 +1,326 @@
+<template>
+  <el-form
+    ref="submitForm"
+    label-position="top"
+    :model="form"
+    :rules="formRules"
+    :hide-required-asterisk="true"
+  >
+    <el-form-item prop="title" label="Title *">
+      <el-input v-model="form.title" placeholder="Enter a title for your news or event" />
+    </el-form-item>
+
+    <el-form-item prop="summary" label="Summary *">
+      <el-input
+        v-model="form.summary"
+        type="textarea"
+        :rows="3"
+        placeholder="Tell us some details about your news or event"
+      />
+    </el-form-item>
+
+    <hr/>
+
+    <el-form-item class="file-upload" prop="fileAttachment" label="Image Upload">
+      <div class="body4 mb-8"><i>To help others understand your news or event, an image can really help. We recommend images of 600px by 600px.</i></div>
+      <el-upload
+        ref="fileUploader"
+        action=""
+        :limit="limit"
+        :auto-upload="false"
+        :on-change="onUploadChange"
+        :on-remove="onRemove"
+        :before-remove="beforeRemove" >
+        <el-button slot="trigger" class="secondary">Select file</el-button>
+        <span slot="tip" class="el-upload__tip ml-16">jpg/png file with a size less than 5MB</span>
+      </el-upload>
+    </el-form-item>
+
+    <el-form-item prop="supportingLinks" label="Supporting Information">
+      <url-list v-model="form.supportingLinks" @add-link="addSupportingLink" placeholder="Enter URL">
+        <template slot="prepend">Http://</template>
+      </url-list>
+    </el-form-item>
+
+    <hr/>
+
+    <div class="heading1 mb-16">Event specific details</div>
+
+    <el-form-item prop="location" label="Location">
+      <el-input class="location-input mr-16" :disabled="isVirtual" v-model="form.location" placeholder="Enter the location of the event" />
+      <span><client-only>
+        <sparc-checkbox
+          v-model="form.locationCategories"
+          label="Virtual"
+          display="Virtual"
+        />
+      </client-only></span>
+    </el-form-item>
+
+    <el-form-item prop="startDate" label="Start Date">
+      <el-date-picker
+        v-model="form.startDate"
+        type="date"
+        placeholder="Enter the start date"
+      />
+    </el-form-item>
+
+    <el-form-item prop="endDate" label="End Date">
+      <el-date-picker
+        v-model="form.endDate"
+        type="date"
+        placeholder="Enter the end date"
+      />
+    </el-form-item>
+
+    <hr/>
+
+    <user-contact-form-item v-model="form.user"/>
+
+    <hr/>
+
+    <div class="heading2">
+      Please check the box to proceed
+    </div>
+    <recaptcha class="recaptcha my-16 pl-16"/>
+
+    <hr/>
+
+    <div class="body4 mb-16"><i>Before your news or event is published on the SPARC Portal, it will be reviewed. The reviewer may contact you to clarify or seek additional information.</i></div>
+
+    <el-form-item class="submit-button">
+      <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
+        Submit
+      </el-button>
+      <p v-if="hasError" class="error">
+        An error has occurred, please try again.
+      </p>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+import FileUploadMixin from '@/mixins/file-upload/index'
+import RecaptchaMixin from '@/mixins/recaptcha/index'
+import NewsletterMixin from '@/components/ContactUsForms/NewsletterMixin'
+import UserContactFormItem from '../UserContactFormItem.vue'
+import UrlList from '@/components/Url/UrlList.vue'
+import { propOr, isEmpty } from 'ramda'
+import { mapGetters } from 'vuex'
+import { loadForm, populateFormWithUserData, saveForm } from '~/pages/data/utils'
+
+export default {
+  name: 'NewsAndEventsForm',
+
+  mixins: [FileUploadMixin, RecaptchaMixin, NewsletterMixin],
+
+  components: {
+    UrlList,
+    UserContactFormItem
+  },
+
+  data() {
+    return {
+      form: {
+        title: '',
+        summary: '',
+        url: '',
+        location: '',
+        locationCategories: [],
+        startDate: '',
+        endDate: '',
+        supportingLinks: [''],
+        user: {
+          typeOfUser: '',
+          firstName: this.firstName,
+          lastName: this.lastName,
+          email: this.profileEmail,
+          sendCopy: true,
+          shouldFollowUp: true,
+          shouldSubscribe: false,
+        }
+      },
+      isSubmitting: false,
+      formRules: {
+        user: {
+          email: [
+            {
+              required: true,
+              message: 'Please enter your email',
+              type: 'email',
+              trigger: 'blur',
+            }
+          ],
+          firstName: [
+            {
+              required: true,
+              message: 'Please enter your first name',
+              trigger: 'blur',
+            }
+          ],
+          lastName: [
+            {
+              required: true,
+              message: 'Please enter your last name',
+              trigger: 'blur',
+            }
+          ]
+        },
+        title: [
+          {
+            required: true,
+            message: 'Please enter a title',
+            trigger: 'blur',
+          }
+        ],
+        summary: [
+          {
+            required: true,
+            message: 'Please enter a summary',
+            trigger: 'change'
+          }
+        ]
+      }
+    }
+  },
+
+  mounted() {
+    // Reset form fields when showing the form
+    this.$refs.submitForm.resetFields()
+    this.hasError = false
+    const form = loadForm()
+    if (form) {
+      this.form = {
+        ...this.form,
+        ...form
+      }
+    }
+    populateFormWithUserData(this.form, this.firstName, this.lastName, this.profileEmail)
+  },
+
+  computed: {
+    isVirtual: function() {
+      return this.form?.locationCategories.includes('Virtual')
+    },
+    supportingLinksText: function() {
+      let message = ''
+      this.form.supportingLinks.forEach(link => {
+        if (!isEmpty(link))
+          message += `${link}<br>`
+      })
+      return isEmpty(message) ? 'N/A<br>' : message
+    },
+    locationText: function() {
+      return this.isVirtual ? 'Virtual' : this.form.location == '' ? 'N/A' : this.form.location
+    },
+    ...mapGetters('user', ['firstName', 'lastName', 'profileEmail'])
+  },
+
+  methods: {
+    addSupportingLink() {
+      this.form.supportingLinks.push('')
+    },
+    /**
+     * Send form to endpoint
+     */
+    async sendForm() {
+      this.isSubmitting = true
+      const fileName = propOr('', 'name', this.file)
+      const description = `
+        <b>Contact Information</b><br><br>
+        <b>First Name:</b><br>${this.form.user.firstName}<br><br>
+        <b>Last Name:</b><br>${this.form.user.lastName}<br><br>
+        <b>E-mail:</b><br>${this.form.user.email}<br><br>
+        <b>News or Event Details:</b><br><br>
+        <b>Title:</b><br>${this.form.title}<br><br>
+        <b>Summary:</b><br>${this.form.summary}<br><br>
+        ${fileName != '' ? `<b>File Attachment:</b><br>${fileName}<br><br>` : ''}
+        <b>Supporting Information links:</b><br>${this.supportingLinksText}<br>
+        <b>Event Specific Details:</b><br><br>
+        <b>Location:</b><br>${this.locationText}<br><br>
+        <b>Start Date:</b><br>${this.form.startDate == '' ? 'N/A' : new Date(this.form.startDate).toDateString()}<br><br>
+        <b>End Date:</b><br>${this.form.endDate == '' ? 'N/A' : new Date(this.form.endDate).toDateString()}
+      `
+      let formData = new FormData();
+      // we assume it is a news item if there is no start date
+      if (this.form.startDate == '') {
+        formData.append("type", "news")
+        formData.append("title", `News Submission: ${this.form.title}`)
+      }
+      else {
+        formData.append("type", "event")
+        formData.append("title", `Event Submission: ${this.form.title}`)
+      }
+      formData.append("sendCopy", this.form.user.sendCopy)
+      formData.append("description", description)
+      formData.append("userEmail", this.form.user.email)
+      if (propOr('', 'name', this.file) != '') {
+        formData.append("attachment", this.file, this.file.name)
+      }
+
+      // Save form to sessionStorage
+      saveForm(this.form)
+
+      await this.$axios
+        .post(`${process.env.portal_api}/tasks`, formData)
+        .then(() => {
+          if (this.form.user.shouldSubscribe) {
+            this.subscribeToNewsletter(this.form.user.email, this.form.user.firstName, this.form.user.lastName)
+          } else {
+            this.$emit('submit', this.form.user.firstName)
+          }
+        })
+        .catch(() => {
+          this.hasError = true
+        })
+        .finally(() => {
+          this.isSubmitting = false
+        })
+    }
+  },
+
+  watch: {
+    firstName() {
+      this.form.user.firstName = this.firstName
+    },
+    lastName() {
+      this.form.user.lastName = this.lastName
+    },
+    profileEmail() {
+      this.form.user.email = this.profileEmail
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+.submit-button {
+  text-align: left;
+  margin-bottom: 0 !important;
+}
+hr {
+  border-top: none;
+  border-left: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+  margin: 2rem 0;
+}
+.error {
+  color: $danger;
+}
+.recaptcha {
+  display: flex;
+  justify-content: left;
+}
+.location-input {
+  display: inline-block;
+  min-width: 75%;
+  width: unset;
+}
+::v-deep .file-upload {
+  .el-form-item__label {
+    margin-bottom: .3rem;
+  }
+}
+</style>
diff --git a/components/ContactUsForms/ResearchForm/ResearchForm.vue b/components/ContactUsForms/ResearchForm/ResearchForm.vue
new file mode 100644
index 00000000..dae91c03
--- /dev/null
+++ b/components/ContactUsForms/ResearchForm/ResearchForm.vue
@@ -0,0 +1,288 @@
+<template>
+  <el-form
+    ref="submitForm"
+    label-position="top"
+    :model="form"
+    :rules="formRules"
+    :hide-required-asterisk="true"
+  >
+    <el-form-item
+      prop="shortDescription"
+      label="Provide a short description of your research *"
+    >
+      <el-input
+        v-model="form.shortDescription"
+        placeholder="(Example: I am studying the effects of <approach> on <anatomical structure>)"
+      />
+    </el-form-item>
+
+    <el-form-item prop="detailedDescription" label="Provide a detailed description of your research *">
+      <el-input
+        v-model="form.detailedDescription"
+        type="textarea"
+        :rows="3"
+        placeholder="Please provide specifics about your research. Our curation team will then contact you."
+      />
+    </el-form-item>
+
+    <el-form-item
+      class="mt-32 vertical-content"
+      prop="publishedManuscript"
+      label="Has data been published in a manuscript? *"
+    >
+      <client-only>
+        <sparc-radio
+          v-model="form.publishedManuscript"
+          label="Yes"
+          display="Yes"
+        />
+        <sparc-radio
+          v-model="form.publishedManuscript"
+          label="No"
+          display="No"
+        />
+        <sparc-radio
+          v-model="form.publishedManuscript"
+          label="Pending"
+          display="Pending"
+        />
+      </client-only>
+    </el-form-item>
+
+    <el-form-item
+      class="mt-0 vertical-content"
+      prop="manuscriptDoi"
+      :disabled="form.publishedManuscript !== 'Yes'"
+    >
+      <url-input :disabled="form.publishedManuscript !== 'Yes'" v-model="form.manuscriptDoi" placeholder="Enter DOI URL">
+        <template slot="prepend">Http://</template>
+      </url-input>
+    </el-form-item>
+
+    <hr/>
+
+    <user-contact-form-item v-model="form.user"/>
+
+    <hr/>
+
+    <div class="heading2">
+      Please check the box to proceed
+    </div>
+    <recaptcha class="recaptcha my-16 pl-16"/>
+
+    <hr/>
+
+    <el-form-item>
+      <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
+        Submit
+      </el-button>
+      <p v-if="hasError" class="error">
+        An error has occurred, please try again.
+      </p>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import NewsletterMixin from '../NewsletterMixin'
+import RecaptchaMixin from '@/mixins/recaptcha/index'
+import UserContactFormItem from '../UserContactFormItem.vue'
+import { saveForm, loadForm, populateFormWithUserData } from '~/pages/data/utils'
+import UrlInput from '@/components/Url/UrlInput.vue'
+
+export default {
+  name: 'FeedbackForm',
+
+  mixins: [NewsletterMixin, RecaptchaMixin],
+
+  components: {
+    UserContactFormItem,
+    UrlInput
+  },
+
+  data() {
+    const validateDoi = (rule, value, callback) => {
+      const form = this.$refs.submitForm
+      const publishedManuscriptField = form.fields.find(field => field.prop === 'publishedManuscript')
+      if (publishedManuscriptField && publishedManuscriptField.fieldValue === 'Yes' && value === '') {
+        callback(new Error('Please enter a DOI URL'))
+      }
+      callback()
+    }
+    return {
+      form: {
+        detailedDescription: '',
+        shortDescription: '',
+        publishedManuscript: '',
+        manuscriptDoi: '',
+        user: {
+          typeOfUser: '',
+          firstName: this.firstName,
+          lastName: this.lastName,
+          email: this.profileEmail,
+          sendCopy: true,
+          shouldFollowUp: true,
+          shouldSubscribe: false
+        }
+      },
+      isSubmitting: false,
+      formRules: {
+        user: {
+          typeOfUser: [
+            {
+              required: true,
+              message: 'Please select one',
+              trigger: 'change'
+            }
+          ],
+          email: [
+            {
+              required: true,
+              message: 'Please enter your email',
+              type: 'email',
+              trigger: 'blur',
+            }
+          ],
+          firstName: [
+            {
+              required: true,
+              message: 'Please enter your first name',
+              trigger: 'blur',
+            }
+          ],
+          lastName: [
+            {
+              required: true,
+              message: 'Please enter your last name',
+              trigger: 'blur',
+            }
+          ]
+        },
+
+        shortDescription: [
+          {
+            required: true,
+            message: 'Please enter a description',
+            trigger: 'change'
+          }
+        ],
+
+        detailedDescription: [
+          {
+            required: true,
+            message: 'Please enter a description',
+            trigger: 'change'
+          }
+        ],
+
+        publishedManuscript: [
+          {
+            required: true,
+            message: 'Please select one option',
+            trigger: 'change'
+          }
+        ],
+
+        manuscriptDoi: [
+          {
+            trigger: 'change',
+            validator: validateDoi
+          }
+        ],
+      }
+    }
+  },
+
+  computed: {
+    ...mapGetters('user', ['firstName', 'lastName', 'profileEmail'])
+  },
+
+  mounted() {
+    // Reset form fields when showing the form
+    this.hasError = false
+    this.$refs.submitForm.resetFields()
+    const form = loadForm()
+    if (form) {
+      this.form = {
+        ...this.form,
+        ...form
+      }
+    }
+    populateFormWithUserData(this.form, this.firstName, this.lastName, this.profileEmail)
+  },
+
+  methods: {
+    /**
+     * Send form to endpoint
+     */
+    async sendForm() {
+      this.isSubmitting = true
+      const description = `
+        <b>Short description:</b><br>${this.form.shortDescription}<br><br>
+        <b>Detailed description:</b><br>${this.form.detailedDescription}<br><br>
+        <b>Has a published manuscript:</b><br>${this.form.publishedManuscript === 'Yes' ? this.form.manuscriptDoi : this.form.publishedManuscript}<br><br>
+        <b>What type of user are you?</b><br>${this.form.user.typeOfUser}<br><br>
+        <b>Name:</b><br>${this.form.user.firstName} ${this.form.user.lastName}<br><br>
+        <b>Email:</b><br>${this.form.user.email}
+      `
+      let formData = new FormData();
+      formData.append("type", "research")
+      formData.append("sendCopy", this.form.user.sendCopy)
+      formData.append("title", `SPARC Research Submission: ${this.form.shortDescription}`)
+      formData.append("description", description)
+      formData.append("userEmail", this.form.user.email)
+
+      // Save form to sessionStorage
+      saveForm(this.form)
+
+      await this.$axios
+        .post(`${process.env.portal_api}/tasks`, formData)
+        .then(() => {
+          if (this.form.user.shouldSubscribe) {
+            this.subscribeToNewsletter(this.form.user.email, this.form.user.firstName, this.form.user.lastName)
+          } else {
+            this.$emit('submit', this.form.user.firstName)
+          }
+        })
+        .catch(() => {
+          this.hasError = true
+        })
+        .finally(() => {
+          this.isSubmitting = false
+        })
+    }
+  },
+
+  watch: {
+    firstName() {
+      this.form.user.firstName = this.firstName
+    },
+    lastName() {
+      this.form.user.lastName = this.lastName
+    },
+    profileEmail() {
+      this.form.user.email = this.profileEmail
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+hr {
+  border-top: none;
+  border-left: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+  margin: 2rem 0;
+}
+.error {
+  color: $danger;
+}
+.recaptcha {
+  display: flex;
+  justify-content: left;
+}
+</style>
diff --git a/components/ContactUsForms/ToolsAndResourcesForm/ToolsAndResourcesForm.vue b/components/ContactUsForms/ToolsAndResourcesForm/ToolsAndResourcesForm.vue
new file mode 100644
index 00000000..4216a816
--- /dev/null
+++ b/components/ContactUsForms/ToolsAndResourcesForm/ToolsAndResourcesForm.vue
@@ -0,0 +1,456 @@
+<template>
+  <el-form
+    ref="submitForm"
+    label-position="top"
+    :model="form"
+    :rules="formRules"
+    :hide-required-asterisk="true"
+  >
+    <el-form-item prop="resourceName" label="What is the name of the tool/resource? *">
+      <el-input v-model="form.resourceName" placeholder="Enter tool/resource name" />
+    </el-form-item>
+
+    <el-form-item class="mt-32" prop="resourceLinks" label="What is the webpage link for this tool/resource? *">
+      <url-list v-model="form.resourceLinks" @add-link="addResourceLink" placeholder="Enter URL">
+        <template slot="prepend">Http://</template>
+      </url-list>
+    </el-form-item>
+
+    <el-form-item
+      class="resource-categories vertical-content mt-32"
+      prop="resourceCategories"
+      label="Which category, or categories, would you place this tool/resource? *"
+    >
+      <div class="body4 mb-4"><i>Select all that apply.</i></div>
+      <client-only>
+        <sparc-checkbox
+          v-for="resourceCategory in resourceCategoryOptions"
+          v-model="form.resourceCategories"
+          :key="resourceCategory"
+          :label="resourceCategory"
+          :display="resourceCategory"
+        />
+      </client-only> 
+    </el-form-item>
+
+    <el-form-item prop="otherCategoryDescription" label="If you answered 'Other', please describe the category for this tool/resource.">
+      <el-input :disabled="!isOtherSelected" v-model="form.otherCategoryDescription" placeholder="Category description" />
+    </el-form-item>
+
+    <el-form-item
+      class="mt-32 vertical-content"
+      prop="isFree"
+      label="Is it free and/or open-source? *"
+    >
+      <client-only>
+        <sparc-radio
+          v-model="form.isFree"
+          label="Yes"
+          display="Yes"
+        />
+        <sparc-radio
+          v-model="form.isFree"
+          label="No"
+          display="No"
+        />
+      </client-only>
+    </el-form-item>
+
+    <el-form-item
+      class="mt-32 vertical-content"
+      prop="hasSpecificApplications"
+      label="Does it have specific applications to the peripheral nervous system or the neural control of organs? *"
+    >
+      <client-only>
+        <sparc-radio
+          v-model="form.hasSpecificApplications"
+          label="Yes"
+          display="Yes"
+        />
+        <sparc-radio
+          v-model="form.hasSpecificApplications"
+          label="No"
+          display="No"
+        />
+      </client-only>
+    </el-form-item>
+
+    <el-form-item
+      class="mt-32 vertical-content"
+      prop="isCreator"
+      label="Are you the tool/resource creator? *"
+    >
+      <client-only>
+        <sparc-radio
+          v-model="form.isCreator"
+          label="Yes"
+          display="Yes"
+        />
+        <sparc-radio
+          v-model="form.isCreator"
+          label="No"
+          display="No"
+        />
+      </client-only>
+    </el-form-item>
+
+    <el-form-item class="mt-32" prop="linksToUsages" label="Please provide any links to datasets or publications using this tool/resource">
+      <url-list v-model="form.linksToUsages" @add-link="addUsageLink" placeholder="Enter URL">
+        <template slot="prepend">Http://</template>
+      </url-list>
+    </el-form-item>
+
+    <el-form-item
+      class="mt-32 vertical-content"
+      prop="tutorialsAvailable"
+      label="Do you have any tutorials/user guides available?"
+    >
+      <client-only>
+        <sparc-radio
+          v-model="form.tutorialsAvailable"
+          label="Yes"
+          display="Yes"
+        />
+        <sparc-radio
+          v-model="form.tutorialsAvailable"
+          label="No"
+          display="No"
+        />
+      </client-only>
+      <url-list class="mt-8" :disabled="!isTutorialAvailable" v-model="form.linksToTutorials" @add-link="addTutorialLink" placeholder="Enter URL">
+        <template slot="prepend">Http://</template>
+      </url-list>
+    </el-form-item>
+
+    <hr/>
+
+    <user-contact-form-item v-model="form.user"/>
+
+    <hr/>
+
+    <div class="heading2">
+      Please check the box to proceed
+    </div>
+    <recaptcha class="recaptcha my-16 pl-16"/>
+
+    <hr/>
+
+    <div class="body4 mb-16"><i>Before your tool or resource is published on the SPARC Portal, it will be reviewed. The reviewer may contact you to clarify or seek additional information.</i></div>
+
+    <el-form-item class="submit-button">
+      <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
+        Submit
+      </el-button>
+      <p v-if="hasError" class="error">
+        An error has occurred, please try again.
+      </p>
+    </el-form-item>
+  </el-form>
+</template>
+
+<script>
+import RecaptchaMixin from '@/mixins/recaptcha/index'
+import NewsletterMixin from '@/components/ContactUsForms/NewsletterMixin'
+import UserContactFormItem from '../UserContactFormItem.vue'
+import UrlList from '@/components/Url/UrlList.vue'
+import { isEmpty } from 'ramda'
+import { mapState, mapGetters } from 'vuex'
+import { loadForm, populateFormWithUserData, saveForm } from '~/pages/data/utils'
+
+export default {
+  name: 'ToolsAndResourcesForm',
+
+  components: {
+    UrlList,
+    UserContactFormItem
+  },
+
+  mixins: [RecaptchaMixin, NewsletterMixin],
+
+  data() {
+    return {
+      form: {
+        resourceName: '',
+        resourceLinks: [''],
+        resourceCategories: [],
+        otherCategoryDescription: '',
+        isFree: '',
+        hasSpecificApplications: '',
+        isCreator: '',
+        linksToUsages: [''],
+        tutorialsAvailable: '',
+        linksToTutorials: [''],
+        user: {
+          typeOfUser: '',
+          firstName: this.firstName,
+          lastName: this.lastName,
+          email: this.profileEmail,
+          sendCopy: true,
+          shouldFollowUp: true,
+          shouldSubscribe: false,
+        }
+      },
+      isSubmitting: false,
+      formRules: {
+        user: {
+          email: [
+            {
+              required: true,
+              message: 'Please enter your email',
+              type: 'email',
+              trigger: 'blur',
+            }
+          ],
+          firstName: [
+            {
+              required: true,
+              message: 'Please enter your first name',
+              trigger: 'blur',
+            }
+          ],
+          lastName: [
+            {
+              required: true,
+              message: 'Please enter your last name',
+              trigger: 'blur',
+            }
+          ]
+        },
+        resourceName: [
+          {
+            required: true,
+            message: 'Please enter the name of the tool/resource',
+            trigger: 'blur',
+          }
+        ],
+        resourceLinks: [
+          {
+            message: 'Please enter at least one link url',
+            trigger: 'blur',
+            validator: this.validateResourceLinks
+          }
+        ],
+        resourceCategories: [
+          {
+            required: true,
+            message: 'Please select at least one',
+            trigger: 'change'
+          }
+        ],
+        otherCategoryDescription: [
+          {
+            message: 'Please enter a description',
+            trigger: 'change',
+            validator: this.validateCategoryDescription
+          }
+        ],
+        isFree: [
+          {
+            required: true,
+            message: 'Please select one',
+            trigger: 'blur',
+          }
+        ],
+        hasSpecificApplications: [
+          {
+            required: true,
+            message: 'Please select one',
+            trigger: 'blur',
+          }
+        ],
+        isCreator: [
+          {
+            required: true,
+            message: 'Please select one',
+            trigger: 'blur',
+          }
+        ]
+      }
+    }
+  },
+
+  computed: {
+    ...mapState('pages/contact-us', {
+      resourceCategoryOptions: state => state.formOptions.resourceCategories
+    }),
+    isOtherSelected: function() {
+      return this.form?.resourceCategories.includes('Other')
+    },
+    isTutorialAvailable: function() {
+      return this.form?.tutorialsAvailable === 'Yes'
+    },
+    resourceLinksText: function() {
+      let message = ''
+      this.form.resourceLinks.forEach(link => {
+        if (!isEmpty(link))
+          message += `${link}<br>`
+      })
+      return message
+    },
+    linksToUsagesText: function() {
+      let message = ''
+      this.form.linksToUsages.forEach(link => {
+        if (!isEmpty(link))
+          message += `${link}<br>`
+      })
+      return isEmpty(message) ? 'N/A<br>' : message
+    },
+    linksToTutorialsText: function() {
+      let message = ''
+      if (this.isTutorialAvailable) {
+        this.form.linksToTutorials.forEach(link => {
+          if (!isEmpty(link))
+            message += `${link}<br>`
+        })
+      }
+      return isEmpty(message) ? 'N/A<br>' : message
+    },
+    ...mapGetters('user', ['firstName', 'lastName', 'profileEmail'])
+  },
+
+  mounted() {
+    // Reset form fields when showing the form
+    this.hasError = false
+    this.$refs.submitForm.resetFields()
+    const form = loadForm()
+    if (form) {
+      this.form = {
+        ...this.form,
+        ...form
+      }
+    }
+    populateFormWithUserData(this.form, this.firstName, this.lastName, this.profileEmail)
+  },
+
+  methods: {
+    validateCategoryDescription: function(rule, value, callback) {
+      if (this.isOtherSelected && value === '') {
+        callback(new Error(rule.message))
+      }
+      callback()
+    },
+    validateResourceLinks: function(rule, value, callback) {
+      const hasResourceLink = value.some(link => {
+        return !isEmpty(link)
+      })
+      if (!hasResourceLink) {
+        callback(new Error(rule.message))
+      }
+      callback()
+    },
+    addResourceLink() {
+      this.form.resourceLinks.push('')
+    },
+    addUsageLink() {
+      this.form.linksToUsages.push('')
+    },
+    addTutorialLink() {
+      this.form.linksToTutorials.push('')
+    },
+    /**
+     * Send form to endpoint
+     */
+    async sendForm() {
+      this.isSubmitting = true
+
+      const description = `
+        <b>What is the name of the tool/resource?</b><br>${this.form.resourceName}<br><br>
+        <b>What is the webpage link for this tool/resource?</b><br>${this.resourceLinksText}<br>
+        <b>Which category, or categories, would you place this tool/resource?</b><br>${this.form.resourceCategories}<br><br>
+        <b>If you answered 'Other', please describe the category for this tool/resource:</b><br>${this.isOtherSelected ? this.form.otherCategoryDescription : 'N/A'}<br><br>
+        <b>Is it free and/or open-source?</b><br>${this.form.isFree}<br><br>
+        <b>Does it have specific applications to the autonomic nervous system and the neural control of organs?</b><br>${this.form.hasSpecificApplications}<br><br>
+        <b>Are you the tool/resource creator?</b><br>${this.form.isCreator}<br><br>
+        <b>Please provide any links to datasets or publications using this tool/resource</b><br>${this.linksToUsagesText}<br>
+        <b>Do you have any tutorials/user guides available?</b><br>${this.form.tutorialsAvailable}<br><br>
+        <b>Links to tutorials/user guides:</b><br>${this.linksToTutorialsText}<br>
+        <b>What type of user are you?</b><br>${this.form.user.typeOfUser}<br><br>
+        <b>First Name:</b><br>${this.form.user.firstName}<br><br>
+        <b>Last Name:</b><br>${this.form.user.lastName}<br><br>
+        <b>Email:</b><br>${this.form.user.email}
+      `
+      let formData = new FormData();
+      formData.append("type", "toolsAndResources")
+      formData.append("sendCopy", this.form.user.sendCopy)
+      formData.append("title", `T&R Submission: ${this.form.resourceName}`)
+      formData.append("description", description)
+      formData.append("userEmail", this.form.user.email)
+
+      // Save form to sessionStorage
+      saveForm(this.form)
+
+      await this.$axios
+        .post(`${process.env.portal_api}/tasks`, formData)
+        .then(() => {
+          if (this.form.user.shouldSubscribe) {
+            this.subscribeToNewsletter(this.form.user.email, this.form.user.firstName, this.form.user.lastName)
+          } else {
+            this.$emit('submit', this.form.user.firstName)
+          }
+        })
+        .catch(() => {
+          this.hasError = true
+        })
+        .finally(() => {
+          this.isSubmitting = false
+        })
+    }
+  },
+
+  watch: {
+    firstName() {
+      this.form.user.firstName = this.firstName
+    },
+    lastName() {
+      this.form.user.lastName = this.lastName
+    },
+    profileEmail() {
+      this.form.user.email = this.profileEmail
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+.submit-button {
+  text-align: left;
+  margin-bottom: 0 !important;
+}
+hr {
+  border-top: none;
+  border-left: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+  margin: 2rem 0;
+}
+.error {
+  color: $danger;
+}
+.recaptcha {
+  display: flex;
+  justify-content: left;
+}
+::v-deep .vertical-content {
+  .el-form-item__content {
+    display: flex;
+    flex-direction: column;
+    .el-radio {
+      line-height: 25px;
+      padding-left: 2rem;
+    }
+  }
+}
+::v-deep .resource-categories {
+  .el-form-item__content {
+    .el-checkbox {
+      padding-left: 2rem;
+      margin: 0;
+      line-height: 25px;
+    }
+  }
+  .el-form-item__label {
+    margin-bottom: .3rem;
+  }
+}
+</style>
diff --git a/components/ToolsAndResourcesForm/questions.js b/components/ContactUsForms/ToolsAndResourcesForm/questions.js
similarity index 70%
rename from components/ToolsAndResourcesForm/questions.js
rename to components/ContactUsForms/ToolsAndResourcesForm/questions.js
index 59adff79..0715ef6b 100644
--- a/components/ToolsAndResourcesForm/questions.js
+++ b/components/ContactUsForms/ToolsAndResourcesForm/questions.js
@@ -1,10 +1,4 @@
-export const sparcFunded = [
-  'Yes - Receive SPARC funding for bioelectronic medicine research', 
-  'No - Receive other funding for bioelectronic medicine research', 
-  'No - Not involved in bioelectronic medicine research'
-]
-
-export const levelOfInvolvement = [
+export const typeOfUser = [
   'Principal Investigator',
   'Co-Investigator or other Faculty Member',
   'Research Scientist',
diff --git a/components/ContactUsForms/UserContactFormItem.vue b/components/ContactUsForms/UserContactFormItem.vue
new file mode 100644
index 00000000..31c40c41
--- /dev/null
+++ b/components/ContactUsForms/UserContactFormItem.vue
@@ -0,0 +1,78 @@
+<template>
+  <div v-if="value">
+    <el-form-item
+      prop="user.typeOfUser"
+      label="What type of user are you? *"
+    >
+      <el-select
+        v-model="value.typeOfUser"
+        placeholder="Select one"
+        :popper-append-to-body="false"
+      >
+        <el-option
+          v-for="userType in userTypes"
+          :key="userType"
+          :label="userType"
+          :value="userType"
+        />
+      </el-select>
+    </el-form-item>
+
+    <el-form-item prop="user.firstName" label="First Name *">
+      <el-input v-model="value.firstName" placeholder="Enter your first name" />
+    </el-form-item>
+
+    <el-form-item prop="user.lastName" label="Last Name *">
+      <el-input v-model="value.lastName" placeholder="Enter your last name" />
+    </el-form-item>
+
+    <el-form-item prop="user.email" label="Email *" class="mb-0">
+      <el-input v-model="value.email" placeholder="Enter your email address" type="email" />
+    </el-form-item>
+
+    <el-form-item v-if="showFollowUpOption" prop="user.shouldFollowUp" class="mt-16 mb-0">
+      <el-checkbox v-model="value.shouldFollowUp">
+        <span class="body1">Let me know when you resolve this issue</span>
+      </el-checkbox>
+    </el-form-item>
+
+    <el-form-item prop="user.sendCopy" :class="['mb-0', { 'mt-16': !showFollowUpOption }]">
+      <el-checkbox v-model="value.sendCopy">
+        <span class="body1">Please send me a copy of this message</span>
+      </el-checkbox>
+    </el-form-item>
+
+    <el-form-item prop="user.shouldSubscribe">
+      <el-checkbox v-model="value.shouldSubscribe">
+        <span class="body1">Subscribe to the SPARC Newsletter</span>
+      </el-checkbox>
+    </el-form-item>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+
+export default {
+  name: 'UserContactFormItem',
+  props: {
+    showFollowUpOption: {
+      type: Boolean,
+      default: false
+    },
+    value: {
+      type: Object
+    }
+  },
+  computed: {
+    ...mapState('pages/contact-us', {
+      userTypes: state => state.formOptions.userTypes,
+    })
+  },
+  watch: {
+    value() {
+      this.$emit('input', this.value)
+    }
+  }
+}
+</script>
diff --git a/components/DataUseAgreementPopup/DataUseAgreementPopup.vue b/components/DataUseAgreementPopup/DataUseAgreementPopup.vue
index 185f521a..969f644e 100644
--- a/components/DataUseAgreementPopup/DataUseAgreementPopup.vue
+++ b/components/DataUseAgreementPopup/DataUseAgreementPopup.vue
@@ -4,72 +4,14 @@
     :visible="dialogVisible"
     @close-download-dialog="dialogVisible = false"
   >
-    <div class="content" slot="mainContent">
+    <div v-loading="agreementLoading" class="content p-16" slot="mainContent">
       <h1 class="heading1 mb-8">
-        Sign Data Use Agreement
+        {{ title }}
       </h1>
-      <div class="agreement-body">
-        <p class="body1">
-          NIH SPARC EMBARGOED DATA USE AGREEMENT
-        </p>
-        <div class="align-left">
-          <p class="body1">
-            The SPARC Portal (“Portal”) is a data sharing resource funded by the National Institutes of Health (NIH) Stimulating Peripheral Activity to Relieve Conditions (SPARC) program. The Portal is used to disseminate data, maps, computational studies, protocols, tools, and other digital resources, in order to accelerate development of therapeutic devices that modulate electrical activity in peripheral nerves. This therapeutic strategy, also known as bioelectronic medicine, could offer new treatment options for diverse diseases and conditions such as hypertension, heart failure, gastrointestinal disorders, type II diabetes, inflammatory disorders, and more. Data are made publicly available on the Portal and can be used under the terms of the CC-BY license (unless otherwise specified). The Portal contains data from a variety of researchers, including SPARC-funded researchers (“SPARC Data Generators”). The Portal also provides a mechanism to request and access data from SPARC Data Generators that is scheduled to become publicly available in the future (“Embargoed Data”), per the public release timeline defined in the SPARC Material Sharing Policy. All data on the Portal is assigned a contact person (“Corresponding Contributor”) from which access can be requested.
-          </p>
-          <p class="body1">
-            This NIH SPARC Embargoed Data Use Agreement (“Agreement”) describes the terms and conditions for use of Embargoed Data if access is approved by a Corresponding Author. For purposes of this Agreement, Embargoed Data means all information furnished by SPARC Data Generators and their unfunded project collaborators that is accessible through the Portal, but not yet publicly available, including without limitation, unpublished plans, methods, software, data, results, and findings by SPARC Data Generators.
-          </p>
-          <p class="body1">
-            After accepting the terms and conditions outlined below by executing this Agreement, individuals and organizations seeking access to data (“Data Users”) may request access to Embargoed Data residing in the Portal. Approval of a request to access Embargoed Data is at the sole discretion of the Corresponding Author.
-          </p>
-          <p class="body1">
-            Data User agrees to:
-          </p>
-          <p class="body1">
-            Not use Embargoed Data for any purpose other than for the research project described in the data access request.
-          </p>
-          <p class="body1">
-            Not disclose or distribute Embargoed Data to parties external to the SPARC Data Generator, even if said parties are employees of the same institution or entity as the SPARC Data Generator or Data User.
-          </p>
-          <p class="body1">
-            Not use Embargoed Data for any commercial purposes without first executing a license with the owner of the data.
-          </p>
-          <p class="body1">
-            Use the same level of care in safeguarding Embargoed Data that is used with his/her/their own confidential information of a similar nature, but in no event less than reasonable care.
-          </p>
-          <p class="body1">
-            Use the data in accordance with all applicable laws, rules and regulations, and policies.
-          </p>
-          <p class="body1">
-            Promptly report to the Corresponding Author any use or disclosure of the data not provided for by this Agreement of which it becomes aware; emails should CC info@sparc.science and use the specific subject line “Potential Data Breach Notification”.
-          </p>
-          <p class="body1">
-            Data User’s obligations of confidentiality and limited use under this Agreement do not extend to any information that:
-          </p>
-          <p class="body1">
-            is or becomes publicly available, except through breach of this Agreement.
-          </p>
-          <p class="body1">
-            Data User can demonstrate that he/she/they possessed prior to, or developed independently from, disclosure or development under this Agreement, and was not acquired directly or indirectly from the SPARC Data Generator.
-          </p>
-          <p class="body1">
-            becomes available to Data User from third party (external to the SPARC Data Generator) that, to the knowledge of Data User, is not legally prohibited from disclosing Embargoed Data.
-          </p>
-          <p class="body1">
-            Data User is required by law, regulation or court order to disclose, provided that the Corresponding Author is promptly notified of any such requirement to allow such owning Data User to seek a protective order or other modifications to the requirement.
-          </p>
-          <p class="body1">
-            NIH MAKES NO REPRESENTATIONS AND EXTENDS NO WARRANTIES OF ANY KIND, EITHER EXPRESSED OR IMPLIED. THERE ARE NO EXPRESSED OR IMPLIED WARRANTIES OF MERCHANTABILITY OR FITNESS FOR A PARTICULAR PURPOSE, OR THAT THE USE OF THE DATA WILL NOT INFRINGE ANY PATENT, COPYRIGHT, TRADEMARK, OR OTHER PROPRIETARY RIGHTS.
-          </p>
-          <p class="body1">
-            Unless prohibited by law, Data User assumes all liability for claims for damages against him/her/them by third parties which may arise from his/her/their use of the data.
-          </p>
-          <p class="body1">
-            Data User will accept the terms of this Agreement via electronic click.
-          </p>
-        </div>
+      <div class="agreement-body-container">
+        <span class="agreement-body" v-html="content" />
       </div>
-      <div class="align-left mt-16">
+      <div class="mt-16">
         <sparc-checkbox
           v-model="checkboxVal"
           :label=true
@@ -81,20 +23,23 @@
           Cancel
         </el-button>
         <el-button :disabled="!hasAcceptedAgreement" @click="submit">
-          Sign and Submit
+          Accept and Submit
         </el-button>
       </div>
     </div>
   </large-modal>
 </template>
 <script>
+import { pathOr, propOr } from 'ramda'
 
 export default {
   name: 'DataUseAgreementPopup',
   data() {
     return {
       dialogVisible: false,
-      checkboxVal: false
+      checkboxVal: false,
+      dataUseAgreement: {},
+      agreementLoading: true
     }
   },
   props: {
@@ -122,8 +67,30 @@ export default {
   computed: {
     hasAcceptedAgreement() {
       return this.checkboxVal
+    },
+    title() {
+      return propOr('', 'name', this.dataUseAgreement)
+    },
+    content() {
+      return propOr('', 'body', this.dataUseAgreement)
     }
   },
+  mounted() {
+    const datasetId = pathOr('', ['params', 'datasetId'], this.$route)
+    const url = `${process.env.discover_api_host}/datasets/${datasetId}/data-use-agreement`
+    this.$axios
+      .$get(url)
+      .then((response) => {
+        this.dataUseAgreement = response
+      })
+      .catch(() => {
+        return
+      })
+      .finally(() => {
+        this.$emit('agreement-loaded', propOr(null, 'id', this.dataUseAgreement))
+        this.agreementLoading = false
+      })
+  },
   methods: {
     submit: async function(x) {
       x.preventDefault()
@@ -137,11 +104,12 @@ export default {
 .close-button-container {
   text-align: right;
 }
-.agreement-body {
-  overflow: auto;
-  max-height: 20rem;
+.agreement-body-container {
+  max-height: 20rem; 
+  overflow: auto;  
 }
-.align-left {
-  text-align: left;
+.agreement-body {
+  white-space: pre-wrap;
+  overflow-wrap: break-word;
 }
 </style>
diff --git a/components/DatasetCitations/ApaCitation.vue b/components/DatasetCitations/ApaCitation.vue
index 3e408fba..863a90ae 100644
--- a/components/DatasetCitations/ApaCitation.vue
+++ b/components/DatasetCitations/ApaCitation.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div v-if="isDoiValid">
     <div v-if="canCopyCitation" class="citation-container py-16 pl-16 pr-24" v-loading="citationLoading">
       <button class="copy-button" @click="handleCitationCopy">
         <img src="../../static/images/copyIcon.png" />
@@ -43,7 +43,8 @@ export default {
       title: "",
       publisher: "",
       year: 0,
-      url: ""
+      url: "",
+      isDoiValid: true
     }
   },
 
@@ -72,15 +73,22 @@ export default {
         method: 'GET',
         headers: { Accept: 'application/json'}
       })
-        .then(response => response.json())
-        .then(json => {
+      .then(async response => {
+        if (response.status == '404') {
+          this.isDoiValid = false
+          this.$emit('doi-invalid', this.doi)
+        } else {
+          const json = await response.json()
           this.title = json.title
           this.authors = json.author
           this.publisher = json["container-title"]
           this.year = json.published["date-parts"][0][0]
           this.url = json.URL
-          this.citationLoading = false
-        })
+        }
+      })
+      .finally(() => {
+        this.citationLoading = false
+      })
     },
     /**
      * Handle copy citation to clipboard
@@ -109,19 +117,21 @@ export default {
     authorCitations() {
       let authorCitationText = ""
       let num = 0
-      if (this.authors.length == 1) {
-        let author = this.authors[0]
-        let lastName = this.getAuthorLastName(author)
-        let firstName = this.getAuthorFirstName(author)
-        authorCitationText = `${lastName}, ${firstName.charAt(0)}. `
-      }
-      else {
-        this.authors.forEach(author => {
+      if (this.authors) {
+        if (this.authors.length == 1) {
+          let author = this.authors[0]
           let lastName = this.getAuthorLastName(author)
           let firstName = this.getAuthorFirstName(author)
-          authorCitationText += num === this.authors.length-1 ? `and ${lastName}, ${firstName.charAt(0)}. ` : `${lastName}, ${firstName.charAt(0)}., `
-          num++
-        })
+          authorCitationText = `${lastName}, ${firstName.charAt(0)}. `
+        }
+        else {
+          this.authors.forEach(author => {
+            let lastName = this.getAuthorLastName(author)
+            let firstName = this.getAuthorFirstName(author)
+            authorCitationText += num === this.authors.length-1 ? `and ${lastName}, ${firstName.charAt(0)}. ` : `${lastName}, ${firstName.charAt(0)}., `
+            num++
+          })
+        }
       }
       return authorCitationText
     },
diff --git a/components/DatasetDetails/DatasetAboutInfo.vue b/components/DatasetDetails/DatasetAboutInfo.vue
index da704275..ec8151d7 100644
--- a/components/DatasetDetails/DatasetAboutInfo.vue
+++ b/components/DatasetDetails/DatasetAboutInfo.vue
@@ -32,6 +32,15 @@
         <span v-if="index < associatedProjects.length - 1">, </span>
       </span>
     </div>
+    <div class="mb-16">
+      <span class="label4">
+        Funding Program(s): 
+      </span>
+      <span v-for="(project, index) in associatedProjects" :key="index">
+        {{ getFundingProgram(project) }}
+        <span v-if="index < associatedProjects.length - 1">, </span>
+      </span>
+    </div>
     <hr />
     <div class="mb-16">
       <span class="label4">
@@ -60,7 +69,6 @@
     <div class="mb-16"><span class="label4">Dataset DOI: </span>
       <a
           :href="doiLink"
-          target="_blank"
       >
         {{ doiLink }}
       </a>
@@ -69,7 +77,7 @@
 </template>
 
 <script>
-import { propOr} from 'ramda'
+import { pathOr, propOr } from 'ramda'
 import { mapState } from 'vuex'
 
 import DateUtils from '@/mixins/format-date'
@@ -115,6 +123,14 @@ export default {
       const awardNumber = propOr(null, 'awardId', fields)
       return awardNumber !== null ? `NIH ${awardNumber}` : 'N/A'
     },
+    /**
+     * Get the funding program name
+     * @returns {String}
+     */
+     getFundingProgram: function(associatedProject) {
+      const program = pathOr(null, ['fields','program'], associatedProject)
+      return program.length > 0 ? program[0] : 'N/A'
+    },
     /**
      * Construct the project title
      * @returns {String}
diff --git a/components/DatasetDetails/DatasetActionBox.vue b/components/DatasetDetails/DatasetActionBox.vue
index ca6db6ee..c9df0299 100644
--- a/components/DatasetDetails/DatasetActionBox.vue
+++ b/components/DatasetDetails/DatasetActionBox.vue
@@ -4,77 +4,89 @@
     <sparc-pill class="sparc-pill" v-if="embargoed">
       Embargoed
     </sparc-pill>
-    <div class="button-container" v-if="datasetTypeName === 'scaffold' && !datasetInfo.study">
-      <div v-if="hasFiles" class="button-container">
+    <div class="button-container">
+      <template v-if="datasetTypeName === 'scaffold' && !datasetInfo.study">
+        <template v-if="hasFiles">
+          <el-button
+            class="dataset-button"
+            @click="actionButtonClicked('images')"
+          >
+            View Scaffold
+          </el-button>
+          <el-button
+            class="dataset-button"
+            @click="actionButtonClicked('files')"
+          >
+            Get Scaffold
+          </el-button>
+        </template>
+        <el-button class="secondary" @click="actionButtonClicked('cite')">
+          Cite Scaffold
+        </el-button>
+      </template>
+      <template v-else-if="datasetTypeName === 'computational model'">
+        <el-button v-if="canViewSimulation" @click="openSimulationViewer()">
+          View Simulation
+        </el-button>
+        <a
+          v-if="canRunSimulation"
+          :href="`https://osparc.io/study/${simulationId}`"
+          target="_blank"
+        >
+          <el-button>
+            Run Simulation
+          </el-button>
+        </a>
         <el-button
-          class="dataset-button"
-          @click="actionButtonClicked('images')"
+          v-if="hasFiles"
+          @click="actionButtonClicked('files')"
         >
-          View Scaffold
+          Get Model
         </el-button>
+        <el-button class="secondary" @click="actionButtonClicked('cite')">
+          Cite Model
+        </el-button>
+        <a
+          v-if="canViewSimulation || canRunSimulation"
+          href="https://osparc.io/"
+          target="_blank"
+        >
+          <sparc-tooltip
+            placement="left-center"
+          >
+            <div slot="data">
+              oSPARC simulations may offer<br />additional functionality, such as<br />more parameters, if you create<br />an account at
+              <a class="ospac-tooltip" href="https://osparc.io/">
+                osparc.io
+              </a>
+            </div>
+            <el-button slot="item" style="width: 100%;" class="secondary">
+              Go to oSPARC
+            </el-button>
+          </sparc-tooltip>
+        </a>
+      </template>
+      <template>
         <el-button
-          class="dataset-button"
+          v-if="hasFiles"
           @click="actionButtonClicked('files')"
         >
-          Get Scaffold
+          Get Dataset
         </el-button>
-      </div>
-      <el-button class="secondary" @click="actionButtonClicked('cite')">
-        Cite Scaffold
-      </el-button>
-    </div>
-    <div class="button-container" v-else-if="datasetTypeName === 'computational model'">
-      <el-button v-if="canViewSimulation" @click="openSimulationViewer()">
-        View Simulation
-      </el-button>
-      <a
-        v-if="canRunSimulation"
-        :href="`https://osparc.io/study/${simulationId}`"
-        target="_blank"
-      >
-        <el-button>
-          Run Simulation
+        <el-button class="secondary" @click="actionButtonClicked('cite')">
+          Cite Dataset
         </el-button>
-      </a>
-      <el-button
-        v-if="hasFiles"
-        @click="actionButtonClicked('files')"
-      >
-        Get Model
-      </el-button>
-      <el-button class="secondary" @click="actionButtonClicked('cite')">
-        Cite Model
-      </el-button>
-      <a
-        v-if="canViewSimulation || canRunSimulation"
-        href="https://osparc.io/"
-        target="_blank"
-      >
-        <sparc-tooltip
-          placement="left-center"
+      </template>
+      <template v-if="sdsViewer">
+        <a
+          :href="sdsViewer"
+          target="_blank"
         >
-          <div slot="data">
-            oSPARC simulations may offer<br />additional functionality, such as<br />more parameters, if you create<br />an account at
-            <a class="ospac-tooltip" href="https://osparc.io/">
-              osparc.io
-            </a>
-          </div>
-          <el-button slot="item" style="width: 100%;" class="secondary">
-            Go to oSPARC
+          <el-button class="secondary" @click="onSdsButtonClick">
+            Explore in SDS Viewer
           </el-button>
-        </sparc-tooltip>
-      </a>
-    </div>
-    <div class="button-container" v-else>
-      <el-button
-        v-if="hasFiles"
-        @click="actionButtonClicked('files')"
-      >
-        Get Dataset
-      </el-button>
-      <el-button class="secondary" @click="actionButtonClicked('cite')">
-        Cite Dataset
-      </el-button>
+        </a>
+      </template>
     </div>
   </div>
 </template>
@@ -138,6 +150,14 @@ export default {
     embargoed: function() {
       return propOr(false, 'embargo', this.datasetInfo)
     },
+    sdsViewer: function() {
+      if (this.datasetInfo.doi && process.env.SHOW_SDS_VIEWER === 'true') {
+        const metacellUrl = new URL(process.env.METACELL_SDS_VIEWER_URL)
+        metacellUrl.searchParams.append('doi', this.datasetInfo.doi)
+        return metacellUrl.toString()
+      }
+      return null
+    }
   },
 
   methods: {
@@ -148,7 +168,22 @@ export default {
     getDatasetDetailsTabArea: function() {
       return document.getElementById('datasetDetailsTabsContainer')
     },
-
+    onSdsButtonClick(){
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'sds_viewer_button_click',
+        location: 'dataset_action_box',
+        category: "",
+        dataset_id: propOr('', 'id', this.datasetInfo),
+        version_id: propOr('', 'version', this.datasetInfo),
+        doi: propOr('', 'doi', this.datasetInfo),
+        citation_type: "",
+        files: "",
+        file_name: "",
+        file_path: "",
+        file_type: "",
+      })
+    },
     /**
      * scroll to the dataset details tab area
      */
diff --git a/components/DatasetDetails/DatasetDescriptionInfo.vue b/components/DatasetDetails/DatasetDescriptionInfo.vue
index cde736ad..d3a069a6 100644
--- a/components/DatasetDetails/DatasetDescriptionInfo.vue
+++ b/components/DatasetDetails/DatasetDescriptionInfo.vue
@@ -159,19 +159,19 @@ export default {
       return propOr(false, 'embargo', this.datasetInfo)
     },
     anatomicalStructureText: function() {
-      return this.getFacetText('Anatomical Structure')
+      return this.getFacetText('anatomy.organ.name')
     },
     experimentalApproachText: function() {
-      return this.getFacetText('Experimental Approach')
+      return this.getFacetText('item.modalities.keyword')
     },
     speciesText: function() {
-      return this.getFacetText('Species')
+      return this.getFacetText('organisms.primary.species.name')
     },
     sexText: function() {
-      return this.getFacetText('Sex')
+      return this.getFacetText('attributes.subject.sex.value')
     },
     ageRangeText: function() {
-      return this.getFacetText('Age Categories')
+      return this.getFacetText('attributes.subject.ageCategory.value')
     },
     numberSamples: function() {
       return _.get(this.datasetMetadataInfo.item, 'statistics.samples.count')
@@ -225,9 +225,9 @@ export default {
   },
 
   methods: {
-    getFacetText(facetLabel) {
-       let text = ''
-      const facet = this.datasetFacetsData.find(item => item.label === facetLabel)
+    getFacetText(facetKey) {
+      let text = ''
+      const facet = this.datasetFacetsData.find(item => item.key === facetKey)
       if (facet === undefined || !facet.children)
       {
         return 'n/a'
@@ -255,6 +255,7 @@ export default {
 <style lang="scss" scoped>
 .dataset-description-info {
   overflow-wrap: anywhere;
+  word-wrap: normal;
   ::v-deep hr{
     margin-top: 1rem;
     border-top: none;
diff --git a/components/DatasetDetails/DatasetFilesInfo.vue b/components/DatasetDetails/DatasetFilesInfo.vue
index db757ff4..fe9d04aa 100644
--- a/components/DatasetDetails/DatasetFilesInfo.vue
+++ b/components/DatasetDetails/DatasetFilesInfo.vue
@@ -16,12 +16,15 @@
       Sign in</a> to the SPARC Portal to request
       access to or view the status of an access request to embargoed data.
       <div>
-        <el-button
-          class="mt-8"
-          disabled
-        >
-          Request Access
-        </el-button>
+        <sparc-tooltip content="Sign in to request access" placement="top-center">
+          <el-button
+            class="mt-8"
+            disabled
+            slot="item"
+          >
+            Request Access
+          </el-button>
+        </sparc-tooltip>
       </div>
     </div>
     <div v-else-if="embargoed && requestPending">
@@ -31,12 +34,15 @@
       release date for this dataset is <b>{{ embargoedReleaseDate }}</b> 
       and will become available to the public on that day.
       <div>
-        <el-button
-          class="mt-8"
-          disabled
-        >
-          Request Access
-        </el-button>
+        <sparc-tooltip content="Access request is pending" placement="top-center">
+          <el-button
+            class="mt-8"
+            disabled
+            slot="item"
+          >
+            Request Access
+          </el-button>
+        </sparc-tooltip>
       </div>
     </div>
     <div v-else-if="embargoed && !accessGranted">
@@ -55,7 +61,7 @@
       <div>
         <el-button
           class="my-8"
-          :disabled="embargoAccess != null"
+          :disabled="embargoAccess != null && agreementId != null"
           @click="openAgreementPopup()"
         >
           Request Access
@@ -71,7 +77,7 @@
           <div v-if="!isDatasetSizeLarge">
             <div><span class="label4">Option 1 - Direct download: </span>Download a zip archive of all the files and metadata directly to your computer free of charge. Please note that the files will be compressed upon download.</div>
             <a :href="downloadUrl">
-              <el-button class="my-16">Download full dataset</el-button>
+              <el-button @click='sendFullDownloadGtmEvent("portal")' class="my-16">Download full dataset</el-button>
             </a>
           </div>
           <div v-else>
@@ -85,19 +91,28 @@
               <el-button slot="item" disabled class="my-16">Download full dataset</el-button>
             </sparc-tooltip>
           </div>
+          <a
+            v-show="sdsViewer"
+            :href="sdsViewer"
+            target="_blank"
+          >
+            <el-button class="secondary" @click="onSdsButtonClick">
+              Explore in SDS Viewer
+            </el-button>
+          </a>
         </div>
         <div class="bx--col-sm-4 bx--col-md-8 bx--col aws-download-column">
           <div class="mb-8">
             <span class="label4">Option 2 - AWS download: </span>
             Download or transfer the dataset to your AWS Account. The files and metadata are stored in an AWS S3 Requester Pays bucket. You can learn more about downloading data from AWS on our
-            <a href="https://sparc.science/help/zQfzadwADutviJjT19hA5" target="_blank">Help Page</a>.
+            <a href="https://docs.sparc.science/docs/accessing-public-datasets" target="_blank">Help Page</a>.
           </div>
           <div class="aws-block mb-16 px-16 pb-16 pt-8">
             <div class="heading3">Resource Type</div>
             <div class="mb-0"><span class="heading3">Amazon S3 Bucket</span> (Requester Pays) *</div>
             <div class="download-text-block mb-8 p-4">
               {{ datasetArn }}
-              <button class="copy-button" @click="handleCitationCopy(datasetArn)">
+              <button class="copy-button" @click="handleS3CopyButtonClicked(datasetArn)">
                 <img src="../../static/images/copyIcon.png" />
               </button>
             </div>
@@ -124,23 +139,19 @@
           <span class="label4">Dataset size: </span>{{ formatMetric(datasetInfo.size) }}
         </span>
         <span class="dataset-link inline">
-          <nuxt-link
-            :to="{
-              name: 'help-helpId',
-              params: {
-                helpId: ctfDatasetNavigationInfoPageId
-              }
-            }"
+          <a
+            href="https://docs.sparc.science/docs/accessing-public-datasets"
             class="dataset-link"
           >
             How to navigate datasets
-          </nuxt-link>
+          </a>
         </span>
       </div>
       <files-table :osparc-viewers="osparcViewers" :dataset-scicrunch="datasetScicrunch"/>
     </div>
     <data-use-agreement-popup
       :show-dialog="showAgreementPopup"
+      @agreement-loaded="agreementLoaded"
       @dialog-closed="showAgreementPopup = false"
       @agreement-signed="requestAccess"
     />
@@ -174,15 +185,15 @@ export default {
 
   mixins: [DateUtils, FormatMetric],
 
-  props: {
-    osparcViewers: {
-      type: Object,
-      default: () => {}
-    },
-    datasetScicrunch: {
-      type: Object,
-      default: () => {}
-    }
+  async fetch() {
+    // Get oSPARC file viewers
+    this.osparcViewers = 
+      await this.$axios
+        .$get(`${process.env.portal_api}/sim/file`)
+        .then(osparcData => osparcData['file_viewers'])
+        .catch(() => {
+          return {}
+        })
   },
 
   computed: {
@@ -192,6 +203,9 @@ export default {
      */
     ...mapState('pages/datasets/datasetId', ['datasetInfo']),
     ...mapGetters('user', ['cognitoUserToken']),
+    datasetScicrunch() {
+      return propOr({}, 'sciCrunch', this.datasetInfo)
+    },
     userToken() {
       return this.cognitoUserToken || this.$cookies.get('user-token')
     },
@@ -251,15 +265,24 @@ export default {
         url += `&api_key=${this.userToken}`
       }
       return url
+    },
+    sdsViewer: function() {
+      if (this.datasetInfo.doi && process.env.SHOW_SDS_VIEWER === 'true') {
+        const metacellUrl = new URL(process.env.METACELL_SDS_VIEWER_URL)
+        metacellUrl.searchParams.append('doi', this.datasetInfo.doi)
+        return metacellUrl.toString()
+      }
+      return null
     }
   },
 
   data() {
     return {
-      ctfDatasetNavigationInfoPageId: process.env.ctf_dataset_navigation_info_page_id,
       awsMessage: 'us-east-1',
       showAgreementPopup: false,
       showLoginDialog: false,
+      osparcViewers: {},
+      agreementId: null
     }
   },
 
@@ -279,6 +302,25 @@ export default {
           this.$message(failMessage('Failed to copy.'))
         }
     },
+    onSdsButtonClick() {
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'sds_viewer_button_click',
+        location: 'files_tab',
+        category: "",
+        dataset_id: propOr('', 'id', this.datasetInfo),
+        version_id: propOr('', 'version', this.datasetInfo),
+        doi: propOr('', 'doi', this.datasetInfo),
+        citation_type: "",
+        files: "",
+        file_name: "",
+        file_path: "",
+        file_type: "",
+      })
+    },
+    agreementLoaded(id) {
+      this.agreementId = id
+    },
     openAgreementPopup: function() {
       this.showAgreementPopup = true
     },
@@ -287,7 +329,7 @@ export default {
 
       this.$axios
         .$post(url, {
-          datasetId: this.datasetInfo.id,
+          dataUseAgreementId: this.agreementId,
         })
         .then(() => {
           this.updateEmbargoAccess(EMBARGO_ACCESS.REQUESTED)
@@ -307,6 +349,26 @@ export default {
       }
 
       this.$store.dispatch('pages/datasets/datasetId/setDatasetInfo', newDatasetInfo)
+    },
+    handleS3CopyButtonClicked(text) {
+      this.sendFullDownloadGtmEvent("aws")
+      this.handleCitationCopy(text)
+    },
+    sendFullDownloadGtmEvent(location) {
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'download_full_dataset',
+        dataset_id: this.datasetId,
+        version_id: propOr('', 'version', this.datasetInfo),
+        doi: propOr('', 'doi', this.datasetInfo),
+        location: location,
+        category: "",
+        citation_type: "",
+        files: "",
+        file_name: "",
+        file_path: "",
+        file_type: "",
+      })
     }
   }
 }
diff --git a/components/DatasetDetails/DatasetHeader.vue b/components/DatasetDetails/DatasetHeader.vue
index b3cc924f..57b853f0 100644
--- a/components/DatasetDetails/DatasetHeader.vue
+++ b/components/DatasetDetails/DatasetHeader.vue
@@ -32,14 +32,14 @@
           </div>
           <div class="bx--col-sm-4 bx--col-md-8 bx--col-lg-16 bx--col-xlg-16">
             <hr />
-            <div v-if="primaryPublications">
+            <div v-if="showPrimaryPublications">
               <div class="publications-container">
                 <span class="primary-publications-title-column">
                   <span class="label4">Primary Publication(s): </span>
                 </span>
                 <span>
                   <div v-for="(item, index) in primaryPublications" :key="index" class="primary-publications-list-item">
-                    <apa-citation class="mb-8" :doi="item.doi" :can-copy-citation="false" />
+                    <apa-citation @doi-invalid="onDoiInvalid" class="mb-8" :doi="item.doi" :can-copy-citation="false" />
                   </div>
                 </span>
               </div>
@@ -79,6 +79,7 @@
 <script>
 import { mapState } from 'vuex'
 import { propOr } from 'ramda'
+import DoiChecker from '@/mixins/doi-checker'
 import ApaCitation from '@/components/DatasetCitations/ApaCitation'
 import ContributorItem from '@/components/ContributorItem/ContributorItem.vue'
 import DatasetInformationBox from '@/components/DatasetDetails/DatasetInformationBox.vue'
@@ -93,6 +94,8 @@ export default {
     ApaCitation,
   },
 
+  mixins: [DoiChecker],
+
   props: {
     latestVersionRevision: {
       type: String,
diff --git a/components/DatasetDetails/DatasetReferences.vue b/components/DatasetDetails/DatasetReferences.vue
index d5e6eaaf..ce5af6de 100644
--- a/components/DatasetDetails/DatasetReferences.vue
+++ b/components/DatasetDetails/DatasetReferences.vue
@@ -1,29 +1,29 @@
 <template>
   <div class="dataset-references">
-    <div v-if="primaryPublications">
+    <div v-if="showPrimaryPublications">
       <div class="heading2 mb-8">
         Primary Publications for this Dataset
       </div>
       <div v-for="(item, index) in primaryPublications" :key="index">
-        <apa-citation class="mb-8" :doi="item.doi" />
+        <apa-citation @doi-invalid="onDoiInvalid" class="mb-8" :doi="item.doi" />
       </div>
       <hr v-if="associatedPublications" />
     </div>
-    <div v-if="associatedPublications">
+    <div v-if="showAssociatedPublications">
       <div class="heading2 mb-8">
         Associated Publications for this Dataset
       </div>
       <div v-for="(item, index) in associatedPublications" :key="index">
-        <apa-citation class="mb-8" :doi="item.doi" />
+        <apa-citation @doi-invalid="onDoiInvalid" class="mb-8" :doi="item.doi" />
       </div>
       <hr v-if="preprints" />
     </div>
-    <div v-if="preprints">
+    <div v-if="showPreprints">
       <div class="heading2 mb-8">
         Preprints
       </div>
       <div v-for="(item, index) in preprints" :key="index">
-        <apa-citation class="mb-8" :doi="item.doi" />
+        <apa-citation @doi-invalid="onDoiInvalid" class="mb-8" :doi="item.doi" />
       </div>
     </div>
   </div>
@@ -31,6 +31,7 @@
 
 <script>
 
+import DoiChecker from '@/mixins/doi-checker'
 import ApaCitation from '@/components/DatasetCitations/ApaCitation'
 import { isEmpty } from 'ramda'
 
@@ -38,10 +39,10 @@ const PREPRINT_DOI_LINKS = ['https://doi.org/10.1101/']
 
 export default {
   name: 'DatasetReferences',
-
   components: {
     ApaCitation
   },
+  mixins: [DoiChecker],
   props: {
     primaryPublications: {
       type: Array,
diff --git a/components/DatasetDetails/SimilarDatasetsInfoBox.vue b/components/DatasetDetails/SimilarDatasetsInfoBox.vue
index d9ed53d5..b85a7256 100644
--- a/components/DatasetDetails/SimilarDatasetsInfoBox.vue
+++ b/components/DatasetDetails/SimilarDatasetsInfoBox.vue
@@ -15,11 +15,37 @@
         </div>
         <hr class="mt-16"/>
       </div>
-      <div class="my-8" v-for="facet in datasetFacetsData" :key="facet.label">
+      <div class="my-8" v-for="facet in datasetFacetsData" :key="facet.key">
         <div v-if="facet.children && showFacet(facet)">
           <div class="capitalize mb-8">{{facet.label}}:</div>
-          <div class="facet-button-container" v-for="child in facet.children" :key="child.id">
-            <sparc-tooltip placement="left-center" :content="capitalize(child.label)" is-repeating-item-content>
+          <div class="facet-button-container parent-facet mt-8" v-for="child in facet.children" :key="child.id">
+            <div v-if="child.children.length > 0">
+              <sparc-tooltip placement="left-center" :content="capitalize(child.label)" is-repeating-item-content>
+                  <div class="tooltip-item facet-button my-2 px-12 label2" slot="item">
+                    <a
+                      :href="getSelectedFacetLink(getFacetId(child))"
+                    >
+                      <div class="facet-label capitalize">
+                        {{child.label}}
+                      </div>
+                    </a>
+                  </div>
+              </sparc-tooltip>
+              <div class="facet-button-container child-facet" v-for="nestedChild in child.children" :key="nestedChild.id">
+                <sparc-tooltip class="ml-32" placement="left-center" :content="capitalize(nestedChild.label.split('.')[1])" is-repeating-item-content>
+                  <div class="ml-4 tooltip-item facet-button my-2 px-12 label2" slot="item">
+                    <a
+                      :href="getSelectedFacetLink(getFacetId(nestedChild))"
+                    >
+                      <div class="facet-label capitalize">
+                        {{nestedChild.label.split('.')[1]}}
+                      </div>
+                    </a>
+                  </div>
+                </sparc-tooltip> 
+              </div>
+            </div>
+            <sparc-tooltip v-else placement="left-center" :content="capitalize(child.label)" is-repeating-item-content>
               <div class="tooltip-item facet-button my-2 px-12 label2" slot="item">
                 <nuxt-link
                   :to="getSelectedFacetLink(getFacetId(child))"
@@ -71,7 +97,17 @@ import FormatString from '@/mixins/format-string'
 
 const algoliaClient = createAlgoliaClient()
 const algoliaIndex = algoliaClient.initIndex(process.env.ALGOLIA_INDEX)
-const EXPERIMENTAL_APPROACH_LABEL = facetPropPathMapping['item.modalities.keyword']
+const EXPERIMENTAL_APPROACH_LABEL = facetPropPathMapping.find(item => item.id == 'item.modalities').label
+
+const getPageTypeName = typeFacet => {
+  let typeName = 'dataset'
+  if (typeFacet === 'scaffold') {
+    typeName = 'model'
+  } else if (typeFacet === 'computational model') {
+    typeName = 'simulation'
+  }
+  return typeName
+}
 
 export default {
   name: 'SimilarDatasetsInfoBox',
@@ -127,31 +163,70 @@ export default {
     getFacetId(datasetFacet) {
       const key = datasetFacet.facetPropPath;
       const label = datasetFacet.label;
-      if (this.allFacetsData === []) {
+      if (this.allFacetsData == []) {
         return
       }
-      const category = this.allFacetsData.find(facet => facet.key === key);
+      let category = this.allFacetsData.find(facet => facet.key === key)
       if (category === undefined) {
-        return
+        // check heirarchal facets
+        this.allFacetsData.forEach(facet => {
+          let foundCategory = false
+          facet.children.forEach(child => {
+            if (child.children.length > 0) {
+              child.children.forEach(nestedChild => {
+                if (nestedChild.facetPropPath === key && nestedChild.label === label) {
+                  category = child
+                  foundCategory = true
+                  return
+                }
+              })
+              if (foundCategory) {
+                return
+              }
+            }
+          })
+          if (foundCategory) {
+            return
+          }
+        })
+        if (category === undefined) {
+          return
+        }
       }
       const correspondingFacet = category.children.find(child => child.label === label)
+      if (correspondingFacet == undefined) {
+        return
+      }
       return correspondingFacet.id
     },
     getSelectedFacetLink(facetId) {
-      return this.datasetTypeName === 'dataset' ?
-        `/data?type=dataset&selectedFacetIds=${facetId}` :
-        `/data?type=simulation&selectedFacetIds=${facetId}`
+      const pageName = getPageTypeName(this.datasetTypeName)
+      return `/data?type=${pageName}&selectedFacetIds=${facetId}`
     },
     getSelectedContributorLink(contributor) {
       const name = this.getContributorFullName(contributor)
-      return this.datasetTypeName === 'dataset' ?
-        `/data?type=dataset&q=${name}` :
-        `/data?type=simulation&q=${name}`
+      const pageName = getPageTypeName(this.datasetTypeName)
+      return `/data?type=${pageName}&search=${name}`
+    },
+    heirarchalFacetLabel(label) {
+      const labels = label.split('.')
+      return `${labels[0]} > ${labels[1]}`
     },
     showFacet(facet) {
       if (facet.label === EXPERIMENTAL_APPROACH_LABEL && !this.showExperimentalApproachFacet) {
         return false
       }
+      if (process.env.SHOW_HIERARCHAL_FACETS === 'true') {
+        // hide the parent facets
+        if (facet.key === 'anatomy.organ.name') {
+          return false
+        }
+      } else {
+        // hide the child facets
+        if (facet.key === 'anatomy.category.organ.name') {
+          return false
+        }
+      }
       return true
     },
     getContributorFullName: function(contributor) {
@@ -177,6 +252,7 @@ hr {
 }
 
 .facet-button {
+  display: block !important;
   border-radius: 15px;
   max-width: fit-content;
   background-color: #f9f2fc;
@@ -210,5 +286,17 @@ hr {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  display: inherit;
+}
+.parent-facet .child-facet:first-of-type::after {
+  content: url('../../static/images/child-parent-relationship.png');
+  display: block;
+  height: 0;
+  position: relative;
+  top: -1.8rem;
+}
+
+::v-deep .child-facet > span {
+  display: block;
 }
 </style>
diff --git a/components/DatasetSubmissionModal/DatasetSubmissionModal.vue b/components/DatasetSubmissionModal/DatasetSubmissionModal.vue
new file mode 100644
index 00000000..da110752
--- /dev/null
+++ b/components/DatasetSubmissionModal/DatasetSubmissionModal.vue
@@ -0,0 +1,274 @@
+<template>
+  <large-modal
+    v-if="modalVisible"
+    :visible="modalVisible"
+    @close-download-dialog="modalVisible = false"
+  >
+    <div slot="mainContent">
+      <h2>Dataset Submission Request</h2>
+      <p class="body1">This form allows you to submit a dataset submission request to outline your intention of submitting a dataset, computational, or anatomical model to the SPARC Portal.</p>
+      <el-form
+        ref="submitForm"
+        label-position="top"
+        :model="form"
+        :rules="formRules"
+        :hide-required-asterisk="true"
+      >
+        <el-form-item
+          prop="shortDescription"
+          label="Provide a short description of your data *"
+        >
+          <el-input
+            v-model="form.shortDescription"
+            placeholder="(Example: I am studying the effects of <approach> on <anatomical structure>)"
+            :disabled="disabled"
+          />
+        </el-form-item>
+
+        <el-form-item prop="detailedDescription" label="Provide a detailed description of your data *">
+          <el-input
+            v-model="form.detailedDescription"
+            type="textarea"
+            :rows="3"
+            placeholder="Please provide specifics about your data. Our curation team will then contact you."
+            :disabled="disabled"
+          />
+        </el-form-item>
+        <template v-for="question in questions">
+          <el-form-item
+            :key="question.id"
+            :label="question.question + ' *'"
+            :prop="question.id.toString()"
+          >
+            <el-input
+              v-model="form[question.id.toString()]"
+              type="textarea"
+              :rows="1"
+              placeholder="Please provide an answer."
+              :disabled="disabled"
+            />
+          </el-form-item>
+        </template>
+
+        <el-button class="secondary" :disabled="disabled || isSubmitting" @click="onSubmit">
+          Send Submission Request
+        </el-button>
+        <p v-if="hasError" class="error">
+          An error has occurred, please try again.
+        </p>
+      </el-form>
+    </div>
+  </large-modal>
+</template>
+
+<script>
+import { mapGetters, mapState } from 'vuex'
+
+export default {
+  name: 'DatasetSubmissionModal',
+
+  data: function() {
+    return {
+      modalVisible: false,
+      form: {
+        detailedDescription: '',
+        shortDescription: '',
+      },
+      isSubmitting: false,
+    }
+  },
+  props: {
+    questions: {
+      type: Array,
+      default: []
+    },
+    showModal: {
+      type: Boolean,
+      default: false
+    },
+    defaultForm: {
+      type: Object,
+      default: () => {}
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    }
+  },
+  watch: {
+    showModal: {
+      handler: function(show) {
+        if (show) {
+          this.modalVisible = true
+        }
+      }
+    },
+    modalVisible: {
+      handler: function(show) {
+        if (!show) {
+          this.$emit('modal-closed')
+        }
+      }
+    },
+    questions: {
+      handler: function() {
+        this.updateForm()
+      },
+      immediate: true
+    },
+    defaultForm() {
+      this.updateForm()
+    }
+  },
+  mounted() {
+    // Reset form fields when showing the form
+    this.hasError = false
+  },
+  computed: {
+    ...mapGetters('user', ['cognitoUserToken']),
+    ...mapState('pages/contact-us', {
+      userTypes: state => state.formOptions.userTypes,
+    }),
+    userToken() {
+      return this.cognitoUserToken || this.$cookies.get('user-token')
+    },
+    formRules() {
+      let formRules = {}
+      const formRuleValue = [{
+        required: true,
+        message: 'Please enter a response',
+        trigger: 'blur'
+      }]
+      for (const formKey in this.form) {
+        formRules[formKey] = formRuleValue
+      }
+      return formRules
+    },
+  },
+  methods: {
+    async onSubmit() {
+      this.hasError = false
+      await this.$refs.submitForm.validate(async valid => {
+        if (!valid) {
+          return
+        }
+        if (!this.hasError) {
+          await this.sendForm()
+          this.resetForm()
+        }
+      })
+    },
+    async sendForm() {
+      this.isSubmitting = true
+      this.modalVisible = false
+      const survey = this.questions.map(question => {
+        const questionId = parseInt(question.id)
+        const answer = this.form[questionId]
+        return {
+          "questionId": questionId,
+          "response": answer
+        }
+      })
+      const headers = { 'Authorization': `Bearer ${this.userToken}` }
+      const url = `${process.env.PENNSIEVE_API_VERSION_2}/publishing/repositories`
+      let orgNodeId = ''
+      await this.$axios
+        .get(url, { headers })
+        .then(({ data }) => {
+          orgNodeId = data.find(repo => repo.name === 'sparc')?.organizationNodeId
+        }).catch(() => {
+          this.hasError = true
+        }).finally(() => {
+          const formData = {
+            "name": this.form.shortDescription,
+            "description": this.form.detailedDescription,
+            "organizationNodeId": orgNodeId,
+            "survey": survey,
+            "contributors": []
+          }
+          this.$axios
+            .post(`${process.env.PENNSIEVE_API_VERSION_2}/publishing/proposal`, formData, { headers })
+            .then(({ data }) => {
+              this.$axios
+                .post(`${process.env.PENNSIEVE_API_VERSION_2}/publishing/proposal/submit?node_id=${data.nodeId}`, {}, { headers })
+                .catch(() => {
+                  this.hasError = true
+                  this.$message(failMessage('Failed to submit proposal.'))
+                }).finally(() => {
+                  this.$emit('proposal-submitted', data.nodeId)
+                  this.isSubmitting = false
+                })
+            })
+            .catch(() => {
+              this.hasError = true
+            })
+            .finally(() => {
+              this.isSubmitting = false
+            })
+        })
+    },
+    resetForm() {
+      this.form = {
+        detailedDescription: '',
+        shortDescription: '',
+      }
+    },
+    updateForm() {
+      if (this.questions == [])
+        return
+      this.questions.forEach(question => {
+        question['answer'] = this.defaultForm == {} ?  "" : this.defaultForm[question.id]
+      })
+      let form = {
+        detailedDescription: this.defaultForm == {} ?  '' : this.defaultForm.detailedDescription,
+        shortDescription: this.defaultForm == {} ?  '' : this.defaultForm.shortDescription,
+      }
+      this.questions.forEach(question => {
+        const key = question.id
+        const formValue = question.answer
+        form[key] = formValue
+      })
+      this.form = form
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+::v-deep .el-form-item__label {
+  color: $grey;
+  font-size: 1.5rem;
+  line-height: 2.25rem;
+  font-weight: 500;
+  margin-bottom: .5rem;
+  padding-bottom: 0;
+}
+::v-deep .el-select {
+  max-width: 20rem;
+  width: 100%;
+}
+::v-deep .el-input,
+.el-textarea,
+::v-deep .el-select-dropdown__item {
+  ::placeholder {
+    color: $lightGrey;
+  }
+}
+::v-deep .el-textarea__inner {
+  border-color: $lightGrey;
+  border-radius: 4px;
+  padding-top: .75rem;
+  padding-bottom: .75rem;
+  font-family: inherit;
+}
+::v-deep .el-textarea {
+  ::placeholder {
+    color: $lightGrey;
+  }
+}
+::v-deep .el-input.is-disabled .el-input__inner {
+  color: #c0c4cc !important;
+}
+
+</style>
diff --git a/components/Error/400.vue b/components/Error/400.vue
index fa939d67..ddeff0d4 100644
--- a/components/Error/400.vue
+++ b/components/Error/400.vue
@@ -29,7 +29,8 @@
               :to="{
                 name: 'contact-us',
                 query: {
-                  type: 'bug'
+                  type: 'bug',
+                  source_url: this.$nuxt.$route.fullPath
                 }
               }"
             >
diff --git a/components/Error/404.vue b/components/Error/404.vue
index a2665132..5ac81d56 100644
--- a/components/Error/404.vue
+++ b/components/Error/404.vue
@@ -29,7 +29,8 @@
               :to="{
                 name: 'contact-us',
                 query: {
-                  type: 'bug'
+                  type: 'bug',
+                  source_url: this.$nuxt.$route.fullPath
                 }
               }"
             >
diff --git a/components/EventCard/EventCard.vue b/components/EventCard/EventCard.vue
index 9518ee8e..7e671f84 100644
--- a/components/EventCard/EventCard.vue
+++ b/components/EventCard/EventCard.vue
@@ -111,7 +111,7 @@ export default {
   background: #fff;
   border: 1px solid #dbdfe6;
   color: $dark-sky;
-  padding: 1em;
+  padding: 1.5em 1em;
   &__image {
     margin-bottom: 1rem;
     overflow: hidden;
diff --git a/components/EventListItem/EventListItem.vue b/components/EventListItem/EventListItem.vue
index 221d1039..b9ba6415 100644
--- a/components/EventListItem/EventListItem.vue
+++ b/components/EventListItem/EventListItem.vue
@@ -1,5 +1,6 @@
 <template>
-  <div class="event-list-item">
+  <div :v-if="isDestinationLinkRetreived" :class="['event-list-item', { 'past-events-divider': showPastEventsDivider }]" >
+    <hr v-if="showPastEventsDivider" class="divider-text" data-content="PAST EVENTS" />
     <div class="event-content">
       <div class="image">
         <event-banner-image :src="bannerUrl" />
@@ -14,10 +15,13 @@
           }"
           v-html="highlightMatches(item.fields.title, $route.query.search)"
         />
-        <a v-else class="link1" :href="item.fields.url" :target="isInternalLink('item.fields.url') ? '_self' : '_blank'">
+        <a v-else-if="item.fields.url" class="link1" :href="item.fields.url" :target="openInNewTab ? '_blank' : '_self'">
           <span v-html="highlightMatches(item.fields.title, $route.query.search)"/>
-          <svg-icon v-if="!isInternalLink('item.fields.url')" name="icon-open" height="30" width="30" />
+          <svg-icon v-if="openInNewTab" name="icon-open" height="30" width="30" />
         </a>
+        <div v-else>
+          <span v-html="highlightMatches(item.fields.title, $route.query.search)"/>
+        </div>
         <div>
           <div class="body1 my-8" v-html="highlightMatches(item.fields.summary, $route.query.search)"/>
           <table class="property-table">
@@ -57,11 +61,11 @@ import { isEmpty, pathOr } from 'ramda'
 import eventBannerImage from '@/components/EventBannerImage/EventBannerImage.vue'
 import FormatDate from '@/mixins/format-date'
 
-import { isInternalLink } from '@/mixins/marked/index'
+import { isInternalLink, opensInNewTab } from '@/mixins/marked/index'
 import { highlightMatches } from '../../pages/data/utils'
 
 export default {
-  name: 'EventCard',
+  name: 'EventListItem',
   components: {
     eventBannerImage
   },
@@ -70,7 +74,40 @@ export default {
     item: {
       type: Object,
       default: () => {}
+    },
+    showPastEventsDivider: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      isDestinationLinkRetreived: false,
+      openInNewTab: false
+    }
+  },
+  async mounted() {
+    const url = pathOr("", ['fields', 'url'], this.item)
+    if (url.includes('bit.ly')) {
+      const bitlyId = url.replace("https://", "")
+      try {
+        const response = await this.$axios.post(process.env.bitly_expand_endpoint, { bitlink_id: bitlyId }, {
+          headers: {
+            Authorization: `Bearer ${process.env.BITLY_ACCESS_TOKEN}`,
+            'Content-Type': 'application/json',
+          }
+        })
+        const newUrl = response.data.long_url
+        this.openInNewTab = !isInternalLink(newUrl)
+      } catch {
+        console.log("Error retreiving bitly link destination url")
+        this.openInNewTab = !isInternalLink(url)
+      }
+    }
+    else {
+      this.openInNewTab = !isInternalLink(url)
     }
+    this.isDestinationLinkRetreived = true
   },
   computed: {
     /**
@@ -106,13 +143,14 @@ export default {
   },
   methods: {
     isInternalLink,
-    highlightMatches
+    highlightMatches,
+    opensInNewTab
   }
 }
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/_variables.scss';
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
 .el-table {
   width: 100%;
 }
@@ -139,6 +177,34 @@ table:not([class^='el-table__'])::before {
   background-color: white;
   margin-bottom: 5px;
 }
+.divider-text {
+  line-height: 1em;
+  position: relative;
+  outline: 0;
+  border: 0;
+  color: $grey;
+  text-align: center;
+  height: 1.5em;
+  &:before {
+    content: '';
+    background: linear-gradient(to right, transparent, $grey, transparent);
+    position: absolute;
+    left: 0;
+    top: 50%;
+    width: 100%;
+    height: 1px;
+  }
+  &:after {
+    content: attr(data-content);
+    position: relative;
+    display: inline-block;
+    color: $grey;
+    padding: 0 .5em;
+    line-height: 1.5em;
+    font-weight: 500;
+    background-color: white;
+  }
+}
 .event-content {
   display: flex;
   flex-direction: row;
diff --git a/components/FacetMenu/CommunitySpotlightFacetMenu.vue b/components/FacetMenu/CommunitySpotlightFacetMenu.vue
index acc89867..9c309e35 100644
--- a/components/FacetMenu/CommunitySpotlightFacetMenu.vue
+++ b/components/FacetMenu/CommunitySpotlightFacetMenu.vue
@@ -76,7 +76,7 @@ export default {
   computed: {
     selectedFacet: function() {
       let facets = []
-      if (this.selectedAnatomicalStructures !== []) {
+      if (this.selectedAnatomicalStructures != []) {
         this.selectedAnatomicalStructures.forEach(selectedOption => {
           facets.push({
             label: `${selectedOption.label}`,
@@ -85,7 +85,7 @@ export default {
           })
         })
       }
-      if (this.selectedSpotlightTypes !== []) {
+      if (this.selectedSpotlightTypes != []) {
         this.selectedSpotlightTypes.forEach(selectedOption => {
           facets.push({
             label: `${selectedOption.label}`,
diff --git a/components/FacetMenu/DatasetFacetMenu.vue b/components/FacetMenu/DatasetFacetMenu.vue
index b9f7db1a..eac26756 100644
--- a/components/FacetMenu/DatasetFacetMenu.vue
+++ b/components/FacetMenu/DatasetFacetMenu.vue
@@ -16,7 +16,7 @@
     <dropdown-multiselect
       v-for="item in this.facets"
       v-show="visibleCategories.includes(item.key)"
-      collapse-by-default
+      :collapse-by-default="!containsSelectedId(item)"
       :key="item.id"
       :category="constructCategory(item)"
       :visible-data="visibleFacets"
@@ -37,7 +37,7 @@
 </template>
 
 <script>
-import { pluck, pathOr } from 'ramda'
+import { pluck, pathOr, propOr } from 'ramda'
 import FacetMenu from './FacetMenu.vue'
 import { facetPropPathMapping } from '~/pages/data/utils'
 
@@ -58,16 +58,28 @@ const embargoedFacetCategory = {
   ]
 }
 
-const visibleDatasetsFacetCategories = [
-  'anatomy.organ.name',
-  'organisms.primary.species.name',
-  'item.modalities.keyword',
-  'attributes.subject.sex.value',
-  'attributes.subject.ageCategory.value',
-  'availability'
-];
+const visibleDatasetsFacetCategories = process.env.SHOW_HIERARCHAL_FACETS === 'true' ?
+  [
+    'anatomy.organ.category.name',
+    'anatomy.organ.subcategory.name',
+    'organisms.primary.species.name',
+    'item.modalities.keyword',
+    'attributes.subject.sex.value',
+    'attributes.subject.ageCategory.value',
+    'availability'
+  ] :
+  [
+    'anatomy.organ.name',
+    'organisms.primary.species.name',
+    'item.modalities.keyword',
+    'attributes.subject.sex.value',
+    'attributes.subject.ageCategory.value',
+    'availability'
+  ]
 
-const visibleModelsAndSimulationsFacetCategories = ['anatomy.organ.name', 'availability'];
+const visibleModelsAndSimulationsFacetCategories = process.env.SHOW_HIERARCHAL_FACETS === 'true' ?
+  ['anatomy.organ.category.name', 'anatomy.organ.subcategory.name', 'availability', 'organisms.primary.species.name'] :
+  ['anatomy.organ.name', 'availability', 'organisms.primary.species.name']
 
 const embargoFacetCategoryTooltip = "SPARC datasets are subject to a 1 year embargo during which time<br/>the datasets are visible only to members of the SPARC consortium.<br/>During embargo, the public will be able to view basic metadata about<br/>these datasets as well as their release date."
 
@@ -141,9 +153,10 @@ export default {
       if (item === null || item === undefined) {
         return
       }
+      const categoryFacet = facetPropPathMapping.find(category => category.facetPropPath === item.key)
       const category = {
         label: item.label,
-        id: Object.keys(facetPropPathMapping).find(key => facetPropPathMapping[key] === item.label),
+        facet: categoryFacet,
         data: item.children
       }
       return category
@@ -179,8 +192,9 @@ export default {
       }
       let filters = this.embargoedFilter
       filters = `(${filters}) AND `
-      const facetPropPaths = Object.keys(facetPropPathMapping)
+      const facetPropPaths = facetPropPathMapping.map(item => item.facetPropPath)
       facetPropPaths.map(facetPropPath => {
+        const subpropPath = facetPropPathMapping.find(facet => facet.facetPropPath == facetPropPath)?.facetSubpropPath || ''
         if (!this.visibleCategories.includes(facetPropPath)) {
           return
         }
@@ -194,6 +208,15 @@ export default {
           }
           filter += `"${facetPropPath}":"${facet.label}" OR `
         })
+        const subfacetsToOr = this.selectedFacetArray.filter(
+          facet => facet.facetPropPath == subpropPath
+        )
+        subfacetsToOr.map(facet => {
+          if (pathOr(undefined, [facet.facetPropPath, facet.label], this.visibleFacets) === undefined) {
+            return
+          }
+          filter += `"${subpropPath}":"${facet.label}" OR `
+        })
         if (filter == '') {
           return
         }
@@ -210,7 +233,7 @@ export default {
     },
     deselectAllFacets() {
       this.$refs.facetCategories.map(facetCategory => {
-        if (this.visibleCategories.includes(facetCategory.category.id))
+        if (this.visibleCategories.includes(pathOr('', ['category','facet','facetPropPath'], facetCategory)))
           facetCategory.uncheckAll()
       })
       this.$refs.embargoedFacetCategory.uncheckAll()
@@ -221,11 +244,23 @@ export default {
     },
     expandAllCategories() {
       this.$refs.facetCategories.map(facetCategory => {
-        if (this.visibleCategories.includes(facetCategory.category.id))
+        if (this.visibleCategories.includes(pathOr('', ['category','facet','facetPropPath'], facetCategory)))
           facetCategory.setCollapsed(false)
       })
       this.$refs.embargoedFacetCategory.setCollapsed(false)
     },
+    containsSelectedId(item) {
+      const children = propOr([], 'children', item)
+      return children.some(child => {
+        let found = this.defaultCheckedFacetIds.some(checkedId => parseInt(checkedId) == (propOr('', 'id', child)))
+        if (!found && child.children.length > 0) {
+          found = child.children.some(nestedChild => {
+            return this.defaultCheckedFacetIds.some(checkedId => parseInt(checkedId) == (propOr('', 'id', nestedChild)))
+          })
+        }
+        return found
+      })
+    }
 	}
 }
 </script>
diff --git a/components/FacetMenu/EventsFacetMenu.vue b/components/FacetMenu/EventsFacetMenu.vue
index cc0aa84c..6d36ca6d 100644
--- a/components/FacetMenu/EventsFacetMenu.vue
+++ b/components/FacetMenu/EventsFacetMenu.vue
@@ -91,8 +91,8 @@ export default {
       selectedEventTypeOptions: [],
       eventDateOption: 'show all',
       eventTypeOption: 'show all',
-      eventMonth: 'Mar',
-      eventYear: 2020,
+      eventMonth: new Date().toLocaleString('en-US', {month: 'short'}),
+      eventYear: new Date().getFullYear(),
       visibleCategories: visibleCategories,
     }
   },
diff --git a/components/FacetMenu/FacetRadioButtonDateCategory.vue b/components/FacetMenu/FacetRadioButtonDateCategory.vue
index f01361c5..8d585208 100644
--- a/components/FacetMenu/FacetRadioButtonDateCategory.vue
+++ b/components/FacetMenu/FacetRadioButtonDateCategory.vue
@@ -68,7 +68,8 @@ export default {
 
   computed: {
     monthNumber: function() {
-      return new Date(this.month + '/1/01').getMonth() + 1
+      // This Date format should be supported by all browsers. Used to convert month string to a number
+      return new Date(`2001, ${this.month}, 01`).getMonth() + 1
     }
   },
   watch: {
diff --git a/components/FacetMenu/NewsFacetMenu.vue b/components/FacetMenu/NewsFacetMenu.vue
index 9a03dc09..bf847a41 100644
--- a/components/FacetMenu/NewsFacetMenu.vue
+++ b/components/FacetMenu/NewsFacetMenu.vue
@@ -42,13 +42,21 @@ const SUBJECT_CATEGORY = {
   id: 'subject',
   data: [
     {
-      label: 'News article',
+      label: 'General News',
       id: 'News Article',
     },
     {
-      label: 'Funding oppotunity',
+      label: 'Funding Opportunity',
       id: 'Funding Opportunity',
-    }
+    },
+    {
+      label: 'Highlight',
+      id: 'Highlight',
+    },
+    {
+      label: 'Portal Update',
+      id: 'Portal Update',
+    },
   ]
 }
 
@@ -65,8 +73,8 @@ export default {
       newsSubjects: SUBJECT_CATEGORY,
       selectedNewsSubjectIds: [],
       publicationDateOption: 'show all',
-      publicationMonth: 'Mar',
-      publicationYear: 2020,
+      publicationMonth: new Date().toLocaleString('en-US', {month: 'short'}),
+      publicationYear: new Date().getFullYear(),
       visibleCategories: visibleCategories,
     }
   },
diff --git a/components/FacetMenu/ProjectsFacetMenu.vue b/components/FacetMenu/ProjectsFacetMenu.vue
index 376e2858..aff3f935 100644
--- a/components/FacetMenu/ProjectsFacetMenu.vue
+++ b/components/FacetMenu/ProjectsFacetMenu.vue
@@ -16,8 +16,15 @@
       ref="anatomicalFocusCategory"
       collapse-by-default
       :category="anatomicalFocusCategory"
-      :default-checked-ids="defaultCheckedFacetIds"
-      @selection-change="onSelectionChange"
+      :default-checked-ids="defaultCheckedAnatomicalFocusIds"
+      @selection-change="onAnatomicalFacetSelectionChange"
+    />
+    <dropdown-multiselect
+      ref="fundingCategory"
+      collapse-by-default
+      :category="fundingCategory"
+      :default-checked-ids="defaultCheckedFundingIds"
+      @selection-change="onFundingFacetSelectionChange"
     />
   </div>
 </template>
@@ -27,6 +34,7 @@ import { pluck } from 'ramda'
 import FacetMenu from './FacetMenu.vue'
 
 const ANATOMICAL_FOCUS_CATEGORY_ID = 'anatomicalFocus'
+const FUNDING_CATEGORY_ID = 'funding'
 
 export default {
   name: 'ProjectsFacetMenu',
@@ -38,33 +46,48 @@ export default {
       type: Array,
       default: () => []
     },
+    fundingFacets: {
+      type: Array,
+      default: () => []
+    }
   },  
   
   data() {
     return {
       selectedAnatomicalFocusFacets: [],
-      selectedFacetArray: [],
-      defaultCheckedFacetIds: [],
+      selectedFundingFacets: [],
+      defaultCheckedAnatomicalFocusIds: [],
+      defaultCheckedFundingIds: []
     }
   },
 
   computed: {
     anatomicalFocusCategory: function() {
       return {
-        label: 'Anatomical Focus',
+        label: 'Focus',
         id: ANATOMICAL_FOCUS_CATEGORY_ID,
         data: this.anatomicalFocusFacets
       }
     },
+    fundingCategory: function() {
+      return {
+        label: 'Funding Program',
+        id: FUNDING_CATEGORY_ID,
+        data: this.fundingFacets
+      }
+    },
     visibleCategories: function() {
-      return [ANATOMICAL_FOCUS_CATEGORY_ID]
+      return [ANATOMICAL_FOCUS_CATEGORY_ID, FUNDING_CATEGORY_ID]
     },
     selectedAnatomicalFocusIds: function() {
       return pluck('id', this.selectedAnatomicalFocusFacets).toString()
     },
+    selectedFundingIds: function() {
+      return pluck('id', this.selectedFundingFacets).toString()
+    },
     selectedFacets: function() {
       let facets = []
-      if (this.selectedAnatomicalFocusFacets !== []) {
+      if (this.selectedAnatomicalFocusFacets != []) {
         this.selectedAnatomicalFocusFacets.forEach(selectedOption => {
           facets.push({
             label: `${selectedOption.label}`,
@@ -73,25 +96,50 @@ export default {
           })
         })
       }
+      if (this.selectedFundingFacets != []) {
+        this.selectedFundingFacets.forEach(selectedOption => {
+          facets.push({
+            label: `${selectedOption.label}`,
+            id: `${selectedOption.id}`,
+            facetPropPath: this.fundingCategory.id
+          })
+        })
+      }
       return facets
     },
   },
 
   mounted() {
-    if (this.$route.query.selectedProjectsFacetIds) {
-      this.defaultCheckedFacetIds = this.$route.query.selectedProjectsFacetIds.split(",")
+    if (this.$route.query.selectedProjectsAnatomicalFocusIds) {
+      this.defaultCheckedAnatomicalFocusIds = this.$route.query.selectedProjectsAnatomicalFocusIds.split(",")
+    }
+    if (this.$route.query.selectedProjectsFundingIds) {
+      this.defaultCheckedFundingIds = this.$route.query.selectedProjectsFundingIds.split(",")
     }
   },
 
   methods: {
-    onSelectionChange: function(data) {
+    onAnatomicalFacetSelectionChange: function(data) {
       this.selectedAnatomicalFocusFacets = data.checkedNodes
       const selectedFacetIds = this.selectedAnatomicalFocusFacets.length === 0 ? undefined : this.selectedAnatomicalFocusIds
 
       this.$router.replace({
         query: { 
           ...this.$route.query, 
-          selectedProjectsFacetIds: selectedFacetIds
+          selectedProjectsAnatomicalFocusIds: selectedFacetIds
+        }
+      }).then(() => {
+        this.$emit('projects-selections-changed')
+      })
+    },
+    onFundingFacetSelectionChange: function(data) {
+      this.selectedFundingFacets = data.checkedNodes
+      const selectedFacetIds = this.selectedFundingFacets.length === 0 ? undefined : this.selectedFundingIds
+
+      this.$router.replace({
+        query: { 
+          ...this.$route.query, 
+          selectedProjectsFundingIds: selectedFacetIds
         }
       }).then(() => {
         this.$emit('projects-selections-changed')
@@ -100,14 +148,32 @@ export default {
     getSelectedAnatomicalFocusTypes: function() {
       return this.selectedAnatomicalFocusFacets.length > 0 ? this.selectedAnatomicalFocusIds : undefined
     },
+    getSelectedFundingTypes: function() {
+      return this.selectedFundingFacets.length > 0 ? this.selectedFundingIds : undefined
+    },
     deselectAllFacets() {
-      this.$refs.anatomicalFocusCategory.uncheckAll()
+      this.$router.replace(
+        {
+          query: {
+            ...this.$route.query,
+            selectedProjectsAnatomicalFocusIds: undefined,
+            selectedFundingIds: undefined
+          }
+        },
+        () => {
+          this.$emit('projects-selections-changed')
+          this.$refs.anatomicalFocusCategory.uncheckAll()
+          this.$refs.fundingCategory.uncheckAll()
+        }
+      )
     },
     deselectFacet(id) {
       this.$refs.anatomicalFocusCategory.uncheck(id)
+      this.$refs.fundingCategory.uncheck(id)
     },
     expandAllCategories() {
       this.$refs.anatomicalFocusCategory.setCollapsed(false)
+      this.$refs.fundingCategory.setCollapsed(false)
     },
 	}
 }
diff --git a/components/FacetMenu/RadioDateOption.vue b/components/FacetMenu/RadioDateOption.vue
index f63d6e9e..6645023a 100644
--- a/components/FacetMenu/RadioDateOption.vue
+++ b/components/FacetMenu/RadioDateOption.vue
@@ -1,10 +1,10 @@
 <template>
   <div>
-    <el-radio class="margin-bottom" :label="label" />
-    <div class="flex margin-y">
+    <el-radio class="mb-4" :label="label" />
+    <div class="flex ml-0 mr-24">
       <el-select
         v-model="month"
-        class="margin-right"
+        class="mr-8 month"
         placeholder="Month"
         :disabled="!enabled"
         @change="monthChanged"
@@ -18,7 +18,7 @@
       </el-select>
       <el-input-number
         v-model="year"
-        class="remove-number-arrows"
+        controls-position="right"
         placeholder="Year"
         :precision="0"
         :min="2000"
@@ -115,17 +115,10 @@ export default {
   border-color: #8300bf;
   background: #8300bf;
 }
-.remove-number-arrows > .el-input-number__increase,
-.remove-number-arrows > .el-input-number__decrease {
-  display: none;
-}
-.remove-number-arrows > .el-input > .el-input__inner {
-  padding: 0;
-}
 </style>
 
 <style lang="scss" scoped>
-@import '../../assets/_variables.scss';
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
 
 .flex {
   display: flex;
@@ -137,11 +130,8 @@ export default {
   margin: 0 1.5rem;
 }
 
-.margin-right {
-  margin-right: 0.5rem;
-}
-
-.margin-bottom {
-  margin-bottom: 0.25rem;
+.month {
+  max-width: 5rem;
+  min-width: 4.75rem;
 }
 </style>
diff --git a/components/FacetMenu/TagsContainer.vue b/components/FacetMenu/TagsContainer.vue
index 70051249..5f556b01 100644
--- a/components/FacetMenu/TagsContainer.vue
+++ b/components/FacetMenu/TagsContainer.vue
@@ -37,7 +37,7 @@
         closable
         @close="deselectFacet(facet.id)"
       >
-        {{ facet.label }}
+        {{ facet.label.split('.').pop() }}
       </el-tag>
     </el-card>
   </div>
@@ -139,5 +139,8 @@ export default {
   .purple-fill {
     fill: $purple;
   }
+  ::v-deep .popover {
+    background-color: #f9f2fc;
+  }
 }
 </style>
diff --git a/components/FacetMenu/ToolsAndResourcesFacetMenu.vue b/components/FacetMenu/ToolsAndResourcesFacetMenu.vue
index 430dbcc9..7b96797c 100644
--- a/components/FacetMenu/ToolsAndResourcesFacetMenu.vue
+++ b/components/FacetMenu/ToolsAndResourcesFacetMenu.vue
@@ -8,27 +8,31 @@
       @deselect-all-facets="deselectAllFacets"
     />
     <dropdown-multiselect
-      :category="developedBySparcCategory"
-      :default-checked-ids="selectedDevelopedBySparcIds"
-      @selection-change="onDevelopedBySparcChanged"
-      ref="developedBySparcCategory"
+      :category="typeCategory"
+      :default-checked-ids="selectedTypeIds"
+      @selection-change="onTypesChanged"
+      ref="typeCategory"
     />
   </div>
 </template>
 
 <script>
 import FacetMenu from './FacetMenu.vue'
+import { pluck } from 'ramda'
 
-const visibleCategories = ['developedBySparc']
+const visibleCategories = ['type']
 
-const developedBySparcCategory = {
-  label: 'Developed By SPARC',
-  id: 'developedBySparc',
+const TYPE_CATEGORY = {
+  label: 'Type',
+  id: 'type',
   data: [
     {
       label: 'Developed By SPARC',
-      id: 'developedBySparc',
-      facetPropPath: 'developedBySparc'
+      id: 'developedBySparc'
+    },
+    {
+      label: 'Codeathon',
+      id: 'codeathon'
     }
   ]
 }
@@ -40,8 +44,8 @@ export default {
 
   data() {
     return {
-      developedBySparcCategory: developedBySparcCategory,
-      selectedDevelopedBySparcIds: [],
+      typeCategory: TYPE_CATEGORY,
+      selectedTypeIds: [],
       visibleCategories: visibleCategories,
     }
   },
@@ -49,12 +53,12 @@ export default {
   computed: {
     selectedFacets: function() {
       let facets = []
-      if (this.selectedDevelopedBySparcIds !== []) {
-        this.selectedDevelopedBySparcIds.forEach(selectedOption => {
+      if (this.selectedTypeIds !== []) {
+        this.selectedTypeIds.forEach(selectedOption => {
           facets.push({
-            label: `${developedBySparcCategory.label}`,
+            label: `${selectedOption.label}`,
             id: `${selectedOption.id}`,
-            facetPropPath: developedBySparcCategory.id
+            facetPropPath: this.typeCategory.id
           })
         })
       }
@@ -63,8 +67,8 @@ export default {
   },
 
   mounted() {
-    if (this.$route.query.developedBySparc) {
-      this.selectedDevelopedBySparcIds = ['developedBySparc']
+    if (this.$route.query.type) {
+      this.selectedTypeIds = this.$route.query.type.split(',')
     }
   },
 
@@ -72,11 +76,11 @@ export default {
     visibleFacetsForCategory: function(key) {
       return this.visibleFacets[key]
     },
-    onDevelopedBySparcChanged: function(newValue) {
-      this.selectedDevelopedBySparcIds = newValue.checkedNodes
+    onTypesChanged: function(newValue) {
+      this.selectedTypeIds = newValue.checkedNodes
       this.$router.replace(
         {
-          query: { ...this.$route.query, developedBySparc: this.selectedDevelopedBySparcIds.length === 0 ? undefined : true }
+          query: { ...this.$route.query, type: this.selectedTypeIds.length === 0 ? undefined : pluck('id', this.selectedTypeIds).toString() }
         },
         () => {
           this.$emit('tool-and-resources-selections-changed')
@@ -88,17 +92,18 @@ export default {
         {
           query: {
             ...this.$route.query,
-            developedBySparc: undefined
+            developedBySparc: undefined,
+            codeathon: undefined
           }
         },
         () => {
           this.$emit('tool-and-resources-selections-changed')
-          this.$refs.developedBySparcCategory.uncheckAll()
+          this.$refs.typeCategory.uncheckAll()
         }
       )
     },
     deselectFacet(id) {
-      this.$refs.developedBySparcCategory.uncheck(id)
+      this.$refs.typeCategory.uncheck(id)
     },
   }
 }
diff --git a/components/FeaturedData/FeaturedData.vue b/components/FeaturedData/FeaturedData.vue
index 3e818a14..22317f73 100644
--- a/components/FeaturedData/FeaturedData.vue
+++ b/components/FeaturedData/FeaturedData.vue
@@ -74,7 +74,7 @@ export default {
       getAlgoliaFacets(algoliaIndex, facetPropPathMapping)
         .then(data => {
           this.organFacets = data.find(
-            facet => facet.key === 'anatomy.organ.name'
+            facet => facet.key === 'anatomy.organ.category.name'
           ).children
         })
         .finally(() => {
@@ -83,14 +83,23 @@ export default {
     },
     filterOrgans(contentfulFields) {
       const normStr = str => str.toLowerCase().trim()
-      return this.organFacets.filter(
+      let organs = this.organFacets.filter(
         organ =>
-          normStr(organ.label).includes(normStr(contentfulFields.label)) ||
-          (contentfulFields.containsSearch &&
-            contentfulFields.containsSearch.some(keyword =>
-              normStr(organ.label).includes(normStr(keyword))
-            ))
+          normStr(organ.label).includes(normStr(contentfulFields.label)) || 
+          (contentfulFields.containsSearch && contentfulFields.containsSearch.some(keyword => normStr(organ.label).includes(normStr(keyword))))
       )
+      this.organFacets.forEach(organFacet => {
+        if (organFacet.children.length == 0) {
+          return
+        }
+        const subOrgans = organFacet.children.filter(
+          subOrgan =>
+            normStr(subOrgan.label).includes(normStr(contentfulFields.label)) || 
+            (contentfulFields.containsSearch && contentfulFields.containsSearch.some(keyword => normStr(subOrgan.label).includes(normStr(keyword))))
+        )
+        organs = organs.concat(subOrgans)
+      })
+      return organs
     },
     getLink(contentfulFields) {
       if (isEmpty(this.organFacetIds)) {
diff --git a/components/FeaturedEvent/FeaturedEvent.vue b/components/FeaturedEvent/FeaturedEvent.vue
index 426e947e..e15c79d7 100644
--- a/components/FeaturedEvent/FeaturedEvent.vue
+++ b/components/FeaturedEvent/FeaturedEvent.vue
@@ -1,35 +1,35 @@
 <template>
   <sparc-card>
     <template slot="image">
-      <nuxt-link
-        v-if="event.fields.requiresADetailsPage"
-        :to="{
-          name: 'news-and-events-events-id',
-          params: { id: event.sys.id }
-        }"
-        class="sparc-card__image"
-        :style="`background-image: url(${imageSrc})`"
-      >
-        <img class="visuallyhidden" :src="imageSrc" :alt="imageAlt" />
-      </nuxt-link>
-      <template v-else>
-        <a
-          v-if="event.fields.url"
-          :href="event.fields.url"
-          target="_blank"
-          class="sparc-card__image"
-          :style="`background-image: url(${imageSrc})`"
-        >
-          <img class="visuallyhidden" :src="imageSrc" :alt="imageAlt" />
+      <div class="sparc-card__image-container">
+        <a v-if="event.fields.requiresADetailsPage" :href="href(event)">
+          <img
+            class="sparc-card__image"
+            :src="imageSrc"
+            :alt="imageAlt" 
+          />
         </a>
-        <div
-          v-else
-          class="sparc-card__image"
-          :style="`background-image: url(${imageSrc})`"
-        >
-          <img class="visuallyhidden" :src="imageSrc" :alt="imageAlt" />
-        </div>
-      </template>
+        <template v-else>
+          <div v-if="event.fields.url">
+            <a :href="event.fields.url" :target="isInternalLink(event.fields.url) ? '_self' : '_blank'">
+              <img
+                class="sparc-card__image"
+                :src="imageSrc"
+                :alt="imageAlt" 
+              />
+            </a>
+          </div>
+          <div
+            v-else
+          >
+          <img
+              class="sparc-card__image"
+              :src="imageSrc"
+              :alt="imageAlt" 
+            />
+          </div>
+        </template>
+      </div>
     </template>
 
     <div>
@@ -97,6 +97,7 @@ import SparcCard from '@/components/SparcCard/SparcCard.vue'
 
 import FormatDate from '@/mixins/format-date'
 import MarkedMixin from '@/mixins/marked'
+import { isInternalLink} from '@/mixins/marked'
 
 export default {
   name: 'FeaturedEvent',
@@ -116,6 +117,14 @@ export default {
     }
   },
 
+  methods: {
+    isInternalLink,
+    href: function(event) {
+      const eventId = pathOr("", ["sys","id"], event)
+      return `news-and-events/events/${eventId}`
+    },
+  },
+
   computed: {
     /**
      * Get image source
diff --git a/components/FilesTable/FilesTable.vue b/components/FilesTable/FilesTable.vue
index 330e9ddc..30af9e24 100644
--- a/components/FilesTable/FilesTable.vue
+++ b/components/FilesTable/FilesTable.vue
@@ -97,7 +97,7 @@
                             datasetVersion: datasetInfo.version
                           },
                           query: {
-                            path: s3Path(scope.row.path)
+                            path: s3Path(scope.row)
                           }
                         }"
                       >
@@ -192,20 +192,20 @@
                 </sparc-tooltip>
               </div>
               <div
-                v-if="hasOsparcViewer(scope)"
                 class="circle"
                 @click="setDialogSelectedFile(scope)"
               >
                 <sparc-tooltip
                   placement="bottom-center"
                 >
-                  <div slot="data">
-                    Open in oSPARC. More info on oSPARC can be found
-                    <a href="/help/4EFMev665H4i6tQHfoq5NM" target="_blank">
+                  <div slot="data" class="osparc-service-btn-tooltip">
+                    Open in o<sup>2</sup>S<sup>2</sup>PARC. Login is required, 
+                    <a href="/resources/4LkLiH5s4FV0LVJd3htsvH#user-accounts" target="_blank">
                       <u>here</u>
                     </a>
+                    you can find more information on how to get an account.
                   </div>
-                  <svg-icon slot="item" name="icon-view" height="1.5rem" width="1.5rem" />
+                  <svg-icon slot="item" name="icon-osparc" height="1.5rem" width="1.5rem" />
                 </sparc-tooltip>
               </div>
               <div
@@ -310,10 +310,16 @@ import { mapGetters, mapState } from 'vuex'
 import FormatStorage from '@/mixins/bf-storage-metrics/index'
 import { successMessage, failMessage } from '@/utils/notification-messages'
 
-import { extractExtension } from '@/pages/data/utils'
-
 import * as path from 'path'
 
+const openableFileTypes = [
+  'pdf',
+  'text',
+  'jpeg',
+  'png',
+  'svg',
+]
+
 export const contentTypes = {
   pdf: 'application/pdf',
   text: 'text/plain',
@@ -321,7 +327,8 @@ export const contentTypes = {
   png: 'image/png',
   svg: 'img/svg+xml',
   mp4: 'video/mp4',
-  csv: 'text/csv'
+  csv: 'text/csv',
+  msword: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
 }
 
 export default {
@@ -382,7 +389,9 @@ export default {
         ? this.$route.query.path
         : this.schemaRootPath
     },
-
+    doi() {
+      return propOr('', 'doi', this.datasetInfo)
+    },
     breadcrumbs: function() {
       return compose(reject(isEmpty), split('/'))(this.path)
     },
@@ -417,6 +426,9 @@ export default {
     datasetVersion: function() {
       return propOr(1, 'version', this.datasetInfo)
     },
+    datasetId: function() {
+      return propOr("", 'id', this.datasetInfo)
+    },
     /**
      * Compute URL for zipit service
      * @returns {String}
@@ -453,11 +465,10 @@ export default {
      * - Vector Drawings (svg)
      */
     isFileOpenable(scope) {
-      const allowableExtensions = Object.keys(contentTypes).map(key => key)
       const fileType = scope.row.fileType.toLowerCase()
       return (
         this.isMicrosoftFileType(scope) ||
-        allowableExtensions.includes(fileType)
+        openableFileTypes.includes(fileType)
       )
     },
 
@@ -530,14 +541,6 @@ export default {
         scope.row.fileType === 'PowerPoint'
       )
     },
-    /**
-     * Checks if file has a viewer in oSPARC
-     * @param {Object} scope
-     */
-    hasOsparcViewer(scope) {
-      const fileType = extractExtension(scope.row.path)
-      return Object.keys(this.osparcViewers).includes(fileType)
-    },
     /**
      * Get contents of directory
      */
@@ -595,17 +598,19 @@ export default {
     },
 
     getViewFileUrl(scope) {
+      let uri = `${pathOr('', ['row', 'uri'], scope).replace("s3://", "")}`
+      let s3BucketName = uri.substring(0, uri.indexOf("/"))
       const filePath = compose(
         last,
         defaultTo([]),
-        split('s3://pennsieve-prod-discover-publish-use1/'),
+        split(`s3://${s3BucketName}/`),
         pathOr('', ['row', 'uri'])
       )(scope)
 
       const fileType = scope.row.fileType.toLowerCase()
       const contentType = contentTypes[fileType]
 
-      const requestUrl = `${process.env.portal_api}/download?key=${filePath}&contentType=${contentType}`
+      const requestUrl = `${process.env.portal_api}/download?s3BucketName=${s3BucketName}&key=${filePath}&contentType=${contentType}`
 
       return this.$axios.$get(requestUrl).then(response => {
         const url = response
@@ -622,24 +627,55 @@ export default {
      * @param {Object} scope
      */
     openFile: function(scope) {
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'view_file_in_web_browser',
+        file_name: pathOr('', ['row','name'], scope),
+        file_path: pathOr('', ['row','path'], scope),
+        file_type: pathOr('', ['row','fileType'], scope),
+        location: "",
+        category: "",
+        dataset_id: this.datasetId,
+        version_id: this.datasetVersion,
+        doi: this.doi,
+        citation_type: "",
+        files: ""
+      })
       this.getViewFileUrl(scope).then(response => {
         window.open(response, '_blank')
       })
     },
 
     executeDownload(downloadInfo) {
-      const datasetVersionRegexp = /s3:\/\/pennsieve-prod-discover-publish-use1\/(?<datasetId>\d*)\/(?<version>\d*)\/(?<filePath>.*)/
-      const matches = downloadInfo.uri.match(datasetVersionRegexp)
+      const datasetVersionRegexp = /(?<datasetId>\d*)\/(?<filePath>.*)/
+      let params = downloadInfo.uri.replace("s3://", "")
+      let firstIndex = params.indexOf("/") + 1
+      params = params.substr(firstIndex)
+      const matches = params.match(datasetVersionRegexp)
 
       const payload = {
         paths: [matches.groups.filePath],
         datasetId: matches.groups.datasetId,
-        version: matches.groups.version
+        version: this.datasetVersion
       }
 
       this.zipData = JSON.stringify(payload, undefined)
       this.$nextTick(() => {
         this.$refs.zipForm.submit() // eslint-disable-line no-undef
+        this.$gtm.push({
+          event: 'interaction_event',
+          event_name: 'download_dataset_files',
+          files: [propOr('', 'paths', payload)[0]],
+          file_name: "",
+          file_path: "",
+          file_type: "",
+          location: "",
+          category: "",
+          dataset_id: this.datasetId,
+          version_id: this.datasetVersion,
+          doi: this.doi,
+          citation_type: ""
+        })
       })
     },
 
@@ -651,9 +687,9 @@ export default {
       const id = pathOr('', ['params', 'datasetId'], this.$route)
       const version = this.datasetVersion
       return {
-        name: 'datasets-scaffoldviewer-id',
+        name: 'maps',
         params: {},
-        query: { dataset_id: id, dataset_version: version, file_path: scope.row.path }
+        query: { type: "scaffold", dataset_id: id, dataset_version: version, file_path: scope.row.path }
       }
     },
 
@@ -682,7 +718,6 @@ export default {
 
         // Create paths for fetching the files from 'sparc-api/s3-resource/'
         const scaffoldPath = `${currentDirectoryPath}${viewMetadata.datacite.isDerivedFrom.relative.path[0]}`
-        const s3Path = `${id}/${version}/${scaffoldPath}`
 
         // View paths need to be relative
         const viewPath = path.relative(
@@ -690,9 +725,9 @@ export default {
           scope.row.path
         )
         return {
-          name: 'datasets-scaffoldviewer-id',
+          name: 'maps',
           params: {},
-          query: { scaffold: s3Path, viewURL: viewPath }
+          query: { type: "scaffold", dataset_id: id, dataset_version: version, file_path: scaffoldPath, viewURL: viewPath }
         }
       }
       return {}
@@ -725,7 +760,7 @@ export default {
           datasetVersion: this.datasetInfo.version
         },
         query: {
-          path: this.s3Path(scope.row.path)
+          path: s3Path(scope.row)
         }
       }
 
@@ -816,10 +851,9 @@ export default {
          return -1 
       return 0; 
     },
-    s3Path(path) {
-      // patch for discrepancy between file paths containing spaces and/or commas and the s3 path. s3 paths appear to use underscores instead
-      path = path.replaceAll(' ', '_')
-      return path.replaceAll(',', '_')
+    s3Path(file) {
+      const uri = file.uri
+      return uri.substring(uri.indexOf('files/'))
     },
   }
 }
@@ -908,4 +942,14 @@ export default {
     }
   }
 }
+.osparc-service-btn-tooltip {
+  sup, sub {
+    vertical-align: baseline;
+    position: relative;
+    top: -0.4em;
+  }
+  sub {
+    top: 0.4em;
+  }
+}
 </style>
diff --git a/components/FilesTable/OsparcFileViewersDialog.vue b/components/FilesTable/OsparcFileViewersDialog.vue
index 9ef3f82c..927a3971 100644
--- a/components/FilesTable/OsparcFileViewersDialog.vue
+++ b/components/FilesTable/OsparcFileViewersDialog.vue
@@ -8,25 +8,32 @@
   >
     <bf-dialog-header slot="title" title="Select a service" />
     <dialog-body>
-      <el-select
-        v-model="selectedViewer"
-        value-key="title"
-        placeholder="Select a service..."
-      >
-        <el-option
-          v-for="viewer in viewersForFile"
-          :key="viewer.title"
-          :value="viewer"
-          :label="viewer.title"
-        />
-      </el-select>
-      <bf-button
-        :disabled="selectedViewer === ''"
-        :processing="isFetching"
-        @click="openFile"
-      >
-        Open in oSPARC
-      </bf-button>
+      <div class="content-body">
+        <el-select
+          v-model="selectedViewer"
+          value-key="title"
+          placeholder="Select a service..."
+        >
+          <el-option
+            :value="filePickerDummy"
+            :label="filePickerDummy.title"
+          />
+          <el-option
+            v-for="viewer in viewersForFile"
+            :key="viewer.title"
+            :value="viewer"
+            :label="viewer.title"
+          />
+        </el-select>
+        <bf-button
+          :disabled="selectedViewer === ''"
+          :processing="isFetching"
+          @click="openFile"
+          class="open-btn"
+        >
+          Open in o²S²PARC
+        </bf-button>
+      </div>
     </dialog-body>
   </el-dialog>
 </template>
@@ -39,6 +46,9 @@ import BfButton from '@/components/shared/BfButton/BfButton.vue'
 import { extractExtension } from '~/pages/data/utils'
 import { contentTypes } from '@/components/FilesTable/FilesTable.vue'
 
+const osparcViewUrl = new URL(process.env.osparc_host)
+osparcViewUrl.pathname = '/view'
+
 export default {
   name: 'OsparcFileViewersDialog',
   components: { BfButton, BfDialogHeader, DialogBody },
@@ -61,7 +71,11 @@ export default {
   data() {
     return {
       selectedViewer: '',
-      isFetching: false
+      isFetching: false,
+      filePickerDummy: {
+        title: "o²S²PARC file service",
+        "view_url": osparcViewUrl.toString()
+      }
     }
   },
   computed: {
@@ -77,11 +91,14 @@ export default {
   },
   methods: {
     openFile() {
+      this.sendGtmEvent()
       const fileSize = this.selectedFile.size
+      let uri = `${pathOr('', ['uri'], this.selectedFile).replace("s3://", "")}`
+      let s3BucketName = uri.substring(0, uri.indexOf("/"))
       const filePath = compose(
         last,
         defaultTo([]),
-        split('s3://pennsieve-prod-discover-publish-use1/'),
+        split(`s3://${s3BucketName}/`),
         pathOr('', ['uri'])
       )(this.selectedFile)
 
@@ -89,6 +106,7 @@ export default {
 
       const requestUrl = new URL(process.env.portal_api + '/download')
       requestUrl.searchParams.append('key', filePath)
+      requestUrl.searchParams.append('s3BucketName', s3BucketName)
       const fileType = this.selectedFile.fileType.toLowerCase()
       const contentType = contentTypes[fileType]
       if (contentType) {
@@ -102,6 +120,10 @@ export default {
 
           redirectionUrl.searchParams.append('download_link', fileUrl)
           redirectionUrl.searchParams.append('file_size', fileSize)
+          redirectionUrl.searchParams.append('file_type', this.fileExtension)
+          if (this.selectedFile.name) {
+            redirectionUrl.searchParams.append('file_name', this.selectedFile.name)
+          }
 
           window.open(redirectionUrl, '_blank')
 
@@ -112,12 +134,28 @@ export default {
           this.isFetching = false
         })
     },
+    sendGtmEvent() {
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'open_in_osparc',
+        files: "",
+        file_name: "",
+        file_path: "",
+        file_type: "",
+        location: this.selectedViewer?.view_url,
+        category: this.selectedViewer?.title,
+        dataset_id: "",
+        version_id: "",
+        doi: "",
+        citation_type: ""
+      })
+    },
     beforeClose(done) {
       this.selectedViewer = ''
       done()
     },
     openedHandler() {
-      this.selectedViewer = this.viewersForFile[0]
+      this.selectedViewer = this.filePickerDummy
     },
     closeHandler() {
       this.$emit('close')
@@ -125,3 +163,12 @@ export default {
   }
 }
 </script>
+
+<style lang="scss" scoped>
+.content-body {
+  display: flex;
+  & > button {
+    margin-left: .5em;
+  }
+}
+</style>
\ No newline at end of file
diff --git a/components/Gallery/Gallery.vue b/components/Gallery/Gallery.vue
new file mode 100644
index 00000000..da105031
--- /dev/null
+++ b/components/Gallery/Gallery.vue
@@ -0,0 +1,245 @@
+<template>
+  <div ref="myButton" class="gallery">
+    <div class="resources-gallery-strip">
+      <div class="card-line">
+        <span v-for="(item, index) in windowedItems" :key="index" :class="['key-image-span']">
+          <template v-if="item">
+            <component
+              v-if="galleryItemType === 'resources'"
+              :is="galleryItemComponent"
+              :width="cardWidth"
+              :key="item.sys.id"
+              :title="item.fields.name"
+              :subtitle="item.fields.resourceType.join(', ')"
+              :showSparcTag="item.fields.developedBySparc"
+              :description="item.fields.description"
+              :thumbnail-url="item.fields.logo.fields.file.url"
+              :button-link="`/resources/${item.sys.id}`"
+              :external-url="item.fields.url"
+              @card-clicked="cardClicked"
+            />
+            <component
+              v-else-if="galleryItemType === 'metrics'"
+              :is="galleryItemComponent"
+              :width="cardWidth"
+              :key="item.title"
+              :title="item.title"
+              :data="item.data"
+              :subData="item.subData"
+            />
+            <component
+              v-else-if="galleryItemType === 'highlights'"
+              :is="galleryItemComponent"
+              :width="cardWidth"
+              :key="item.sys.id"
+              :item="item"
+            />
+            <component
+              v-else-if="galleryItemType === 'datasets'"
+              :is="galleryItemComponent"
+              :width="cardWidth"
+              :key="item.objectID"
+              :item="item"
+            />
+            <component
+              v-else-if="galleryItemType === 'fileViewer'"
+              :is="galleryItemComponent"
+              :data="item"
+              :width="cardWidth"
+              :datasetId="datasetId"
+              :versionId="versionId"
+              :doi="doi"
+              show-card-details
+              @card-clicked="cardClicked"
+            />
+          </template>
+        </span>
+      </div>
+    </div>
+    <pagination  v-if="items.length > 0" background :total-count="itemCount" :selected="currentIndex" :page-size="numberOfItemsVisible" :pager-count=7 @select-page="indicatorClicked"/>
+  </div>
+</template>
+
+<script>
+import ResourceCard from '~/components/Gallery/GalleryItems/ResourceCard.vue'
+import MetricsCard from '~/components/Gallery/GalleryItems/MetricsCard.vue'
+import HighlightCard from '~/components/Gallery/GalleryItems/HighlightCard.vue'
+import DatasetCard from '~/components/Gallery/GalleryItems/DatasetCard.vue'
+import FileViewerCard from '~/components/Gallery/GalleryItems/FileViewerCard.vue'
+import { defaultTo } from 'ramda'
+
+const galleryItemComponents = {
+  resources: ResourceCard,  
+  metrics: MetricsCard,
+  highlights: HighlightCard,
+  datasets: DatasetCard,
+  fileViewer: FileViewerCard
+}
+
+function convertRemToPixels(rem) {
+  if (typeof window !== 'undefined') {
+    return rem * parseFloat(window.getComputedStyle(document.documentElement).fontSize)
+  }
+  return rem * 16
+}
+
+export default {
+  name: 'Gallery',
+  components: { DatasetCard, ResourceCard, MetricsCard, HighlightCard },
+  props: {
+    items: {
+      type: Array,
+      default: () => {
+        return []
+      },
+    },
+    cardWidth: {
+      type: Number,
+      default: 21,
+    },
+    showIndicatorBar: {
+      type: Boolean,
+      default: true,
+    },
+    galleryItemType: {
+      type: String,
+      default: 'resources'
+    },
+    datasetId: {
+      type: Number,
+      default: undefined,
+    },
+    versionId: {
+      type: Number,
+      default: undefined,
+    },
+    doi: {
+      type: String,
+      default: "",
+    }
+  },
+  data() {
+    return {
+      resizeObserver: null,
+      count: 0,
+      currentIndex: 0,
+      maxWidth: 0
+    }
+  },
+  mounted() {
+    this.resizeObserver = new ResizeObserver(this.onResize).observe(this.$el)
+  },
+  destroyed() {
+    delete this.resizeObserver
+  },
+  computed: {
+    galleryItemComponent: function() {
+      return defaultTo('', galleryItemComponents[this.galleryItemType])
+    },
+    itemCount() {
+      return this.items.length
+    },
+    isPrevPossible() {
+      return this.currentIndex > 0
+    },
+    isNextPossible() {
+      return this.currentIndex < this.itemCount - 1
+    },
+    cardHeight() {
+      return 0.78 * this.cardWidth
+    },
+    cardLineWidth() {
+      const cardSpacing = 0.25
+      return this.itemCount * (this.cardWidth + cardSpacing) - cardSpacing
+    },
+    numberOfItemsVisible() {
+      // The maximum width we are allowed minus two buttons for next and previous
+      // divided by the width of a card.
+      // const n = this.itemCount - 1
+      const cardSpacingPx = convertRemToPixels(0.5)
+      const buttonPx = convertRemToPixels(2)
+      const cardWidthPx = convertRemToPixels(this.cardWidth)
+      const cardItems = (this.maxWidth - 2 * buttonPx - 2 * cardSpacingPx) / (1.1 * cardWidthPx)
+      //Display at least one item
+      const possibleNumberVisible = Math.max(1, Math.floor(cardItems))
+      return this.itemCount < possibleNumberVisible ? this.itemCount : possibleNumberVisible
+    },
+    valueAdjustment() {
+      let valueAdjust = (this.currentIndex - 1) * this.numberOfItemsVisible
+      if (valueAdjust < 0) {
+        valueAdjust = 0
+      } else if (valueAdjust + this.numberOfItemsVisible > this.itemCount) {
+        valueAdjust = this.itemCount - this.numberOfItemsVisible
+      }
+      return valueAdjust
+    },
+    windowedItems() {
+      let myArray = []
+      for (let i = 0; i < this.numberOfItemsVisible; i++) {
+        myArray.push(this.items[i + this.valueAdjustment])
+      }
+      return myArray
+    },
+  },
+  methods: {
+    cardClicked(payload) {
+      this.$emit('card-clicked', payload)
+    },
+    goNext() {
+      this.currentIndex += 1
+    },
+    goPrev() {
+      this.currentIndex -= 1
+    },
+    indicatorClicked(index) {
+      if (this.currentIndex !== index) {
+        this.currentIndex = index
+      }
+    },
+    onResize() {
+      this.maxWidth = this.$el.clientWidth
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+.arrow-button {
+  min-width: 1.5rem;
+  min-height: 1.5rem;
+  border-radius: 50%;
+  background: $purple;
+  line-height: 1.1rem;
+  display: flex;
+  justify-content: center;
+  user-select: none;
+  align-self: center;
+}
+.resources-gallery-strip,
+.card-line {
+  display: flex;
+  flex-wrap: nowrap;
+  justify-content: space-around;
+  align-items: flex-start;
+}
+.card-line {
+  flex-grow: 2;
+}
+.progress-button {
+  font-size: 2rem;
+  color: white;
+}
+.filler {
+  flex-grow: .5;
+}
+a.prev:not(.underline),
+a.next:not(.underline) {
+  text-decoration: none;
+}
+.disabled {
+  opacity: 0.5;
+  pointer-events: none;
+}
+</style>
diff --git a/components/Gallery/GalleryItems/DatasetCard.vue b/components/Gallery/GalleryItems/DatasetCard.vue
new file mode 100644
index 00000000..afd02f61
--- /dev/null
+++ b/components/Gallery/GalleryItems/DatasetCard.vue
@@ -0,0 +1,78 @@
+<template>
+  <el-card :style="{ border: 'none', maxWidth: width + 'rem' }" class="card">
+    <el-row :gutter="20">
+      <el-col :span="8">
+        <img class="banner-image" :src="item.banner" />
+      </el-col>
+      <el-col class="body1" :span="16">
+        <nuxt-link
+          class="dataset-name"
+          :to="{
+            name: 'datasets-datasetId',
+            params: {
+              datasetId: datasetId
+            }
+          }"
+        >
+          {{ datasetTitle }}
+        </nuxt-link>
+        <div>
+          Total Downloads: <b>{{ numDownloads }}</b>
+        </div>
+        <div>
+          Citations: <b>{{ numCitations }}</b>
+        </div>
+      </el-col>
+    </el-row>
+  </el-card>
+</template>
+
+<script>
+
+import { propOr } from 'ramda'
+
+export default {
+  name: 'DatasetCard',
+  props: {
+    item: {
+      type: Object,
+      default: {}
+    },
+    width: {
+      type: Number,
+      default: 68
+    },
+  },
+  computed: {
+    datasetId() {
+      return propOr('', 'intId', this.item)
+    },
+    datasetTitle() {
+      return propOr('', 'name', this.item)
+    },
+    numDownloads() {
+      return propOr('', 'numDownloads', this.item)
+    },
+    numCitations() {
+      return propOr('', 'numCitations', this.item)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.card {
+  background-color: transparent;
+  position: relative;
+  cursor: default;
+  text-align: left;
+}
+.banner-image {
+  display: block;
+  width: 100%;
+  max-height: 200px;
+}
+.dataset-name {
+  overflow-wrap: anywhere;
+}
+</style>
diff --git a/components/Gallery/GalleryItems/FileViewerCard.vue b/components/Gallery/GalleryItems/FileViewerCard.vue
new file mode 100644
index 00000000..2e3e7fb8
--- /dev/null
+++ b/components/Gallery/GalleryItems/FileViewerCard.vue
@@ -0,0 +1,283 @@
+<template>
+  <el-card :shadow="shadow" :style="{ padding: '0px', maxWidth: width + 'rem' }">
+    <div v-loading="!isReady">
+      <div class="cursor-pointer" @click.prevent="cardClicked">
+        <img v-if="useDefaultImg" src="~/assets/logo-sparc-wave-primary.svg" svg-inline />
+        <img v-else :src="thumbnail" alt="thumbnail loading ..." />
+      </div>
+      <div v-if="false" class="image-overlay">
+        <div
+          class="triangle-right-corner"
+          :style="`border-left-width: ${triangleHeight * 1.2}rem; border-top-width: ${triangleHeight}rem;`"
+          @click="openLinkInNewTab"
+        />
+        <el-tooltip class="item" :content="`View ${data.type}`" placement="left">
+          <img
+            class="triangle-icon"
+            :style="`height: ${triangleHeight * 0.25}rem;top: ${triangleHeight * 0.15}rem;right: ${triangleHeight * 0.15}rem`"
+            :src="typeIcon"
+            @click="openLinkInNewTab"
+          />
+        </el-tooltip>
+      </div>
+      <div v-if="showCardDetails" class="details">
+        <p v-if="!data.hideType">
+          <b>{{ data.type }}</b>
+        </p>
+        <el-popover
+          ref="galleryPopover"
+          :disabled="disableTooltip"
+          :content="data.title"
+          placement="top"
+          trigger="hover"
+          popper-class="gallery-popper"
+        />
+        <!--use v-show here to make sure el popover always have a starting location -->
+        <p v-show="!data.hideTitle" ref="titleText" v-popover:galleryPopover class="title">
+          {{ data.title }}
+        </p>
+        <p v-show="data.hideTitle" class="title text-placeholder" />
+        <el-button class="primary" @click.prevent="cardClicked"> View {{ data.type }}</el-button>
+      </div>
+    </div>
+  </el-card>
+</template>
+
+<script>
+
+function isValidHttpUrl(string) {
+  let url = undefined
+
+  try {
+    url = new URL(string)
+  } catch (_) {
+    return false
+  }
+  return url.protocol === 'http:' || url.protocol === 'https:'
+}
+
+export default {
+  name: 'GalleryCard',
+  mixins: [],
+  props: {
+    data: {
+      type: Object,
+      required: true,
+    },
+    width: {
+      type: Number,
+      default: 3,
+    },
+    height: {
+      type: Number,
+      default: 3,
+    },
+    datasetId: {
+      type: Number,
+      default: undefined,
+    },
+    versionId: {
+      type: Number,
+      default: undefined,
+    },
+    doi: {
+      type: String,
+      default: "",
+    },
+    showCardDetails: {
+      type: Boolean,
+    },
+    shadow: {
+      type: String,
+      default: 'always',
+    },
+  },
+  data() {
+    return {
+      ro: null,
+      triangleSize: 4,
+      thumbnail: undefined,
+      useDefaultImg: false,
+      disableTooltip: false,
+      tooltipCalculated: false,
+    }
+  },
+  computed: {
+    isReady() {
+      return this.data.title && (this.thumbnail || this.useDefaultImg) && (this.data.link || this.data.userData)
+    },
+    imageHeight() {
+      return this.showCardDetails ? this.height * 0.525 : this.height
+    },
+    imageWidth() {
+      return this.width - 2 * this.marginDetails
+    },
+    triangleHeight() {
+      return this.height * 0.237
+    },
+    marginDetails() {
+      return this.height * 0.076
+    },
+    typeIcon() {
+      return undefined
+    },
+  },
+  watch: {
+    data: {
+      deep: true,
+      immediate: true,
+      handler: function () {
+        this.thumbnail = undefined
+        this.useDefaultImg = false
+        this.tooltipCalculated = false
+        this.disableTooltip = false
+        if (this.data.thumbnail) {
+          if (isValidHttpUrl(this.data.thumbnail) && this.data.mimetype) {
+            this.downloadThumbnail(this.data.thumbnail, { fetchAttempts: 0 })
+          } else {
+            this.thumbnail = this.data.thumbnail
+          }
+        } else {
+          this.useDefaultImg = true
+        }
+        //Dynamically check title length to determine if popover should be shown
+        this.$nextTick(() => {
+          this.calculateShowTooltip()
+        })
+      },
+    },
+  },
+  updated: function () {
+    if (!this.tooltipCalculated) {
+      this.$nextTick(() => {
+        this.calculateShowTooltip()
+      })
+    }
+  },
+  methods: {
+    /**
+     * Open a new link if link is provide.
+     * Fire an event if userData is provide.
+     */
+    cardClicked: function () {
+      if (this.data.link) {
+        this.$gtm.push({
+          event: 'interaction_event',
+          event_name: 'gallery_item_clicked',
+          files: "",
+          file_name: this.data.title,
+          file_path: this.data.link,
+          file_type: this.data.type,
+          location: "",
+          category: "file_viewer",
+          dataset_id: this.datasetId,
+          version_id: this.versionId,
+          doi: this.doi,
+          citation_type: ""
+        })
+        const link = document.createElement('a')
+        link.href = this.data.link
+        link.target = '_blank'
+        document.body.appendChild(link)
+        link.click()
+        link.remove()
+      }
+      if (this.data.userData) {
+        this.$emit('card-clicked', this.data.userData)
+      }
+    },
+    /**
+     * handle thumbnail downloading,, it will use a default svg image if fails
+     */
+    downloadThumbnail: function (url, info) {
+      this.getRequest(url, {}, 11000).then(
+        (response) => {
+          let data = response.data
+          if (typeof data === 'string' && data.startsWith('data:')) {
+            this.thumbnail = response.data
+          } else {
+            if (this.data.mimetype) {
+              this.thumbnail = `data:${this.data.mimetype};base64,${response.data}`
+            } else {
+              this.thumbnail = response.data
+            }
+          }
+        },
+        (reason) => {
+          if (reason.message.includes('timeout') && reason.message.includes('exceeded') && info.fetchAttempts < 3) {
+            info.fetchAttempts += 1
+            this.downloadThumbnail(url, info)
+          } else {
+            this.useDefaultImg = true
+          }
+        }
+      )
+    },
+    //dynamically calculate if tooltip is required
+    calculateShowTooltip: function () {
+      if (this.data.hideTitle) {
+        this.disableTooltip = true
+        this.tooltipCalculated = true
+      } else {
+        const ele = this.$refs.titleText
+        //Check if title text is rendered yet
+        if (ele && ele.offsetParent) {
+          this.tooltipCalculated = true
+          if (ele.offsetWidth >= ele.scrollWidth) this.disableTooltip = true
+          else this.disableTooltip = false
+        } else {
+          //text not rendered yet
+          if (this.data.title && this.data.title.length > 20) this.disableTooltip = false
+          else this.disableTooltip = true
+        }
+      }
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+.card {
+  position: relative;
+}
+.details {
+  text-align: left;
+}
+
+.cursor-pointer {
+  cursor: pointer;
+}
+
+.text-placeholder {
+  height: 1rem;
+}
+
+.title {
+  overflow-x: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+p.bold {
+  font-weight: bold;
+}
+
+.image-overlay {
+  position: absolute;
+  top: 0;
+  right: 0;
+}
+
+.triangle-icon {
+  position: absolute;
+}
+
+.triangle-right-corner {
+  width: 0;
+  height: 0;
+  border-left: solid transparent;
+  border-top: solid $purple;
+}
+</style>
diff --git a/components/Gallery/GalleryItems/HighlightCard.vue b/components/Gallery/GalleryItems/HighlightCard.vue
new file mode 100644
index 00000000..17485c85
--- /dev/null
+++ b/components/Gallery/GalleryItems/HighlightCard.vue
@@ -0,0 +1,38 @@
+<template>
+  <el-card :style="{ border: 'none', maxWidth: width + 'rem' }" class="card">
+    <news-list-item
+      :item="item"
+    />
+  </el-card>
+</template>
+
+<script>
+import NewsListItem from '@/components/NewsListItem/NewsListItem.vue'
+
+export default {
+  name: 'HighlightCard',
+  components: {
+    NewsListItem
+  },
+  props: {
+    item: {
+      type: Object,
+      default: {}
+    },
+    width: {
+      type: Number,
+      default: 68
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+.card {
+  background-color: transparent;
+  position: relative;
+  cursor: default;
+}
+</style>
diff --git a/components/Gallery/GalleryItems/MetricsCard.vue b/components/Gallery/GalleryItems/MetricsCard.vue
new file mode 100644
index 00000000..df4214d6
--- /dev/null
+++ b/components/Gallery/GalleryItems/MetricsCard.vue
@@ -0,0 +1,65 @@
+<template>
+  <el-card :style="{ border: 'none', maxWidth: width + 'rem' }" class="card">
+    <div class="title-container">
+      <div class="title heading2">
+        {{ title }}
+      </div>
+    </div>
+    <div class="heading1 data">
+      {{ data }}
+    </div>
+    <div class="body1 mb-16">
+      {{ subData }}
+    </div>
+  </el-card>
+</template>
+
+<script>
+import SparcPill from '@/components/SparcPill/SparcPill.vue'
+export default {
+  name: 'ResourceCard',
+  components: {
+    SparcPill
+  },
+  props: {
+    width: {
+      type: Number,
+      default: 21
+    },
+    title: {
+      type: String,
+      default: ''
+    },
+    data: {
+      type: String,
+      default: '0'
+    },
+    subData: {
+      type: String,
+      default: '0'
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+.data {
+  color: $purple;
+}
+.card {
+  background-color: transparent;
+  position: relative;
+  cursor: default;
+  text-align: center;
+}
+.title-container {
+  display: flex;
+  align-items: center;
+}
+.title {
+  overflow-x: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+</style>
diff --git a/components/ResourcesGallery/ResourceCard.vue b/components/Gallery/GalleryItems/ResourceCard.vue
similarity index 89%
rename from components/ResourcesGallery/ResourceCard.vue
rename to components/Gallery/GalleryItems/ResourceCard.vue
index c45fb167..b5b161a7 100644
--- a/components/ResourcesGallery/ResourceCard.vue
+++ b/components/Gallery/GalleryItems/ResourceCard.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-card :shadow="shadow" :style="{ border: 'none', maxWidth: width + 'rem' }" class="card">
+  <el-card :style="{ border: 'none', maxWidth: width + 'rem' }" class="card">
     <div class="image-container mb-16">
       <img class="thumbnail" :src="thumbnailUrl" alt="thumbnail loading ..." />
     </div>
@@ -37,10 +37,6 @@ export default {
       type: Number,
       default: 13.8
     },
-    showShadow: {
-      type: Boolean,
-      default: false
-    },
     title: {
       type: String,
       default: ''
@@ -71,9 +67,6 @@ export default {
     },
   },
   computed: {
-    shadow() {
-      return this.showShadow ? 'always' : 'never'
-    },
     truncatedDescription() {
       return this.description.length > 134 ? 
         `${this.description.substring(0, 134)}...` :
diff --git a/components/HomepageNews/HomepageNews.vue b/components/HomepageNews/HomepageNews.vue
new file mode 100644
index 00000000..f18ef0c9
--- /dev/null
+++ b/components/HomepageNews/HomepageNews.vue
@@ -0,0 +1,289 @@
+<template>
+  <div class="featured-datasets container pt-32">
+    <h2 class="heading2">
+      News &amp; Upcoming Events
+    </h2>
+    <sparc-card
+      v-for="(item, index) in upcomingNews"
+      :key="item.sys.id"
+      :image-align="index % 2 ? 'right' : ''"
+    >
+      <template slot="image">
+        <div class="sparc-card__image-container">
+          <a class="centered" v-if="item.fields.requiresADetailsPage" :href="href(item)">
+            <img
+              class="sparc-card__image"
+              :src="getImageSrc(item)" 
+              :alt="getImageAlt(item)" 
+            />
+          </a>
+          <template v-else>
+            <div class="centered" v-if="item.fields.url">
+              <a :href="item.fields.url" :target="newsItemIsInternalLink[index] ? '_self' : '_blank'">
+                <img
+                  class="sparc-card__image"
+                  :src="getImageSrc(item)" 
+                  :alt="getImageAlt(item)" 
+                />
+              </a>
+            </div>
+            <div v-else class="centered">
+              <img
+                  class="sparc-card__image"
+                  :src="getImageSrc(item)" 
+                  :alt="getImageAlt(item)" 
+                />
+            </div>
+          </template>
+        </div>
+      </template>
+      <div>
+        <h3>
+          <nuxt-link
+            v-if="item.fields.requiresADetailsPage"
+            :to="nuxtLink(item)"
+          >
+            {{ item.fields.title }}
+          </nuxt-link>
+          <a
+            v-else
+            :href="item.fields.url"
+            :target="newsItemIsInternalLink[index] ? '_self' : '_blank'"
+          >
+            {{ item.fields.title }}
+          </a>
+        </h3>
+        <div class="sparc-card__detail" v-if="eventDate(item) || item.fields.location">
+          <template v-if="eventDate(item)">
+            <svg-icon name="icon-calendar" height="16" width="16" />
+            <p>{{ eventDate(item) }}</p>
+          </template>
+          <template v-if="item.fields.location">
+            <svg-icon
+              class="sparc-card__detail--location"
+              name="icon-map"
+              height="16"
+              width="16"
+            />
+            <p>{{ item.fields.location }}</p>
+          </template>
+        </div>
+        <!-- eslint-disable vue/no-v-html -->
+        <!-- marked will sanitize the HTML injected -->
+        <div class="markdown-text" v-html="parseMarkdown(item.fields.summary)" />
+      </div>
+      <nuxt-link v-if="item.fields.requiresADetailsPage" :to="nuxtLink(item)">
+        <el-button size="medium" class="secondary">
+          Learn More
+        </el-button>
+      </nuxt-link>
+      <a
+        v-else
+        :href="item.fields.url"
+        :target="newsItemIsInternalLink[index] ? '_self' : '_blank'"
+      >
+        <el-button size="medium" class="secondary">
+          Learn More
+        </el-button>
+      </a>
+      <nuxt-link to="news-and-events" class="view-all-link">
+        View All News &amp; Events
+      </nuxt-link>
+    </sparc-card>
+  </div>
+</template>
+
+<script>
+import { pathOr } from 'ramda'
+import SparcCard from '@/components/SparcCard/SparcCard.vue'
+import MarkedMixin from '@/mixins/marked'
+import FormatDate from '@/mixins/format-date'
+import { isInternalLink } from '@/mixins/marked/index'
+export default {
+  name: 'HomepageNews',
+  components: {
+    SparcCard
+  },
+  mixins: [MarkedMixin, FormatDate],
+  props: {
+    news: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      itemIsInternalLink: []
+    }
+  },
+  async created() {
+    await this.fetchBitlyLinks()
+  },
+  computed: {
+    newsItemIsInternalLink() {
+      return this.itemIsInternalLink
+    },
+    /**
+     * Filter news to remove past events
+     * @returns {Array}
+     */
+    upcomingNews: function() {
+      return this.news.filter(event => this.isUpcoming(event))
+    }
+  },
+  methods: {
+    isInternalLink,
+    async fetchBitlyLinks() {
+      this.upcomingNews.forEach(async item => {
+        const url = pathOr("", ['fields', 'url'], item)
+        if (url.includes('bit.ly')) {
+          const bitlyId = url.replace("https://", "")
+          try {
+            const response = await this.$axios.post(process.env.bitly_expand_endpoint, { bitlink_id: bitlyId }, {
+              headers: {
+                Authorization: `Bearer ${process.env.BITLY_ACCESS_TOKEN}`,
+                'Content-Type': 'application/json',
+              }
+            })
+            const newUrl = response.data.long_url
+            this.itemIsInternalLink.push(isInternalLink(newUrl))
+          } catch {
+            console.log("Error retreiving bitly link destination url")
+            this.itemIsInternalLink.push(isInternalLink(url))
+          }
+        }
+        else {
+          this.itemIsInternalLink.push(isInternalLink(url))
+        }
+      })
+    },
+    /**
+     * Get image source
+     * @param {Object} item
+     * @returns {String}
+     */
+    getImageSrc: function(item) {
+      return pathOr('', ['fields', 'image', 'fields', 'file', 'url'], item)
+    },
+    /**
+     * Get image source
+     * @param {Object} item
+     * @returns {String}
+     */
+    getImageAlt: function(item) {
+      return pathOr(
+        '',
+        ['fields', 'image', 'fields', 'file', 'description'],
+        item
+      )
+    },
+    /**
+     * Get event date range, if there is no end date, default to start date
+     * @returns {String}
+     */
+    eventDate: function(event) {
+      const startDate = this.formatDate(event.fields.startDate || '')
+      const endDate = this.formatDate(event.fields.endDate || '')
+      return startDate === endDate || !endDate
+        ? startDate
+        : `${startDate} - ${endDate}`
+    },
+    /**
+     * Check if an event is upcoming, if there is no end date, default to start date
+     * @param {Object} item
+     * @returns {Boolean}
+     */
+    isUpcoming: function(item) {
+      const today = new Date()
+      const checkDate = item.fields.endDate || item.fields.startDate || ''
+      return checkDate ? Date.parse(checkDate) > Date.parse(today) : true
+    },
+    /**
+     * Create nuxt link based on type
+     * @param {Object} item
+     * @returns {Object}
+     */
+     nuxtLink: function(item) {
+      const contentTypeId = pathOr("", ["sys","contentType","sys","id"], item)
+      const itemId = pathOr("", ["sys","id"], item)
+      const name = contentTypeId == 'news'
+          ? 'news-and-events-news-id'
+          : 'news-and-events-events-id'
+      return {
+        name,
+        params: { id: itemId }
+      }
+    },
+    href: function(item) {
+      const contentTypeId = pathOr("", ["sys","contentType","sys","id"], item)
+      const itemId = pathOr("", ["sys","id"], item)
+      return contentTypeId == 'news'
+          ? `news-and-events/news/${itemId}`
+          : `news-and-events/events/${itemId}`
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '../../assets/_variables.scss';
+$tablet-small: 48em;
+$tablet-large: 64em;
+.centered {
+  display: flex;
+  margin: auto;
+}
+h2 a:not(:hover) {
+  color: #000;
+  text-decoration: none;
+}
+div.sparc-card {
+  margin-bottom: 1.5rem;
+  @media (min-width: $tablet-small) {
+    margin-bottom: 2.5rem;
+  }
+  ::v-deep &__content-wrap {
+    flex: 7 0 0rem;
+    &__content {
+      @media (min-width: $tablet-small) {
+        font-size: 0.9rem;
+        line-height: 1.5rem;
+        padding: 2rem;
+        .markdown-text {
+          p {
+            margin: 0 0 1.5rem;
+          }
+        }
+      }
+      @media (min-width: $tablet-large) {
+        font-size: 1rem;
+      }
+    }
+  }
+  h3 {
+    font-size: 1.333333333rem;
+    line-height:1.33333333rem;
+    margin:0 0 1rem;
+  }
+  &__detail {
+    align-items: baseline;
+    display: flex;
+    margin-bottom: 1rem;
+    .svg-icon {
+      flex-shrink: 0;
+      margin-right: 0.5rem;
+    }
+    p {
+      margin-bottom: 0rem;
+      margin-right: 2rem;
+    }
+    &--location {
+      margin-left: 1.25rem;
+    }
+  }
+}
+.view-all-link {
+  margin-top: auto;
+  text-decoration: underline !important;
+}
+</style>
diff --git a/components/ImagesGallery/ImagesGallery.vue b/components/ImagesGallery/ImagesGallery.vue
index 4ffc4ec8..29fa1fcd 100644
--- a/components/ImagesGallery/ImagesGallery.vue
+++ b/components/ImagesGallery/ImagesGallery.vue
@@ -1,21 +1,30 @@
 <template>
   <div class="full-size">
-    <div v-if="hasDescription" class="description-info">
-      <p>
-        <strong>Data collection:</strong>
-        {{ description }}
-      </p>
-    </div>
     <client-only placeholder="Loading gallery ...">
-      <div :class="['gallery-container', { 'one-item': galleryItems.length === 1 }]">
-        <gallery
-          :items="galleryItems"
-          :max-width="maxWidth"
-          :show-indicator-bar="true"
-          :show-card-details="true"
-          :highlight-active="shouldHighlight"
-        />
-      </div>
+        <div class="loading-gallery mt-16" v-if="$fetchState.pending" v-loading="$fetchState.pending" />
+        <div v-else-if="$fetchState.error">
+          There was an error loading the gallery items
+        </div>
+        <div v-else-if="galleryItems.length > 0" :class="['gallery-container', { 'one-item': galleryItems.length === 1 }]">
+          <div v-if="hasDescription" class="description-info">
+            <p>
+              <strong>Data collection:</strong>
+              {{ description }}
+            </p>
+          </div>
+          <gallery
+            class="file-viewer-gallery"
+            galleryItemType="fileViewer"
+            :items="galleryItems"
+            :cardWidth="13.8"
+            :datasetId="datasetId"
+            :versionId="versionId"
+            :doi="doi"
+          />
+        </div>
+        <div v-else-if="!$fetchState.pending">
+          This dataset does not contain gallery items
+        </div>
     </client-only>
   </div>
 </template>
@@ -23,34 +32,127 @@
 <script>
 import biolucida from '@/services/biolucida'
 import discover from '@/services/discover'
+import scicrunch from '@/services/scicrunch'
 import flatmaps from '@/services/flatmaps'
+import Uberons from '@/static/js/uberon-map.js'
+import ErrorMessages from '@/mixins/error-messages'
+import Gallery from '@/components/Gallery/Gallery.vue'
 
 import FormatString from '@/mixins/format-string'
 import MarkedMixin from '@/mixins/marked'
+import { pathOr, propOr } from 'ramda'
 
-import { baseName, extractSection } from '@/utils/common'
+import { mapState } from 'vuex'
+
+import { baseName, extractSection, extractS3BucketName } from '@/utils/common'
+
+import { failMessage } from '@/utils/notification-messages'
+
+const getBiolucidaData = async datasetId => {
+  try {
+    return biolucida.searchDataset(datasetId)
+  } catch (e) {
+    return {}
+  }
+}
+
+/**
+ * Get data for objects that have a data specific viewer.
+ * @param {Number} datasetId
+ */
+const getThumbnailData = async (datasetDoi, datasetId, datasetVersion, datasetFacetsData) => {
+  let biolucidaImageData = {}
+  let scicrunchData = {}
+  try {
+    const [biolucida_response, scicrunch_response] = await Promise.all([
+      getBiolucidaData(datasetId),
+      scicrunch.getDatasetInfoFromDOI(datasetDoi)
+    ])
+
+    if (biolucida_response.status === 'success') {
+      const scicrunchData = pathOr([], ['data','result'], scicrunch_response)
+      biolucidaImageData = biolucida_response
+      biolucidaImageData['discover_dataset_version'] = datasetVersion
+      biolucidaImageData['dataset_info'] = scicrunchData.length > 0 ? scicrunchData[0] : {}
+    }
+
+    if (scicrunch_response.data.result.length > 0) {
+      scicrunchData = scicrunch_response.data.result[0]
+      scicrunchData.discover_dataset = {
+        id: Number(datasetId),
+        version: datasetVersion
+      }
+      // Check for flatmap data
+      if (scicrunchData.organs) {
+        let flatmapData = []
+        let species = undefined
+        // Get species data from algolia if it exists
+        if (datasetFacetsData){
+          let speciesArray = datasetFacetsData.filter(item=>item.label==="Species")
+          if (speciesArray && speciesArray.length > 0)
+            species = speciesArray[0].children[0].label.toLowerCase()
+        }
+
+        // check if there is a flatmap for the given species, use a rat if there is not
+        const taxo = species && species in Uberons.species ? Uberons.species[species] : Uberons.species['rat']
+
+        // Check if flatmap has the anatomy for this species. This is done by asking the flatmap knowledge base
+        // if a flatmap of (species) has (anatomy)
+        let foundAnatomy = []
+        if (scicrunchData.organs[0]) { // Check if dataset has organ annotation
+          // Send a requst to flatmap knowledgebase
+          const anatomy = scicrunchData.organs.map(organ => organ.curie)
+          const data = await flatmaps.anatomyQuery(taxo, anatomy)
+
+          // Check request was successful
+          const anatomyResponse = data.data ? data.data.values : undefined
+          if (anatomyResponse && anatomyResponse.length > 0) {
+            foundAnatomy = anatomyResponse.map(val => val[1]) // uberon is stored in second element of tuple
+          }
+        }
+
+        // Add flatmaps that match the anatomy and taxonomy to the gallery
+        scicrunchData.organs.forEach(organ => {
+          if (foundAnatomy.includes(organ.curie)){
+            let organData = {
+              taxo,
+              uberonid: organ.curie,
+              organ: organ.name,
+              id: datasetId,
+              version: datasetVersion,
+              species: species
+            }
+            flatmapData.push(organData)
+          }
+        })
+        //Only create a flatmaps field if flatmapData is not empty
+        if (flatmapData.length > 0)
+          scicrunchData['flatmaps'] = flatmapData
+      }
+    }
+  } catch (e) {
+    console.error(
+      'Hit error in the scicrunch processing. ( pages/_datasetId.vue ). Error: ',
+      e
+    )
+    return {
+      biolucidaImageData: {},
+      scicrunchData: {}
+    }
+  }
+  return {
+    biolucidaImageData,
+    scicrunchData
+  }
+}
 
 export default {
   name: 'ImagesGallery',
   components: {
-    Gallery: process.client
-      ? () => import('@abi-software/gallery').then(gallery => gallery)
-      : null
+    Gallery
   },
   mixins: [FormatString, MarkedMixin],
   props: {
-    datasetScicrunch: {
-      type: Object,
-      default: () => {
-        return {}
-      }
-    },
-    datasetBiolucida: {
-      type: Object,
-      default: () => {
-        return {}
-      }
-    },
     datasetImages: {
       type: Array,
       default: () => {
@@ -75,12 +177,6 @@ export default {
         return []
       }
     },
-    timeseriesData: {
-      type: Array,
-      default: () => {
-        return []
-      }
-    },
     markdown: {
       type: String,
       default: ''
@@ -113,10 +209,25 @@ export default {
       maxWidth: 3,
       scicrunchItems: [],
       biolucidaItems: [],
-      timeseriesItems: []
+      timeseriesItems: [],
+      timeseriesData: [],
+      datasetScicrunch: {},
+      datasetBiolucida: {},
     }
   },
   computed: {
+    ...mapState('pages/datasets/datasetId', 
+      ['datasetInfo', 'datasetFacetsData']
+    ),
+    datasetId() {
+      return propOr('', 'id', this.datasetInfo)
+    },
+    versionId() {
+      return propOr('', 'version', this.datasetInfo)
+    },
+    doi() {
+      return propOr('', 'doi', this.datasetInfo)
+    },
     isPrevPossible() {
       return this.currentIndex > 0
     },
@@ -151,10 +262,61 @@ export default {
       return this.hasDescription || this.galleryItems.length > 1
     }
   },
+  async fetch() {
+    const { biolucidaImageData, scicrunchData } = await getThumbnailData(
+      this.datasetInfo.doi,
+      this.datasetId,
+      this.datasetInfo.version,
+      this.datasetFacetsData
+    )
+    if (Object.keys(biolucidaImageData).length === 0 &&
+      Object.keys(scicrunchData).length === 0 ) {
+      //Non critical error
+      this.$message(failMessage(ErrorMessages.methods.scicrunch()))
+    }
+    this.datasetBiolucida = biolucidaImageData
+    this.datasetScicrunch = scicrunchData
+
+    const newDatasetInfo = {
+      ...this.datasetInfo,
+      sciCrunch: scicrunchData
+    }
+
+    this.$store.dispatch('pages/datasets/datasetId/setDatasetInfo', newDatasetInfo)
+
+        // Get all timeseries files (those with an '.edf' extension)
+    const timeseriesData = process.env.SHOW_TIMESERIES_VIEWER
+    ? await this.$axios.$get(`${process.env.discover_api_host}/search/files?fileType=edf&datasetId=${this.datasetId}`)
+        .then(({ files }) => {
+          let data = []
+          files.forEach(file => {
+            const filePath = file.uri.substring(file.uri.indexOf('files'))
+            const linkUrl =
+                process.env.ROOT_URL +
+                `/datasets/timeseriesviewer?&dataset_id=${file.datasetId}&dataset_version=${file.datasetVersion}&file_path=${filePath}`
+
+            data.push({
+              title: file.name,
+              type: 'Timeseries',
+              thumbnail: undefined,
+              link: linkUrl
+            })
+          })
+          return data
+        })
+        .catch(() => {
+          return []
+        }) 
+    : []
+    this.timeseriesData = timeseriesData
+  },
   watch: {
-    markdown: function(text) {
-      const html = this.parseMarkdown(text)
-      this.description = extractSection(/data collect[^:]+:/i, html)
+    markdown: {
+      immediate: true,
+      handler: function(text) {
+        const html = this.parseMarkdown(text)
+        this.description = extractSection(/data collect[^:]+:/i, html)
+      }
     },
     timeseriesData: {
       deep: true,
@@ -171,11 +333,11 @@ export default {
         const baseRoute = this.$router.options.base || '/'
         let datasetId = -1
         let datasetVersion = -1
+        let s3Bucket = extractS3BucketName(scicrunchData['s3uri'])
         if ('discover_dataset' in scicrunchData) {
           datasetId = scicrunchData.discover_dataset.id
           datasetVersion = scicrunchData.discover_dataset.version
         }
-
         if ('abi-scaffold-metadata-file' in scicrunchData) {
           let index = 0
           items.push(
@@ -184,21 +346,24 @@ export default {
               scaffold => {
                 const file_path = scaffold.dataset.path
                 const id = scaffold.identifier
-                const thumbnail = this.getThumbnailForScaffold(
-                  index,
-                  scicrunchData
+                const thumbnail = this.getThumbnailPathForScaffold(
+                  scaffold,
+                  scicrunchData["abi-scaffold-view-file"],
+                  scicrunchData["abi-thumbnail"],
+                  index
+                )
+                this.retrieveThumbnailFromInfo(items, {
+                    id,
+                    fetchAttempts: 0,
+                    datasetId,
+                    mimetype: thumbnail.mimetype.name,
+                    file_path: thumbnail.dataset.path,
+                    s3Bucket: s3Bucket
+                  },
+                  this.defaultScaffoldImg
                 )
-
-                this.getScaffoldThumbnail(items, {
-                  id,
-                  fetchAttempts: 0,
-                  datasetId,
-                  datasetVersion,
-                  mimetype: thumbnail.mimetype.name,
-                  file_path: thumbnail.dataset.path
-                })
                 let filePath = encodeURIComponent(`files/${file_path}`)
-                const linkUrl = `${baseRoute}datasets/scaffoldviewer?dataset_id=${datasetId}&dataset_version=${datasetVersion}&file_path=${filePath}`
+                const linkUrl = `${baseRoute}maps?type=scaffold&dataset_id=${datasetId}&dataset_version=${datasetVersion}&file_path=${filePath}`
                 index += 1
                 return {
                   id,
@@ -213,35 +378,49 @@ export default {
         }
 
         if ('video' in scicrunchData) {
-          items.push(
-            ...Array.from(scicrunchData.video, videoFile => {
-              const filePath = this.getS3FilePath(
-                datasetId,
-                datasetVersion,
-                videoFile.dataset.path
-              )
-              const linkUrl = `${baseRoute}datasets/videoviewer?dataset_version=${datasetVersion}&dataset_id=${datasetId}&file_path=${filePath}&mimetype=${videoFile.mimetype.name}`
-              return {
-                title: videoFile.name,
-                type: 'Video',
-                thumbnail: this.defaultVideoImg,
-                link: linkUrl
+          const thumbnailPaths = {}
+          if (scicrunchData['abi-thumbnail']) {
+            scicrunchData['abi-thumbnail'].forEach(thumbnail => {
+              const videoPath = thumbnail.datacite.isDerivedFrom.path[0]
+              thumbnailPaths[videoPath] = thumbnail.dataset.path
+            })
+          }
+          scicrunchData.video.forEach(async videoFile => {
+            let thumbnail = this.defaultVideoImg
+            if (thumbnailPaths[videoFile.dataset.path]) {
+              const url = new URL(`${process.env.portal_api}/s3-resource/${datasetId}/files/${thumbnailPaths[videoFile.dataset.path]}`)
+              url.searchParams.append('encodeBase64', true)
+              const img = await fetch(url).then(resp => resp.ok ? resp.text() : null)
+              if (img) {
+                thumbnail = 'data:image/png;base64,' + img
               }
+            }
+            const linkUrl = `${baseRoute}datasets/file/${datasetId}/${datasetVersion}?path=files/${videoFile.dataset.path}`
+            items.push({
+              title: videoFile.name,
+              type: 'Video',
+              thumbnail,
+              link: linkUrl
             })
-          )
+          })
         }
 
         if ('flatmaps' in scicrunchData) {
           items.push(
             ...Array.from(scicrunchData.flatmaps, f => {
               let title = f.uberonid ? f.uberonid : null
-              if (f.organ) title = this.capitalize(f.organ)
+              if (f.organ) {
+                title = `View ${f.organ}`
+              }
 
-              const linkUrl = `${baseRoute}datasets/flatmapviewer?dataset_version=${datasetVersion}&dataset_id=${datasetId}&taxo=${f.taxo}&uberonid=${f.uberonid}&for_species=${f.species}&organ=${f.organ}`
+              let linkUrl = `${baseRoute}maps?type=ac&dataset_version=${datasetVersion}&dataset_id=${datasetId}&taxon=${f.taxo}&anatomy=${f.uberonid}`
+              if (f.species) linkUrl = linkUrl + `&for_species=${f.species}`
               const item = {
                 id: f.uberonid,
                 title: title,
-                type: 'Flatmap',
+                type: `${this.capitalize(
+                  f.species ? f.species : 'rat'
+                )} flatmap`,
                 thumbnail: null,
                 link: linkUrl
               }
@@ -262,12 +441,12 @@ export default {
         if ('mbf-segmentation' in scicrunchData) {
           items.push(
             ...Array.from(scicrunchData['mbf-segmentation'], segmentation => {
-              const id = segmentation.id
+              const id = segmentation.identifier
               let file_path = segmentation.dataset.path
               // patch for discrepancy between file paths containing spaces and/or commas and the s3 path. s3 paths appear to use underscores instead
               file_path = file_path.replaceAll(' ', '_')
               file_path = file_path.replaceAll(',', '_')
-              const link = `${baseRoute}datasets/segmentationviewer?dataset_id=${datasetId}&dataset_version=${datasetVersion}&file_path=files/${file_path}`
+              const link = `${baseRoute}datasets/file/${datasetId}/${datasetVersion}?path=files/${file_path}`
 
               this.getSegmentationThumbnail(items, {
                 id,
@@ -293,7 +472,21 @@ export default {
             ...Array.from(scicrunchData['abi-plot'], plot => {
               const id = plot.identifier
               const file_path = plot.dataset.path
-              const linkUrl = `${baseRoute}datasets/plotviewer?dataset_id=${datasetId}&dataset_version=${datasetVersion}&identifier=${id}`
+              const thumbnail = this.getThumbnailPathForPlot(
+                plot,
+                scicrunchData["abi-thumbnail"]
+              )
+              this.retrieveThumbnailFromInfo(items, {
+                  id,
+                  fetchAttempts: 0,
+                  datasetId,
+                  mimetype: thumbnail.mimetype.name,
+                  file_path: thumbnail.dataset.path,
+                  s3Bucket: s3Bucket
+                },
+                this.defaultPlotImg
+              )
+              const linkUrl = `${baseRoute}datasets/file/${datasetId}/${datasetVersion}?path=files/${file_path}`
               return {
                 id,
                 title: baseName(file_path),
@@ -310,14 +503,6 @@ export default {
             ...Array.from(scicrunchData['common-images'], generic_image => {
               const filePath = generic_image.dataset.path
               const id = generic_image.identifier
-              // this.getImageFromS3(items, {
-              //   id,
-              //   fetchAttempts: 0,
-              //   datasetId,
-              //   datasetVersion,
-              //   imageFilePath: filePath,
-              //   mimetype: generic_image.mimetype.name
-              // })
               const linkUrl = `${baseRoute}datasets/imageviewer?dataset_id=${datasetId}&dataset_version=${datasetVersion}&file_path=${filePath}&mimetype=${generic_image.mimetype.name}`
               return {
                 id,
@@ -336,11 +521,18 @@ export default {
       deep: true,
       immediate: true,
       handler: function(biolucidaData) {
+        const biolucida2DItems = pathOr([], ['dataset_info','biolucida-2d'], biolucidaData)
         let items = []
         const baseRoute = this.$router.options.base || '/'
         if ('dataset_images' in biolucidaData) {
           items.push(
             ...Array.from(biolucidaData.dataset_images, dataset_image => {
+              let filePath = ""
+              biolucida2DItems.forEach(biolucida2DItem => {
+                if (pathOr("", ['biolucida','identifier'], biolucida2DItem) == dataset_image.image_id) {
+                  filePath = "files/" + pathOr("", ['dataset','path'], biolucida2DItem)
+                }
+              })
               this.getThumbnailFromBiolucida(items, {
                 id: dataset_image.image_id,
                 fetchAttempts: 0
@@ -353,8 +545,10 @@ export default {
                 process.env.BL_SHARE_LINK_PREFIX,
                 ''
               )
-              // https://sparc.science/datasets/imageviewer/2724?view=MjcyNC1jb2wtMTA4&dataset_version=5&dataset_id=43
-              let linkUrl =
+              // If we can naviagte directly to the file path then do it, otherwise we have to redirect from the datasets/biolucida page
+              let linkUrl = filePath != "" ?
+                baseRoute +
+                `datasets/file/${biolucidaData.discover_dataset_id}/${biolucidaData.discover_dataset_version}?path=${filePath}` :
                 baseRoute +
                 'datasets/biolucidaviewer/' +
                 dataset_image.image_id +
@@ -399,17 +593,51 @@ export default {
       const encoded_file_path = encodeURIComponent(file_path)
       return `${dataset_id}/${dataset_version}/files/${encoded_file_path}`
     },
-    getThumbnailForScaffold(index, scaffold_info) {
-      if (
-        'abi-scaffold-thumbnail' in scaffold_info &&
-        index < scaffold_info['abi-scaffold-thumbnail'].length
-      ) {
-        return scaffold_info['abi-scaffold-thumbnail'][index]
-      } else if (
-        'abi-thumbnail' in scaffold_info &&
-        index < scaffold_info['abi-thumbnail'].length
-      ) {
-        return scaffold_info['abi-thumbnail'][index]
+    /**
+     * Find data path in the array that matches the provide path
+     */
+    findEntryWithPathInArray(array, path) {
+      if (path && array) {
+        for (let i = 0; i < array.length; i++) {
+          if (path === array[i].dataset.path) return array[i]
+        }
+      }
+      return undefined
+    },
+    getThumbnailPathForPlot(plot, thumbnails) {
+      if (thumbnails && plot) {
+        const thumbnail = this.findEntryWithPathInArray(thumbnails, plot.datacite.isSourceOf.path[0])
+        if (thumbnail) {
+          return thumbnail
+        }
+      }
+      return {
+        dataset: {
+          path: ''
+        },
+        mimetype: {
+          name: ''
+        }
+      }
+    },
+    /**
+     * Use the scaffoldViews to help with finding the correct thumbnails.
+     * Use the index if the workflow stated above fails.
+     */
+    getThumbnailPathForScaffold(scaffold, scaffoldViews, thumbnails, index) {
+      if (thumbnails && thumbnails.length > 0) {
+        let thumbnail = undefined
+        if (scaffold && scaffoldViews) {
+          const view = this.findEntryWithPathInArray(scaffoldViews, scaffold.datacite.isSourceOf.path[0])
+          if (view) {
+            thumbnail = this.findEntryWithPathInArray(thumbnails, view.datacite.isSourceOf.path[0])
+          }
+        }
+        if (thumbnail) {
+          return thumbnail
+        } else if (index < thumbnails.length) {
+          return thumbnails[index]
+        }
       }
 
       return {
@@ -421,9 +649,9 @@ export default {
         }
       }
     },
-    getScaffoldThumbnail(items, info) {
+    retrieveThumbnailFromInfo(items, info, defaultImg) {
       discover
-        .fetch(info.datasetId, info.datasetVersion, info.file_path, true)
+        .fetch(info.datasetId, info.file_path, true, info.s3Bucket)
         .then(
           response => {
             let item = items.find(x => x.id === info.id)
@@ -439,10 +667,10 @@ export default {
               info.fetchAttempts < 3
             ) {
               info.fetchAttempts += 1
-              return this.getScaffoldThumbnail(items, info)
+              return this.retrieveThumbnailFromInfo(items, info)
             } else {
               let item = items.find(x => x.id === info.id)
-              this.$set(item, 'thumbnail', this.defaultScaffoldImg)
+              this.$set(item, 'thumbnail', defaultImg)
             }
 
             return Promise.reject('Maximum iterations reached.')
@@ -550,37 +778,6 @@ export default {
         }
       }
     },
-    getImageFromS3(items, image_info) {
-      discover
-        .fetch(
-          image_info.datasetId,
-          image_info.datasetVersion,
-          image_info.imageFilePath,
-          true
-        )
-        .then(
-          response => {
-            let item = items.find(x => x.id === image_info.id)
-            this.scaleThumbnailImage(item, {
-              mimetype: image_info.mimetype,
-              data: response.data
-            })
-          },
-          reason => {
-            if (
-              reason.message.includes('timeout') &&
-              reason.message.includes('exceeded') &&
-              image_info.fetchAttempts < 3
-            ) {
-              image_info.fetchAttempts += 1
-              this.getImageFromS3(items, image_info)
-            } else {
-              let item = items.find(x => x.id === image_info.id)
-              this.$set(item, 'thumbnail', this.defaultImg)
-            }
-          }
-        )
-    },
     getThumbnailFromBiolucida(items, info) {
       biolucida.getThumbnail(info.id).then(
         response => {
@@ -637,7 +834,18 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+::v-deep .file-viewer-gallery {
+  .card-line {
+    flex-grow: 0 !important;
+    gap: 1rem;
+  }
+}
+.loading-gallery {
+  overflow: hidden;
+  min-height: 4rem;
+}
+
 .full-size {
   width: 100%;
   height: 100%;
@@ -716,9 +924,3 @@ a.next {
   flex-grow: unset !important;
 }
 </style>
-
-<style lang="scss">
-.gallery-container {
-  @import '~@abi-software/gallery/dist/gallery';
-}
-</style>
diff --git a/components/LatestNewsAndEvents/LatestNewsAndEvents.vue b/components/LatestNewsAndEvents/LatestNewsAndEvents.vue
deleted file mode 100644
index 629e6ee3..00000000
--- a/components/LatestNewsAndEvents/LatestNewsAndEvents.vue
+++ /dev/null
@@ -1,204 +0,0 @@
-<template>
-  <div class="container py-32">
-    <div class="heading2 mb-16 section-title">Stay up to date</div>
-    <el-row :gutter="32">
-      <el-col class="mb-16" :sm="12">
-        <div class="heading2 subheading mb-16">Latest News</div>
-        <div class="subpage news-wrap">
-          <div>
-            <news-list-item v-for="newsItem in news.items" :key="newsItem.sys.id" :item="newsItem" />
-
-            <nuxt-link
-              class="btn-load-more mt-16"
-              :to="{
-                name: 'news-and-events-news'
-              }"
-            >
-              View All News &gt;
-            </nuxt-link>
-          </div>
-        </div>
-      </el-col>
-      <el-col :sm="12">
-        <div class="heading2 subheading mb-16">Events</div>
-        <!--
-          Server side rendering does not work with the following
-          combination of components
-        -->
-        <client-only>
-          <content-tab-card
-            class="tabs p-32"
-            :tabs="eventsTabs"
-            :active-tab-id="activeTabId"
-            @tab-changed="eventsTabChanged"
-          >
-            <template v-if="activeTabId === 'upcoming'">
-              <div class="upcoming-events">
-                <event-card
-                  v-for="event in upcomingEvents.items"
-                  :key="event.sys.id"
-                  :event="event"
-                />
-              </div>
-
-            </template>
-
-            <template v-if="activeTabId === 'past'">
-              <div class="past-events">
-                <event-card
-                  v-for="event in pastEvents.items"
-                  :key="event.sys.id"
-                  :event="event"
-                />
-              </div>
-            </template>
-            <div class="mt-16">
-              <nuxt-link
-                class="btn-load-more"
-                :to="{
-                  name: 'news-and-events-events',
-                }"
-              >
-                View All Events >
-              </nuxt-link>
-            </div>
-          </content-tab-card>
-        </client-only>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-import TabNav from '@/components/TabNav/TabNav.vue';
-import EventListItem from '@/components/EventListItem/EventListItem.vue';
-import NewsListItem from '@/components/NewsListItem/NewsListItem.vue';
-import EventCard from '@/components/EventCard/EventCard.vue';
-import MarkedMixin from '@/mixins/marked'
-
-import createClient from '@/plugins/contentful.js';
-
-import { fetchData, fetchNews } from '@/pages/news-and-events/model';
-
-const client = createClient()
-
-export default {
-  name: 'LatestNewsAndEvents',
-
-  mixins: [
-    MarkedMixin
-  ],
-
-  components: {
-    EventCard,
-    EventListItem,
-    NewsListItem,
-    TabNav,
-  },
-
-  async mounted() {
-    const { upcomingEvents, pastEvents, news } = await fetchData(client, '', 2)
-    this.news = news
-    this.upcomingEvents = upcomingEvents
-    this.pastEvents = pastEvents
-  },
-
-  data: function() {
-    return {
-      activeTabId: 'upcoming',
-      eventsTabs: [
-        {
-          label: 'Upcoming',
-          id: 'upcoming'
-        },
-        {
-          label: 'Past',
-          id: 'past'
-        }
-      ],
-      upcomingEvents: {},
-      pastEvents: {},
-      news: {},
-    }
-  },
-
-  methods: {
-    /**
-     * Get all news
-     */
-    getAllNews: async function() {
-      const news = await fetchNews(client, '', undefined, undefined, undefined, undefined, this.news.total, 2)
-      this.news = { ...this.news, items: { ...this.news.items, ...news.items } }
-    },
-    eventsTabChanged(newTab) {
-      this.activeTabId = newTab.id
-    },
-  },
-}
-</script>
-
-<style lang="scss" scoped>
-@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
-.subpage {
-  margin: 0;
-}
-.subheading {
-  font-weight: 100;
-}
-.section-title {
-  text-align: center;
-}
-.event-card {
-  margin-bottom: 2em;
-}
-::v-deep .details-tabs__container {
-  background: none;
-  border: none;
-  margin: 1em 0;
-  padding: 0;
-}
-.upcoming-events, .past-events {
-  justify-content: space-between;
-  display: flex;
-  flex-wrap: wrap;
-}
-.upcoming-event {
-  margin: 0;
-  width: 100%;
-  @media (min-width: 48em) {
-    width: calc(50% - 2.4rem); // Account for the margins and the border
-  }
-}
-.news-list-item {
-  border-bottom: 2px solid #d8d8d8;
-  padding: 1.5em 0;
-  &:first-child {
-    padding-top: 0;
-  }
-}
-
-.btn-load-more {
-  background: none;
-  border: none;
-  color: $darkBlue;
-  cursor: pointer;
-  display: block;
-  font-size: 1rem;
-  font-weight: 700;
-  padding: 0;
-  &:hover,
-  &:active {
-    text-decoration: underline;
-  }
-}
-
-::v-deep .el-button {
-  a {
-    text-decoration: none !important;
-  }
-}
-
-::v-deep .tabs {
-  padding: 0;
-}
-</style>
diff --git a/components/LearnMoreCard/LearnMoreCard.vue b/components/LearnMoreCard/LearnMoreCard.vue
index 97b681d5..9fa56d2b 100644
--- a/components/LearnMoreCard/LearnMoreCard.vue
+++ b/components/LearnMoreCard/LearnMoreCard.vue
@@ -1,18 +1,15 @@
 <template>
   <div class="learn-more-card">
-    <h3>
-      <nuxt-link class="about-link" :to="aboutLink"
-        v-html="aboutDetailsItem.fields ? highlightMatches(aboutDetailsItem.fields.title, $route.query.search) : ''"
-      />
-    </h3>
+    <a class="link1" :href="aboutDetailsItem.fields.link"
+      v-html="aboutDetailsItem.fields ? highlightMatches(aboutDetailsItem.fields.title, $route.query.search) : ''"
+    />
     <p
-      v-html="aboutDetailsItem.fields ? highlightMatches(aboutDetailsItem.fields.summary, $route.query.search) : ''"
+      v-html="aboutDetailsItem.fields ? highlightMatches(aboutDetailsItem.fields.description, $route.query.search) : ''"
     />
   </div>
 </template>
 
 <script>
-import { pathOr } from 'ramda'
 import { highlightMatches } from '../../pages/data/utils'
 
 export default {
@@ -27,43 +24,12 @@ export default {
           fields: {}
         }
       }
-    },
-    parentPath: {
-      type: String,
-      default: ''
     }
   },
 
   methods: {
     highlightMatches
   },
-
-  computed: {
-    /**
-     * Compute the link to the about details article
-     * This will use the slug if available, and fallback
-     * to the ID of the entry if not
-     * @returns {Object}
-     */
-    aboutLink() {
-      const sysId = pathOr('', ['sys', 'id'], this.aboutDetailsItem)
-      const aboutDetailsId = pathOr(
-        sysId,
-        ['fields', 'slug'],
-        this.aboutDetailsItem
-      )
-      const aboutDetailsLevel = pathOr(
-        '',
-        ['fields', 'level'],
-        this.aboutDetailsItem
-      )
-      const route =
-        aboutDetailsLevel === '3rd Level Details'
-          ? `about-${this.parentPath}-aboutDetailsId`
-          : 'about-aboutDetailsId'
-      return { name: route, params: { aboutDetailsId } }
-    }
-  }
 }
 </script>
 
@@ -82,10 +48,8 @@ export default {
     font-size: 1em !important;
   }
 }
-.about-link {
-  color: $median;
-}
-.about-link:not(:hover) {
+
+.link1:not(:hover) {
   text-decoration: none;
 }
 </style>
diff --git a/components/Loading/Loading.vue b/components/Loading/Loading.vue
new file mode 100644
index 00000000..028fc6d3
--- /dev/null
+++ b/components/Loading/Loading.vue
@@ -0,0 +1,47 @@
+<template>
+  <div class="loading-container" v-if="loading">
+    <img class="logo" :src="logo" />
+  </div>
+</template>
+<script>
+export default {
+  name: 'Loading',
+  data: () => ({
+    loading: false,
+    loaded: false,
+    logo: require('~/assets/sparcLogoFast.gif'),
+  }),
+  methods: {
+    start() {
+      this.loaded = false
+      this.loading = false
+      setTimeout(() => {
+        if (!this.loaded)
+          this.loading = true
+      }, 1000)
+    },
+    finish() {
+      this.loading = false
+      this.loaded = true
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.loading-container {
+  position: fixed;
+  top: 0;
+  z-index: 1;
+  background-color: white;
+  opacity: .5;
+  width: 100vw;
+  height: 100vh;
+}
+.logo {
+  position: absolute;
+  height: 5rem;
+  z-index: 2;
+  left: calc(50vw - 5rem);
+  top: calc(50vh - 5rem);
+}
+</style>
diff --git a/components/LoginModal/LoginModal.vue b/components/LoginModal/LoginModal.vue
index ba052666..f8f8ca57 100644
--- a/components/LoginModal/LoginModal.vue
+++ b/components/LoginModal/LoginModal.vue
@@ -6,11 +6,21 @@
   >
     <div class="content" slot="mainContent">
       <h1 class="heading1 mb-8">
-        {{ fields.title }}
+        Sign into SPARC
       </h1>
       <!-- eslint-disable vue/no-v-html -->
       <!-- marked will sanitize the HTML injected -->
-      <div class="body1" v-html="parseMarkdown(fields.description)" />
+      <div class="body1">
+        <p>
+          SPARC Portal login authentication is provided by <a href="https://orcid.org">ORCID iD</a>. Create a SPARC Portal account or sign in to your existing SPARC Portal account by using your existing ORCID iD credentials. If you do not have an existing ORCID iD, please <a href="https://orcid.org/register">register here</a> for a free account.
+        </p>
+        <p>
+          Upon initial login to the SPARC Portal via ORCID iD, you will also be creating* an account on <a href="https://app.pennsieve.io/">Pennsieve</a> to unlock all the features the SPARC Portal has to offer.
+        </p>
+        <p>
+          Learn more <a href="https://docs.sparc.science/docs/sparc-portal-login">here</a> about why a Pennsieve account is being created for you and which features are enabled by the SPARC Portal login.
+        </p>
+      </div>
       <el-button class="secondary" @click="onLoginWithORCID">
         <img
           class="orcid-logo mr-2"
@@ -23,7 +33,9 @@
       </el-button>
       <!-- eslint-disable vue/no-v-html -->
       <!-- marked will sanitize the HTML injected -->
-      <div class="mt-16 body4" v-html="parseMarkdown(fields.termsAndConditions)" />
+      <p class="mt-16 body4">
+        Use of the SPARC Portal, its data and resources, regardless of registration status, implies acceptance of the <a href="https://docs.sparc.science/docs/policies">SPARC Data and Resource Center Privacy Policy</a> and adherence to the <a href="https://docs.sparc.science/docs/terms-of-service">SPARC Terms of Service</a> and the <a href="https://docs.sparc.science/docs/instructions-for-sparc-investigators-to-cite-their-datasets-in-manuscripts-1">SPARC Citation Policy</a>. By signing in to SPARC, you are also accepting the <a href="https://docs.pennsieve.io/page/pennsieve-terms-of-use">Pennsieve Terms of Use</a> and <a href="https://docs.pennsieve.io/page/privacy-policy">Pennsieve Privacy Policy</a>.
+      </p>
       <p class="body4">
         * If you already have an account on Pennsieve, you will be able to link your newly created SPARC account to it by entering your existing Pennsieve account's e-mail address when prompted.
       </p>
@@ -37,7 +49,6 @@
 </template>
 <script>
 import createClient from '@/plugins/contentful.js'
-import ErrorMessages from '@/mixins/error-messages'
 import marked from '@/mixins/marked/index'
 
 const client = createClient()
@@ -50,28 +61,18 @@ export default {
   data() {
     return {
       dialogVisible: false,
-      fields: {}
     }
   },
   props: {
     showDialog: {
       type: Boolean,
       default: false
+    },
+    redirectUrl: {
+      type: String,
+      default: ''
     }
   },
-  fetch() {
-    return client
-      .getEntry(process.env.ctf_sparc_login_modal_id)
-      .then(({ fields }) => {
-          this.fields = fields
-        }
-      )
-      .catch( e => {
-        console.error(e)
-        //Display the error page with an custom message
-        error({ statusCode: 400, message: ErrorMessages.methods.contentful(), display: true, error: e} )
-      })
-  },
   watch: {
     showDialog: {
       handler: function(show) {
@@ -93,7 +94,7 @@ export default {
     onLoginWithORCID: async function(x) {
       x.preventDefault()
       this.dialogVisible = false
-      this.$cookies.set('sign-in-redirect-url', this.$nuxt.$route.fullPath)
+      this.$cookies.set('sign-in-redirect-url', this.redirectUrl || this.$nuxt.$route.fullPath)
       await this.$store.dispatch('user/login', 'ORCID')
       
     },
diff --git a/components/Metrics/ScientificContribution.vue b/components/Metrics/ScientificContribution.vue
new file mode 100644
index 00000000..a81f2b60
--- /dev/null
+++ b/components/Metrics/ScientificContribution.vue
@@ -0,0 +1,292 @@
+<template>
+  <div class="p-16">
+    <div class="heading2 mb-0">
+      Data
+    </div>
+    <BarChart
+      :chartData="dataChartData"
+      :chartOptions="dataChartOptions"
+    />
+    <hr class="my-16"/>
+    <div class="row">
+      <div class="col">
+        <div class="col-header heading2 mb-0">
+          Samples: <span class="col-data">{{ totalSamples }}</span> <span class="body1">Across all Data</span>
+        </div>
+      </div>
+      <div class="col">
+        <div class="col-header heading2 mb-0">
+          Subjects: <span class="col-data">{{ totalSubjects }}</span> <span class="body1">Across all Data</span>
+        </div>
+      </div>
+    </div>
+    <hr class="my-16"/>
+    <div class="heading2 mb-0">
+      Anatomical Structures
+    </div>
+    <span class="col-data pl-32">
+      {{ totalAnatomicalStructures }}
+    </span><span>Different Anatomical Structures</span>
+    <div class="heading3 chart-title">Top 5 Anatomical Structures</div>
+    <BarChart
+      :chartData="anatomicalStructuresChartData"
+      :chartOptions="anatomicalStructuresChartOptions"
+    />
+    <hr class="my-16"/>
+    <div class="row">
+      <div class="col">
+        <div class="col-header heading2 mb-0">
+          File Storage: <span class="col-data">{{ totalFileStorage }} GB </span><span class="body1">Across all Data</span>
+        </div>
+      </div>
+      <div v-if="totalProtocols" class="col">
+        <div class="col-header heading2 mb-0">
+          Number of Protocols: <span class="col-data">{{ totalProtocols }}</span> <span class="body1"> overall</span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { pathOr, propOr } from 'ramda'
+import BarChart from '@/components/Charts/BarChart.vue'
+
+export default {
+  name: 'ScientificContribution',
+  components: {
+    BarChart
+  },
+  props: {
+    metricsData: {
+      type: Object,
+      default: () => {}
+    },
+  },
+  watch: {
+    scientificContribution: {
+      handler: function(contribution) {
+        if (!contribution) {
+          return
+        }
+        this.dataChartData = {
+          labels: contribution.dataChartLabels,
+          datasets: [ 
+            {
+              backgroundColor: [
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+              ],
+              borderColor: 'rgba(131, 0, 191, .5)',
+              data: contribution.dataChartData.total
+            },
+          ]
+        },
+        this.anatomicalStructuresChartData = {
+          labels: contribution.anatomicalStructuresChartLabels,
+          datasets: [ 
+            {
+              backgroundColor: [
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)'
+              ],
+              borderColor: 'rgba(131, 0, 191, .5)',
+              data: contribution.anatomicalStructuresChartData
+            } 
+          ]
+        }
+      },
+      immediate: true
+    }
+  },
+  data() {
+    return {
+      dataChartData: {},
+      dataChartOptions: {
+        responsive: true,
+        maintainAspectRatio: false,
+        drawOnChartArea: false,
+        title: {
+          display: true,
+        },
+        legend: {
+          display: false
+        },
+        scales: {
+          yAxes: [{
+            gridLines: {
+              drawTicks: true,
+              drawOnChartArea: false,
+              lineWidth: 2
+            },
+            ticks: {
+              display: true,
+              padding: 3,
+              callback: (value, index, values) => {
+                // we only want to show the greatest value tick
+                if (values[0] == value) {
+                  return value
+                }
+              }
+            },
+            scaleLabel: {
+              display: false,
+            }
+          }],
+          xAxes: [{
+            gridLines: {
+              drawTicks: false,
+              drawOnChartArea: false,
+              lineWidth: 2
+            },
+            ticks: {
+              padding: 8,
+              fontFamily: 'sans-serif',
+              fontSize: 16,
+              fontStyle: 'bold'
+            },
+          }]
+        },
+        plugins: {
+          datalabels: {
+            anchor: 'end',
+            align: 'top',
+            formatter: Math.round,
+            font: {
+                weight: 'bold',
+                size: 16
+            }
+          }
+        }    
+      },
+      anatomicalStructuresChartData: {},
+      anatomicalStructuresChartOptions: {
+        responsive: true,
+        maintainAspectRatio: false,
+        drawOnChartArea: false,
+        title: {
+          display: false,
+        },
+        legend: {
+          display: false
+        },
+        scales: {
+          yAxes: [{
+            gridLines: {
+              drawTicks: true,
+              drawOnChartArea: false,
+              lineWidth: 2
+            },
+            ticks: {
+              display: true,
+              padding: 3,
+              callback: (value, index, values) => {
+                // we only want to show the greatest value tick
+                if (values[0] == value) {
+                  return value
+                }
+              }
+            },
+            scaleLabel: {
+              display: false,
+            }
+          }],
+          xAxes: [{
+            gridLines: {
+              drawTicks: false,
+              drawOnChartArea: false,
+              lineWidth: 2
+            },
+            ticks: {
+              padding: 8,
+              fontFamily: 'sans-serif',
+              fontSize: 16,
+              fontStyle: 'bold'
+            },
+          }]
+        },
+        plugins: {
+          datalabels: {
+            anchor: 'end',
+            align: 'top',
+            formatter: Math.round,
+            font: {
+                weight: 'bold',
+                size: 16
+            }
+          }
+        }    
+      }
+    }
+  },
+  computed: {
+    scientificContribution() {
+      return propOr({}, 'scientificContribution', this.metricsData)
+    },
+    totalAnatomicalStructures() {
+      return pathOr('', ['anatomicalStructures', 'total'], this.scientificContribution)
+    },
+    totalSamples() {
+      return pathOr('', ['samples', 'total'], this.scientificContribution)
+    },
+    totalSubjects() {
+      return pathOr('', ['subjects', 'total'], this.scientificContribution)
+    },
+    totalFileStorage() {
+      return pathOr('', ['fileStorage', 'totalGB'], this.scientificContribution)
+    },
+    totalProtocols() {
+      return pathOr(undefined, ['protocols', 'total'], this.scientificContribution)
+    }
+  },
+}
+
+</script>
+<style scoped lang="scss">
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+hr {
+  border-top: none;
+  border-left: none;
+  border-right: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+}
+
+.row {
+  display: flex;
+  @media screen and (max-width: 767px) {
+    flex-direction: column;
+  }
+}
+
+.col {
+  text-align: center;
+  width: 50%;
+  @media screen and (max-width: 767px) {
+    width: 100%;
+  }
+}
+
+.col-header {
+  text-align: left;
+}
+
+.col-data {
+  font-size: 2rem;
+  line-height: 2.75rem;
+  color: $purple;
+  font-weight: bold;
+}
+
+.chart-title {
+  text-align: center;
+}
+</style>
diff --git a/components/Metrics/UserBehaviors.vue b/components/Metrics/UserBehaviors.vue
new file mode 100644
index 00000000..00cd3e9e
--- /dev/null
+++ b/components/Metrics/UserBehaviors.vue
@@ -0,0 +1,300 @@
+<template>
+  <div class="p-16">
+    <div class="heading2 mb-0">
+      Page Views
+    </div>
+    <BarChart
+      :chartData="pageChartData"
+      :chartOptions="pageChartOptions"
+    />
+    <hr class="my-16"/>
+    <div class="heading2 mb-0">
+      User Types
+    </div>
+    <BarChart
+      :chartData="usersChartData"
+      :chartOptions="usersChartOptions"
+    />
+    <hr class="my-16"/>
+    <div class="row">
+      <div class="col">
+        <div class="col-header heading2 mb-0">
+          Downloads last month: <span class="col-data">{{ totalDownloadsLastMonth }}</span> <span class="body1">({{ totalDownloadsLastQuarter }} last quarter)</span>
+        </div>
+      </div>
+      <div class="col">
+        <div class="col-header heading2 mb-0">
+          Dataset Contributors: <span class="col-data">{{ totalContributers }}</span> <span class="body1">({{ newContributers }} new in the last month)</span>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+
+import { pathOr, propOr } from 'ramda'
+import BarChart from '@/components/Charts/BarChart.vue'
+
+export default {
+  name: 'UserBehaviors',
+  components: {
+    BarChart
+  },
+  props: {
+    metricsData: {
+      type: Object,
+      default: () => {}
+    },
+  },
+  watch: {
+    userBehaviors: {
+      handler: function(behaviors) {
+        if (!behaviors) {
+          return
+        }
+        this.pageChartData = {
+          labels: behaviors.pageViewsLabels,
+          datasets: [ 
+            { 
+              label: 'Last Month',
+              backgroundColor: [
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+              ],
+              borderColor: 'rgba(131, 0, 191, .5)',
+              data: behaviors.pageViewsData.lastMonth
+            },
+            { 
+              label: 'Last Quarter',
+              backgroundColor: [
+                'rgba(188, 0, 252, .25)',
+                'rgba(188, 0, 252, .25)',
+                'rgba(188, 0, 252, .25)',
+                'rgba(188, 0, 252, .25)',
+                'rgba(188, 0, 252, .25)',
+                'rgba(188, 0, 252, .25)',
+              ],
+              borderColor: 'rgba(188, 0, 252, .25)',
+              data: behaviors.pageViewsData.last3Months
+            }
+          ]
+        }
+        this.usersChartData = {
+          labels: [ 'Returning', 'New' ],
+          datasets: [ 
+            { 
+              label: 'Last Month',
+              backgroundColor: [
+                'rgba(131, 0, 191, .5)',
+                'rgba(131, 0, 191, .5)',
+              ],
+              borderColor: 'rgba(131, 0, 191, .5)',
+              data: behaviors.usersData.lastMonth
+            },
+            { 
+              label: 'Last Quarter',
+              backgroundColor: [
+                'rgba(188, 0, 252, .25)',
+                'rgba(188, 0, 252, .25)',
+              ],
+              borderColor: 'rgba(188, 0, 252, .25)',
+              data: behaviors.usersData.last3Months
+            }
+          ]
+        }
+      },
+      immediate: true
+    }
+  },
+  data() {
+    return {
+      pageChartData: {},
+      pageChartOptions: {
+        responsive: true,
+        maintainAspectRatio: false,
+        drawOnChartArea: false,
+        title: {
+          display: true,
+        },
+        legend: {
+          labels: {
+            boxWidth: 13
+          },
+          position: 'right',
+          align: 'start',
+        },
+        scales: {
+          yAxes: [{
+            gridLines: {
+              drawTicks: true,
+              drawOnChartArea: false,
+              lineWidth: 2
+            },
+            ticks: {
+              display: true,
+              padding: 3,
+              callback: (value, index, values) => {
+                // we only want to show the greatest value tick
+                if (values[0] == value) {
+                  return value
+                }
+              }
+            },
+            scaleLabel: {
+              display: false,
+            }
+          }],
+          xAxes: [{
+            barPercentage: 1.0,
+            gridLines: {
+              drawTicks: false,
+              drawOnChartArea: false,
+              lineWidth: 2
+            },
+            ticks: {
+              padding: 8,
+              fontFamily: 'sans-serif',
+              fontSize: 16,
+              fontStyle: 'bold'
+            },
+          }]
+        },
+        plugins: {
+          datalabels: {
+            anchor: 'end',
+            align: 'top',
+            formatter: Math.round,
+            font: {
+                weight: 'bold',
+                size: 16
+            }
+          }
+        }    
+      },
+      usersChartData: {},
+      usersChartOptions: {
+        responsive: false,
+        maintainAspectRatio: false,
+        drawOnChartArea: false,
+        title: {
+          display: true,
+        },
+        legend: {
+          labels: {
+            boxWidth: 13
+          },
+          position: 'right',
+          align: 'start',
+        },
+        scales: {
+          yAxes: [{
+            gridLines: {
+              drawTicks: true,
+              drawOnChartArea: false,
+              lineWidth: 2
+            },
+            ticks: {
+              display: true,
+              padding: 3,
+              callback: (value, index, values) => {
+                // we only want to show the greatest value tick
+                if (values[0] == value) {
+                  return value
+                }
+              }
+            },
+            scaleLabel: {
+              display: false
+            }
+          }],
+          xAxes: [{
+            barPercentage: 1.0,
+            gridLines: {
+              drawTicks: false,
+              drawOnChartArea: false,
+              lineWidth: 2
+            },
+            ticks: {
+              padding: 8,
+              fontFamily: 'sans-serif',
+              fontSize: 16,
+              fontStyle: 'bold'
+            },
+          }]
+        },
+        plugins: {
+          datalabels: {
+            anchor: 'end',
+            align: 'top',
+            formatter: Math.round,
+            font: {
+                weight: 'bold',
+                size: 16
+            }
+          }
+        }    
+      }
+    }
+  },
+  computed: {
+    userBehaviors() {
+      return propOr({}, 'userBehaviors', this.metricsData)
+    },
+    totalDownloadsLastMonth() {
+      return pathOr('', ['totalDownloadsData', 'lastMonth'], this.userBehaviors)
+    },
+    totalDownloadsLastQuarter() {
+      return pathOr('', ['totalDownloadsData', 'last3Months'], this.userBehaviors)
+    },
+    totalContributers() {
+      return pathOr('', ['datasetContributorsData', 'total'], this.userBehaviors)
+    },
+    newContributers() {
+      return pathOr('', ['datasetContributorsData', 'newLastMonth'], this.userBehaviors)
+    }
+  },
+}
+
+</script>
+<style scoped lang="scss">
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+hr {
+  border-top: none;
+  border-left: none;
+  border-right: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+}
+
+.row {
+  display: flex;
+  @media screen and (max-width: 767px) {
+    flex-direction: column;
+  }
+}
+
+.col {
+  text-align: center;
+  width: 50%;
+  @media screen and (max-width: 767px) {
+    width: 100%;
+  }
+}
+
+.col-header {
+  text-align: left;
+}
+
+.col-data {
+  font-size: 2rem;
+  line-height: 2.75rem;
+  color: $purple;
+  font-weight: bold;
+}
+</style>
diff --git a/components/NewsAndEventsForm/NewsAndEventsForm.vue b/components/NewsAndEventsForm/NewsAndEventsForm.vue
deleted file mode 100644
index e186495a..00000000
--- a/components/NewsAndEventsForm/NewsAndEventsForm.vue
+++ /dev/null
@@ -1,234 +0,0 @@
-<template>
-  <el-form
-    ref="submitForm"
-    label-position="top"
-    :model="form"
-    :rules="formRules"
-    :hide-required-asterisk="true"
-  >
-    <el-form-item prop="name" label="Your name">
-      <el-input v-model="form.name" placeholder="Enter your name" />
-    </el-form-item>
-
-    <el-form-item prop="email" label="Email address">
-      <el-input v-model="form.email" placeholder="Enter your email address" type="email" />
-    </el-form-item>
-
-    <hr/>
-
-    <el-form-item prop="title" label="Title">
-      <el-input v-model="form.title" placeholder="Enter a title for your news or event" />
-    </el-form-item>
-
-    <el-form-item prop="summary" label="Summary">
-      <el-input
-        v-model="form.summary"
-        type="textarea"
-        :rows="3"
-        placeholder="Tell us some details about your news or event"
-      />
-    </el-form-item>
-
-    <hr/>
-
-    <el-form-item prop="fileAttachment" label="Image Upload">
-      <div class="body4 mb-8"><i>To help other users understand your news or event, an image can really help. We recommend images of 600px by 600px.</i></div>
-      <el-upload
-        ref="fileUploader"
-        action=""
-        :limit="limit"
-        :auto-upload="false"
-        :on-change="onUploadChange"
-        :on-remove="onRemove"
-        :before-remove="beforeRemove" >
-        <el-button slot="trigger" class="secondary">Select file</el-button>
-        <div slot="tip" class="el-upload__tip">jpg/png file with a size less than 5MB</div>
-      </el-upload>
-    </el-form-item>
-
-    <el-form-item prop="url" label="Supporting Information">
-      <el-input placeholder="Enter URL" v-model="form.url">
-        <template slot="prepend">Http://</template>
-      </el-input>
-    </el-form-item>
-
-    <hr/>
-
-    <div class="heading1 mb-16">Event specific details</div>
-
-    <el-form-item prop="location" label="Location">
-      <el-input v-model="form.location" placeholder="Enter the location of the event. If there is no physical location, please enter 'virtual'" />
-    </el-form-item>
-
-    <el-form-item prop="startDate" label="Start Date">
-      <el-date-picker
-        v-model="form.startDate"
-        type="date"
-        placeholder="Enter the start date"
-      />
-    </el-form-item>
-
-    <el-form-item prop="endDate" label="End Date">
-      <el-date-picker
-        v-model="form.endDate"
-        type="date"
-        placeholder="Enter the end date"
-      />
-    </el-form-item>
-
-    <hr/>
-
-    <div class="body4 mb-16"><i>Before your news or event is published on the SPARC Portal, it will be reviewed. The reviewer may contact you to clarify or seek additional information.</i></div>
-
-    <el-form-item class="submit-button">
-      <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
-        Submit
-      </el-button>
-      <p v-if="hasError" class="error">
-        An error has occurred, please try again.
-      </p>
-    </el-form-item>
-  </el-form>
-</template>
-
-<script>
-
-import FileUploadMixin from '@/mixins/file-upload/index'
-import { propOr } from 'ramda'
-
-export default {
-  name: 'NewsAndEventsForm',
-
-  mixins: [FileUploadMixin],
-
-  data() {
-    return {
-      hasError: false,
-      form: {
-        name: '',
-        email: '',
-        title: '',
-        summary: '',
-        url: '',
-        location: '',
-        startDate: '',
-        endDate: ''
-      },
-      isSubmitting: false,
-      formRules: {
-        email: [
-          {
-            required: true,
-            message: 'Please enter your email',
-            type: 'email',
-            trigger: 'blur'
-          }
-        ],
-        name: [
-          {
-            required: true,
-            message: 'Please enter your name',
-            trigger: 'blur',
-          }
-        ],
-        title: [
-          {
-            required: true,
-            message: 'Please a title',
-            trigger: 'blur',
-          }
-        ],
-        summary: [
-          {
-            required: true,
-            message: 'Please enter a summary',
-            trigger: 'change'
-          }
-        ]
-      }
-    }
-  },
-
-  mounted() {
-    // Reset form fields when showing the form
-    this.$refs.submitForm.resetFields()
-    this.hasError = false
-  },
-
-  methods: {
-    /**
-     * Submit the form and validate
-     */
-    onSubmit() {
-      this.hasError = false
-
-      this.$refs.submitForm.validate(valid => {
-        if (!valid) {
-          return
-        }
-        this.sendForm()
-      })
-    },
-
-    /**
-     * Send form to endpoint
-     */
-    sendForm() {
-      this.isSubmitting = true
-      const fileName = propOr('', 'name', this.file)
-      const description = `
-        <b>Contact Information</b><br><br>
-        <b>Name:</b><br>${this.form.name}<br><br>
-        <b>E-mail:</b><br>${this.form.email}<br><br>
-        <b>News or Event Details:</b><br><br>
-        <b>Title:</b><br>${this.form.title}<br><br>
-        <b>Summary:</b><br>${this.form.summary}<br><br>
-        ${fileName != '' ? `<b>File Attachment:</b><br>${fileName}<br><br>` : ''}
-        <b>Supporting Information URL:</b><br>${this.form.url == '' ? 'N/A' : this.form.url}<br><br>
-        <b>Event Specific Details:</b><br><br>
-        <b>Location:</b><br>${this.form.location == '' ? 'N/A' : this.form.location}<br><br>
-        <b>Start Date:</b><br>${this.form.startDate == '' ? 'N/A' : new Date(this.form.startDate).toDateString()}<br><br>
-        <b>End Date:</b><br>${this.form.endDate == '' ? 'N/A' : new Date(this.form.endDate).toDateString()}
-      `
-      let formData = new FormData();
-      formData.append("type", "newsAndEvents")
-      formData.append("title", `N&E Submission - ${this.form.title}`)
-      formData.append("description", description)
-      formData.append("userEmail", this.form.email)
-      if (propOr('', 'name', this.file) != '') {
-        formData.append("attachment", this.file, this.file.name)
-      }
-
-      this.$axios
-        .post(`${process.env.portal_api}/tasks`, formData)
-        .then(() => {
-          this.$emit('submit', this.form.name)
-        })
-        .catch(() => {
-          this.hasError = true
-        })
-        .finally(() => {
-          this.isSubmitting = false
-        })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
-.submit-button {
-  text-align: right;
-  margin-bottom: 0 !important;
-}
-hr {
-  border-top: none;
-  border-left: none;
-  border-width: 2px;
-  border-color: $lineColor1;
-  margin: 2.5rem 0;
-}
-.error {
-  color: $danger;
-}
-</style>
diff --git a/components/NewsEventsResourcesPage/NewsEventsResourcesPage.vue b/components/NewsEventsResourcesPage/NewsEventsResourcesPage.vue
index e9985478..4f87de87 100644
--- a/components/NewsEventsResourcesPage/NewsEventsResourcesPage.vue
+++ b/components/NewsEventsResourcesPage/NewsEventsResourcesPage.vue
@@ -1,11 +1,9 @@
 <template>
   <div class="page">
     <breadcrumb :breadcrumb="breadcrumb" :title="heroTitle" />
-    <page-hero>
-      <h1>{{ heroTitle }}</h1>
-      <div class="body2">
-        {{ heroSummary }}
-      </div>
+    <page-hero class="news-header">
+      <h1 v-html="parseMarkdown(heroTitle)"/>
+      <div class="body2" v-html="parseMarkdown(heroSummary)"/>
     </page-hero>
     <div class="page-wrap container">
       <div class="subpage">
@@ -153,8 +151,9 @@ export default {
 .content {
   & ::v-deep img,
   & ::v-deep video {
+    display: block;
     height: auto;
-    margin: 0.5em 0;
+    margin: auto;
     max-width: 100%;
   }
 }
@@ -174,6 +173,8 @@ export default {
     text-transform: uppercase;
   }
   img {
+    display: block;
+    margin: auto;
     height: auto;
     max-width: 100%;
   }
@@ -187,3 +188,13 @@ export default {
   padding-bottom: 2rem;
 }
 </style>
+
+<style lang="scss">
+.news-header {
+  & sup {
+    vertical-align: baseline;
+    position: relative;
+    top: -0.4em;
+  }
+}
+</style>
diff --git a/components/NewsEventsResourcesPage/SubmitCommunitySection.vue b/components/NewsEventsResourcesPage/SubmitCommunitySection.vue
new file mode 100644
index 00000000..0d78d70a
--- /dev/null
+++ b/components/NewsEventsResourcesPage/SubmitCommunitySection.vue
@@ -0,0 +1,39 @@
+<template>
+  <paper
+    :text="parseMarkdown(searchPaperText)"
+    :button-text="searchPaperCSButton"
+    :button-link="{ name: 'contact-us', query: { type: 'story'} }"
+    new-tab
+  />
+</template>
+
+<script>
+import Paper from '@/components/Paper/Paper.vue'
+import createClient from '@/plugins/contentful.js'
+import marked from '@/mixins/marked/index'
+
+const client = createClient()
+
+export default {
+  name: 'SubmitCommunitySection',
+
+  mixins: [marked],
+
+  components: {
+    Paper
+  },
+
+  data() {
+    return {
+      searchPaperText: '',
+      searchPaperCSButton: ''
+    }
+  },
+
+  async fetch() {
+    const response = await client.getEntry(process.env.ctf_news_and_events_page_id)
+    this.searchPaperCSButton = response.fields.searchPaperCsButton
+    this.searchPaperText = response.fields.searchPaperCsText
+  }
+}
+</script>
diff --git a/components/NewsEventsResourcesPage/SubmitNewsSection.vue b/components/NewsEventsResourcesPage/SubmitNewsSection.vue
new file mode 100644
index 00000000..ebf4c133
--- /dev/null
+++ b/components/NewsEventsResourcesPage/SubmitNewsSection.vue
@@ -0,0 +1,39 @@
+<template>
+  <paper
+    :text="parseMarkdown(searchPaperText)"
+    :button-text="searchPaperNEButton"
+    :button-link="{ name: 'contact-us', query: { type: 'news-event'} }"
+    new-tab
+  />
+</template>
+
+<script>
+import Paper from '@/components/Paper/Paper.vue'
+import createClient from '@/plugins/contentful.js'
+import marked from '@/mixins/marked/index'
+
+const client = createClient()
+
+export default {
+  name: 'SubmitNewsSection',
+
+  mixins: [marked],
+
+  components: {
+    Paper
+  },
+
+  data() {
+    return {
+      searchPaperText: '',
+      searchPaperNEButton: ''
+    }
+  },
+
+  async fetch() {
+    const response = await client.getEntry(process.env.ctf_news_and_events_page_id)
+    this.searchPaperNEButton = response.fields.searchPaperNeButton
+    this.searchPaperText = response.fields.searchPaperText
+  }
+}
+</script>
diff --git a/components/NewsListItem/NewsListItem.vue b/components/NewsListItem/NewsListItem.vue
index 0c13bf59..885d316c 100644
--- a/components/NewsListItem/NewsListItem.vue
+++ b/components/NewsListItem/NewsListItem.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="news-list-item">
+  <div :v-if="isDestinationLinkRetreived" class="news-list-item">
     <div v-if="item.fields.image" class="image">
       <event-banner-image :src="item.fields.image.fields.file.url"/>
       <sparc-pill class="sparc-pill" v-if="fundingOpportunity">
@@ -19,10 +19,10 @@
         <a
           v-else
           :href="item.fields.url"
-          :target="isInternalLink('item.fields.url') ? '_self' : '_blank'"
+          :target="openInNewTab ? '_blank' : '_self'"
         >
           <span v-html="highlightMatches(item.fields.title, $route.query.search)"/>
-          <svg-icon v-if="!isInternalLink('item.fields.url')" name="icon-open" height="30" width="30" />
+          <svg-icon v-if="openInNewTab" name="icon-open" height="30" width="30" />
         </a>
       </h3>
       <p v-html="highlightMatches(item.fields.summary, $route.query.search)"/>
@@ -39,7 +39,7 @@ import FormatDate from '@/mixins/format-date'
 import EventBannerImage from '@/components/EventBannerImage/EventBannerImage.vue'
 import SparcPill from '@/components/SparcPill/SparcPill.vue'
 
-import { isInternalLink } from '@/mixins/marked/index'
+import { isInternalLink, opensInNewTab } from '@/mixins/marked/index'
 import { highlightMatches } from '~/pages/data/utils'
 
 export default {
@@ -59,6 +59,35 @@ export default {
     },
   },
 
+  data() {
+    return {
+      isDestinationLinkRetreived: false,
+      openInNewTab: false
+    }
+  },
+  async mounted() {
+    const url = pathOr("", ['fields', 'url'], this.item)
+    if (url.includes('bit.ly')) {
+      const bitlyId = url.replace("https://", "")
+      try {
+        const response = await this.$axios.post(process.env.bitly_expand_endpoint, { bitlink_id: bitlyId }, {
+          headers: {
+            Authorization: `Bearer ${process.env.BITLY_ACCESS_TOKEN}`,
+            'Content-Type': 'application/json',
+          }
+        })
+        const newUrl = response.data.long_url
+        this.openInNewTab = !isInternalLink(newUrl)
+      } catch {
+        console.log("Error retreiving bitly link destination url")
+        this.openInNewTab = !isInternalLink(url)
+      }
+    }
+    else {
+      this.openInNewTab = !isInternalLink(url)
+    }
+    this.isDestinationLinkRetreived = true
+  },
   computed: {
     /**
      * Compute and formate start date
@@ -75,6 +104,7 @@ export default {
 
   methods: {
     isInternalLink,
+    opensInNewTab,
     highlightMatches
   }
 }
diff --git a/components/NewsletterForm/NewsletterForm.vue b/components/NewsletterForm/NewsletterForm.vue
index 9e4defab..f6e73e26 100644
--- a/components/NewsletterForm/NewsletterForm.vue
+++ b/components/NewsletterForm/NewsletterForm.vue
@@ -3,7 +3,7 @@
   <div id="mc_embed_signup">
     <form
       id="mc-embedded-subscribe-form"
-      action="https://mailchi.mp/199fe3626d97/signup"
+      action="https://eepurl.com/hgBxgv"
       method="post"
       name="mc-embedded-subscribe-form"
       class="validate"
@@ -18,6 +18,7 @@
               native-type="submit"
               name="subscribe"
               class="secondary"
+              @click="sendGtmEvent"
             >
               Sign Up <svg-icon icon="icon-open" height="16" width="16" />
             </el-button>
@@ -30,7 +31,31 @@
 
 <script>
 export default {
-  name: 'NewsletterForm'
+  name: 'NewsletterForm',
+  props: {
+    location: {
+      type: String,
+      default: ""
+    }
+  },
+  methods: {
+    sendGtmEvent() {
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'newsletter_signup',
+        files: "",
+        file_name: "",
+        file_path: "",
+        file_type: "",
+        location: this.location,
+        category: "",
+        dataset_id: "",
+        version_id: "",
+        doi: "",
+        citation_type: ""
+      })
+    }
+  }
 }
 </script>
 
diff --git a/components/PageHero/PageHero.vue b/components/PageHero/PageHero.vue
index 753a8123..43b1a778 100644
--- a/components/PageHero/PageHero.vue
+++ b/components/PageHero/PageHero.vue
@@ -1,20 +1,20 @@
 <template>
-<div class="page-hero">
-  <div class="bx--grid">
-    <div class="container">
-      <div class="bx--row">
-        <div class="bx--col-sm-4 bx--col-md-8 bx--col-lg-11 bx--col-xlg-11 py-16 text-container">
-          <slot />
-        </div>
-        <div class="bx--col-sm-0 bx--col-md-0 bx--col-lg-5 bx--col-xlg-5">
-          <div v-if="$slots['image']" class="graphic-container">
-            <slot name="image" />
+  <div class="page-hero">
+    <div class="bx--grid">
+      <div class="container">
+        <div class="bx--row">
+          <div class="bx--col-sm-4 bx--col-md-8 bx--col-lg-11 bx--col-xlg-11 py-16 text-container">
+            <slot />
+          </div>
+          <div class="bx--col-sm-0 bx--col-md-0 bx--col-lg-5 bx--col-xlg-5">
+            <div v-if="$slots['image']" class="graphic-container">
+              <slot name="image" />
+            </div>
           </div>
         </div>
       </div>
     </div>
   </div>
-  </div>
 </template>
 
 <script>
diff --git a/components/Paper/Paper.vue b/components/Paper/Paper.vue
index 524d3928..194fc34c 100644
--- a/components/Paper/Paper.vue
+++ b/components/Paper/Paper.vue
@@ -6,6 +6,7 @@
         v-if="buttonText !== null && buttonLinkExternal === null"
         class="margin-top-auto"
         :to="buttonLink"
+        :target="newTab ? '_blank' : '_self'"
       >
         <el-button class="secondary">
           {{ buttonText }}
@@ -17,7 +18,7 @@
         :href="buttonLinkExternal"
         target="_blank"
       >
-        <el-button class="about-button">
+        <el-button class="secondary">
           {{ buttonText }}
         </el-button>
       </a>
@@ -40,7 +41,7 @@ export default {
       default: ''
     },
     buttonLink: {
-      type: Object,
+      type: [Object, String],
       default: null
     },
     buttonLinkExternal: {
@@ -54,6 +55,10 @@ export default {
     imgSrc: {
       type: String,
       default: null
+    },
+    newTab: {
+      type: Boolean,
+      default: false
     }
   }
 }
diff --git a/components/PlotViewer/PlotViewer.vue b/components/PlotViewer/PlotViewer.vue
new file mode 100644
index 00000000..ba173310
--- /dev/null
+++ b/components/PlotViewer/PlotViewer.vue
@@ -0,0 +1,144 @@
+<template>
+  <div class="plot-viewer-page">
+    <div class="page-wrap container">
+      <client-only placeholder="Loading plot ...">
+        <div class="plotvuer-container">
+          <plot-vuer
+            v-if="source_url"
+            :data-source="{ url: source_url }"
+            :metadata="metadata"
+            :supplemental-data="supplemental_data"
+          />
+        </div>
+      </client-only>
+      <plot-viewer-metadata
+        :plotType="plotType"
+        :file="file"
+        :datasetInfo="datasetInfo"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import PlotViewerMetadata from "@/components/ViewersMetadata/PlotViewerMetadata.vue"
+
+import discover from '@/services/discover'
+import { extractS3BucketName } from '@/utils/common'
+import { pathOr, propOr } from 'ramda'
+
+export default {
+  name: 'PlotViewer',
+
+  components: {
+    PlotViewerMetadata,
+    PlotVuer: process.client
+      ? () => import('@abi-software/plotvuer').then(m => m.PlotVuer)
+      : null
+  },
+
+  props: {
+    plotData: {
+      type: Object,
+      default: () => {
+        return {
+          share_link: '',
+          status: ''
+        }
+      }
+    },
+    file: {
+      type: Object,
+      default: () => {}
+    },
+    datasetInfo: {
+      type: Object,
+      default: () => {}
+    },
+  },
+
+  async fetch() {
+    try {
+      const s3Bucket = this.datasetInfo ? extractS3BucketName(this.datasetInfo.uri) : undefined
+
+      const plot_annotation = this.plotData.datacite
+      const file_path = `${this.datasetId}/files/${this.plotData.dataset.path}`
+      const source_url_response = await discover.downloadLink(file_path, s3Bucket)
+      let source_url = source_url_response.data
+
+      const metadata = JSON.parse(
+        plot_annotation.supplemental_json_metadata.description
+      )
+
+      let supplemental_data = []
+      if (plot_annotation.isDescribedBy) {
+        let tmp_path = plot_annotation.isDescribedBy.path
+        // Hack to fix path entry.
+        if (tmp_path === '../derivative/sub-1/subject1_header.txt') {
+          tmp_path = 'derivative/sub-1/sam-1/subject1_header.txt'
+        }
+
+        const supplemental_file_path = `${this.datasetId}/files/${tmp_path}`
+
+        const supplemental_url_response = await discover.downloadLink(
+          supplemental_file_path,
+          s3Bucket
+        )
+        let supplemental_url = supplemental_url_response.data
+        supplemental_data.push({
+          url: supplemental_url
+        })
+      }
+      this.source_url = source_url
+      this.metadata = metadata
+      this.supplemental_data = supplemental_data
+    } catch(e) {
+      console.log(e)
+    }
+  },
+
+  data: () => {
+    return {
+      source_url: "",
+      metadata: {
+        version: "1.1.0",
+        type: "plot",
+        attrs: {
+          style: "timeseries"
+        }
+      },
+      supplemental_data: [],
+    }
+  },
+  computed: {
+    plotType: function() {
+      return pathOr("", ['attrs','style'], this.metadata)
+    },
+    /**
+     * Return the dataset's name.
+     * @returns String
+     */
+    datasetTitle: function() {
+      return this.datasetInfo ? this.datasetInfo.name : 'Go to dataset'
+    },
+    datasetId() {
+      return propOr(undefined, "id", this.datasetInfo)
+    },
+    versionId() {
+      return propOr(undefined, "version", this.datasetInfo)
+    },
+  }
+}
+</script>
+
+<style lang="scss">
+.plotvuer-container {
+  margin-top: 1.5rem;
+  height: 90vh;
+  max-width: calc(100% - 48px);
+  @import '~@abi-software/plotvuer/dist/plotvuer';
+}
+.page-heading {
+  margin-bottom: 1.375rem;
+}
+</style>
diff --git a/components/PortalFeatures/PortalFeature/PortalFeature.vue b/components/PortalFeatures/PortalFeature/PortalFeature.vue
index b4c89afc..cadec801 100644
--- a/components/PortalFeatures/PortalFeature/PortalFeature.vue
+++ b/components/PortalFeatures/PortalFeature/PortalFeature.vue
@@ -1,20 +1,26 @@
 <template>
   <div class="feature-container pt-0 px-16 pb-16">
     <img
+      v-if="iconIsTopElement"
       class="icon"
       :src=iconUrl
     />
     <div class="heading2">
       {{ title }}
     </div>
+    <img
+      v-if="!iconIsTopElement"
+      class="icon"
+      :src=iconUrl
+    />
     <div class="body1 my-16">
       {{ description }}
     </div>
-    <a class="button-link" :href="buttonLink">
-      <el-button class="secondary">
+    <nuxt-link class="button-link" :to="buttonLink">
+      <el-button class="secondary" @click="sendGtmEvent">
         {{ buttonText }}
       </el-button>
-    </a>
+    </nuxt-link>
   </div>
 </template>
 
@@ -28,6 +34,10 @@ export default {
     feature: {
       type: Object,
       default: () => {}
+    },
+    iconIsTopElement: {
+      type: Boolean,
+      default: true
     }
   },
 
@@ -48,6 +58,25 @@ export default {
       return pathOr('', ['fields','icon', 'fields', 'file', 'url'], this.feature)
     }
   },
+
+  methods: {
+    sendGtmEvent(e) {
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'portal_feature_button_click',
+        files: "",
+        file_name: "",
+        file_path: "",
+        file_type: "",
+        location: this.buttonText,
+        category: this.title,
+        dataset_id: "",
+        version_id: "",
+        doi: "",
+        citation_type: ""
+      })
+    }
+  }
 }
 </script>
 
diff --git a/components/PortalFeatures/PortalFeatures.vue b/components/PortalFeatures/PortalFeatures.vue
index ff8462ea..1fa19ee3 100644
--- a/components/PortalFeatures/PortalFeatures.vue
+++ b/components/PortalFeatures/PortalFeatures.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="section-container container py-32">
-    <div class="heading2 mb-32">What can I do with SPARC?</div>
+    <div class="heading2 mb-32">{{ title }}</div>
     <div class="row">
       <div 
         v-for="(item, index) in features"
@@ -10,6 +10,7 @@
       >
         <portal-feature
           :feature="item"
+          :icon-is-top-element="iconIsTopElement"
         />
       </div>
     </div>
@@ -28,6 +29,14 @@ export default {
     features: {
       type: Array,
       default: () => []
+    },
+    title: {
+      type: String,
+      default: "What Can I Do With SPARC?"
+    },
+    iconIsTopElement: {
+      type: Boolean,
+      default: true
     }
   },
   computed: {
diff --git a/components/ProjectsAndDatasets/ProjectsAndDatasets.vue b/components/ProjectsAndDatasets/ProjectsAndDatasets.vue
index 1e5595d3..64565963 100644
--- a/components/ProjectsAndDatasets/ProjectsAndDatasets.vue
+++ b/components/ProjectsAndDatasets/ProjectsAndDatasets.vue
@@ -1,27 +1,44 @@
 <template>
   <div class="section-container container py-32">
-    <div class="heading2 mb-32">Projects and Datasets</div>
+    <div v-if="isProject" class="heading2 mb-32">Projects &amp; Datasets</div>
+    <div v-else class="heading2 mb-32">Resources &amp; Datasets</div>
     <div class="row">
       <div class="col p-16">
-        <div class="body2 mb-16">Here is a project you might be interested in:</div>
-        <projects-and-datasets-card 
-          :title="project.fields.title" 
-          :description="project.fields.shortDescription" 
-          :banner="project.fields.banner" 
-          :link="'projects/' + project.sys.id"
-          button-text="View Project"
-        />
-        <nuxt-link class="view-all-link body2 mt-16" to="/data?type=projects">
-          View All Projects
-        </nuxt-link>
+        <template v-if="isProject">
+          <div class="body2 mb-16">Here is a project you might be interested in:</div>
+          <projects-and-datasets-card 
+            :title="projectOrResource.fields.title" 
+            :description="projectOrResource.fields.shortDescription" 
+            :banner="projectOrResource.fields.banner" 
+            :link='projectLink'
+            button-text="View Project"
+          />
+          <nuxt-link class="view-all-link body2 mt-16" to="/data?type=projects">
+            View All Projects
+          </nuxt-link>
+        </template>
+        <!--If not a project then we assume it is a tool/resource since it must be one or the other-->
+        <template v-else>
+          <div class="body2 mb-16">Here is a resource you might be interested in:</div>
+          <projects-and-datasets-card 
+            :title="projectOrResource.fields.name" 
+            :description="projectOrResource.fields.description" 
+            :banner="projectOrResource.fields.logo.fields.file.url" 
+            :link='resourceLink'
+            button-text="View Resource"
+          />
+          <nuxt-link class="view-all-link body2 mt-16" to="/resources/databases">
+            View All Tools & Resources
+          </nuxt-link>
+        </template>
       </div>
       <div class="col p-16">
-        <div class="body2 mb-16">Here is a dataset you might be interested in:</div>
+        <div class="body2 mb-16">{{ datasetSectionTitle }}</div>
         <projects-and-datasets-card 
           :title="dataset.title" 
           :description="dataset.description" 
           :banner="dataset.banner" 
-          :link="'datasets/' + dataset.id"
+          :link="datasetLink"
           button-text="View Dataset"
         />
         <nuxt-link class="view-all-link body2 mt-16" to="/data?type=dataset">
@@ -34,6 +51,7 @@
 
 <script>
 import ProjectsAndDatasetsCard from '@/components/ProjectsAndDatasets/ProjectsAndDatasetsCard/ProjectsAndDatasetsCard.vue'
+import { pathOr } from 'ramda'
 
 export default {
   name: 'ProjectsAndDatasets',
@@ -41,7 +59,7 @@ export default {
     ProjectsAndDatasetsCard
   },
   props: {
-    project: {
+    projectOrResource: {
       type: Object,
       default: () => {}
     },
@@ -49,7 +67,41 @@ export default {
       type: Object,
       default: () => {}
     },
+    datasetSectionTitle: {
+      type: String,
+      default: 'Here is a dataset you might be interested in: '
+    }
   },
+  computed: {
+    isProject() {
+      return pathOr('', ["sys","contentType","sys","id"], this.projectOrResource) == process.env.ctf_project_id
+    },
+    datasetLink() {
+      return {
+        isInternal: true,
+        path: `datasets/${this.dataset.id}`
+      }
+    },
+    projectLink() {
+      return {
+        isInternal: true,
+        path: "projects/" + pathOr("", ["sys","id"], this.projectOrResource)
+      }
+    },
+    resourceLink() {
+      if (this.projectOrResource.fields.requiresDetailsPage) {
+        return {
+          isInternal: true,
+          path: "resources/" + pathOr("", ["sys","id"], this.projectOrResource)
+        }
+      } else {
+        return {
+          isInternal: false,
+          path: pathOr("", ["fields","url"], this.projectOrResource)
+        }
+      }
+    }
+  }
 }
 </script>
 
diff --git a/components/ProjectsAndDatasets/ProjectsAndDatasetsCard/ProjectsAndDatasetsCard.vue b/components/ProjectsAndDatasets/ProjectsAndDatasetsCard/ProjectsAndDatasetsCard.vue
index 36ab2e1d..2233ca8d 100644
--- a/components/ProjectsAndDatasets/ProjectsAndDatasetsCard/ProjectsAndDatasetsCard.vue
+++ b/components/ProjectsAndDatasets/ProjectsAndDatasetsCard/ProjectsAndDatasetsCard.vue
@@ -7,23 +7,45 @@
         </div>
       </el-col>
       <el-col :span="18">
-        <nuxt-link
-          class="dataset-name tab1"
-          :to="link"
-        >
-          {{ title }}
-        </nuxt-link>
-        <div class="dataset-description body1 mt-8">
-          {{ description }}
-        </div>
-        <el-button class="secondary mt-16">
+        <template v-if="link.isInternal">
+          <nuxt-link
+            class="dataset-name tab1"
+            :to="link.path"
+          >
+            {{ title }}
+          </nuxt-link>
+          <div class="dataset-description body1 mt-8">
+            {{ description }}
+          </div>
           <nuxt-link
             class="button-link"
-            :to="link"
+            :to="link.path"
           >
-            {{ buttonText }}
+            <el-button class="secondary mt-16">
+              {{ buttonText }}
+            </el-button>
           </nuxt-link>
-        </el-button>
+        </template>
+        <template v-else>
+          <a
+            class="dataset-name tab1"
+            :href="link.path"
+          >
+            {{ title }}
+          </a>
+          <div class="dataset-description body1 mt-8">
+            {{ description }}
+          </div>
+          <a
+            class="button-link"
+            :href="link.path"
+          >
+            <el-button class="secondary mt-16">
+              {{ buttonText }}
+              <svg-icon name="icon-open" height="20" width="20" />
+            </el-button>
+          </a>
+        </template>
       </el-col>
     </el-row>
   </div>
@@ -50,8 +72,11 @@ export default {
       default: ''
     },
     link: {
-      type: String,
-      default: ''
+      type: Object,
+      default: {
+        isInternal: true,
+        path:'/'
+      }
     }
   },
 }
diff --git a/components/Resources/ResourcesSearchResults.vue b/components/Resources/ResourcesSearchResults.vue
index 3a0b18a6..549c59c9 100644
--- a/components/Resources/ResourcesSearchResults.vue
+++ b/components/Resources/ResourcesSearchResults.vue
@@ -27,14 +27,21 @@
         <a v-else :href="data.fields.url" target="blank">
           <h2><span v-html="highlightMatches(data.fields.name, $route.query.search)"/><svg-icon name="icon-open" height="30" width="30" /></h2>
         </a>
-        <p v-if="data.fields.developedBySparc" class="resource-category">
-          SPARC
-        </p>
+        <div class="mb-8">
+          <span v-if="data.fields.developedBySparc" class="resource-category">
+            SPARC
+          </span>
+          <span v-if="data.fields.codeathon" class="resource-category">
+            Codeathon
+          </span>
+        </div>
         <template v-if="data.fields.contactEmail">
           <h3 class="metadata-title">
             Support Contact
           </h3>
           <p>
+            <span v-if="data.fields.owner" v-html="highlightMatches(data.fields.owner, $route.query.search)"/>
+            <span v-if="data.fields.owner && data.fields.contactEmail"> · </span>
             <a
               v-if="data.fields.contactEmail"
               :href="`mailto:${data.fields.contactEmail}`"
@@ -84,19 +91,18 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/_variables.scss';
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
 .resources-search-results {
   &__items {
     display: flex;
     flex-direction: row;
-    border-bottom: solid 1px $light-grey;
     padding: 1.25em 0;
     @media screen and (max-width: 768px) {
       display: block;
     }
     h2 {
       font-size: 1em;
-      color: $median;
+      color: $purple;
       margin-bottom: 0.375rem;
       line-height: 22px;
       font-weight: 500;
@@ -126,19 +132,19 @@ export default {
       font-style: italic;
       line-height: 18px;
       font-weight: normal;
-      color: $dark-sky;
+      color: $grey;
     }
     &--content-description {
       font-size: 1em;
       font-weight: normal;
       line-height: 22px;
       font-weight: normal;
-      color: $dark-sky;
+      color: $grey;
     }
   }
 }
 .metadata-title {
-  color: $dark-sky;
+  color: $grey;
   font-size: 1em;
   font-weight: 500;
   line-height: 1.2;
@@ -147,12 +153,13 @@ export default {
 }
 
 .resource-category {
-  background: $median;
+  background: $purple;
   border-radius: 15px;
   color: #fff;
   font-size: 0.875rem;
   top: 10px;
-  padding: 0 0.65rem;
+  padding: .2rem 0.6rem;
+  margin-right: .25rem;
   right: 14px;
   width: fit-content;
   margin-bottom: 10px;
diff --git a/components/Resources/ServicesSearchResults.vue b/components/Resources/ServicesSearchResults.vue
new file mode 100644
index 00000000..66329238
--- /dev/null
+++ b/components/Resources/ServicesSearchResults.vue
@@ -0,0 +1,191 @@
+<template>
+  <div class="resources-search-results">
+    <div class="no-results" v-if="services.length === 0">
+      <el-table :show-header="false" empty-text="No Results">
+        <el-table-column />
+      </el-table>
+    </div>
+    <div
+      v-else
+      v-for="service in services"
+      :key="service.id"
+      class="resources-search-results__items"
+    >
+      <div class="resources-search-results__items--image">
+        <img v-show="service.thumbnail" :src="service.thumbnail" />
+      </div>
+      <div class="resources-search-results__items--content">
+        <h2><span v-html="highlightMatches(service.title, $route.query.search)"/></h2>
+        <p
+          class="resources-search-results__items--content-description"
+          v-html="highlightMatches(parseMarkdown(service.description), $route.query.search)"
+        />
+      </div>
+      <div  class="resources-search-results__items--button">
+        <sparc-tooltip placement="top-center">
+          <div slot="item">
+            <a :href="service['view_url']" target="_blank">
+              <el-button @click="sendGtmEvent(service)" class="secondary">
+                <div class="open-osparc-btn-content">
+                  Open in o<sup>2</sup>S<sup>2</sup>PARC <svg-icon icon="icon-open" height="18" width="18" />
+                </div>
+              </el-button>
+            </a>
+          </div>
+          <div slot="data" class="osparc-service-btn-tooltip">
+            Instantiate this service in o<sup>2</sup>S<sup>2</sup>PARC. Login is required, 
+            <a href="/resources/4LkLiH5s4FV0LVJd3htsvH#user-accounts" target="_blank">
+              <u>here</u>
+            </a>
+            you can find more information on how to get an account.
+          </div>
+        </sparc-tooltip>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import marked from '@/mixins/marked/index'
+import { highlightMatches } from '../../pages/data/utils'
+
+export default {
+  name: 'ServicesSearchResults',
+
+  mixins: [marked],
+
+  props: {
+    services: {
+      type: Array,
+      default: () => []
+    }
+  },
+
+  methods: {
+    highlightMatches,
+    sendGtmEvent(service) {
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'open_in_osparc',
+        files: "",
+        file_name: "",
+        file_path: "",
+        file_type: "",
+        location: service?.view_url,
+        category: service?.title,
+        dataset_id: "",
+        version_id: "",
+        doi: "",
+        citation_type: ""
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+.resources-search-results {
+  &__items {
+    display: flex;
+    flex-direction: row;
+    align-items: flex-start;
+    padding: 1.25em 0;
+    @media screen and (max-width: 768px) {
+      display: block;
+    }
+    h2 {
+      font-size: 1em;
+      color: $purple;
+      margin-bottom: 0.375rem;
+      line-height: 22px;
+      font-weight: 500;
+    }
+
+    &--content {
+      flex: 1;
+      a {
+        text-decoration: none;
+      }
+    }
+
+    &--image {
+      display: flex;
+      margin-right: 1rem;
+      @media (min-width: 48em) {
+        flex-shrink: 0;
+        width: 128px;
+      }
+      img {
+        margin: auto;
+        width: 100%;
+        height: auto;
+      }
+    }
+    &--content-date {
+      font-size: 1em;
+      font-style: italic;
+      line-height: 18px;
+      font-weight: normal;
+      color: $grey;
+    }
+    &--content-description {
+      font-size: 1em;
+      font-weight: normal;
+      line-height: 22px;
+      font-weight: normal;
+      color: $grey;
+      margin-right: 1rem;
+    }
+    &--button {
+      align-self: center;
+      sup, sub {
+        vertical-align: baseline;
+        position: relative;
+        top: -0.4em;
+      }
+      sub {
+        top: 0.4em;
+      }
+      svg {
+        margin-left: .3em;
+      }
+      .open-osparc-btn-content {
+        display: flex;
+        align-items: center;
+      }
+    }
+  }
+}
+.osparc-service-btn-tooltip {
+  sup, sub {
+    vertical-align: baseline;
+    position: relative;
+    top: -0.4em;
+  }
+  sub {
+    top: 0.4em;
+  }
+}
+.metadata-title {
+  color: $grey;
+  font-size: 1em;
+  font-weight: 500;
+  line-height: 1.2;
+  margin-bottom: 0.375rem;
+  text-transform: uppercase;
+}
+
+.resource-category {
+  background: $purple;
+  border-radius: 15px;
+  color: #fff;
+  font-size: 0.875rem;
+  top: 10px;
+  padding: .2rem 0.6rem;
+  margin-right: .25rem;
+  right: 14px;
+  width: fit-content;
+  margin-bottom: 10px;
+}
+</style>
diff --git a/components/Resources/SubmitToolSection.vue b/components/Resources/SubmitToolSection.vue
new file mode 100644
index 00000000..930b5101
--- /dev/null
+++ b/components/Resources/SubmitToolSection.vue
@@ -0,0 +1,39 @@
+<template>
+  <paper
+    :text="parseMarkdown(searchPaperText)"
+    :button-text="searchPaperButton"
+    :button-link="{ name: 'contact-us', query: { type: 'tool'} }"
+    new-tab
+  />
+</template>
+
+<script>
+import Paper from '@/components/Paper/Paper.vue'
+import createClient from '@/plugins/contentful.js'
+import marked from '@/mixins/marked/index'
+
+const client = createClient()
+
+export default {
+  name: 'SubmitToolSection',
+
+  mixins: [marked],
+
+  components: {
+    Paper
+  },
+
+  data() {
+    return {
+      searchPaperText: '',
+      searchPaperButton: ''
+    }
+  },
+
+  async fetch() {
+    const response = await client.getEntry(process.env.ctf_tools_and_resources_page_id)
+    this.searchPaperButton = response.fields.searchPaperButton
+    this.searchPaperText = response.fields.searchPaperText
+  }
+}
+</script>
diff --git a/components/ResourcesGallery/IndexIndicator.vue b/components/ResourcesGallery/IndexIndicator.vue
deleted file mode 100644
index baeaf5eb..00000000
--- a/components/ResourcesGallery/IndexIndicator.vue
+++ /dev/null
@@ -1,46 +0,0 @@
-<template>
-  <div class="indicator-container">
-    <div
-      v-for="(number, index) in count"
-      :key="'indicator_' + number"
-      :class="['indicator', { active: current === index }]"
-      @click="$emit('clicked', index)"
-    />
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'IndexIndicator',
-  props: {
-    count: {
-      type: Number,
-      default: 0,
-    },
-    current: {
-      type: Number,
-      default: 0,
-    }
-  }
-}
-</script>
-
-<style scoped lang="scss">
-@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
-
-.indicator-container {
-  display: flex;
-  justify-content: center;
-}
-.indicator {
-  width: 1rem;
-  height: 1rem;
-  border-radius: 50%;
-  background-color: $lineColor2;
-  margin-left: 0.25rem;
-  margin-right: 0.25rem;
-}
-.indicator.active {
-  background-color: $purple;
-}
-</style>
diff --git a/components/ResourcesGallery/ResourcesGallery.vue b/components/ResourcesGallery/ResourcesGallery.vue
deleted file mode 100644
index 136cba16..00000000
--- a/components/ResourcesGallery/ResourcesGallery.vue
+++ /dev/null
@@ -1,192 +0,0 @@
-<template>
-  <div ref="myButton" class="gallery">
-    <div class="resources-gallery-strip">
-      <a v-if="items.length > 1" href="#" :class="['arrow-button', 'prev', { disabled: !isPrevPossible }]" @click.prevent="goPrev">
-        <span class="progress-button">&lsaquo;</span>
-      </a>
-      <div v-else style="width: 2rem" />
-      <div class="filler" />
-      <div class="card-line">
-        <span v-for="(item, index) in windowedItems" :key="index" :class="['key-image-span']">
-          <ResourceCard
-            v-if="item"
-            :width="cardWidth"
-            :key="item.sys.id"
-            :showShadow="isActive(index)"
-            :title="item.fields.name"
-            :subtitle="item.fields.resourceType.join(', ')"
-            :showSparcTag="item.fields.developedBySparc"
-            :description="item.fields.description"
-            :thumbnail-url="item.fields.logo.fields.file.url"
-            :button-link="`/resources/${item.sys.id}`"
-            :external-url="item.fields.url"
-            @card-clicked="cardClicked"
-          />
-        </span>
-      </div>
-      <div class="filler" />
-      <a v-if="items.length > 1" href="#" :class="['arrow-button', 'next', { disabled: !isNextPossible }]" @click.prevent="goNext">
-        <span class="progress-button">&rsaquo;</span>
-      </a>
-      <div v-else style="width: 2rem" />
-    </div>
-    <index-indicator class="mt-32" :count="itemCount" :current="currentIndex" @clicked="indicatorClicked" />
-  </div>
-</template>
-
-<script>
-import IndexIndicator from './IndexIndicator'
-import ResourceCard from './ResourceCard.vue'
-function convertRemToPixels(rem) {
-  if (typeof window !== 'undefined') {
-    return rem * parseFloat(window.getComputedStyle(document.documentElement).fontSize)
-  }
-  return rem * 16
-}
-export default {
-  name: 'ResourcesGallery',
-  components: { IndexIndicator, ResourceCard },
-  props: {
-    items: {
-      type: Array,
-      default: () => {
-        return []
-      },
-    },
-    cardWidth: {
-      type: Number,
-      default: 21,
-    },
-    showIndicatorBar: {
-      type: Boolean,
-      default: true,
-    },
-    highlightActive: {
-      type: Boolean,
-      default: true,
-    },
-  },
-  data() {
-    return {
-      resizeObserver: null,
-      count: 0,
-      currentIndex: 0,
-      maxWidth: 0
-    }
-  },
-  mounted() {
-    this.resizeObserver = new ResizeObserver(this.onResize).observe(this.$el)
-  },
-  destroyed() {
-    delete this.resizeObserver
-  },
-  computed: {
-    itemCount() {
-      return this.items.length
-    },
-    isPrevPossible() {
-      return this.currentIndex > 0
-    },
-    isNextPossible() {
-      return this.currentIndex < this.itemCount - 1
-    },
-    cardHeight() {
-      return 0.78 * this.cardWidth
-    },
-    cardLineWidth() {
-      const cardSpacing = 0.25
-      return this.itemCount * (this.cardWidth + cardSpacing) - cardSpacing
-    },
-    numberOfItemsVisible() {
-      // The maximum width we are allowed minus two buttons for next and previous
-      // divided by the width of a card.
-      // const n = this.itemCount - 1
-      const cardSpacingPx = convertRemToPixels(0.5)
-      const buttonPx = convertRemToPixels(2)
-      const cardWidthPx = convertRemToPixels(this.cardWidth)
-      const cardItems = (this.maxWidth - 2 * buttonPx - 2 * cardSpacingPx) / (1.1 * cardWidthPx)
-      //Display at least one item
-      return Math.max(1, Math.floor(cardItems))
-    },
-    valueAdjustment() {
-      const halfWindow = Math.floor(this.numberOfItemsVisible / 2)
-      let valueAdjust = this.currentIndex - halfWindow
-      if (valueAdjust < 0) {
-        valueAdjust = 0
-      } else if (valueAdjust + this.numberOfItemsVisible > this.itemCount) {
-        valueAdjust = this.itemCount - this.numberOfItemsVisible
-      }
-      return valueAdjust
-    },
-    windowedItems() {
-      let myArray = []
-      for (let i = 0; i < this.numberOfItemsVisible; i++) {
-        myArray.push(this.items[i + this.valueAdjustment])
-      }
-      return myArray
-    },
-  },
-  methods: {
-    cardClicked(payload) {
-      this.$emit('card-clicked', payload)
-    },
-    isActive(index) {
-      return this.currentIndex - this.valueAdjustment === index && this.highlightActive
-    },
-    goNext() {
-      this.currentIndex += 1
-    },
-    goPrev() {
-      this.currentIndex -= 1
-    },
-    indicatorClicked(index) {
-      if (this.currentIndex !== index) {
-        this.currentIndex = index
-      }
-    },
-    onResize() {
-      this.maxWidth = this.$el.clientWidth
-    }
-  },
-}
-</script>
-
-<style scoped lang="scss">
-@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
-
-.arrow-button {
-  width: 2rem;
-  height: 2rem;
-  line-height: 2rem;
-  display: flex;
-  justify-content: center;
-  user-select: none;
-  align-self: center;
-}
-.resources-gallery-strip,
-.card-line {
-  display: flex;
-  flex-wrap: nowrap;
-  justify-content: space-around;
-  align-items: start;
-}
-.card-line {
-  flex-grow: 2;
-}
-.progress-button {
-  font-size: 3rem;
-  font-weight: bold;
-  color: $purple;
-}
-.filler {
-  flex-grow: .5;
-}
-a.prev:not(.underline),
-a.next:not(.underline) {
-  text-decoration: none;
-}
-.disabled {
-  opacity: 0.5;
-  pointer-events: none;
-}
-</style>
diff --git a/components/ScaffoldViewer/ScaffoldViewer.vue b/components/ScaffoldViewer/ScaffoldViewer.vue
deleted file mode 100644
index f008a35a..00000000
--- a/components/ScaffoldViewer/ScaffoldViewer.vue
+++ /dev/null
@@ -1,170 +0,0 @@
-<template>
-  <div class="scaffold-viewer">
-    <el-row type="flex" class="mb-2 position-right">
-      <bf-button class="ml-8" @click="copyLink">
-        <svg-icon name="icon-permalink" height="24" width="24" />
-        <span class="visuallyhidden">Copy permalink</span>
-      </bf-button>
-    </el-row>
-    <client-only placeholder="Loading scaffold ...">
-      <div class="scaffoldvuer-container">
-        <ScaffoldVuer
-          ref="scaffoldvuer"
-          :state="state"
-          :display-markers="displayMarkers"
-          :url="scaffoldURL"
-          :background-toggle="backgroundToggle"
-          :region="region"
-          :view-u-r-l="viewURL"
-        />
-      </div>
-    </client-only>
-  </div>
-</template>
-
-<script>
-import { successMessage, failMessage } from '@/utils/notification-messages'
-
-import BfButton from '@/components/shared/BfButton/BfButton.vue'
-
-export default {
-  name: 'ScaffoldViewer',
-
-  components: {
-    BfButton,
-    ScaffoldVuer: process.client
-      ? () => import('@abi-software/scaffoldvuer').then(m => m.ScaffoldVuer)
-      : null
-  },
-
-  props: {
-    scaffoldURL: {
-      type: String,
-      required: true
-    },
-    viewURL: {
-      type: String,
-      default: ''
-    },
-    region: {
-      type: String,
-      default: ''
-    },
-    state: {
-      type: Object,
-      default: () => {
-        return undefined
-      }
-    }
-  },
-
-  data: () => {
-    return {
-      displayMarkers: false,
-      backgroundToggle: true,
-    }
-  },
-
-  watch: {
-    '$route.query': '$fetch'
-  },
-  fetchOnServer: false,
-  created: function() {
-    this.currentId = undefined
-    this.api = process.env.portal_api
-    let lastChar = this.api.substr(-1)
-    if (lastChar != '/') {
-      this.api = this.api + '/'
-    }
-  },
-  methods: {
-    copyLink: function() {
-      // this.$message(successMessage('Share link copied to clipboard.'))
-      let url = this.api + `scaffold/getshareid`
-      let state = this.$refs.scaffoldvuer.getState()
-      // Dont need the url here
-      if (state && state.url) delete state['url']
-      fetch(url, {
-        method: 'POST',
-        headers: {
-          'Content-type': 'application/json'
-        },
-        body: JSON.stringify({ state: state })
-      })
-        .then(response => response.json())
-        .then(data => {
-          if (data.uuid) {
-            //Remove other scaffold queries
-            delete this.$route.query['viewURL']
-            delete this.$route.query['region']
-            this.currentId = data.uuid
-            //Update and copy the url
-            this.$router.replace(
-              { query: { ...this.$route.query, id: data.uuid } },
-              //Callback once the router replace is done, essential
-              //for copying the correct url.
-              () => {
-                this.$copyText(
-                  `${process.env.ROOT_URL}${this.$route.fullPath}`
-                ).then(
-                  () => {
-                    this.$message(
-                      successMessage('Share link copied to clipboard.')
-                    )
-                  },
-                  () => {
-                    this.$message(failMessage('Failed to copy share link.'))
-                  }
-                )
-              }
-            )
-          }
-        })
-        .catch(() => {
-          this.$message(failMessage('Failed to get a share link.'))
-        })
-    }
-  }
-}
-</script>
-
-<style scoped lang="scss">
-.position-right {
-  justify-content: flex-end;
-}
-</style>
-<style lang="scss">
-.scaffoldvuer-container {
-  height: 90vh;
-  max-width: calc(100% - 48px);
-  left: 24px;
-  overflow: hidden;
-  position: relative;
-  @import '~@abi-software/scaffoldvuer/dist/scaffoldvuer';
-}
-
-.time-slider-container .el-tabs__content {
-  height: 40px;
-}
-
-.time-slider-container .el-slider__marks-text {
-  margin-top: 6px !important;
-}
-
-.time-slider-tooltip {
-  padding: 6px 4px !important;
-  font-family: 'Asap', sans-serif;
-  font-size: 12px !important;
-  color: rgb(48, 49, 51) !important;
-  background-color: #f3ecf6 !important;
-  border: 1px solid #8300bf !important;
-  white-space: nowrap !important;
-  min-width: unset !important;
-}
-
-.scaffold_viewer_dropdown .el-select-dropdown__item {
-  white-space: nowrap;
-  text-align: left;
-  font-family: 'Asap', sans-serif;
-}
-</style>
diff --git a/components/SearchControlsContentful/SearchControlsContentful.vue b/components/SearchControlsContentful/SearchControlsContentful.vue
index cafda883..6cd29b0d 100644
--- a/components/SearchControlsContentful/SearchControlsContentful.vue
+++ b/components/SearchControlsContentful/SearchControlsContentful.vue
@@ -63,6 +63,7 @@ export default {
 
   methods: {
     submit() {
+      this.terms = this.terms?.trim()
       this.$router.push({ path: this.path, query: { ...this.$route.query, search: this.terms } })
     },
     clear() {
diff --git a/components/SearchResults/AboutDetailsSearchResults.vue b/components/SearchResults/AboutDetailsSearchResults.vue
index 0d29c61e..a8aa5675 100644
--- a/components/SearchResults/AboutDetailsSearchResults.vue
+++ b/components/SearchResults/AboutDetailsSearchResults.vue
@@ -5,7 +5,6 @@
         <learn-more-card
           class="small-title"
           :about-details-item="scope.row"
-          :parent-path="calculateParentPath(scope.row)"
         />
       </template>
     </el-table-column>
diff --git a/components/SearchResults/DatasetSearchResults.vue b/components/SearchResults/DatasetSearchResults.vue
index 20be698c..04c5421c 100644
--- a/components/SearchResults/DatasetSearchResults.vue
+++ b/components/SearchResults/DatasetSearchResults.vue
@@ -48,6 +48,7 @@
           />
           <div
             class="my-8"
+            v-if="scope.row._highlightResult.item.description"
             v-html="scope.row._highlightResult.item.description.value"
           />
           <table class="property-table">
@@ -162,11 +163,14 @@ export default {
         }
         case 'Publication Date': {
           const pennsieve = _.get(item, property.propPath)
-          const createdAt = pennsieve.createdAt.timestamp.split(",")[0]
-          const updatedAt = pennsieve.updatedAt.timestamp.split(",")[0]
-          return this.formatDate(createdAt) +
+          if (pennsieve.firstPublishedAt == undefined || pennsieve.versionPublishedAt == undefined) {
+            return undefined
+          }
+          const firstPublishedAt = pennsieve.firstPublishedAt.timestamp.split(",")[0]
+          const versionPublishedAt = pennsieve.versionPublishedAt.timestamp.split(",")[0]
+          return this.formatDate(firstPublishedAt) +
                     ' (Last updated ' +
-                    this.formatDate(updatedAt) +
+                    this.formatDate(versionPublishedAt) +
                     ')'
         }
         default: {
diff --git a/components/SearchResults/ProjectSearchResults.vue b/components/SearchResults/ProjectSearchResults.vue
index 19aa69cc..d5a7a41b 100644
--- a/components/SearchResults/ProjectSearchResults.vue
+++ b/components/SearchResults/ProjectSearchResults.vue
@@ -27,7 +27,7 @@
         <table class="property-table">
           <tr v-if="scope.row.fields.projectSection">
             <td class="property-name-column">
-              Anatomical Focus
+              Focus
             </td>
             <td v-html="highlightMatches(scope.row.fields.projectSection.fields.title, $route.query.search)"/>
           </tr>
@@ -45,9 +45,17 @@
               {{ scope.row.fields.institution.fields.name }}
             </td>
           </tr>
+          <tr v-if="scope.row.fields.program.length > 0">
+            <td class="property-name-column">
+              Funding Program
+            </td>
+            <td 
+              v-html="highlightMatches(scope.row.fields.program[0], $route.query.search)"
+            />
+          </tr>
           <tr v-if="scope.row.fields.awardId">
             <td class="property-name-column">
-              NIH Award
+              Award
             </td>
             <td>
               <a :href="getNihReporterUrl(scope)" target="_blank">
diff --git a/components/SegmentationViewer/SegmentationViewer.vue b/components/SegmentationViewer/SegmentationViewer.vue
index 45783549..af785778 100644
--- a/components/SegmentationViewer/SegmentationViewer.vue
+++ b/components/SegmentationViewer/SegmentationViewer.vue
@@ -3,7 +3,7 @@
     <template v-if="data.status !== 'error'">
       <p>
         <a :href="data.share_link" target="_blank">
-          <bf-button>
+          <el-button>
             View Full Screen
             <svg-icon
               class="icon-full-screen"
@@ -11,10 +11,15 @@
               height="24"
               width="24"
             />
-          </bf-button>
+          </el-button>
         </a>
       </p>
       <iframe :src="data.share_link" />
+      <segmentation-viewer-metadata
+        :segmentationData="data"
+        :datasetInfo="datasetInfo"
+        :file="file"
+      />
     </template>
     <p v-else class="error">
       Sorry, an error has occurred
@@ -23,13 +28,13 @@
 </template>
 
 <script>
-import BfButton from '@/components/shared/BfButton/BfButton.vue'
+import SegmentationViewerMetadata from '@/components/ViewersMetadata/SegmentationViewerMetadata.vue'
 
 export default {
   name: 'SegmentationViewer',
 
   components: {
-    BfButton
+    SegmentationViewerMetadata
   },
 
   props: {
@@ -41,7 +46,15 @@ export default {
           status: ''
         }
       }
-    }
+    },
+    file: {
+      type: Object,
+      default: () => {}
+    },
+    datasetInfo: {
+      type: Object,
+      default: () => {}
+    },
   }
 }
 </script>
diff --git a/components/SetupNewUser/SetupNewUser.vue b/components/SetupNewUser/SetupNewUser.vue
index 25aae44f..e0435805 100644
--- a/components/SetupNewUser/SetupNewUser.vue
+++ b/components/SetupNewUser/SetupNewUser.vue
@@ -1,6 +1,5 @@
 <template>
   <div>
-
     <div
       v-if="this.askingForEmail"
       class="login-wrap"
@@ -201,7 +200,6 @@
         Home
       </bf-button>
     </div>
-
   </div>
 </template>
 
@@ -211,7 +209,6 @@ import BfButton from '@/components/shared/BfButton/BfButton.vue'
 import {pathOr} from "ramda";
 import Request from '@/mixins/request'
 import { Auth } from '@aws-amplify/auth'
-import EventBus from "@/static/js/event-bus";
 export default {
   name: 'SetupNewUser',
   components: {
diff --git a/components/SparcCard/SparcCard.vue b/components/SparcCard/SparcCard.vue
index 5293e9e6..c9249beb 100644
--- a/components/SparcCard/SparcCard.vue
+++ b/components/SparcCard/SparcCard.vue
@@ -45,25 +45,28 @@ export default {
 $tablet-small: 48em;
 $tablet-large: 64em;
 .sparc-card {
-  @media (min-width: $tablet-small) {
-    display: flex;
-  }
+  display: flex;
   &--image-right {
-    .sparc-card__image {
-      @media (min-width: $tablet-small) {
-        order: 2;
-      }
+    .sparc-card__image-container {
+      order: 2;
     }
   }
-  &__image {
-    background-size: cover;
-    background-position: center;
-    height: 300px;
-    @media (min-width: $tablet-small) {
-      height: auto;
+  &__image-container {
+    display: flex;
+    visibility: visible;
+    background-color: white;
+    width: 25%;
+    @media (max-width: $tablet-large) {
+      display: none;
     }
   }
+  &__image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
   &__content-wrap {
+    display: flex;
     flex: 1;
     background: #24245b;
   }
@@ -78,17 +81,16 @@ $tablet-large: 64em;
 
       display: flex;
       flex-direction: column;
-      justify-content: space-between;
 
-      @media (min-width: $tablet-small + 1) and (max-width: $tablet-large) {
+      @media (min-width: $tablet-small) and (max-width: $tablet-large) {
         font-size: 1em;
         line-height: 2rem;
         padding: 2em;
       }
-      @media (min-width: $tablet-large + 1) {
+      @media (min-width: $tablet-large) {
         font-size: 1.125em;
         line-height: 2rem;
-        padding: 3em;
+        padding: 2rem 2.5rem;
       }
 
       a {
diff --git a/components/StayConnected/StayConnected.vue b/components/StayConnected/StayConnected.vue
index 118094c2..12ad4604 100644
--- a/components/StayConnected/StayConnected.vue
+++ b/components/StayConnected/StayConnected.vue
@@ -1,19 +1,21 @@
 <template>
-  <div class="container pb-32">
-    <div class="heading2 subheader mb-16">Stay Connected</div>
+  <div class="container py-32">
+    <h2 class="heading2 subheader mb-32">Stay Connected</h2>
     <div class="subpage py-16">
       <el-row :gutter="32">
         <el-col :xs="24" :sm="12" class="newsletter-wrap">
           <div class="heading2">Sign up for the SPARC Newsletter</div>
           <div class="body1 mb-16 mt-8">Keep up to date with all the latest news and events from the SPARC Portal.</div>
-          <newsletter-form />
+          <newsletter-form
+            location="stay connected"
+          />
         </el-col>
         <el-col class="office-hours-column" :xs="24" :sm="12">
           <div class="heading2">Open Office Hours</div>
           <div class="body1 mb-16 mt-8">Join one of our weekly office hours to ask questions and learn more from the SPARC Data Resource Center Team.</div>
-          <a href="https://docs.sparc.science/docs/sparc-drc-open-office-hours">
+          <a href="https://docs.sparc.science/docs/sparc-drc-open-office-hours" target="_blank">
             <el-button class="secondary">
-            Find out more
+              Find out more
             </el-button>
           </a>
         </el-col>
@@ -50,7 +52,7 @@ export default {
   margin: 0 !important;
 }
 .subheader {
-  font-weight: 100;
+  text-align: center;
 }
 .office-hours-column {
   border-left: 2px solid $lineColor2;
diff --git a/components/Tombstone/Tombstone.vue b/components/Tombstone/Tombstone.vue
index 938e73d9..2d9c8d0f 100644
--- a/components/Tombstone/Tombstone.vue
+++ b/components/Tombstone/Tombstone.vue
@@ -6,7 +6,8 @@
       <div class="heading3">
         The dataset with the identifier: <b>{{ doiUrl }}</b> has been removed and is no longer available on the SPARC portal.
         <br/>
-        Please refer to the <a href="https://docs.sparc.science/?redirect=%2Fv1.0%2Fdocs%2Fsparc-changes-to-published-datasets-policy" target="_blank">SPARC Changes to Published Datasets</a> Policy for its full bibliographic citation and its statement of unavailability. 
+        Please refer to the <a href="https://docs.sparc.science/docs/list-of-datasets-that-have-been-removed" target="_blank">List of SPARC Datasets Removed from the SPARC Portal</a>
+        for its full bibliographic citation and its statement of unavailability. For information on SPARC's policy on dataset removal, please refer to the Removal of Published Data section of the <a href="https://docs.sparc.science/docs/sparc-changes-to-published-datasets-policy" target="_blank">SPARC Changes to Published Datasets Policy</a>.
       </div>
     </div>
   </div>
diff --git a/components/ToolAndResourcesPage/ToolsAndResourcesPage.vue b/components/ToolAndResourcesPage/ToolsAndResourcesPage.vue
index 5450b49d..09e9a698 100644
--- a/components/ToolAndResourcesPage/ToolsAndResourcesPage.vue
+++ b/components/ToolAndResourcesPage/ToolsAndResourcesPage.vue
@@ -18,7 +18,7 @@
           <div class="label4 mb-4" >
             TUTORIALS & GUIDES
           </div>
-          <a class="resource-link" v-for="(tutorial, index) in tutorials" :key="index" :href="tutorial.fields.url" :target="isInternalLink(tutorial.fields.url) ? '_self' : '_blank'">
+          <a class="resource-link" v-for="(tutorial, index) in tutorials" :key="index" :href="tutorial.fields.url" :target="!opensInNewTab(tutorial.fields.url) ? '_self' : '_blank'">
             {{ tutorial.fields.title }}
             <svg-icon v-if="!isInternalLink(tutorial.fields.url)" name="icon-open" height="25" width="25" />
           </a>
@@ -27,7 +27,7 @@
           <div class="label4 mb-4" >
             VIDEOS & WEBINARS
           </div>
-          <a class="resource-link" v-for="(webinar, index) in webinars" :key="index" :href="webinar.fields.url" :target="isInternalLink(webinar.fields.url) ? '_self' : '_blank'">
+          <a class="resource-link" v-for="(webinar, index) in webinars" :key="index" :href="webinar.fields.url" :target="!opensInNewTab(webinar.fields.url) ? '_self' : '_blank'">
             {{ webinar.fields.title }}
             <svg-icon v-if="!isInternalLink(webinar.fields.url)" name="icon-open" height="25" width="25" />
           </a>
@@ -46,7 +46,7 @@ import FormatDate from '@/mixins/format-date'
 import Breadcrumb from '@/components/Breadcrumb/Breadcrumb'
 import PageHero from '@/components/PageHero/PageHero'
 import { pathOr } from 'ramda'
-import { isInternalLink } from '@/mixins/marked/index'
+import { isInternalLink, opensInNewTab } from '@/mixins/marked/index'
 
 export default {
   name: 'ToolsAndResourcesPage',
@@ -87,6 +87,7 @@ export default {
 
   methods: {
     isInternalLink,
+    opensInNewTab
   },
 
   computed: {
@@ -126,8 +127,9 @@ export default {
 .content {
   & ::v-deep img,
   & ::v-deep video {
+    display: block;
     height: auto;
-    margin: 0.5em 0;
+    margin: auto;
     max-width: 100%;
   }
 }
diff --git a/components/ToolsAndResourcesForm/ToolsAndResourcesForm.vue b/components/ToolsAndResourcesForm/ToolsAndResourcesForm.vue
deleted file mode 100644
index 4d360102..00000000
--- a/components/ToolsAndResourcesForm/ToolsAndResourcesForm.vue
+++ /dev/null
@@ -1,538 +0,0 @@
-<template>
-  <el-form
-    ref="submitForm"
-    label-position="top"
-    :model="form"
-    :rules="formRules"
-    :hide-required-asterisk="true"
-  >
-    <el-form-item
-      prop="sparcFunded"
-      label="Are you involved in SPARC-funded research? *"
-    >
-      <el-select
-        v-model="form.sparcFunded"
-        placeholder="Select one"
-        :popper-append-to-body="false"
-      >
-        <el-option
-          v-for="sparcFundedOption in questionOptions.sparcFunded"
-          :key="sparcFundedOption"
-          :label="sparcFundedOption"
-          :value="sparcFundedOption"
-        />
-      </el-select>
-    </el-form-item>
-
-    <el-form-item
-      class="mt-32"
-      prop="levelOfInvolvement"
-      label="What is your highest level of involvement in research projects? *"
-    >
-      <el-select
-        v-model="form.levelOfInvolvement"
-        placeholder="Select one"
-        :popper-append-to-body="false"
-      >
-        <el-option
-          v-for="levelOfInvolvementOption in questionOptions.levelOfInvolvement"
-          :key="levelOfInvolvementOption"
-          :label="levelOfInvolvementOption"
-          :value="levelOfInvolvementOption"
-        />
-      </el-select>
-    </el-form-item>
-
-    <el-form-item class="mt-32" prop="resourceName" label="What is the name of the tool/resource? *">
-      <el-input v-model="form.resourceName" placeholder="Enter tool/resource name" />
-    </el-form-item>
-
-    <el-form-item class="mt-32" prop="resourceLink" label="What is the webpage link for this tool/resource? *">
-      <el-input placeholder="Enter URL" v-model="form.resourceLink">
-        <template slot="prepend">Http://</template>
-      </el-input>
-    </el-form-item>
-
-    <el-form-item
-      class="mt-32"
-      prop="resourceCategories"
-      label="Which category, or categories, would you place this tool/resource? Select all that apply. *"
-    >  
-      <client-only>
-        <sparc-checkbox
-          v-for="item in questionOptions.resourceCategories"
-          v-bind:key="item.label"
-          v-model="form.resourceCategories"
-          :label="item.label"
-          :display="item.display"
-        />
-      </client-only> 
-    </el-form-item>
-
-    <el-form-item prop="otherCategoryDescription" label="If you answered 'Other', please describe the category for this tool/resource.">
-      <el-input :disabled="!isOtherSelected" v-model="form.otherCategoryDescription" placeholder="Category description" />
-    </el-form-item>
-
-    <el-form-item
-      class="mt-32"
-      prop="isFree"
-      label="Is it free and/or open-source? *"
-    >
-      <client-only>
-        <sparc-radio
-          v-model="form.isFree"
-          label="Yes"
-          display="Yes"
-        />
-        <sparc-radio
-          v-model="form.isFree"
-          label="No"
-          display="No"
-        />
-      </client-only>
-    </el-form-item>
-
-    <el-form-item
-      class="mt-32"
-      prop="howBroadlyUsed"
-      label="How broadly is it used in biomedical science? (Uncommon 1 2 3 4 5 Common) *"
-    >
-      <client-only>
-        <sparc-radio
-          v-model="form.howBroadlyUsed"
-          label="1"
-          display="1"
-        />
-        <sparc-radio
-          v-model="form.howBroadlyUsed"
-          label="2"
-          display="2"
-        />
-        <sparc-radio
-          v-model="form.howBroadlyUsed"
-          label="3"
-          display="3"
-        />
-        <sparc-radio
-          v-model="form.howBroadlyUsed"
-          label="4"
-          display="4"
-        />
-        <sparc-radio
-          v-model="form.howBroadlyUsed"
-          label="5"
-          display="5"
-        />
-      </client-only>
-    </el-form-item>
-
-    <el-form-item
-      class="mt-32"
-      prop="hasSpecificApplications"
-      label="Does it have specific applications to the autonomic nervous system and the neural control of organs? *"
-    >
-      <client-only>
-        <sparc-radio
-          v-model="form.hasSpecificApplications"
-          label="Yes"
-          display="Yes"
-        />
-        <sparc-radio
-          v-model="form.hasSpecificApplications"
-          label="No"
-          display="No"
-        />
-      </client-only>
-    </el-form-item>
-
-    <el-form-item class="mt-32" prop="experienceDescription" label="Briefly describe your experience using this tool. *">
-      <el-input
-        v-model="form.experienceDescription"
-        type="textarea"
-        :rows="3"
-        placeholder="Tell us some details about your use of this tool/resource"
-      />
-    </el-form-item>
-
-    <el-form-item
-      class="mt-32"
-      prop="isCreator"
-      label="Are you the tool/resource creator? *"
-    >
-      <client-only>
-        <sparc-radio
-          v-model="form.isCreator"
-          label="Yes"
-          display="Yes"
-        />
-        <sparc-radio
-          v-model="form.isCreator"
-          label="No"
-          display="No"
-        />
-      </client-only>
-    </el-form-item>
-
-    <el-form-item class="mt-32" prop="primaryGoal" label="If yes, what was your primary goal in creating this tool/resource?">
-      <el-input
-        v-model="form.primaryGoal"
-        type="textarea"
-        :rows="3"
-        :disabled="form.isCreator != 'Yes'"
-        placeholder="Tell us your goal in creating this tool/resource"
-      />
-    </el-form-item>
-
-    <el-form-item
-      class="mt-32"
-      prop="hasBeenUsed"
-      label="To date, has this tool been used in an NIH SPARC-funded project? *"
-    >
-      <client-only>
-        <sparc-radio
-          v-model="form.hasBeenUsed"
-          label="Yes"
-          display="Yes"
-        />
-        <sparc-radio
-          v-model="form.hasBeenUsed"
-          label="No"
-          display="No"
-        />
-        <sparc-radio
-          v-model="form.hasBeenUsed"
-          label="Not sure"
-          display="Not sure"
-        />
-      </client-only>
-    </el-form-item>
-
-    <el-form-item class="mt-32" prop="howUsed" label="If yes, how has it been used in NIH SPARC-funded research?">
-      <el-input
-        v-model="form.howUsed"
-        type="textarea"
-        :rows="3"
-        :disabled="form.hasBeenUsed != 'Yes'"
-        placeholder="Tell us how it has been used"
-      />
-    </el-form-item>
-
-    <el-form-item
-      class="mt-32"
-      prop="isWilling"
-      label="Are you willing to participate in other user research to support the development of the SPARC Portal? *"
-    >
-      <client-only>
-        <sparc-radio
-          v-model="form.isWilling"
-          label="Yes"
-          display="Yes"
-        />
-        <sparc-radio
-          v-model="form.isWilling"
-          label="No"
-          display="No"
-        />
-      </client-only>
-    </el-form-item>
-
-    <hr/>
-
-    <div class="heading1">
-      Contact Information
-    </div>
-
-    <el-form-item class="mt-16" prop="name" label="Name *">
-      <el-input v-model="form.name" placeholder="Enter your name" />
-    </el-form-item>
-
-    <el-form-item class="mt-32" prop="email" label="Email *">
-      <el-input v-model="form.email" placeholder="Enter your email address" type="email" />
-    </el-form-item>
-
-    <div class="body4 mb-16"><i>Your submission will be reviewed and the reviewer may contact you to clarify or seek additional information.</i></div>
-
-    <el-form-item class="submit-button">
-      <el-button class="primary" :disabled="isSubmitting" @click="onSubmit">
-        Submit
-      </el-button>
-      <p v-if="hasError" class="error">
-        An error has occurred, please try again.
-      </p>
-    </el-form-item>
-  </el-form>
-</template>
-
-<script>
-import { sparcFunded, levelOfInvolvement, resourceCategories } from './questions.js'
-
-export default {
-  name: 'ToolsAndResourcesForm',
-
-  data() {
-    return {
-      hasError: false,
-      form: {
-        sparcFunded: '',
-        levelOfInvolvement: '',
-        resourceName: '',
-        resourceLink: '',
-        resourceCategories: [],
-        otherCategoryDescription: '',
-        isFree: '',
-        howBroadlyUsed: '',
-        hasSpecificApplications: '',
-        experienceDescription: '',
-        isCreator: '',
-        primaryGoal: '',
-        hasBeenUsed: '',
-        howUsed: '',
-        isWilling: '',
-        name: '',
-        email: '',
-      },
-      isSubmitting: false,
-      questionOptions: {
-        sparcFunded,
-        levelOfInvolvement,
-        resourceCategories
-      },
-      formRules: {
-        sparcFunded: [
-          {
-            required: true,
-            message: 'Please select one',
-            trigger: 'change'
-          }
-        ],
-        levelOfInvolvement: [
-          {
-            required: true,
-            message: 'Please select one',
-            trigger: 'change'
-          }
-        ],
-        resourceName: [
-          {
-            required: true,
-            message: 'Please enter the name of the tool/resource',
-            trigger: 'blur',
-          }
-        ],
-        resourceLink: [
-          {
-            required: true,
-            message: 'Please enter the link url',
-            trigger: 'blur',
-          }
-        ],
-        resourceCategories: [
-          {
-            required: true,
-            message: 'Please select at least one',
-            trigger: 'change'
-          }
-        ],
-        otherCategoryDescription: [
-          {
-            message: 'Please enter a description',
-            trigger: 'change',
-            validator: this.validateCategoryDescription
-          }
-        ],
-        isFree: [
-          {
-            required: true,
-            message: 'Please select one',
-            trigger: 'blur',
-          }
-        ],
-        howBroadlyUsed: [
-          {
-            required: true,
-            message: 'Please select one',
-            trigger: 'blur',
-          }
-        ],
-        hasSpecificApplications: [
-          {
-            required: true,
-            message: 'Please select one',
-            trigger: 'blur',
-          }
-        ],
-        experienceDescription: [
-          {
-            required: true,
-            message: 'Please enter a description',
-            trigger: 'change'
-          }
-        ],
-        isCreator: [
-          {
-            required: true,
-            message: 'Please select one',
-            trigger: 'blur',
-          }
-        ],
-        primaryGoal: [
-          {
-            message: 'Please enter your goal',
-            trigger: 'change',
-            validator: this.validatePrimaryGoal
-          }
-        ],
-        hasBeenUsed: [
-          {
-            required: true,
-            message: 'Please select one',
-            trigger: 'blur',
-          }
-        ],
-        howUsed: [
-          {
-            message: 'Please enter how it was used',
-            trigger: 'change',
-            validator: this.validateHowUsed
-          }
-        ],
-        isWilling: [
-          {
-            required: true,
-            message: 'Please select one',
-            trigger: 'blur',
-          }
-        ],
-        name: [
-          {
-            required: true,
-            message: 'Please enter your name',
-            trigger: 'blur',
-          }
-        ],
-        email: [
-          {
-            required: true,
-            message: 'Please enter your email',
-            type: 'email',
-            trigger: 'blur'
-          }
-        ],
-      }
-    }
-  },
-
-  computed: {
-    isOtherSelected: function() {
-      return this.form?.resourceCategories.some(resource => {
-        return resource == 'Other'
-      })
-    }
-  },
-
-  mounted() {
-    // Reset form fields when showing the form
-    this.$refs.submitForm.resetFields()
-    this.hasError = false
-  },
-
-  methods: {
-    /**
-     * Submit the form and validate
-     */
-    onSubmit() {
-      this.hasError = false
-
-      this.$refs.submitForm.validate(valid => {
-        if (!valid) {
-          return
-        }
-        this.sendForm()
-      })
-    },
-
-    validateHowUsed: function(rule, value, callback) {
-      if (this.form.hasBeenUsed == 'Yes' && value === '') {
-        callback(new Error(rule.message))
-      }
-      callback()
-    },
-
-    validateCategoryDescription: function(rule, value, callback) {
-      if (this.isOtherSelected && value === '') {
-        callback(new Error(rule.message))
-      }
-      callback()
-    },
-
-    validatePrimaryGoal: function(rule, value, callback) {
-      if (this.form.isCreator == 'Yes' && value === '') {
-        callback(new Error(rule.message))
-      }
-      callback()
-    },
-    /**
-     * Send form to endpoint
-     */
-     sendForm() {
-      this.isSubmitting = true
-
-      const description = `
-        <b>Are you involved in SPARC-funded research?</b><br>${this.form.sparcFunded}<br><br>
-        <b>What is your highest level of involvement in research projects?</b><br>${this.form.levelOfInvolvement}<br><br>
-        <b>What is the name of the tool/resource?</b><br>${this.form.resourceName}<br><br>
-        <b>What is the webpage link for this tool/resource?</b><br>${this.form.resourceLink}<br><br>
-        <b>Which category, or categories, would you place this tool/resource?</b><br>${this.form.resourceCategories}<br><br>
-        <b>If you answered 'Other', please describe the category for this tool/resource:</b><br>${this.isOtherSelected ? this.form.otherCategoryDescription : 'N/A'}<br><br>
-        <b>Is it free and/or open-source?</b><br>${this.form.isFree}<br><br>
-        <b>How broadly is it used in biomedical science?</b><br>${this.form.howBroadlyUsed}<br><br>
-        <b>Does it have specific applications to the autonomic nervous system and the neural control of organs?</b><br>${this.form.hasSpecificApplications}<br><br>
-        <b>Briefly describe your experience using this tool:</b><br>${this.form.experienceDescription}<br><br>
-        <b>Are you the tool/resource creator?</b><br>${this.form.isCreator}<br><br>
-        <b>If yes, what was your primary goal in creating this tool/resource?</b><br>${this.form.isCreator == 'Yes' ? this.form.primaryGoal : 'N/A'}<br><br>
-        <b>To date, has this tool been used in an NIH SPARC-funded project?</b><br>${this.form.hasBeenUsed}<br><br>
-        <b>If yes, how has it been used in NIH SPARC-funded research?</b><br>${this.form.hasBeenUsed == 'Yes' ? this.form.howUsed : 'N/A'}<br><br>
-        <b>Are you willing to participate in other user research to support the development of the SPARC Portal?</b><br>${this.form.isWilling}<br><br>
-        <b>Contact Information</b><br><br>
-        <b>Name:</b><br>${this.form.name}<br><br>
-        <b>Email:</b><br>${this.form.email}
-      `
-      let formData = new FormData();
-      formData.append("type", "toolsAndResources")
-      formData.append("title", `T&R Submission: ${this.form.resourceName}`)
-      formData.append("description", description)
-      formData.append("userEmail", this.form.email)
-
-      this.$axios
-        .post(`${process.env.portal_api}/tasks`, formData)
-        .then(() => {
-          this.$emit('submit', this.form.name)
-        })
-        .catch(() => {
-          this.hasError = true
-        })
-        .finally(() => {
-          this.isSubmitting = false
-        })
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
-.submit-button {
-  text-align: right;
-  margin-bottom: 0 !important;
-}
-hr {
-  border-top: none;
-  border-left: none;
-  border-width: 2px;
-  border-color: $lineColor1;
-  margin: 2rem 0;
-}
-.error {
-  color: $danger;
-}
-</style>
diff --git a/components/Url/UrlInput.vue b/components/Url/UrlInput.vue
new file mode 100644
index 00000000..3419e31a
--- /dev/null
+++ b/components/Url/UrlInput.vue
@@ -0,0 +1,65 @@
+<template>
+  <div>
+    <div class="url-input mr-16">
+      <el-input :disabled="disabled" :placeholder="placeholder" v-model="value">
+        <template slot="prepend">
+          <slot name="prepend" />
+        </template>
+      </el-input>
+    </div>
+    <span v-on:click="addLinkClicked" class="add-link-button link1" v-if="showAddLink && !disabled">
+      + Add URL
+    </span>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'UrlInput',
+  props: {
+    showAddLink: {
+      type: Boolean,
+      default: false
+    },
+    placeholder: {
+      type: String,
+      default: ''
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    value: String
+  },
+  watch: {
+    value() {
+      this.$emit("input", this.value)
+    }
+  },
+  methods: {
+    addLinkClicked() {
+      this.$emit('add-link')
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+.url-input {
+  display: inline-block;
+  min-width: 75%;
+}
+.add-link-button {
+  display: inline-block;
+  text-decoration: none;
+}
+.add-link-button:hover {
+  cursor: pointer;
+}
+::v-deep .is-disabled .el-input-group__prepend
+{
+  border-color: $lineColor1 !important;
+  color: #c0c4cc !important;
+}
+</style>
diff --git a/components/Url/UrlList.vue b/components/Url/UrlList.vue
new file mode 100644
index 00000000..69412430
--- /dev/null
+++ b/components/Url/UrlList.vue
@@ -0,0 +1,43 @@
+<template>
+  <div>
+    <url-input class="my-4" v-for="(val, index) in value"
+      :disabled="disabled" v-model="value[index]"
+      :placeholder="placeholder" @add-link="addLink" :showAddLink="index === value.length-1"
+      :key="index"
+    >
+      <template slot="prepend">Http://</template>
+    </url-input>
+  </div>
+</template>
+
+<script>
+
+import UrlInput from '@/components/Url/UrlInput.vue'
+
+export default {
+  name: 'UrlList',
+  components: {
+    UrlInput
+  },
+  props: {
+    value: {
+      type: Array
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    placeholder: String
+  },
+  watch: {
+    value() {
+      this.$emit("input", this.value)
+    }
+  },
+  methods: {
+    addLink() {
+      this.$emit('add-link')
+    }
+  }
+}
+</script>
diff --git a/components/VersionHistory/VersionHistory.vue b/components/VersionHistory/VersionHistory.vue
index 7c350e84..0d1a6081 100644
--- a/components/VersionHistory/VersionHistory.vue
+++ b/components/VersionHistory/VersionHistory.vue
@@ -67,20 +67,7 @@
         justify="center"
       >
         <el-col :span="4" :pull="1">
-          <router-link
-            :to="{
-              name: 'version',
-              params: {
-                version: version.version,
-                datasetId
-              },
-              query: {
-                type: 'dataset'
-              }
-            }"
-          >
-            Version {{ version.version }}
-          </router-link>
+          Version {{ version.version }}
         </el-col>
         <el-col :span="4">
           Revision {{ version.revision ? version.revision : '0' }}
@@ -133,7 +120,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters } from 'vuex'
 import { propOr } from 'ramda'
 
 import RequestDownloadFile from '@/mixins/request-download-file'
@@ -150,24 +137,44 @@ export default {
       type: Array,
       default: () => []
     },
-    changelogFiles: {
-      type: Array,
-      default: () => []
-    }
   },
   data: function() {
     return {
       markdown: '',
       dialogVisible: false,
-      changeLogFileInfo: {}
+      changeLogFileInfo: {},
+      changelogFiles: []
     }
   },
+  async fetch() {
+    const changelogFileRequests = []
+    this.versions.forEach(({ version }) => {
+      var changelogEndpoint = `${process.env.discover_api_host}/datasets/${this.datasetId}/versions/${version}/files?path=changelog.md`
+      if (this.userToken) { changelogEndpoint += `&api_key=${this.userToken}` }
+      changelogFileRequests.push(
+        this.$axios.$get(changelogEndpoint).then(response => {
+          return {
+            ...response,
+            version: version
+          }
+        }).catch(() => {
+          return {}
+        })
+      )
+    })
+
+    this.changelogFiles = await Promise.all(changelogFileRequests)
+  },
   computed: {
     /**
      * Get dataset info from the store
      * @returns {Object}
      */
     ...mapState('pages/datasets/datasetId', ['datasetInfo']),
+    ...mapGetters('user', ['cognitoUserToken']),
+    userToken() {
+      return this.cognitoUserToken || this.$cookies.get('user-token')
+    },
     /**
      * Gets dataset id
      * @returns {Number}
@@ -217,7 +224,8 @@ export default {
     },
     viewChangeLogFile(versionInfo) {
       // Note that requestFileContent is a mixin
-      this.requestFileContent(this.getChangelogFile(versionInfo.version)).then(content => {
+      const changelogFile = this.getChangelogFile(versionInfo.version)
+      this.requestFileContent(changelogFile).then(content => {
         this.markdown = content
         this.dialogVisible = true
         this.changeLogFileInfo = versionInfo // Set the version metadata for the currently stored markdown
diff --git a/components/VideoViewer/VideoViewer.vue b/components/VideoViewer/VideoViewer.vue
new file mode 100644
index 00000000..2962485d
--- /dev/null
+++ b/components/VideoViewer/VideoViewer.vue
@@ -0,0 +1,103 @@
+<template>
+  <div class="page-wrap container">
+    <client-only placeholder="Loading video ...">
+      <div class="video-container">
+        <video ref="vid" class="video" controls crossorigin playsinline>
+          <source :src="videoSource" :type="mimetype" size="1080" @error="failedVideoHandler"/>
+          <p>
+            Your browser doesn't support HTML5 video. Here is a a
+            <a :href="videoSource">link to the video</a> instead.
+          </p>
+        </video>
+      </div>
+    </client-only>
+    <video-viewer-metadata
+      :datasetInfo="datasetInfo"
+      :file="file"
+    />
+  </div>
+</template>
+
+<script>
+import Plyr from 'plyr'
+import VideoViewerMetadata from "@/components/ViewersMetadata/VideoViewerMetadata.vue"
+import FileDetails from '@/mixins/file-details'
+import { failMessage } from '@/utils/notification-messages'
+import { propOr } from 'ramda'
+
+export default {
+  name: 'VideoViewer',
+
+  components: {
+    VideoViewerMetadata,
+  },
+
+  mixins: [FileDetails],
+
+  props: {
+    videoData: {
+      type: Object,
+      default: () => {}
+    },
+    videoSource: {
+      type: String,
+      default: ""
+    },
+    file: {
+      type: Object,
+      default: () => {}
+    },
+    datasetInfo: {
+      type: Object,
+      default: () => {}
+    },
+  },
+  
+  data: () => {
+    return {
+      video_src: "",
+    }
+  },
+
+  computed: {
+    mimetype() {
+      return this.videoData.mimetype.name
+    },
+    datasetId() {
+      return propOr(undefined, "id", this.datasetInfo)
+    },
+    versionId() {
+      return propOr(undefined, "version", this.datasetInfo)
+    },
+  },
+
+  async fetch() {
+    try {
+      this.player = new Plyr(this.$refs.vid)
+    } catch(e) {
+      console.log(e)
+    }
+  },
+
+  methods: {
+    failedVideoHandler: function(e) {
+      this.$message(
+        failMessage('There was a problem while opening the video. Please try with another browser or use the Download button below.')
+      )
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+@import '@/assets/_viewer.scss';
+</style>
+<style lang="scss">
+.video-container {
+  padding-top: 0.5rem;
+}
+.video {
+  width: 100%;
+}
+</style>
+
diff --git a/components/ViewersMetadata/BiolucidaViewerMetadata.vue b/components/ViewersMetadata/BiolucidaViewerMetadata.vue
new file mode 100644
index 00000000..bf87c798
--- /dev/null
+++ b/components/ViewersMetadata/BiolucidaViewerMetadata.vue
@@ -0,0 +1,183 @@
+<template>
+  <div class="subpage pt-0 pb-16">
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Dataset</strong>
+      <div class="file-detail__column_2">
+        <nuxt-link
+          :to="{
+            name: 'datasets-datasetId',
+            params: {
+              datasetId
+            }
+          }"
+        >
+          {{ title }}
+        </nuxt-link>
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Filename</strong>
+      <div class="file-detail__column_2">
+        {{ fileName }}
+      </div>
+    </div>
+    <div v-if="filePath" class="file-detail">
+      <strong class="file-detail__column_1">File location</strong>
+      <div class="file-detail__column_2">
+        <nuxt-link
+          :to="{
+            name: `datasets-datasetId`,
+            params: {
+              datasetId: datasetId
+            },
+            query: {
+              datasetDetailsTab: 'files',
+              path: fileFolderLocation
+            }
+          }"
+        >
+          {{ filePath }}
+        </nuxt-link>
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Data collection</strong>
+      <div class="file-detail__column_2">
+        {{ data_collection }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Modality</strong>
+      <div class="file-detail__column_2">
+        {{ xmp_metadata.modality }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Channel target labels</strong>
+      <div class="file-detail__column_2">
+        <image-channels :channel-colours="xmp_metadata.channel_colours" />
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Image scaling</strong>
+      <div class="file-detail__column_2">
+        <image-scaling
+          :x-scale="xmp_metadata.pixel_height"
+          :y-scale="xmp_metadata.pixel_width"
+          :z-scale="xmp_metadata.z_spacing"
+        />
+      </div>
+    </div>
+    <div v-if="filePath" class="pt-16">
+      <el-button @click="requestDownloadFile({...file, version: versionId})">
+        Download file
+      </el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import biolucida from '@/services/biolucida'
+import RequestDownloadFile from '@/mixins/request-download-file'
+import ImageScaling from '@/components/Images/ImageScaling.vue'
+import ImageChannels from '@/components/Images/ImageChannels.vue'
+import MarkedMixin from '@/mixins/marked'
+import FileDetails from '@/mixins/file-details'
+
+import { extractSection } from '@/utils/common'
+import { propOr } from 'ramda'
+
+export default {
+  name: "BiolucidaViewerMetadata",
+  components: {
+    ImageScaling,
+    ImageChannels
+  },
+  props: {
+    biolucidaData: {
+      type: Object,
+      default: () => {
+        return {
+          biolucida_image_id: '',
+          blv_link: '',
+          share_link: '',
+          status: '',
+          location: '',
+          web_neurolucida_link: ''
+        }
+      }
+    },
+    file: {
+      type: Object,
+      default: () => {}
+    },
+    datasetInfo: {
+      type: Object,
+      default: () => {}
+    },
+  },
+  data() {
+    return {
+      data_collection: '',
+      blv_link: '',
+      web_neurolucida_link: '',
+      image_info: '',
+      xmp_metadata: '',
+    }
+  },
+  mixins: [MarkedMixin, FileDetails, RequestDownloadFile],
+  async fetch() {
+    try {
+      const image_identifier = this.biolucidaData.biolucida_image_id
+      const [
+        blv_info,
+        view_info,
+        image_info,
+        xmp_metadata,
+        readme_markdown
+      ] = await Promise.all([
+        biolucida.getBLVLink(image_identifier),
+        biolucida.decodeViewParameter(this.viewId),
+        biolucida.getImageInfo(image_identifier),
+        biolucida.getXMPInfo(image_identifier),
+        fetch(this.datasetInfo.readme).then((response) => {
+          return response.text()
+        })
+      ])
+      const BASE_URL = `blv:${process.env.BL_SERVER_URL}`
+      const queryParameters = `image_id=${image_identifier}&type=${view_info[1]}${view_info[2]}&filename=${image_info.name}`
+      const webNeurolucidaLink = BASE_URL + '/image_view?' + queryParameters
+
+      const html = this.parseMarkdown(readme_markdown)
+      this.data_collection = extractSection(/data collect[^:]+:/i, html)
+      this.blv_link = blv_info['link']
+      this.web_neurolucida_link = webNeurolucidaLink
+      this.image_info = image_info
+      this.xmp_metadata = xmp_metadata
+    } catch (e) {
+      console.log(e)
+    }
+  },
+  computed: {
+    viewId() {
+      return this.biolucidaData.share_link.replace(
+        process.env.BL_SHARE_LINK_PREFIX,
+        ''
+      )
+    },
+    title: function() {
+      return propOr("", 'name', this.datasetInfo)
+    },
+    datasetId() {
+      return propOr(undefined, "id", this.datasetInfo)
+    },
+    versionId() {
+      return propOr(undefined, "version", this.datasetInfo)
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@/assets/_viewer.scss';
+</style>
diff --git a/components/ViewersMetadata/FileViewerMetadata.vue b/components/ViewersMetadata/FileViewerMetadata.vue
new file mode 100644
index 00000000..e1e00faa
--- /dev/null
+++ b/components/ViewersMetadata/FileViewerMetadata.vue
@@ -0,0 +1,137 @@
+<template>
+  <div class="subpage">
+    <div class="page-heading">
+      <div class="heading2 file-detail__column">{{ file.name }}</div>
+      <div class="page-heading__button">
+        <el-button @click="executeDownload(file)">
+          Download
+        </el-button>
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column">Type</strong>
+      <div class="file-detail__column">
+        {{ file.fileType }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column">Size</strong>
+      <div class="file-detail__column">
+        {{ file.size ? formatMetric(file.size) : 'undefined' }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column">Date Created</strong>
+      <div class="file-detail__column">
+        {{ file.createdAt ? formatDate(file.createdAt) : 'undefined' }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column">Dataset</strong>
+      <div class="file-detail__column">
+        <nuxt-link
+          :to="{
+            name: 'datasets-datasetId',
+            params: {
+              datasetId
+            }
+          }"
+        >
+          {{ datasetTitle }}
+        </nuxt-link>
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column">File location</strong>
+      <div class="file-detail__column">
+        <nuxt-link
+          :to="{
+            name: `datasets-datasetId`,
+            params: {
+              datasetId
+            },
+            query: {
+              datasetDetailsTab: 'files',
+              path: location
+            }
+          }"
+        >
+          {{ location }}
+        </nuxt-link>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import FormatDate from '@/mixins/format-date'
+import BfStorageMetrics from '@/mixins/bf-storage-metrics'
+
+import { propOr } from 'ramda'
+
+export default {
+  name: "FileViewerMetadata",
+  props: {
+    file: {
+      type: Object,
+      default: () => {}
+    },
+    datasetInfo: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  mixins: [FormatDate, BfStorageMetrics],
+  computed: {
+    location: function() {
+      return this.file.path.replace(`/${this.file.name}`, '')
+    },
+    datasetTitle: function() {
+      return this.datasetInfo ? this.datasetInfo.name : 'Go to dataset'
+    },
+    datasetId: function() {
+      return propOr(0, 'id', this.datasetInfo)
+    }
+  },
+  methods: {
+    executeDownload(file) {
+      this.$emit("download-file", file)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+h1 {
+  flex: 1;
+  font-size: 1.5em;
+  line-height: 2rem;
+}
+.page-heading {
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 1.375rem;
+  @media (min-width: 48em) {
+    flex-direction: row;
+  }
+  align-items: center;
+}
+.page-heading__button {
+  flex-shrink: 0;
+}
+
+.file-detail {
+  border-bottom: 1px solid $lineColor2;
+  flex-direction: column;
+  font-size: 0.875em;
+  display: flex;
+  padding: 1rem 0.625rem;
+  @media (min-width: 48em) {
+    flex-direction: row;
+  }
+}
+.file-detail__column {
+  flex: 1;
+}
+</style>
diff --git a/components/ViewersMetadata/PlotViewerMetadata.vue b/components/ViewersMetadata/PlotViewerMetadata.vue
new file mode 100644
index 00000000..6d994079
--- /dev/null
+++ b/components/ViewersMetadata/PlotViewerMetadata.vue
@@ -0,0 +1,98 @@
+<template>
+  <div class="subpage">
+    <div class="page-heading">
+      <h2>{{ fileName }}</h2>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Type</strong>
+      <div class="file-detail__column_2">
+        {{ plotType.charAt(0).toUpperCase() + plotType.slice(1) }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Dataset</strong>
+      <div class="file-detail__column_2">
+        <nuxt-link
+          :to="{
+            name: 'datasets-datasetId',
+            params: {
+              datasetId
+            }
+          }"
+        >
+          {{ datasetTitle }}
+        </nuxt-link>
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">File location</strong>
+      <div class="file-detail__column_2">
+        <nuxt-link
+          :to="{
+            name: `datasets-datasetId`,
+            params: {
+              datasetId: datasetId
+            },
+            query: {
+              datasetDetailsTab: 'files',
+              path: fileFolderLocation
+            }
+          }"
+        >
+          {{ filePath }}
+        </nuxt-link>
+      </div>
+    </div>
+    <div class="pt-16">
+      <bf-button @click="requestDownloadFile({...file, version: versionId})">
+        Download file
+      </bf-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import RequestDownloadFile from '@/mixins/request-download-file'
+import FileDetails from '@/mixins/file-details'
+import BfButton from '@/components/shared/BfButton/BfButton.vue'
+
+import { propOr } from 'ramda'
+
+export default {
+  name: "PlotViewerMetadata",
+  components: {
+    BfButton
+  },
+  props: {
+    plotType: {
+      type: String,
+      default: ""
+    },
+    file: {
+      type: Object,
+      default: () => {}
+    },
+    datasetInfo: {
+      type: Object,
+      default: () => {}
+    },
+  },
+  mixins: [FileDetails, RequestDownloadFile],
+
+  computed: {
+    datasetTitle: function() {
+      return propOr("", 'name', this.datasetInfo)
+    },
+    datasetId() {
+      return propOr(undefined, "id", this.datasetInfo)
+    },
+    versionId() {
+      return propOr(undefined, "version", this.datasetInfo)
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@/assets/_viewer.scss';
+</style>
diff --git a/components/ViewersMetadata/SegmentationViewerMetadata.vue b/components/ViewersMetadata/SegmentationViewerMetadata.vue
new file mode 100644
index 00000000..e368d938
--- /dev/null
+++ b/components/ViewersMetadata/SegmentationViewerMetadata.vue
@@ -0,0 +1,199 @@
+<template>
+  <div class="subpage pt-0 pb-16">
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Dataset</strong>
+      <div class="file-detail__column_2">
+        <nuxt-link
+          :to="{
+            name: 'datasets-datasetId',
+            params: {
+              datasetId
+            }
+          }"
+        >
+          {{ title }}
+        </nuxt-link>
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Filename</strong>
+      <div class="file-detail__column_2">
+        {{ segmentation_info.name }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">File location</strong>
+      <div class="file-detail__column_2">
+        <nuxt-link
+          :to="{
+            name: `datasets-datasetId`,
+            params: {
+              datasetId: datasetId
+            },
+            query: {
+              datasetDetailsTab: 'files',
+              path: fileFolderLocation
+            }
+          }"
+        >
+          {{ filePath }}
+        </nuxt-link>
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Data collection</strong>
+      <div class="file-detail__column_2">
+        {{ data_collection }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Subject</strong>
+      <div class="file-detail__column_2">
+        {{ subjectId }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Species</strong>
+      <div class="file-detail__column_2">
+        {{ human_readable_species }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Sex</strong>
+      <div class="file-detail__column_2">
+        {{ sex }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Age</strong>
+      <div class="file-detail__column_2">
+        {{ age }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Organ</strong>
+      <div class="file-detail__column_2">
+        {{ organ }}
+      </div>
+    </div>
+    <div class="pt-16">
+      <el-button @click="requestDownloadFile({...file, version: versionId})">
+        Download file
+      </el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import discover from '@/services/discover'
+import general from '@/services/general'
+
+import RequestDownloadFile from '@/mixins/request-download-file'
+import ImageScaling from '@/components/Images/ImageScaling.vue'
+import ImageChannels from '@/components/Images/ImageChannels.vue'
+import MarkedMixin from '@/mixins/marked'
+import FileDetails from '@/mixins/file-details'
+
+import { baseName, extractSection, extractS3BucketName } from '@/utils/common'
+import { pathOr, propOr } from 'ramda'
+
+export default {
+  name: "SegmentationViewerMetadata",
+  components: {
+    ImageScaling,
+    ImageChannels
+  },
+  props: {
+    segmentationData: {
+      type: Object,
+      default: () => {
+        return {
+          share_link: '',
+          status: '',
+        }
+      }
+    },
+    file: {
+      type: Object,
+      default: () => {}
+    },
+    datasetInfo: {
+      type: Object,
+      default: () => {}
+    },
+  },
+  data() {
+    return {
+      segmentation_info: {},
+      human_readable_species: {},
+      data_collection: ''
+    }
+  },
+  mixins: [MarkedMixin, FileDetails, RequestDownloadFile],
+
+  async fetch() {
+    try {
+      const s3Bucket = this.datasetInfo ? extractS3BucketName(this.datasetInfo.uri) : undefined
+
+      const [segmentation_info_response, readme_markdown] = await Promise.all([
+        discover.getSegmentationInfo(
+          this.datasetId,
+          this.filePath,
+          s3Bucket
+        ),
+        fetch(this.datasetInfo.readme).then((response) => {
+          return response.text()
+        })
+      ])
+      const segmentation_info = {
+        ...segmentation_info_response.data,
+        name: baseName(this.filePath)
+      }
+
+      const species_lookup_response = await general.lookupOntoTerm(
+        segmentation_info.subject.species
+      )
+
+      const human_readable_species = species_lookup_response.label
+
+      this.segmentation_info = segmentation_info
+      this.human_readable_species = human_readable_species
+      const html = this.parseMarkdown(readme_markdown)
+      this.data_collection = extractSection(/data collect[^:]+:/i, html)
+    } catch (e) {
+      console.log(e)
+    }
+  },
+
+  computed: {
+    title: function() {
+      return propOr("", 'name', this.datasetInfo)
+    },
+    datasetId() {
+      return propOr(undefined, "id", this.datasetInfo)
+    },
+    versionId() {
+      return propOr(undefined, "version", this.datasetInfo)
+    },
+    segmentationType: function() {
+      return 'application/vnd.mbfbioscience.neurolucida+xml'
+    },
+    subjectId() {
+      return pathOr("", ['subject','subjectid'], this.segmentation_info)
+    },
+    sex() {
+      return pathOr("", ['subject','sex'], this.segmentation_info)
+    },
+    age() {
+      return pathOr("", ['subject','age'], this.segmentation_info)
+    },
+    organ() {
+      return pathOr("", ['atlas','organ'], this.segmentation_info)
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@/assets/_viewer.scss';
+</style>
diff --git a/components/ViewersMetadata/VideoViewerMetadata.vue b/components/ViewersMetadata/VideoViewerMetadata.vue
new file mode 100644
index 00000000..7a1bce39
--- /dev/null
+++ b/components/ViewersMetadata/VideoViewerMetadata.vue
@@ -0,0 +1,97 @@
+<template>
+  <div class="subpage">
+    <div class="page-heading">
+      <h2>{{ fileName }}</h2>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Type</strong>
+      <div class="file-detail__column_2">
+        {{ fileType }}
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">Dataset</strong>
+      <div class="file-detail__column_2">
+        <nuxt-link
+          :to="{
+            name: 'datasets-datasetId',
+            params: {
+              datasetId
+            }
+          }"
+        >
+          {{ datasetTitle  }}
+        </nuxt-link>
+      </div>
+    </div>
+    <div class="file-detail">
+      <strong class="file-detail__column_1">File location</strong>
+      <div class="file-detail__column_2">
+        <nuxt-link
+          :to="{
+            name: `datasets-datasetId`,
+            params: {
+              datasetId: datasetId
+            },
+            query: {
+              datasetDetailsTab: 'files',
+              path: fileFolderLocation
+            }
+          }"
+        >
+          {{ filePath }}
+        </nuxt-link>
+      </div>
+    </div>
+    <div class="pt-16">
+      <bf-button @click="requestDownloadFile({...file, version: versionId})">
+        Download file
+      </bf-button>
+    </div>
+  </div>
+</template>
+
+<script>
+import RequestDownloadFile from '@/mixins/request-download-file'
+import FileDetails from '@/mixins/file-details'
+import BfButton from '@/components/shared/BfButton/BfButton.vue'
+
+import { propOr } from 'ramda'
+
+export default {
+  name: "VideoViewerMetadata",
+  components: {
+    BfButton
+  },
+  props: {
+    file: {
+      type: Object,
+      default: () => {}
+    },
+    datasetInfo: {
+      type: Object,
+      default: () => {}
+    },
+  },
+  mixins: [FileDetails, RequestDownloadFile],
+
+  computed: {
+    datasetTitle: function() {
+      return propOr("", 'name', this.datasetInfo)
+    },
+    datasetId() {
+      return propOr(undefined, "id", this.datasetInfo)
+    },
+    versionId() {
+      return propOr(undefined, "version", this.datasetInfo)
+    },
+    fileType: function() {
+      return this.file.fileType
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@/assets/_viewer.scss';
+</style>
diff --git a/components/footer/ContactUsModal.vue b/components/footer/ContactUsModal.vue
deleted file mode 100644
index f500597c..00000000
--- a/components/footer/ContactUsModal.vue
+++ /dev/null
@@ -1,213 +0,0 @@
-<template>
-  <el-dialog :show-close="true" :visible.sync="visible" @close="onClose">
-    <div class="dialog-body">
-      <div class="header">
-        <h2>Send Us a Message</h2>
-      </div>
-      <el-form
-        ref="contactForm"
-        :label-position="labelPosition"
-        label-width="100px"
-        :model="contactUsForm"
-        :rules="contactUsFormRules"
-      >
-        <el-form-item prop="name" label="Your Name">
-          <el-input
-            v-model="contactUsForm.name"
-            placeholder="Enter your name"
-          />
-        </el-form-item>
-        <el-form-item prop="email" label="Your Email">
-          <el-input
-            v-model="contactUsForm.email"
-            placeholder="Enter your email"
-            type="email"
-          />
-        </el-form-item>
-        <el-form-item prop="message" label="Your Message">
-          <el-input
-            v-model="contactUsForm.message"
-            placeholder="Your message"
-            type="textarea"
-          />
-        </el-form-item>
-        <el-form-item>
-          <el-button class="send-button" @click="submitContactForm">
-            Send
-          </el-button>
-        </el-form-item>
-      </el-form>
-    </div>
-  </el-dialog>
-</template>
-
-<script>
-export default {
-  name: 'ContactUsModal',
-  props: {
-    visible: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    return {
-      labelPosition: 'top',
-      contactUsForm: {
-        name: '',
-        email: '',
-        message: ''
-      },
-      contactUsFormRules: {
-        name: [
-          {
-            required: true,
-            message: 'Please enter your name',
-            trigger: 'change'
-          }
-        ],
-
-        email: [
-          {
-            required: true,
-            message: 'Please enter your email',
-            trigger: 'change'
-          }
-        ],
-
-        message: [
-          {
-            required: true,
-            message: 'Please enter a message',
-            trigger: 'change'
-          }
-        ]
-      }
-    }
-  },
-
-  methods: {
-    submitContactForm: function() {
-      this.$refs.contactForm.validate(valid => {
-        if (!valid) {
-          return
-        }
-        this.sendRequest()
-      })
-    },
-
-    sendRequest: function() {
-      // send request logic goes here
-      this.$http.post('/api/contact', {
-        name: this.contactUsForm.name,
-        email: this.contactUsForm.email,
-        message: this.contactUsForm.message
-      })
-      this.onClose()
-    },
-
-    onClose: function() {
-      this.$emit('update:visible', false)
-      this.$refs.contactForm.resetFields()
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.send-button {
-  background-color: #24245b;
-  color: white;
-  display: block;
-  border-radius: 4px;
-  margin: 0 auto;
-  padding: 12px 46px;
-}
-
-.header {
-  margin-left: 1px;
-  @media (max-width: 767px) {
-    text-align: center;
-    width: 90vw;
-  }
-}
-
-h2 {
-  color: #24245b;
-  font-weight: normal;
-  font-size: 46px;
-  line-height: 1;
-  margin-bottom: 32px;
-  text-transform: none;
-  @media (max-width: 767px) {
-    & {
-      font-size: 24px;
-    }
-  }
-}
-
-.el-dialog {
-  background: none;
-  display: flex;
-  height: 100vh;
-  margin: 0 !important;
-  width: 100vw;
-
-  .el-dialog__body {
-    align-items: center;
-    background-color: rgba(237, 241, 252, 0.9);
-    display: flex;
-    flex: 1;
-    justify-content: center;
-    padding: 0;
-  }
-
-  .el-dialog__header {
-    padding: 0;
-  }
-
-  .el-dialog__headerbtn .el-dialog__close {
-    font-size: 34px;
-    color: #24245b;
-    font-weight: bold;
-  }
-}
-
-.el-form {
-  margin: 0 auto;
-  max-width: 317px;
-}
-
-.el-form-item__label {
-  line-height: 1.2;
-}
-
-.el-input {
-  .el-input__inner {
-    border-radius: 4px;
-    border: 1px solid #909399;
-  }
-}
-
-.el-form-item {
-  margin-bottom: 26px;
-  &:last-child {
-    margin: 0;
-  }
-}
-
-.el-textarea {
-  .el-textarea__inner {
-    border-radius: 4px;
-    border: 1px solid #909399;
-  }
-}
-
-.el-form {
-  .el-form-item {
-    .el-form-item__label {
-      text-transform: none;
-    }
-  }
-}
-</style>
diff --git a/components/footer/Footer.vue b/components/footer/Footer.vue
index 83a17ad7..a02c1305 100644
--- a/components/footer/Footer.vue
+++ b/components/footer/Footer.vue
@@ -46,6 +46,11 @@
                 />
               </a>
             </div>
+            <div class="footer__info--re3data">
+              <object type="image/svg+xml" data="/images/100013719.svg">
+                <img src="/images/100013719.svg" alt="re3data badge"/>
+              </object>
+            </div>
           </div>
         </el-col>
         <el-col :sm="{ span: 22, offset: 1 }" :md="{ span: 8, offset: 4 }">
@@ -202,6 +207,10 @@ export default {
           margin-bottom: 1rem;
         }
       }
+
+      &--re3data {
+        margin-bottom: 1.5rem;
+      }
     }
   }
 }
diff --git a/components/footer/FooterLink.vue b/components/footer/FooterLink.vue
index 01a71f17..72334b09 100644
--- a/components/footer/FooterLink.vue
+++ b/components/footer/FooterLink.vue
@@ -1,18 +1,14 @@
 <template>
-  <nuxt-link
-    v-if="isInternalLink(link.fields.url || '')"
-    :to="link.fields.url"
-    data-jest="nuxt-link"
+  <a
+    :href="linkUrl"
+    :target="!opensInNewTab(linkUrl) && !isFeedbackLink ? '_self' : '_blank'"
   >
-    {{ link.fields.title }}
-  </nuxt-link>
-  <a v-else :href="link.fields.longUrl || link.fields.url" target="_blank">
-    {{ link.fields.title }}
+  {{ link.fields.title }}
   </a>
 </template>
 
 <script>
-import { isInternalLink } from '@/mixins/marked/index'
+import { opensInNewTab } from '@/mixins/marked/index'
 
 export default {
   name: 'FooterLink',
@@ -30,7 +26,24 @@ export default {
   },
 
   methods: {
-    isInternalLink
+    opensInNewTab
+  },
+
+  computed: {
+    currentUrl() {
+      return encodeURIComponent(this.$nuxt.$route.fullPath)
+    },
+    isFeedbackLink() {
+      const title = this.link.fields.title
+      return title == 'Site Feedback'
+    },
+    linkUrl() {
+      let url = this.link.fields.longUrl || this.link.fields.url
+      if (this.isFeedbackLink) {
+        url = url + `&source_url=${this.currentUrl}`
+      }
+      return url
+    }
   }
 }
 </script>
diff --git a/components/header/Header.vue b/components/header/Header.vue
index 6ff557d8..6d417cae 100644
--- a/components/header/Header.vue
+++ b/components/header/Header.vue
@@ -10,7 +10,7 @@
         <a href="https://docs.sparc.science/" target="_blank">
           Help
         </a>
-        <template v-if="showLoginFeature">
+        <template>
           <svg-icon
             name="icon-sign-in"
             class="login-logo"
@@ -43,6 +43,7 @@
             </nuxt-link>
           </div>
           <button
+            v-if="showSearchDialog"
             class="nav-main-container__mobile-search"
             @click="openMobileSearch"
             @enter="executeSearch(searchQuery)"
@@ -79,6 +80,7 @@
                   style="z-index: 100;"
                 >
                   <nuxt-link
+                    @click.native="handleClick"
                     :to="link.href"
                     :class="{ active: activeLink(link.href) }"
                     exact-active-class="active"
@@ -101,7 +103,7 @@
                     Help
                   </a>
                 </li>
-                <li v-if="showLoginFeature">
+                <li>
                   <svg-icon
                     name="icon-sign-in"
                     class="login-menu-logo"
@@ -144,7 +146,7 @@
               </div>
             </div>
           </div>
-          <div class="nav-main-container__search">
+          <div v-if="showSearchDialog" class="nav-main-container__search">
             <el-input
               v-model="searchQuery"
               type="text"
@@ -194,8 +196,8 @@ import { mapState, mapGetters } from 'vuex'
 const links = [
   {
     title: 'data',
-    displayTitle: 'Find Data',
-    href: '/data'
+    displayTitle: 'Data & Models',
+    href: '/data?type=dataset'
   },
   {
     title: 'resources',
@@ -216,6 +218,11 @@ const links = [
     title: 'about',
     displayTitle: 'About',
     href: '/about'
+  },
+  {
+    title: 'share-data',
+    displayTitle: 'Submit to SPARC',
+    href: '/share-data'
   }
 ]
 
@@ -228,9 +235,7 @@ export default {
   },
   mixins: [Request],
   mounted: async function() {
-    if (this.showLoginFeature) {
-      await this.$store.dispatch('user/fetchUser')
-    }
+    await this.$store.dispatch('user/fetchUser')
   },
   data: () => {
     return {
@@ -239,8 +244,8 @@ export default {
       mobileSearchOpen: false,
       searchQuery: '',
       searchSelect: 'data',
+      showSearchDialog: false,
       showLoginDialog: false,
-      showLoginFeature: (process.env.SHOW_LOGIN_FEATURE == 'true') ? true : false,
       searchSelectOptions: [
         {
           key: 'data',
@@ -248,8 +253,8 @@ export default {
           label: 'Data'
         },
         {
-          key: 'resources-biological',
-          value: 'resources-biological',
+          key: 'resources-databases',
+          value: 'resources-databases',
           label: 'Tools & Resources'
         },
         {
@@ -268,7 +273,7 @@ export default {
 
   computed: {
     ...mapState('user', ['cognitoUser', 'pennsieveUser']),
-    ...mapGetters('user', ['profileComplete', 'pennsieveUsername']),
+    ...mapGetters('user', ['profileComplete', 'cognitoUserToken', 'pennsieveUsername']),
     firstPath: function() {
       const path = this.$nuxt.$route.path
       // ignore the first backslash
@@ -279,11 +284,17 @@ export default {
       return path.substring(0, endIndex)
     },
     currentUrl: function() {
-      return this.$nuxt.$route.fullPath;
-    }
+      return encodeURIComponent(this.$nuxt.$route.fullPath)
+    },
   },
 
   watch: {
+    profileComplete: {
+      handler: function() {
+        this.verifyProfileComplete()
+      },
+      immediate: true
+    },
     /**
      * Watches for the route path to hide
      * mobile nav on menu click
@@ -293,6 +304,7 @@ export default {
         if (val) {
           this.menuOpen = false
         }
+        this.verifyProfileComplete()
       },
       immediate: true
     },
@@ -312,6 +324,37 @@ export default {
   },
 
   methods: {
+    handleClick(e){
+      if (e.target.href.includes('share-data')) {
+        this.$gtm.push({
+          event: 'interaction_event',
+          event_name: 'submit_to_sparc_button_click',
+          files: "",
+          file_name: "",
+          file_path: "",
+          file_type: "",
+          location: "Header",
+          category: "",
+          dataset_id: "",
+          version_id: "",
+          doi: "",
+          citation_type: ""
+        })
+      }
+    },
+    verifyProfileComplete() {
+      if (this.cognitoUserToken != "") {
+        // If the user is logged in and their profile is incomplete then make sure they complete it. Otherwise, do not allow them to visit the welcome page again
+        if (!this.profileComplete) {
+          if (this.$route.name !== 'welcome') {
+            this.$router.push("/welcome")
+          }
+        }
+        else if (this.$route.name == 'welcome') {
+          this.$router.push("/")
+        }
+      }
+    },
     handleUserMenuSelect(menuId, menuIdPath) {
       if (menuId === 'logout') {
         this.$cookies.set('sign-out-redirect-url', this.$nuxt.$route.fullPath)
@@ -552,8 +595,7 @@ export default {
   display: flex;
   outline: none;
   padding-bottom: 1rem;
-  &:hover:not(:active),
-  &:focus:not(:active) {
+  &:hover:not(:active) {
     color: $app-primary-color;
   }
   @media (min-width: 64em) {
@@ -647,8 +689,7 @@ export default {
   transform: translate(12px, -8px);
   -webkit-appearance: none;
 
-  &:hover:not(:active),
-  &:focus:not(:active) {
+  &:hover:not(:active) {
     color: $app-primary-color;
   }
 
@@ -684,8 +725,7 @@ export default {
         font-weight: 500;
 
         &.active,
-        &:hover,
-        &:focus {
+        &:hover {
           border-bottom: 2px solid $median;
           color: $median;
         }
diff --git a/cypress.config.js b/cypress.config.js
new file mode 100644
index 00000000..4b0e281d
--- /dev/null
+++ b/cypress.config.js
@@ -0,0 +1,27 @@
+const { defineConfig } = require("cypress");
+require('dotenv').config();
+
+module.exports = defineConfig({
+  defaultCommandTimeout: 5000,
+  experimentalMemoryManagement: true,
+  numTestsKeptInMemory: 0,
+  e2e: {
+    baseUrl: process.env.ROOT_URL ? process.env.ROOT_URL : 'http://localhost:3000',
+    experimentalStudio: true,
+    projectId: process.env.CYPRESS_PROJECT_ID,
+    specPattern: "test/cypress/e2e/**/*.cy.{js,jsx,ts,tsx}",
+    supportFile: "test/cypress/support/e2e.js",
+    viewportWidth: 1600,
+    viewportHeight: 900,
+    //Prevent huge amount of time on reloading page
+    testIsolation: true,
+    // pageLoadTimeout: 1024*1024*1024,
+    setupNodeEvents(on, config) {
+      // implement node event listeners here
+    },
+  },
+  fixturesFolder: "test/cypress/fixtures",
+  screenshotsFolder: "test/cypress/screenshots",
+  videosFolder: "test/cypress/videos",
+  downloadsFolder: "test/cypress/downloads",
+});
diff --git a/docs/pull_request_template.md b/docs/pull_request_template.md
index 12c328b6..8b1a74a5 100644
--- a/docs/pull_request_template.md
+++ b/docs/pull_request_template.md
@@ -18,8 +18,8 @@ Please describe the tests that you ran to verify your changes. Provide instructi
 
 # Checklist:
 
-- [ ] My code follows the style guidelines of this project
 - [ ] I have performed a self-review of my own code
 - [ ] I have commented my code, particularly in hard-to-understand areas
 - [ ] I have utilized components from the Design System Library where applicable
-- [ ] I have added unit tests that prove my fix is effective or that my feature works
+- [ ] I have added or updated unit tests that prove my fix is effective or that my feature works
+- [ ] I updated any relevant QC tests to match my changes found here: https://docs.google.com/document/d/1tlV89PMOv8XlmC7LVqifi7NfQ5-AYN8DuEQpmO7O_2Q
diff --git a/layouts/default.vue b/layouts/default.vue
index 1c96d9fa..925fda77 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -12,6 +12,8 @@ import sparcHeader from '@/components/header/Header.vue'
 import sparcFooter from '@/components/footer/Footer.vue'
 import CookieNotice from '@/components/CookieNotice/CookieNotice.vue'
 import { mapState } from 'vuex'
+import { propOr } from 'ramda'
+import DOMPurify from 'isomorphic-dompurify'
 
 export default {
   components: {
@@ -21,11 +23,84 @@ export default {
   },
   computed: {
     ...mapState('layouts/default', {
-      scrollingState: state => state.disableScrolling
+      scrollingState: state => state.disableScrolling,
+      hasAcceptedGDPR: state => state.hasAcceptedGDPR,
+      hasSeenPortalNotification: state => state.hasSeenPortalNotification,
+      portalNotification: state => state.portalNotification
     }),
-    ...mapState('layouts/default', {
-      hasAcceptedGDPR: state => state.hasAcceptedGDPR
-    })
+  },
+  mounted() {
+    this.showPortalNotification()
+  },
+  head() {
+    return {
+      meta: [
+        { 
+          hid: 'og:url',
+          property: 'og:url',
+          content: `${process.env.ROOT_URL}${this.$route.fullPath}`,
+        },
+      ]
+    }
+  },
+  methods: {
+    showPortalNotification() {
+      const displayOnHomePageOnly = propOr("", 'displayOn', this.portalNotification) === 'Homepage Only'
+      const currentlyOnHomePage = this.$route.fullPath === "/"
+      const message = DOMPurify.sanitize(propOr("", 'message', this.portalNotification).trim(), {
+        ALLOWED_TAGS: ['a', 'br', 'sup'], // We allow links, line breaks, and sup tags
+        ALLOWED_ATTR: ['href'], // We allow the href attribute for links
+      })
+      const messageType = propOr("", 'messageType', this.portalNotification)
+      const onlyShowOnce = propOr(true, 'showOnce', this.portalNotification)
+      const stopShowingDate = propOr(undefined, 'stopShowingDate', this.portalNotification)
+      // If the stop showing time is not set then always display message, therwise check if the date has passed
+      const stopShowing = stopShowingDate === undefined ? false : new Date(stopShowingDate).getTime() < new Date().getTime()
+      if (message != "" && !stopShowing) {
+        if (!onlyShowOnce || !this.hasSeenPortalNotification) {
+          if (!displayOnHomePageOnly || (displayOnHomePageOnly && currentlyOnHomePage)) {
+            switch (messageType) {
+              case 'Error': {
+                this.$message({
+                  message: message,
+                  showClose: true,
+                  iconClass: 'el-icon-circle-close',
+                  customClass: 'el-message--error',
+                  dangerouslyUseHTMLString: true,
+                  duration: 0
+                })
+                break
+              }
+              case 'Success': {
+                this.$message({
+                  message: message,
+                  showClose: true,
+                  iconClass: 'el-icon-circle-check',
+                  customClass: 'el-message--success',
+                  dangerouslyUseHTMLString: true,
+                  duration: 0
+                })
+                break
+              }
+              case 'Information': {
+                this.$message({
+                  message: message,
+                  showClose: true,
+                  iconClass: 'about-icon',
+                  customClass: 'el-message--info',
+                  dangerouslyUseHTMLString: true,
+                  duration: 0
+                })
+                break
+              }
+            }
+            const today = new Date()
+            const expirationDate = new Date(today.setDate(today.getDate() + 30))
+            this.$cookies.set('PortalNotification:hasBeenSeen', true, { expires: expirationDate })
+          }
+        }
+      }
+    }
   }
 }
 </script>
diff --git a/middleware/authenticated.js b/middleware/authenticated.js
deleted file mode 100644
index 15a0dcd2..00000000
--- a/middleware/authenticated.js
+++ /dev/null
@@ -1,6 +0,0 @@
-export default function({ redirect, app, store }) {
-  const userToken = app.$cookies.get('user-token') || store.getters['user/cognitoUserToken']
-  if (!userToken) {
-    return redirect('/')
-  }
-}
diff --git a/middleware/clearDatalayer.js b/middleware/clearDatalayer.js
new file mode 100644
index 00000000..4bd56861
--- /dev/null
+++ b/middleware/clearDatalayer.js
@@ -0,0 +1,18 @@
+export default function ({ app }) {
+  if (app != undefined && app.$gtm != undefined) {
+    app.$gtm.push({
+      event: '',
+      event_name: '',
+      category: "",
+      files: "",
+      file_name: "",
+      file_path: "",
+      file_type: "",
+      location: "",
+      dataset_id: "",
+      version_id: "",
+      doi: "",
+      citation_type: ""
+    })
+  }
+}
\ No newline at end of file
diff --git a/middleware/documentationHubRedirects.js b/middleware/documentationHubRedirects.js
index 82470fe7..142004c7 100644
--- a/middleware/documentationHubRedirects.js
+++ b/middleware/documentationHubRedirects.js
@@ -1,9 +1,278 @@
-import getRedirectsMapping from "~/plugins/documentation-hub-redirects";
-import { propOr } from 'ramda'
-
 export default function ({ route, redirect }) {
-  const redirectsMapping = getRedirectsMapping()
-  const redirectUrls = propOr([], 'redirectUrls', redirectsMapping)
+  const redirectUrls = [
+    {
+        "oldUrl": "about/policies-and-standards/privacy-policy",
+        "newUrl": "https://docs.sparc.science/docs/policies"
+    },
+    {
+        "oldUrl": "about/policies-and-standards/terms-of-service",
+        "newUrl": "https://docs.sparc.science/docs/terms-of-service"
+    },
+    {
+        "oldUrl": "about/policies-and-standards/sparc-standards-process",
+        "newUrl": "https://docs.sparc.science/docs/sparc-standards-process-2"
+    },
+    {
+        "oldUrl": "about/sparc-help-center",
+        "newUrl": "https://docs.sparc.science"
+    },
+    {
+        "oldUrl": "help/instructions-to-use-the-map-core-scaffold-mapping-tool",
+        "newUrl": "https://docs.sparc.science/docs/map-core-scaffold-mapping-tools"
+    },
+    {
+        "oldUrl": "help/3lp5YMXqyHXAT57vFyWCe9",
+        "newUrl": "https://docs.sparc.science/docs/supported-browsers"
+    },
+    {
+        "oldUrl": "help/1lmX4FWezRPTCOfGsBATnt",
+        "newUrl": "https://docs.sparc.science/docs/instructions-for-sparc-investigators-to-cite-their-datasets-in-manuscripts-1"
+    },
+    {
+        "oldUrl": "help/the-sparc-data-and-resource-center",
+        "newUrl": "https://docs.sparc.science/docs/getting-started"
+    },
+    {
+        "oldUrl": "about/sparc-portal/sparc-roadmap",
+        "newUrl": "https://docs.sparc.science/docs/sparc-portal-roadmap"
+    },
+    {
+        "oldUrl": "help/sparc-platform-integrations",
+        "newUrl": "https://docs.sparc.science/docs/sparc-platform-integrations"
+    },
+    {
+        "oldUrl": "help/zQfzadwADutviJjT19hA5",
+        "newUrl": "https://docs.sparc.science/docs/accessing-public-datasets"
+    },
+    {
+        "oldUrl": "help/nih-sparc-confidentiality-disclosure-agreement",
+        "newUrl": "https://docs.sparc.science/docs/nih-sparc-confidentiality-disclosure-agreement"
+    },
+    {
+        "oldUrl": "help/35hnVPUSvTqu8szoRVcnfy",
+        "newUrl": "https://docs.sparc.science/discuss?isFAQ=true"
+    },
+    {
+        "oldUrl": "about/team-and-leadership/3Hd5YnMSH06kMH9dSTofrp",
+        "newUrl": "https://docs.sparc.science/docs/sparc-governance-regulations"
+    },
+    {
+        "oldUrl": "help/how-do-i-access-the-sparc-connectivity-knowledge-base-of-the-autonomic",
+        "newUrl": "https://docs.sparc.science/docs/accessing-the-sparc-connectivity-knowledge-base-of-the-autonomic-nervous-system-sckan"
+    },
+    {
+        "oldUrl": "help/sparc-drc-open-office-hours",
+        "newUrl": "https://docs.sparc.science/docs/sparc-drc-open-office-hours"
+    },
+    {
+        "oldUrl": "help/service-status-pages",
+        "newUrl": "https://docs.sparc.science/docs/portal-status"
+    },
+    {
+        "oldUrl": "help/information-for-developers",
+        "newUrl": "https://docs.sparc.science/docs/portal-status"
+    },
+    {
+        "oldUrl": "help/9JZsVzj2xZUMQuzx4RuU7",
+        "newUrl": "https://docs.sparc.science/docs/getting-started-1"
+    },
+    {
+        "oldUrl": "help/74tEteJrzNOLyExCtcdKJv",
+        "newUrl": "https://docs.sparc.science/docs/how-to-use-and-access-sparc-data"
+    },
+    {
+        "oldUrl": "help/3FXikFXC8shPRd8xZqhjVT",
+        "newUrl": "https://docs.sparc.science/docs/overview-of-sparc-dataset-format"
+    },
+    {
+        "oldUrl": "help/qvEcnv56c76V0JC0KvtSd",
+        "newUrl": "https://docs.sparc.science/docs/navigating-a-sparc-dataset"
+    },
+    {
+        "oldUrl": "help/accessing-published-simulations",
+        "newUrl": "https://docs.sparc.science/docs/accessing-published-simulations"
+    },
+    {
+        "oldUrl": "help/overview-of-gallery-viewer",
+        "newUrl": "https://docs.sparc.science/docs/gallery-viewer-overview"
+    },
+    {
+        "oldUrl": "help/overview-of-scaffold-viewer",
+        "newUrl": "https://docs.sparc.science/docs/scaffold-viewer-overview"
+    },
+    {
+        "oldUrl": "help/overview-of-integrated-maps-viewer",
+        "newUrl": "https://docs.sparc.science/docs/integrated-maps-viewer-overview"
+    },
+    {
+        "oldUrl": "help/information-on-organ-scaffolds",
+        "newUrl": "https://docs.sparc.science/docs/organ-scaffolds"
+    },
+    {
+        "oldUrl": "help/sparc-tutorials",
+        "newUrl": "https://docs.sparc.science/docs/sparc-tutorials"
+    },
+    {
+        "oldUrl": "help/sparc-portal-data-repository-structure",
+        "newUrl": "https://docs.sparc.science/docs/sparc-portal-data-repository-structure"
+    },
+    {
+        "oldUrl": "help/overview-of-image-viewer",
+        "newUrl": "https://docs.sparc.science/docs/image-viewer-overview"
+    },
+    {
+        "oldUrl": "help/overview-of-simulation-viewer",
+        "newUrl": "https://docs.sparc.science/docs/simulation-viewer-overview"
+    },
+    {
+        "oldUrl": "help/overview-of-segmentation-viewer",
+        "newUrl": "https://docs.sparc.science/docs/segmentation-viewer-overview"
+    },
+    {
+        "oldUrl": "help/demonstration-on-the-use-of-the-map-core-scaffold-mapping-tool-v0-16-0",
+        "newUrl": "https://docs.sparc.science/docs/use-of-the-map-core-scaffold-mapping-tool-v0160"
+    },
+    {
+        "oldUrl": "help/map-scaffold-mapping-tool-installation-guide",
+        "newUrl": "https://docs.sparc.science/docs/map-scaffold-mapping-tool-installation-guide"
+    },
+    {
+        "oldUrl": "help/publishing-a-flatmap-as-a-sparc-dataset",
+        "newUrl": "https://docs.sparc.science/docs/publishing-a-flatmap-as-a-sparc-dataset"
+    },
+    {
+        "oldUrl": "help/map-core-scaffold-mapping-tools",
+        "newUrl": "https://docs.sparc.science/docs/map-core-scaffold-mapping-tools"
+    },
+    {
+        "oldUrl": "help/7k8nEPuw3FjOq2HuS8OVsd",
+        "newUrl": "https://docs.sparc.science/docs/data-submission-overview"
+    },
+    {
+        "oldUrl": "help/guidelines-for-effective-titles-and-descriptions-for-sparc-datasets",
+        "newUrl": "https://docs.sparc.science/docs/guidelines-for-effective-titles-and-descriptions-for-sparc-datasets"
+    },
+    {
+        "oldUrl": "help/55odkPXI5HjfAr1CovdZvl",
+        "newUrl": "https://docs.sparc.science/docs/uploading-files-to-the-dat-core"
+    },
+    {
+        "oldUrl": "help/6Pf9VAiGc50aGIkhIiegiO",
+        "newUrl": "https://docs.sparc.science/docs/soda-software-to-organize-data-automatically"
+    },
+    {
+        "oldUrl": "help/59wrnT6knb7KuGPJeNgT8k",
+        "newUrl": "https://docs.sparc.science/docs/sawg-sparc-anatomical-working-group"
+    },
+    {
+        "oldUrl": "help/5CuQGs6lBnfSdzroVp0Etf",
+        "newUrl": "https://docs.sparc.science/docs/user-accounts-and-teams"
+    },
+    {
+        "oldUrl": "help/5pcAofIUjrx5ZJalTRbEkM",
+        "newUrl": "https://docs.sparc.science/docs/fair-image-segmentation-in-mbf-bioscience-software"
+    },
+    {
+        "oldUrl": "help/2D4nzgo7wy9Udqcr3DcrW9",
+        "newUrl": "https://docs.sparc.science/docs/connecting-mbf-bioscience-software-to-the-pennsieve-platform"
+    },
+    {
+        "oldUrl": "help/4iTKs1fdqMJHchgpyHOvRt",
+        "newUrl": "https://docs.sparc.science/docs/accessing-scicrunch-vocabulary-services"
+    },
+    {
+        "oldUrl": "help/1slXZSS2XtTYQsdY6mEJi5",
+        "newUrl": "https://docs.sparc.science/docs/creating-a-protocol"
+    },
+    {
+        "oldUrl": "help/how-to-clean-an-orcid-profile",
+        "newUrl": "https://docs.sparc.science/docs/how-to-clean-an-orcid-profile"
+    },
+    {
+        "oldUrl": "help/sparc-webinars",
+        "newUrl": "https://docs.sparc.science/docs/webinars"
+    },
+    {
+        "oldUrl": "help/sparc-promotional-resources",
+        "newUrl": "https://docs.sparc.science/docs/promotional-resources"
+    },
+    {
+        "oldUrl": "about/sparc-portal/6nqPLAgegexTuRSPsDi5nL",
+        "newUrl": "sparc-portal/metrics"
+    },
+    {
+        "oldUrl": "about/sparc-portal/4fImxDNc1drylUCHXH8PIp",
+        "newUrl": "https://docs.sparc.science/docs/portal-release-notes"
+    },
+    {
+        "oldUrl": "about/team-and-leadership/SWTEQctBGlSufKWaNIcVs",
+        "newUrl": "https://docs.sparc.science/docs/dat-core"
+    },
+    {
+        "oldUrl": "about/team-and-leadership/d5sQZFeHwJWWVEPSI1Tha",
+        "newUrl": "https://docs.sparc.science/docs/map-core"
+    },
+    {
+        "oldUrl": "about/team-and-leadership/knowledge-management-and-curation-core-k-core-information",
+        "newUrl": "https://docs.sparc.science/docs/k-core"
+    },
+    {
+        "oldUrl": "about/team-and-leadership/1O8agxobDfjtYq8FPuVX3x",
+        "newUrl": "https://docs.sparc.science/docs/sim-core"
+    },
+    {
+        "oldUrl": "about/team-and-leadership/3Hd5YnMSH06kMH9dSTofrp",
+        "newUrl": "https://docs.sparc.science/docs/operation-of-the-drc"
+    },
+    {
+        "oldUrl": "about/team-and-leadership/2yAkBWbFtk0iAnzyupaPG2",
+        "newUrl": "https://docs.sparc.science/docs/getting-started"
+    },
+    {
+        "oldUrl": "help/2qJHR2E1ozRqRvRFIiWWtJ",
+        "newUrl": "https://docs.sparc.science/docs/webinars"
+    },
+    {
+        "oldUrl": "help/map-core-scaffold-mapping-tools-annotation",
+        "newUrl": "https://docs.sparc.science/docs/map-core-scaffold-mapping-tools-annotation"
+    },
+    {
+        "oldUrl": "help/map-core-scaffold-mapping-tools-creating-dataset-structure",
+        "newUrl": "https://docs.sparc.science/docs/map-core-scaffold-mapping-tools-creating-dataset-structure"
+    },
+    {
+        "oldUrl": "help/map-core-scaffold-mapping-tools-demonstration-overview",
+        "newUrl": "https://docs.sparc.science/docs/map-core-scaffold-mapping-tools-demonstration-overview"
+    },
+    {
+        "oldUrl": "help/map-core-scaffold-mapping-tools-mapping-data",
+        "newUrl": "https://docs.sparc.science/docs/map-core-scaffold-mapping-tools-mapping-data"
+    },
+    {
+        "oldUrl": "help/map-core-scaffold-mapping-tools-provenance",
+        "newUrl": "https://docs.sparc.science/docs/map-core-scaffold-mapping-tools-provenance"
+    },
+    {
+        "oldUrl": "help/2022-sparc-fair-codeathon",
+        "newUrl": "https://sparc.science/news-and-events/events/sparc-fair-codeathon-showcase-2022/event-details"
+    },
+    {
+        "oldUrl": "help/2022-sparc-at-isan",
+        "newUrl": "https://sparc.science/news-and-events/events/2022-sparc-at-isan"
+    },
+    {
+        "oldUrl": "help/2021-sparc-at-society-for-neuroscience-annual-meeting",
+        "newUrl": "https://sparc.science/news-and-events/events/2021-sparc-at-society-for-neuroscience-annual-meeting/event-details"
+    },
+    {
+        "oldUrl": "help/2021-sparc-fair-codeathon",
+        "newUrl": "https://sparc.science/news-and-events/events/2021-sparc-fair-codeathon"
+    },
+    {
+        "oldUrl": "help/k20iaFK8YzOQ69nQEFQyJ",
+        "newUrl": "https://sparc.science/news-and-events/events/2020-sparc-ideas-lab"
+    }
+  ]
   redirectUrls.forEach(redirectUrl => {
     if (route.path.includes(redirectUrl.oldUrl)) {
       redirect(redirectUrl.newUrl)
diff --git a/middleware/verifyUserProfileComplete.js b/middleware/verifyUserProfileComplete.js
deleted file mode 100644
index 68a2859b..00000000
--- a/middleware/verifyUserProfileComplete.js
+++ /dev/null
@@ -1,14 +0,0 @@
-export default function ({ route, redirect, app, store }) {
-  const userToken = app.$cookies.get('user-token')  || store.getters['user/cognitoUserToken']
-  if (userToken) {
-    // If the user is logged in and their profile is incomplete then make sure they complete it. Otherwise, do not allow them to visit the welcome page again
-    const profileComplete = app.$cookies.get('profile-complete')
-    if (!profileComplete) {
-      if (route.name !== 'welcome') {
-        redirect("/welcome")
-      }
-    } else if (route.name === 'welcome') {
-      redirect("/")
-    }
-  }
-}
diff --git a/mixins/authenticated/index.js b/mixins/authenticated/index.js
new file mode 100644
index 00000000..298054df
--- /dev/null
+++ b/mixins/authenticated/index.js
@@ -0,0 +1,18 @@
+import auth from '@/services/auth'
+
+export default {
+  async beforeRouteEnter(to, from, next) {
+    // user info is only accessible on the client side
+    if (process.env.VUE_ENV === 'client') {
+      const user = await auth.user()
+      if (user != null) {
+        return next()
+      } else {
+        return next("/")
+      }
+    }
+    else {
+      next(false)
+    }
+  }
+}
diff --git a/mixins/dataset-info/index.js b/mixins/dataset-info/index.js
new file mode 100644
index 00000000..a3e6b4e9
--- /dev/null
+++ b/mixins/dataset-info/index.js
@@ -0,0 +1,18 @@
+import { isEmpty } from 'ramda'
+export default {
+  methods: {
+    /**
+     * Fetch dataset information from discover api with dataset id and version
+     */
+    getDatasetInfo: async function(axios, datasetId, datasetVersion, userToken) {
+      const url = `${process.env.discover_api_host}/datasets/${datasetId}`
+      var datasetUrl = datasetVersion ? `${url}/versions/${datasetVersion}` : url
+      if (!isEmpty(userToken) && userToken != null) {
+        datasetUrl += `?api_key=${userToken}`
+      }
+      return await axios.$get(datasetUrl).catch(error => {
+        console.log(`Could not get the dataset's info: ${error}`)
+      })
+    }
+  }
+}
diff --git a/mixins/doi-checker/index.js b/mixins/doi-checker/index.js
new file mode 100644
index 00000000..d4a044d1
--- /dev/null
+++ b/mixins/doi-checker/index.js
@@ -0,0 +1,29 @@
+export default {
+  data() {
+    return {
+      invalidDois: []
+    }
+  },
+  computed: {
+    showPrimaryPublications() {
+      return this.primaryPublications?.filter(publication => {
+        return !this.invalidDois.includes(publication.doi)
+      }).length > 0
+    },
+    showAssociatedPublications() {
+      return this.associatedPublications?.filter(publication => {
+        return !this.invalidDois.includes(publication.doi)
+      }).length > 0
+    },
+    showPreprints() {
+      return this.preprints?.filter(publication => {
+        return !this.invalidDois.includes(publication.doi)
+      }).length > 0
+    },
+  },
+  methods: {
+    onDoiInvalid(doi) {
+      this.invalidDois.push(doi)
+    }
+  }
+}
diff --git a/mixins/error-messages/index.js b/mixins/error-messages/index.js
index 6dedfb2f..b7cf7e1b 100644
--- a/mixins/error-messages/index.js
+++ b/mixins/error-messages/index.js
@@ -28,7 +28,10 @@ export default {
     discover: function() {
       return 'Sorry, we have encountered an unexpected error \
         while trying to load the information. Please try again later.'
-
-    }
+    },
+    metrics: function() {
+      return 'Sorry, we have encountered an unexpected error \
+        while trying to load the portal metrics. Please try again later.'
+    },
   }
 }
diff --git a/mixins/file-upload/index.js b/mixins/file-upload/index.js
index b48c91e4..4a0a0485 100644
--- a/mixins/file-upload/index.js
+++ b/mixins/file-upload/index.js
@@ -9,7 +9,7 @@ export default {
       limit: 1,
       allowVideos: false,
       file: {},
-    };
+    }
   },
   computed: {
     hasAttachment: function() {
@@ -28,23 +28,23 @@ export default {
       if (!file) {
         return
       }
-      const isImage = (file.raw.type === 'image/jpeg' || file.raw.type === 'image/png'|| file.raw.type === 'image/gif');
-      const isVideo = (file.raw.type === 'video/mp4');
-      const isFileSizeTooLarge = this.isFileSizeTooLarge(file);
+      const isImage = (file.raw.type === 'image/jpeg' || file.raw.type === 'image/png'|| file.raw.type === 'image/gif')
+      const isVideo = (file.raw.type === 'video/mp4')
+      const isFileSizeTooLarge = this.isFileSizeTooLarge(file)
       if (!isImage && !this.allowVideos) {
         this.$message(failMessage('Upload file must be an image!'));
         this.$refs.fileUploader.clearFiles()
-        return false;
+        return false
       }
       if (!isImage && !isVideo && this.allowVideos) {
-        this.$message(failMessage('Upload file must be an image or video!'));
+        this.$message(failMessage('Upload file must be an image or video!'))
         this.$refs.fileUploader.clearFiles()
-        return false;
+        return false
       }
       if (isFileSizeTooLarge) {
-        this.$message(failMessage(`Upload file size cannot exceed ${MAX_FILE_SIZE_IN_MB} MB!`));
+        this.$message(failMessage(`Upload file size cannot exceed ${MAX_FILE_SIZE_IN_MB} MB!`))
         this.$refs.fileUploader.clearFiles()
-        return false;
+        return false
       }
       this.file = file.raw
     },
@@ -60,11 +60,11 @@ export default {
     },
     beforeUpload(file)
     {
-      const isFileSizeTooLarge = this.isFileSizeTooLarge(file);
+      const isFileSizeTooLarge = this.isFileSizeTooLarge(file)
       if (isFileSizeTooLarge) {
-        this.$message(failMessage(`Upload file size cannot exceed ${MAX_FILE_SIZE_IN_MB} MB!`));
+        this.$message(failMessage(`Upload file size cannot exceed ${MAX_FILE_SIZE_IN_MB} MB!`))
       }
-      return !isFileSizeTooLarge;
+      return !isFileSizeTooLarge
     }
   }
-}
\ No newline at end of file
+}
diff --git a/mixins/marked/index.js b/mixins/marked/index.js
index 44f6482d..31fa4180 100644
--- a/mixins/marked/index.js
+++ b/mixins/marked/index.js
@@ -1,5 +1,7 @@
 import marked from 'marked'
 import youtubeEmbeddedSrc from '../youtube-embedded-src'
+import DOMPurify from 'isomorphic-dompurify'
+import axios from 'axios'
 
 /**
  * Modify the link renderer to add `target="blank"`
@@ -21,14 +23,18 @@ export const isAnchor = str => {
 export const isInternalLink = str => {
   return isAnchor(str)
     ? true
-    : str.includes(process.env.ROOT_URL) || str.startsWith('/')
+    : str.includes(process.env.ROOT_URL) || str.includes("sparc.science") || str.startsWith('/')
+}
+
+// docs.sparc.science is considered an internal link, but should always open in new tab
+export const opensInNewTab = link => {
+  return !isInternalLink(link)
 }
 
 renderer.link = function(href, title, text) {
   const html = linkRenderer.call(renderer, href, title, text)
-  const isInternal = isInternalLink(href)
 
-  return isInternal
+  return !opensInNewTab(href) 
     ? html
     : html.replace(/^<a /, '<a target="_blank" rel="nofollow" ')
 }
@@ -57,10 +63,7 @@ renderer.image = function(href, title, text) {
   }
 }
 
-marked.setOptions({
-  sanitize: true,
-  renderer
-})
+marked.setOptions({ renderer })
 
 let renderYoutube = function(href, title) {
   // for further reading on fluid sizing of videos: https://css-tricks.com/fluid-width-video/
@@ -85,8 +88,9 @@ export default {
      * @param {String} markdown
      * @returns {HTML}
      */
-    parseMarkdown: function(markdown = '') {
-      return marked(markdown)
+    parseMarkdown: function(markdown = '', purifyOptions={}) {
+      purifyOptions = {...purifyOptions, ADD_ATTR: ['target']}
+      return DOMPurify.sanitize(marked(markdown), purifyOptions)
     }
   }
 }
diff --git a/mixins/recaptcha/index.js b/mixins/recaptcha/index.js
new file mode 100644
index 00000000..3e761df1
--- /dev/null
+++ b/mixins/recaptcha/index.js
@@ -0,0 +1,43 @@
+export default {
+  data() {
+    return {
+      hasError: false
+    }
+  },
+  methods: {
+    /**
+     * Submit the form and validate
+     */
+    async onSubmit() {
+      this.hasError = false
+      this.$nuxt.$loading.start()
+      await this.verifyRecaptcha()
+      await this.$refs.submitForm.validate(async valid => {
+        if (!valid) {
+          this.$nuxt.$loading.finish()
+          return
+        }
+        if (!this.hasError) {
+          await this.sendForm()
+        }
+        this.$nuxt.$loading.finish()
+        await this.$recaptcha.reset()
+      })
+    },
+
+    async verifyRecaptcha() {
+      try {
+        const token = await this.$recaptcha.getResponse()
+        const response = await this.$axios.$post(
+          `/captcha-api/siteverify?secret=${process.env.RECAPTCHA_SECRET_KEY}&response=${token}`
+        ).then(() => {
+          return true
+        })
+        return response
+      } catch (error) {
+        this.hasError = true;
+        return
+      }
+    },
+  }
+}
diff --git a/mixins/request-download-file/index.js b/mixins/request-download-file/index.js
index dea06e71..6a25bf94 100644
--- a/mixins/request-download-file/index.js
+++ b/mixins/request-download-file/index.js
@@ -8,14 +8,16 @@ export default {
      */
     requestDownloadFile: function(downloadInfo) {
       const fileName = propOr('', 'name', downloadInfo)
-      const datasetVersionRegexp = /s3:\/\/pennsieve-prod-discover-publish-use1\/(?<datasetId>\d*)\/(?<version>\d*)\/(?<filePath>.*)/
+      const version = propOr('', 'version', downloadInfo)
+      //S3 Bucket is now dynamic but we do not have to catch it here as the 
+      //zipit api seems to handle it internally.
+      const datasetVersionRegexp = /s3:\/\/.*\/(?<datasetId>\d*)\/(?<filePath>.*)/
       const matches = downloadInfo.uri.match(datasetVersionRegexp)
-
       const payload = {
         data: {
           paths: [matches.groups.filePath],
           datasetId: matches.groups.datasetId,
-          version: matches.groups.version
+          version: version
         }
       }
       this.$axios.$post(process.env.zipit_api_host, payload).then(response => {
@@ -26,15 +28,17 @@ export default {
      * Request file contents via axios. This returns a promise which resolves to the contents of the file to then be used withing sparc-app (ie to display markdown)
      */
     requestFileContent(downloadInfo) {
+      const version = propOr('', 'version', downloadInfo)
       return new Promise(resolve => {
-        const datasetVersionRegexp = /s3:\/\/pennsieve-prod-discover-publish-use1\/(?<datasetId>\d*)\/(?<version>\d*)\/(?<filePath>.*)/
+        const datasetVersionRegexp = /s3:\/\/.*\/(?<datasetId>\d*)\/(?<filePath>.*)/
+        //S3 Bucket is now dynamic but we do not have to catch it here as the 
+        //zipit api seems to handle it internally.
         const matches = downloadInfo.uri.match(datasetVersionRegexp)
-
         const payload = {
           data: {
             paths: [matches.groups.filePath],
             datasetId: matches.groups.datasetId,
-            version: matches.groups.version
+            version: version
           }
         }
         this.$axios
diff --git a/nuxt.config.js b/nuxt.config.js
index f5eed931..0a0cb6b0 100644
--- a/nuxt.config.js
+++ b/nuxt.config.js
@@ -1,28 +1,44 @@
-export default {
+const config = {
   /**
    * Outside of localhost visibility
    */
   // server: {
-  //   host: '0.0.0.0'
+  //   host: '0.0.0.0',
   // },
   /*
    ** Headers of the page
    */
   head: {
-    title: 'SPARC Portal' || '',
+    title: 'SPARC Portal',
     meta: [
       { charset: 'utf-8' },
       { name: 'viewport', content: 'width=device-width, initial-scale=1' },
       {
         hid: 'description',
         name: 'description',
-        content: process.env.npm_package_description || ''
+        content: 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)',
       },
       {
-        hid: 'keywords', 
-        name: 'keywords', 
+        hid: 'keywords',
+        name: 'keywords',
         content: 'nih sparc, sparc program, stimulating peripheral activity to relieve conditions, common fund sparc, sparc, sparc initiative, sparc neuro, sparc science'
-      }
+      },
+      // default social cards information for site sharing url's
+      { hid: 'og:type', property: 'og:type', content: 'website' },
+      { hid: 'og:title', property: 'og:title', content: 'SPARC Portal' },
+      { hid: 'og:description', property: 'og:description', content: 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)' },
+      { hid: 'og:image', property: 'og:image',
+        content: 'https://images.ctfassets.net/6bya4tyw8399/7r5WTb92QnHkub8RsExuc1/2ac134de2ddfd65eb6316421df7578f9/sparc-logo-primary.png'
+      },
+      { hid: 'og:image:secure_url', property: 'og:image:secure_url',
+        content: 'https://images.ctfassets.net/6bya4tyw8399/7r5WTb92QnHkub8RsExuc1/2ac134de2ddfd65eb6316421df7578f9/sparc-logo-primary.png'
+      },
+      { hid: 'og:url', property: 'og:url', content: process.env.ROOT_URL || 'sparc.science' },
+      { hid: 't-type', name: 'twitter:card', content: 'summary_large_image' },
+      { name: 'twitter:site', content: '@sparc_science' },
+      { name: 'twitter:title', content: 'SPARC Portal' },
+      { name: 'twitter:image', content: 'https://images.ctfassets.net/6bya4tyw8399/7r5WTb92QnHkub8RsExuc1/2ac134de2ddfd65eb6316421df7578f9/sparc-logo-primary.png' },
+      { name: 'twitter:description', content: 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)' }
     ],
     link: [
       {
@@ -48,58 +64,44 @@ export default {
     zipit_api_host:
       process.env.ZIPIT_API_HOST || 'https://api.pennsieve.io/zipit/discover',
     osparc_host: process.env.OSPARC_HOST || 'https://osparc.io',
+    bitly_expand_endpoint: 'https://api-ssl.bitly.com/v4/expand',
     ctf_event_id: 'event',
     ctf_news_id: 'news',
     ctf_community_spotlight_item_id: 'communitySpotlight',
     ctf_news_and_events_id: 'newsAndEvents',
     ctf_resource_id: 'sparcPartners',
-    ctf_resource_hero_id: '3ImGx7UyDXPwM3oTag06nt',
     ctf_tools_and_resources_page_id: '1Yy2BEB0df8HxLNx2Ivsct',
-    ctf_help_id: 'helpDocument',
-    ctf_help_list_id: 'helpSection',
-    ctf_help_aws_id: 'zQfzadwADutviJjT19hA5',
     ctf_about_page_id: '4VOSvJtgtFv1PS2lklMcnS',
     ctf_about_portal_page_id: '2156L8jQgaifFNpgeylaQp',
     ctf_about_details_content_type_id: 'aboutPageSecondLevel',
-    ctf_about_details_page_types: ['Policies', 'Portal', 'Team', 'Get Involved', 'What We Offer'],
+    ctf_learn_more_item_id: 'learnMoreItem',
     ctf_what_we_offer_page_id: '4wuZ2gzxota1GLTFUXSLNb',
+    ctf_share_data_page_id: '5w2F52873w6g9TH4YMVxXW',
     ctf_team_and_leadership_page_id: '7EL9Plxo7q2GyCzg1sqIcg',
     ctf_get_involved_page_id: 'jxEBoBw2zUctuDaX2eeX1',
-    ctf_about_policies_page_id: '71a9NzpuHvaTpgTf9ir1xg',
-    ctf_contact_us_page_id: '7t2GZ5F74AdNRqBau4mp8S',
-    ctf_support_page_id: '59F0dM5goobqjw3TsqINRw',
+    ctf_contact_us_form_type_id: 'contactUsForm',
     ctf_home_page_id: '4qJ9WUWXg09FAUvCnbGxBY',
     ctf_news_and_events_page_id: '4IoMamTLRlN3OpxT1zgnU',
-    ctf_dataset_navigation_info_page_id: 'qvEcnv56c76V0JC0KvtSd',
-    ctf_dataset_format_info_page_id: '3FXikFXC8shPRd8xZqhjVT',
     ctf_project_id: 'sparcAward',
-    ctf_organ_id: 'organ',
-    ctf_filter_id: '6bya4tyw8399',
-    ctf_filters_dataset_id: '7fL88ABgKSB2tPJmysn2V',
-    ctf_filters_project_id: 'YVan5NSd4bgj2Q5WZdOVw',
-    ctf_filters_organ_id: '5Hhlb7Lf4yijMQUSBai1fh',
-    ctf_filters_image_id: '4R4zfdND13xLLGU9nPpNCD',
-    ctf_filters_simulation_id: '6qMQRugMyzeaUrTIPQDdF1',
     ctf_footer_copy_id: 'wpik0A2sDOy9IQEoKpkKG',
-    ctf_terms_id: '6XCER8v1TVVCoZdaBWg66t',
-    ctf_privacy_policy_id: '2p44GCn1rrWUETwTRF2ElS',
-    ctf_success_story_id: 'successStory',
-    ctf_documentation_hub_redirects_id: 'yhBSKvDSpBQbeHQWHgj9j',
-    ctf_sparc_login_modal_id: '4FSEoB6SW8xrEAsh4t0vGt',
+    ctf_contact_us_form_options_id: '79rwRA0rUqUj6rc913BFsz',
+    ctf_portal_notification_entry_id: 'XiVlrkTXeKxTyN1Q2oY2Q',
     CTF_SPACE_ID: process.env.CTF_SPACE_ID,
     CTF_CDA_ACCESS_TOKEN: process.env.CTF_CDA_ACCESS_TOKEN,
-    CTF_API_HOST: process.env.CTF_API_HOST,
+    CTF_API_HOST: process.env.CTF_API_HOST || 'preview.contentful.com',
     DEPLOY_ENV: process.env.DEPLOY_ENV || 'development',
     ALGOLIA_API_KEY: process.env.ALGOLIA_API_KEY,
     ALGOLIA_APP_ID: process.env.ALGOLIA_APP_ID,
     ALGOLIA_INDEX: process.env.ALGOLIA_INDEX || 'k-core_dev',
-    ALGOLIA_INDEX_PUBLISHED_TIME_DESC: process.env.ALGOLIA_INDEX_PUBLISHED_TIME_DESC || 'k-core_dev_published_time_desc',
-    ALGOLIA_INDEX_PUBLISHED_TIME_ASC: process.env.ALGOLIA_INDEX_PUBLISHED_TIME_ASC || 'k-core_dev_published_time_asc',
+    ALGOLIA_INDEX_VERSION_PUBLISHED_TIME_DESC: process.env.ALGOLIA_INDEX_VERSION_PUBLISHED_TIME_DESC || 'k-core_dev_version_published_time_desc',
+    ALGOLIA_INDEX_VERSION_PUBLISHED_TIME_ASC: process.env.ALGOLIA_INDEX_VERSION_PUBLISHED_TIME_ASC || 'k-core_dev_version_published_time_asc',
     ALGOLIA_INDEX_ALPHABETICAL_A_Z: process.env.ALGOLIA_INDEX_ALPHABETICAL_A_Z || 'k-core_dev_alphabetical_a_z',
     ALGOLIA_INDEX_ALPHABETICAL_Z_A: process.env.ALGOLIA_INDEX_ALPHABETICAL_Z_A || 'k-core_dev_alphabetical_z_a',
+    BITLY_ACCESS_TOKEN: process.env.BITLY_ACCESS_TOKEN,
     BL_API_URL: 'https://sparc.biolucida.net/api/v1/',
     BL_SERVER_URL: 'https://sparc.biolucida.net',
     BL_SHARE_LINK_PREFIX: 'https://sparc.biolucida.net/image?c=',
+    MBF_SPARC_API: process.env.MBF_SPARC_API || 'https://mbfsparcapi.com',
     NL_LINK_PREFIX: 'https://sparc.biolucida.net:8081',
     ROOT_URL: process.env.ROOT_URL || 'http://localhost:3000',
     max_download_size: parseInt(process.env.MAX_DOWNLOAD_SIZE || '5000000000'),
@@ -112,23 +114,28 @@ export default {
     AWS_OAUTH_REDIRECT_SIGN_IN_URL: process.env.AWS_OAUTH_REDIRECT_SIGN_IN_URL || 'http://localhost:3000',
     AWS_OAUTH_REDIRECT_SIGN_OUT_URL: process.env.AWS_OAUTH_REDIRECT_SIGN_OUT_URL || 'http://localhost:3000',
     AWS_OAUTH_RESPONSE_TYPE: process.env.AWS_OAUTH_RESPONSE_TYPE || "token",
-    SHOW_LOGIN_FEATURE: process.env.SHOW_LOGIN_FEATURE || 'false',
     LOGIN_API_URL: process.env.LOGIN_API_URL || 'https://api.pennsieve.net',
+    PENNSIEVE_API_VERSION_2: process.env.PENNSIEVE_API_VERSION_2 || 'https://api2.pennsieve.net',
     ORCID_API_URL: process.env.ORCID_API_URL || 'https://pub.orcid.org/v2.1',
-    GOOGLE_ANALYTICS_GA4: process.env.GOOGLE_ANALYTICS_GA4,
     GOOGLE_ANALYTICS_UA: process.env.GOOGLE_ANALYTICS_UA,
-    SHOW_TIMESERIES_VIEWER: process.env.SHOW_TIMESERIES_VIEWER || false
+    SHOW_TIMESERIES_VIEWER: process.env.SHOW_TIMESERIES_VIEWER || false,
+    RECAPTCHA_SITE_KEY: process.env.RECAPTCHA_SITE_KEY,
+    RECAPTCHA_SECRET_KEY: process.env.RECAPTCHA_SECRET_KEY,
+    METRICS_URL: process.env.METRICS_URL || 'https://metrics.sparc.science',
+    METACELL_SDS_VIEWER_URL: process.env.METACELL_SDS_VIEWER_URL || 'https://metacell.github.io/sds-viewer',
+    SHOW_HIERARCHAL_FACETS: process.env.SHOW_HIERARCHAL_FACETS || 'false',
+    SHOW_SDS_VIEWER: process.env.SHOW_SDS_VIEWER || 'false',
+    SHOW_DATASET_SUBMISSION_FEATURE: process.env.SHOW_DATASET_SUBMISSION_FEATURE || 'false',
+    GOOGLE_TAG_MANAGER_ID: process.env.GOOGLE_TAG_MANAGER_ID || 'GTM-TPT2CVCS'
   },
 
   serverMiddleware: [
-    // Will register redirect-ssl npm package
-    'redirect-ssl'
   ],
 
   /*
-   ** Customize the progress-bar color
+   ** Customize the loading component
    */
-  loading: { color: '#fff' },
+  loading: '@/components/Loading/Loading.vue',
 
   /*
    ** Customize router classes globally
@@ -136,18 +143,13 @@ export default {
   router: {
     linkActiveClass: 'active-link',
     extendRoutes(routes) {
-      // Redirects
-      routes.push({
-        path: '/submit_data.html',
-        redirect: '/help/7k8nEPuw3FjOq2HuS8OVsd'
-      })
       routes.push({
         name: 'version',
         path: '/datasets/:datasetId/version/:version',
         component: '@/pages/datasets/_datasetId.vue'
       })
     },
-    middleware: ['verifyUserProfileComplete', 'documentationHubRedirects', 'signOutRedirect']
+    middleware: ['documentationHubRedirects', 'signOutRedirect', 'clearDatalayer']
   },
   /*
    ** Global CSS
@@ -160,9 +162,6 @@ export default {
     '@/plugins/bootstrap',
     '@/plugins/contentful',
     '@/plugins/amplify',
-    '@/plugins/documentation-hub-redirects',
-    "@/plugins/vue-gtag.client.js",
-    { src: '@/plugins/persisted-state', mode: 'client' },
     { src: '@/plugins/postscribe', mode: 'client' },
     { src: '@/plugins/system-design-components', mode: 'client' },
     { src: '@/plugins/tsviewer', mode: 'client' }
@@ -183,12 +182,59 @@ export default {
    ** Nuxt.js modules
    */
   modules: [
+    '@nuxtjs/gtm',
     '@nuxtjs/axios',
     '@nuxtjs/robots',
     'cookie-universal-nuxt',
     '@miyaoka/nuxt-twitter-widgets-module',
-    'vue-social-sharing/nuxt'
+    'vue-social-sharing/nuxt',
+    '@nuxtjs/proxy',
+    ['@nuxtjs/recaptcha', {
+      siteKey: process.env.RECAPTCHA_SITE_KEY,
+      version: "2"
+    }]
   ],
+  axios: {
+    proxy: true
+  },
+  gtm: {
+    id: 'GTM-TPT2CVCS',
+    enabled: true,
+    debug: true,
+
+    layer: 'dataLayer',
+    variables: {},
+
+    pageTracking: true,
+    pageViewEventName: 'nuxtRoute',
+
+    autoInit: true,
+    respectDoNotTrack: true,
+
+    scriptId: 'gtm-script',
+    scriptDefer: false,
+    scriptURL: 'https://www.googletagmanager.com/gtm.js',
+    crossOrigin: false,
+
+    noscript: true,
+    noscriptId: 'gtm-noscript',
+    noscriptURL: 'https://www.googletagmanager.com/ns.html'
+  },
+  publicRuntimeConfig: {
+    gtm: {
+      id: process.env.GOOGLE_TAG_MANAGER_ID,
+      enabled: process.env.ROOT_URL == 'http://localhost:3000' ? false : true,
+      debug: true,
+    }
+  },
+  proxy: {
+    "/captcha-api/": {
+      target: "https://www.google.com/recaptcha/api",
+      pathRewrite: {
+        "^/captcha-api": ""
+      }
+    }
+  },
   /*
    ** robots.txt
    */
@@ -230,5 +276,14 @@ export default {
         removeEmptyElements: true
       }
     }
-  }
+  },
+}
+
+if (process.env.DISABLE_REDIRECT_SSL !== 'true') {
+  //Need to set a flag to disable redirect ssl for e2e testing
+  //on github action. 
+  config.serverMiddleware.push('redirect-ssl');
 }
+
+
+export default config
diff --git a/package.json b/package.json
index 68bb20a7..3ed1229d 100644
--- a/package.json
+++ b/package.json
@@ -14,25 +14,30 @@
     "lintfix": "eslint --fix --ext .js,.vue --ignore-path .gitignore .",
     "generate-icons": "vsvg -s ./static/icons-svg -t ./static/icons-js",
     "test": "jest",
-    "test:debug": "node --inspect node_modules/.bin/jest --runInBand"
+    "test:debug": "node --inspect node_modules/.bin/jest --runInBand",
+    "test-cypress": "cypress run",
+    "test-run-e2e": "cypress run --record"
   },
   "dependencies": {
-    "@abi-software/flatmapvuer": "0.3.10",
-    "@abi-software/gallery": "0.3.1",
-    "@abi-software/mapintegratedvuer": "0.3.9-fixes-2",
+    "@abi-software/gallery": "0.3.2",
+    "@abi-software/mapintegratedvuer": "0.6.7",
     "@abi-software/plotvuer": "^0.3.0",
-    "@abi-software/scaffoldvuer": "0.1.55",
-    "@abi-software/simulationvuer": "^0.6.5",
+    "@abi-software/simulationvuer": "0.6.5",
     "@aws-amplify/auth": "^4.4.4",
     "@aws-amplify/core": "^4.4.2",
     "@miyaoka/nuxt-twitter-widgets-module": "^0.0.1",
-    "@nih-sparc/sparc-design-system-components": "^0.26.26",
+    "@nih-sparc/sparc-design-system-components": "^0.27.4",
     "@nuxtjs/axios": "^5.8.0",
     "@nuxtjs/google-analytics": "^2.2.3",
+    "@nuxtjs/gtm": "^2.4.0",
+    "@nuxtjs/proxy": "^2.1.0",
+    "@nuxtjs/recaptcha": "^1.1.1",
     "@nuxtjs/robots": "^2.4.2",
     "@vue/shared": "^3.2.37",
     "algoliasearch": "^4.9.3",
     "babel-eslint": "^10.0.3",
+    "chart.js": "^2.9.4",
+    "chartjs-plugin-datalabels": "1.0.0",
     "contentful": "^7.10.0",
     "cookie-universal-nuxt": "^2.1.1",
     "core-js": "3.25.1",
@@ -43,6 +48,7 @@
     "eslint-loader": "^3.0.3",
     "eslint-plugin-prettier": "^3.1.2",
     "eslint-plugin-vue": "^6.1.2",
+    "isomorphic-dompurify": "0.19.0",
     "js-file-download": "^0.4.12",
     "marked": "^0.7.0",
     "nuxt": "^2.12.1",
@@ -54,25 +60,29 @@
     "striptags": "^3.2.0",
     "tsviewer": "^0.1.0",
     "vue": "^2.6.10",
+    "vue-chartjs": "^3.5.1",
     "vue-clipboard2": "^0.3.1",
     "vue-gtag": "1.16.1",
     "vue-infinite-loading": "^2.4.4",
     "vue-meta": "^2.3.2",
     "vue-social-sharing": "^3.0.4",
-    "vue-svgicon": "^3.2.6",
-    "vuex-persistedstate": "^4.1.0"
+    "vue-svgicon": "^3.2.6"
   },
   "devDependencies": {
     "@nuxt/typescript-build": "^0.5.6",
     "@types/node": "^13.7.0",
     "@vue/test-utils": "1.1.0",
     "babel-jest": "^24.1.0",
+    "cypress": "12.17.4",
     "jest": "^24.1.0",
     "sass": "^1.18.0",
     "sass-loader": "^7.1.0",
     "vue-jest": "^4.0.0-0"
   },
+  "resolutions": {
+    "maplibre-gl": "2.4.0"
+  },
   "engines": {
-    "node": "12.13.1"
+    "node": "14.17.6"
   }
 }
diff --git a/pages/about/_aboutDetailsId.vue b/pages/about/_aboutDetailsId.vue
index 99c0c954..5e6852a9 100644
--- a/pages/about/_aboutDetailsId.vue
+++ b/pages/about/_aboutDetailsId.vue
@@ -19,11 +19,15 @@
       </div>
       <div v-if="aboutDetailsItem.fields.learnMore" class="subpage">
         <h1 class="heading1 mb-16">Learn More</h1>
-        <learn-more-card
-          v-for="(item, index) in aboutDetailsItem.fields.learnMore"
-          :key="`${item}-${index}`"
-          :about-details-item="item"
-        />
+        <template v-for="(item, index) in aboutDetailsItem.fields.learnMore">
+          <div :key="`${item}-${index}`">
+            <learn-more-card
+              :about-details-item="item"
+              :parent-path="slug"
+            />
+            <hr v-if="aboutDetailsItem.fields.learnMore.length > 1 && index != aboutDetailsItem.fields.learnMore.length - 1" />
+          </div>
+        </template>
       </div>
     </div>
   </div>
@@ -71,6 +75,11 @@ export default {
   mixins: [MarkedMixin],
 
   async asyncData({ params, redirect }) {
+    if (params.aboutDetailsId == 'metrics') {
+      redirect({
+        name: `about-metrics`
+      })
+    }
     const aboutDetailsItem = await getAboutDetailsItem(params.aboutDetailsId)
 
     // Redirect to the friendly URL page, if this page has a slug
@@ -92,7 +101,7 @@ export default {
           label: 'Home'
         },
         {
-          label: 'About',
+          label: 'About SPARC',
           to: {
             name: 'about'
           }
@@ -101,6 +110,19 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.aboutDetailsItem.fields.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.aboutDetailsItem.fields.title,
+        },
+      ]
+    }
+  },
+
   methods: {
     /**
      * Copy file URL to clipboard
diff --git a/pages/about/about-sparc/index.vue b/pages/about/about-sparc/index.vue
index 440cba8f..3face106 100644
--- a/pages/about/about-sparc/index.vue
+++ b/pages/about/about-sparc/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="page-data">
-    <breadcrumb :breadcrumb="breadcrumb" title="About SPARC" />
+    <breadcrumb :breadcrumb="breadcrumb" title="Search" />
     <div class="container">
       <div class="search-tabs__container">
         <h3>
@@ -125,15 +125,14 @@ const sortOptions = [
   },
 ]
 
-const fetchSearchData = async function(query, limit, skip, sortOrder, types) {
+const fetchSearchData = async function(query, limit, skip, sortOrder, contentType) {
   return client
       .getEntries({
-        content_type: 'aboutPageSecondLevel',
+        content_type: contentType,
         query: query,
         limit: limit,
         skip: skip,
-        order: sortOrder,
-        'fields.type[in]' : types
+        order: sortOrder
       })
       .then(async response => {
         return response
@@ -151,8 +150,7 @@ export default {
   },
 
   async asyncData({ route, env }) {
-    const detailsTypes = env.ctf_about_details_page_types.filter(type => type !== 'Policies').toString()
-    let searchData = await fetchSearchData(route.query.search, 10, 0, 'fields.title', detailsTypes)
+    let searchData = await fetchSearchData(route.query.search, 10, 0, 'fields.title', env.ctf_learn_more_item_id)
     return {
       searchData
     }
@@ -171,7 +169,7 @@ export default {
           }
         },
         {
-          label: 'About',
+          label: 'About SPARC',
           to: {
             name: 'about'
           }
@@ -180,19 +178,29 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.searchTypes[0].label,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.searchTypes[0].label,
+        },
+      ]
+    }
+  },
+
   watch: {
     '$route.query': {
       handler: async function() {
-        this.searchData = await fetchSearchData(this.$route.query.search, 10, 0, this.sortOrder, this.detailsTypes)
+        this.searchData = await fetchSearchData(this.$route.query.search, 10, 0, this.sortOrder, process.env.ctf_learn_more_item_id)
       },
       immediate: true
     },
   },
 
   computed: {
-    detailsTypes: function() {
-      return process.env.ctf_about_details_page_types.filter(type => type !== 'Policies').toString()
-    },
     curSearchPage: function() {
       return this.tableData.skip / this.tableData.limit + 1
     },
@@ -208,15 +216,15 @@ export default {
     async onPaginationPageChange(page) {
       const { limit } = this.searchData
       const offset = (page - 1) * limit
-      this.searchData = await fetchSearchData(this.$route.query.search, limit, offset, this.sortOrder, this.detailsTypes)
+      this.searchData = await fetchSearchData(this.$route.query.search, limit, offset, this.sortOrder, process.env.ctf_learn_more_item_id)
     },
     async onPaginationLimitChange(limit) {
       const newLimit = limit === 'View All' ? this.this.searchData.total : limit
-      this.searchData = await fetchSearchData(this.$route.query.search, newLimit, 0, this.sortOrder, this.detailsTypes)
+      this.searchData = await fetchSearchData(this.$route.query.search, newLimit, 0, this.sortOrder, process.env.ctf_learn_more_item_id)
     },
     async onSortOptionChange(option) {
       this.selectedSortOption = option
-      this.searchData = await fetchSearchData(this.$route.query.search, this.searchData.limit, 0, this.sortOrder, this.detailsTypes)
+      this.searchData = await fetchSearchData(this.$route.query.search, this.searchData.limit, 0, this.sortOrder, process.env.ctf_learn_more_item_id)
     }
   }
 }
@@ -298,7 +306,6 @@ export default {
     text-transform: none;
   }
   &:hover,
-  &:focus,
   &.active {
     color: white;
     background-color: $purple;
diff --git a/pages/about/get-involved/_aboutDetailsId.vue b/pages/about/get-involved/_aboutDetailsId.vue
index 643460b8..def4335c 100644
--- a/pages/about/get-involved/_aboutDetailsId.vue
+++ b/pages/about/get-involved/_aboutDetailsId.vue
@@ -83,7 +83,7 @@ export default {
           }
         },
         {
-          label: 'About',
+          label: 'About SPARC',
           to: {
             name: 'about'
           }
@@ -98,6 +98,19 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.aboutDetailsItem.fields.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.aboutDetailsItem.fields.title,
+        },
+      ]
+    }
+  },
+
   methods: {
     /**
      * Copy file URL to clipboard
diff --git a/pages/about/get-involved/index.vue b/pages/about/get-involved/index.vue
index 2f550d98..182b7309 100644
--- a/pages/about/get-involved/index.vue
+++ b/pages/about/get-involved/index.vue
@@ -16,12 +16,15 @@
       </div>
       <div v-if="learnMore" class="subpage px-32 mb-0">
         <div class="heading1 mb-16">Learn More</div>
-        <learn-more-card
-          v-for="(item, index) in learnMore"
-          :key="`${item}-${index}`"
-          :about-details-item="item"
-          :parent-path="slug"
-        />
+        <template v-for="(item, index) in learnMore">
+          <div :key="`${item}-${index}`">
+            <learn-more-card
+              :about-details-item="item"
+              :parent-path="slug"
+            />
+            <hr v-if="learnMore.length > 1 && index != learnMore.length - 1" />
+          </div>
+        </template>
       </div>
     </div>
   </div>
@@ -74,7 +77,7 @@ export default {
           label: 'Home'
         },
         {
-          label: 'About',
+          label: 'About SPARC',
           to: {
             name: 'about'
           }
@@ -83,6 +86,24 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.summary ? this.summary : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
+
   methods: {
     /**
      * Copy file URL to clipboard
@@ -107,14 +128,28 @@ export default {
 .page-data {
   background-color: $background;
 }
-.heading1 {
-  font-weight: 300;
-}
-
 hr {
   opacity: 0.3;
 }
-h1 {
-  font-weight: 300;
+::v-deep h1 {
+  font-size:2rem;
+  font-weight:500;
+  line-height:2.75rem;
+}
+
+::v-deep h2 {
+  font-size:1.5rem;
+  font-weight:500;
+  line-height:2.25rem;
+}
+
+::v-deep h3 {
+  font-size:1rem;
+  font-weight:500;
+  line-height:1.875rem;
+}
+
+::v-deep img {
+  width: 100%;
 }
 </style>
diff --git a/pages/about/index.vue b/pages/about/index.vue
index 6253906e..230cd734 100644
--- a/pages/about/index.vue
+++ b/pages/about/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="about-page pb-16">
-    <breadcrumb :breadcrumb="breadcrumb" title="About" />
+    <breadcrumb :breadcrumb="breadcrumb" title="About SPARC" />
     <page-hero v-if="heroCopy">
       <h1>{{ pageTitle }}</h1>
       <!-- eslint-disable vue/no-v-html -->
@@ -8,21 +8,11 @@
       <div v-html="parseMarkdown(heroCopy)" />
     </page-hero>
     <div class="page-wrap container">
-      <div class="row">
-        <div class="col">
-          <div
-            class="about-page-text mt-32"
-            v-html="parseMarkdown(overview)"
-          />
-        </div>
-      </div>
-
       <paper
         class="row mt-32"
         :text="parseMarkdown(sparcPortal)"
-        :button-text="' About the SPARC Portal '"
-        :button-link="aboutLink(aboutPortalPageId)"
-        :img-src="sparcPortalImage ? sparcPortalImage.fields.file.url : null"
+        :button-text="' View The Roadmap '"
+        button-link-external="https://docs.sparc.science/docs/sparc-portal-roadmap"
       />
 
       <div class="row mt-32">
@@ -35,36 +25,46 @@
         <paper
           class="row-item"
           :text="parseMarkdown(teamLeadership)"
-          :button-text="' Team & Leadership '"
+          :button-text="' Who We Are '"
           :button-link="aboutLink(teamAndLeadershipPageId)"
         />
         <paper
           class="row-item"
           :text="parseMarkdown(getInvolved)"
-          :button-text="' Get Involved '"
+          :button-text="' Help Us Grow '"
           :button-link="aboutLink(getInvolvedPageId)"
         />
       </div>
 
-      <div class="row mt-32 about-page-border">
-        <img
-          v-if="sparcPortalImage"
-          slot="image"
-          class="portal-image"
-          :src="communitySpotlightImage.fields.file.url"
+      <div class="gallery-items-container p-32 mt-32">
+        <div class="heading2 mb-16">Portal Metrics</div>
+        <gallery
+          galleryItemType="metrics"
+          :items="metricsItems"
+        />
+        <nuxt-link
+          to="about/metrics"
+        >
+          <el-button class="secondary mt-16">
+            View All Metrics
+          </el-button>
+        </nuxt-link>
+      </div>
+
+      <div class="gallery-items-container p-32 mt-32">
+        <div class="heading2 mb-16">Highlights</div>
+        <gallery
+          galleryItemType="highlights"
+          :cardWidth="68"
+          :items="highlightsItems"
+        />
+      </div>
+
+      <div class="gallery-items-container p-32 mt-32">
+        <div
+          class="about-page-text"
+          v-html="parseMarkdown(overview)"
         />
-        <div class="subpage-col midnightblue-background">
-          <div
-            class="about-page-text white-text"
-            v-html="parseMarkdown(communitySpotlight)"
-          />
-          <NuxtLink
-            class="margin-top-auto"
-            to="/news-and-events/community-spotlight"
-          >
-            <el-button class="secondary"> View Spotlight </el-button>
-          </NuxtLink>
-        </div>
       </div>
     </div>
   </div>
@@ -74,11 +74,13 @@
 import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
 import PageHero from '@/components/PageHero/PageHero.vue'
 import Paper from '@/components/Paper/Paper.vue'
+import Gallery from '~/components/Gallery/Gallery.vue'
 
 import createClient from '@/plugins/contentful.js'
 
 import ContentfulErrorHandle from '@/mixins/contentful-error-handle'
 import MarkedMixin from '@/mixins/marked'
+import { getPreviousMonth } from '@/utils/common'
 
 const client = createClient()
 
@@ -88,7 +90,8 @@ export default {
   components: {
     Breadcrumb,
     PageHero,
-    Paper
+    Paper,
+    Gallery
   },
 
   mixins: [ContentfulErrorHandle, MarkedMixin],
@@ -121,6 +124,8 @@ export default {
           label: 'Home'
         }
       ],
+      metricsItems: [],
+      highlightsItems: [],
       projectId: process.env.ctf_project_id,
       heroImage: {},
       futurePlans: '',
@@ -131,6 +136,89 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.pageTitle,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.pageTitle,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.heroCopy ? this.heroCopy : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
+
+  async fetch() {
+    const day = new Date().getDate().toString().padStart(2, "0")
+    let month = new Date().getMonth() + 1
+    month = month.toString().padStart(2, "0")
+    const year = new Date().getFullYear()
+    let totalDownloads, downloadsLastMonth, totalContributors, newContributors = 0
+    await this.$axios
+      .$get(`${process.env.METRICS_URL}/pennsieve?year=${year}&month=${month}`)
+      .then((response) => {
+        const metrics = response[0]
+        totalContributors = parseInt(metrics['number_of_sparc_users_overall']['N'])
+        newContributors = parseInt(metrics['number_of_new_sparc_users_last_quarter']['N'])
+        downloadsLastMonth = parseInt(metrics['number_of_sparc_downloads_last_mo']['N'])
+      }).catch(() => {
+        const lastMonthsDate = getPreviousMonth()
+        this.$axios
+          .$get(`${process.env.METRICS_URL}/pennsieve?year=${lastMonthsDate.year}&month=${lastMonthsDate.month}`)
+          .then((response) => {
+            const metrics = response[0]
+            totalContributors = parseInt(metrics['number_of_sparc_users_overall']['N'])
+            newContributors = parseInt(metrics['number_of_new_sparc_users_last_quarter']['N'])
+            downloadsLastMonth = parseInt(metrics['number_of_sparc_downloads_last_mo']['N'])
+          }).catch((e) => {
+          console.log("ERROR RETRIEVING CONTRIBUTORS: ", e)
+          })
+        })
+    await this.$axios
+      .$get(`${process.env.discover_api_host}/metrics/dataset/downloads/summary?startDate=2020-01-01&endDate=${year}-${month}-${day}`)
+      .then((data) => {
+        totalDownloads = 0
+        data.forEach(item => {
+          if (item['origin'] === "SPARC") {
+            totalDownloads += parseInt(item['downloads'])
+          }
+        })
+      })
+      .catch((e) => {
+        console.log("ERROR RETRIEVING DOWNLOADS: ", e)
+      })
+    await client.getEntries({
+        content_type: process.env.ctf_news_id,
+        order: '-fields.publishedDate',
+        limit: '999',
+        'fields.subject': 'Highlight'
+      })
+      .then(({ items })=> {
+        this.highlightsItems = items
+      })
+      .catch(() => {
+        console.log("ERROR RETRIEVING HIGHLIGHTS")
+      })
+    this.metricsItems = [
+      {
+        title: 'Total Downloads',
+        data: `${totalDownloads}`,
+        subData: `(${downloadsLastMonth} last month)`
+      },
+      {
+        title: 'Dataset Contributors',
+        data: `${totalContributors}`,
+        subData: `(${newContributors} new in the last month)`
+      }
+    ]
+  },
+
   methods: {
     /**
      * Compute the link to the help article
@@ -152,31 +240,6 @@ export default {
 .about-page {
   background-color: $background;
 }
-.page {
-  display: flex;
-  margin-top: 7rem;
-
-  p {
-    color: #606266;
-  }
-}
-
-.subpage-col {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  background-color: white;
-  padding: 2rem;
-
-  @media screen and (max-width: 767px) {
-    margin-top: 0;
-  }
-  .about-page-text {
-    @media screen and (max-width: 767px) {
-      margin-left: 0;
-    }
-  }
-}
 
 .row-item {
   width: 30%;
@@ -219,4 +282,27 @@ export default {
 .about-page-border {
   border: 1px solid $lineColor2;
 }
+.gallery-items-container {
+  background-color: white;
+  border: 1px solid $lineColor1;
+}
+
+::v-deep h1 {
+  font-size:2rem;
+  font-weight:500;
+  line-height:2.75rem;
+}
+
+::v-deep h2 {
+  font-size:1.5rem;
+  font-weight:500;
+  line-height:2.25rem;
+}
+
+::v-deep h3 {
+  font-size:1rem;
+  font-weight:500;
+  line-height:1.875rem;
+}
+
 </style>
diff --git a/pages/about/metrics/index.vue b/pages/about/metrics/index.vue
new file mode 100644
index 00000000..5f0c335c
--- /dev/null
+++ b/pages/about/metrics/index.vue
@@ -0,0 +1,300 @@
+<template>
+  <div class="page-data pb-16">
+    <breadcrumb :breadcrumb="breadcrumb" :title="searchType.label" />
+    <div class="container">
+      <div class="search-tabs__container">
+        <h3>
+          Browse Metrics
+        </h3>
+        <ul class="search-tabs">
+          <li v-for="type in metricsTypes" :key="type.label">
+            <nuxt-link
+              class="search-tabs__button"
+              :class="{ active: type.type === $route.query.metricsType }"
+              :to="{
+                name: 'about-metrics',
+                query: {
+                  ...$route.query,
+                  metricsType: type.type,
+                }
+              }"
+            >
+              {{ type.label }}
+            </nuxt-link>
+          </li>
+        </ul>
+      </div>
+    </div>
+    <div class="container mt-16">
+      <component
+        :is="metricsComponent"
+        :metrics-data="metricsData"
+      />
+    </div>
+  </div>
+</template>
+<script>
+
+import {
+  compose,
+  defaultTo,
+  find,
+  head,
+  pathOr,
+  propEq,
+  propOr
+} from 'ramda'
+import { getPreviousMonth } from '@/utils/common'
+import ErrorMessages from '@/mixins/error-messages'
+import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
+
+const UserBehaviorsMetrics = () =>
+  import('@/components/Metrics/UserBehaviors.vue')
+const ScientificContributionMetrics = () =>
+  import('@/components/Metrics/ScientificContribution.vue')
+
+const metricsComponents = {
+  userBehaviors: UserBehaviorsMetrics,
+  scientificContribution: ScientificContributionMetrics,
+}
+
+const metricsTypes = [
+  {
+    label: 'Scientific Contribution',
+    type: 'scientificContribution',
+    dataSource: ''
+  },
+  {
+    label: 'User Behaviors',
+    type: 'userBehaviors',
+    dataSource: ''
+  }
+]
+
+const fetchMetrics = async (axios, month, year) => {
+  let ga4MetricsData = await axios.get(`${process.env.METRICS_URL}/ga4?year=${year}&month=${month}`)
+  ga4MetricsData = ga4MetricsData.data[0]
+  let pennsieveMetricsData = await axios.get(`${process.env.METRICS_URL}/pennsieve?year=${year}&month=${month}`)
+  pennsieveMetricsData = pennsieveMetricsData.data[0]
+  let sparcMetricsData = await axios.get(`${process.env.METRICS_URL}/sparc?year=${year}&month=${month}`)
+  sparcMetricsData = sparcMetricsData.data[0]
+
+  const top5AnatomicalStructuresObject = sparcMetricsData['anatomical_structures_breakdown']['M']
+  let top5AnatomicalStructuresArray = []
+  // convert the response object into an object array of the form { 'name': <structure name>, 'value': <number of structures>}
+  Object.keys(top5AnatomicalStructuresObject).forEach(key => top5AnatomicalStructuresArray.push({
+    name: key,
+    value: parseInt(top5AnatomicalStructuresObject[key]['N'])
+  }))
+  return {
+    userBehaviors: {
+      pageViewsLabels: ['Homepage', 'Find Data', 'Tools & Resources', 'Maps', 'News & Events'],
+      pageViewsData: {
+        lastMonth: [parseInt(ga4MetricsData['all_home_page_views_last_mo']['N']), parseInt(ga4MetricsData['all_find_data_page_views_last_mo']['N']), parseInt(ga4MetricsData['all_tools_resources_page_views_last_mo']['N']), parseInt(ga4MetricsData['all_maps_page_views_last_mo']['N']), parseInt(ga4MetricsData['all_news_events_page_views_last_mo']['N'])],
+        last3Months: [parseInt(ga4MetricsData['all_home_page_views_last_quarter']['N']), parseInt(ga4MetricsData['all_find_data_page_views_last_quarter']['N']), parseInt(ga4MetricsData['all_tools_resources_page_views_last_quarter']['N']), parseInt(ga4MetricsData['all_maps_page_views_last_quarter']['N']), parseInt(ga4MetricsData['all_news_events_page_views_last_quarter']['N'])]
+      },
+      usersData: {
+        lastMonth: [parseInt(ga4MetricsData['returning_users_in_last_month']['N']), parseInt(ga4MetricsData['new_users_in_last_month']['N'])],
+        last3Months: [parseInt(ga4MetricsData['returning_users_in_last_quarter']['N']), parseInt(ga4MetricsData['new_users_in_last_quarter']['N'])]
+      },
+      totalDownloadsData: {
+        lastMonth: parseInt(pennsieveMetricsData['number_of_sparc_downloads_last_mo']['N']),
+        last3Months: parseInt(pennsieveMetricsData['number_of_sparc_downloads_last_quarter']['N'])
+      },
+      datasetContributorsData: {
+        total: parseInt(pennsieveMetricsData['number_of_sparc_users_overall']['N']),
+        newLastMonth: parseInt(pennsieveMetricsData['number_of_new_sparc_users_last_quarter']['N'])
+      },
+    },
+    scientificContribution: {
+      dataChartLabels: ['All', 'Datasets', 'Anatomical Models', 'Computational Models', 'Embargoed (across all)'],
+      dataChartData: {
+        total: [parseInt(sparcMetricsData['all_sparc_categories_cumulative']['N']), parseInt(sparcMetricsData['sparc_datasets_cumulative']['N']), parseInt(sparcMetricsData['sparc_maps_cumulative']['N']), parseInt(sparcMetricsData['sparc_computational_models_cumulative']['N']), parseInt(sparcMetricsData['embargoed_overall']['N'])],
+        lastMonth: [parseInt(sparcMetricsData['all_sparc_categories_last_mo']['N']), parseInt(sparcMetricsData['new_sparc_datasets_last_1_mo']['N']), parseInt(sparcMetricsData['sparc_maps_cumulative']['N']), parseInt(sparcMetricsData['new_sparc_computational_models_last_1_mo']['N'])],
+        last3Months: [parseInt(sparcMetricsData['all_sparc_categories_last_quarter']['N']), parseInt(sparcMetricsData['new_sparc_datasets_last_quarter']['N']), parseInt(sparcMetricsData['sparc_maps_cumulative']['N']), parseInt(sparcMetricsData['new_sparc_computational_models_last_quarter']['N'])]
+      },
+      samples: {
+        total: parseInt(sparcMetricsData['number_of_samples_cumulative']['N']),
+        newLastMonth: parseInt(sparcMetricsData['number_of_samples_last_mo']['N']),
+        newLast3Months: parseInt(sparcMetricsData['number_of_samples_last_quarter']['N']),
+      },
+      subjects: {
+        total: parseInt(sparcMetricsData['number_of_subjects_cumulative']['N']),
+        newLastMonth: parseInt(sparcMetricsData['number_of_subjects_last_month']['N']),
+        newLast3Months: parseInt(sparcMetricsData['number_of_subjects_last_quarter']['N']),
+      },
+      anatomicalStructures: {
+        total: parseInt(sparcMetricsData['current_number_of_anatomical_structures']['N'])
+      },
+      anatomicalStructuresChartLabels: top5AnatomicalStructuresArray.map(structure => structure.name),
+      anatomicalStructuresChartData: top5AnatomicalStructuresArray.map(structure => structure.value),
+      fileStorage: {
+        totalGB: parseInt(pennsieveMetricsData['total_number_gigabytes']['N'])
+      }
+    }
+  }
+}
+
+export default {
+  name: 'MetricsPage',
+
+  components: {
+    Breadcrumb,
+    Error
+  },
+
+  async asyncData({ redirect, env, $axios, error }) {
+    const month = new Date().getMonth()
+    const year = new Date().getFullYear()
+    let metricsData = undefined
+    try {
+      metricsData = await fetchMetrics($axios, month, year)
+    } catch (e) {
+      const lastMonthsDate = getPreviousMonth()
+      metricsData = await fetchMetrics($axios, lastMonthsDate.month, lastMonthsDate.year).catch(() => {
+        error({ statusCode: 400, message: ErrorMessages.methods.metrics(), display: true, error: e} )
+      })
+    }
+    return {
+      metricsData
+    }
+  },
+
+  data: () => {
+    return {
+      metricsTypes,
+      isLoadingMetrics: false,
+      searchFailed: false,
+      breadcrumb: [
+        {
+          to: {
+            name: 'index'
+          },
+          label: 'Home'
+        },
+        {
+          label: 'About SPARC',
+          to: {
+            name: 'about'
+          }
+        },
+        {
+          to: {
+            name: 'about-metrics',
+            query: {
+              metricsType: 'scientificContribution'
+            }
+          },
+          label: 'Metrics'
+        },
+      ]
+    }
+  },
+
+  computed: {
+    /**
+     * Compute search type
+     * @returns {String}
+     */
+    searchType: function() {
+      const metricsTypeQuery = pathOr('', ['query', 'metricsType'], this.$route)
+      const metricsType = find(propEq('type', metricsTypeQuery), this.metricsTypes)
+
+      return defaultTo(head(this.metricsTypes), metricsType)
+    },
+
+    /**
+     * Compute which search results component to display based on the type of search
+     * @returns {Function}
+     */
+    metricsComponent: function() {
+      return defaultTo('', metricsComponents[this.$route.query.metricsType])
+    },
+  },
+  /**
+   * Check the metricsType param in the route and set it if it
+   */
+  mounted: function() {
+    if (!this.$route.query.metricsType) {
+      const firstTabType = compose(propOr('', 'type'), head)(metricsTypes)
+      this.$router.replace({ query: { metricsType: firstTabType } })
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+.page-data {
+  background-color: $background;
+}
+.search-tabs__container {
+  margin-top: 2rem;
+  padding-top: 0.5rem;
+  background-color: white;
+  border: 0.1rem solid $lineColor2;
+  h3 {
+    padding-left: 0.75rem;
+    font-weight: 600;
+    font-size: 1.5rem;
+  }
+}
+.search-tabs {
+  display: flex;
+  list-style: none;
+  overflow: auto;
+  margin: 0 0 0 0;
+  padding: 0 0;
+  outline: 0.1rem solid $purple;
+  @media (max-width: 40rem) {
+    display: block;
+  }
+  li {
+    width: 100%;
+    text-align: center;
+    color: $purple;
+  }
+  li:last-child > a {
+    border-right: none;
+  }
+}
+.search-tabs__button {
+  background: #f9f2fc;
+  display: block;
+  font-size: 0.75rem;
+  font-weight: 500;
+  outline: none;
+  padding: 0;
+  text-decoration: none;
+  text-transform: uppercase;
+  line-height: 3.5rem;
+  @media (min-width: 40rem) {
+    font-size: 0.65rem;
+    border-right: 0.1rem solid $purple;
+  }
+  @media (min-width: 50rem) {
+    font-size: .75rem;
+  }
+  @media (min-width: 64rem) {
+    font-size: 1.25rem;
+    font-weight: 600;
+    text-transform: none;
+  }
+  &:hover,
+  &.active {
+    color: white;
+    background-color: $purple;
+    font-weight: 500;
+  }
+}
+.table-wrap {
+  background: white;
+  border: 1px solid $lineColor2;
+  padding: 1rem;
+  .search-error {
+    margin: 0 0  auto;
+    text-align:center;
+  }
+}
+</style>
diff --git a/pages/about/policies-and-standards/_aboutDetailsId.vue b/pages/about/policies-and-standards/_aboutDetailsId.vue
deleted file mode 100644
index 8cc9299f..00000000
--- a/pages/about/policies-and-standards/_aboutDetailsId.vue
+++ /dev/null
@@ -1,142 +0,0 @@
-<template>
-  <div>
-    <breadcrumb
-      :breadcrumb="breadcrumb"
-      :title="aboutDetailsItem.fields.title"
-    />
-    <page-hero>
-      <h1>{{ aboutDetailsItem.fields.title }}</h1>
-      <p>{{ aboutDetailsItem.fields.summary }}</p>
-    </page-hero>
-    <div class="container">
-      <div class="subpage">
-        <div v-html="parseMarkdown(aboutDetailsItem.fields.description)" />
-        <hr />
-        <p class="share-text">
-          SHARE
-        </p>
-        <share-links />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
-import PageHero from '@/components/PageHero/PageHero.vue'
-import ShareLinks from '~/components/ShareLinks/ShareLinks.vue'
-
-import MarkedMixin from '@/mixins/marked'
-import createClient from '@/plugins/contentful.js'
-
-import { successMessage, failMessage } from '@/utils/notification-messages'
-
-const client = createClient()
-
-const getAboutDetailsItem = async id => {
-  try {
-    const isSlug = id.split('-').length > 1
-    const item = isSlug
-      ? await client.getEntries({
-          content_type: process.env.ctf_about_details_content_type_id,
-          'fields.slug': id
-        })
-      : await client.getEntry(id)
-    return isSlug ? item.items[0] : item
-  } catch (error) {
-    return {}
-  }
-}
-
-export default {
-  name: 'PoliciesAboutDetailsId',
-
-  components: {
-    Breadcrumb,
-    PageHero,
-    ShareLinks
-  },
-
-  mixins: [MarkedMixin],
-
-  async asyncData({ params, redirect }) {
-    const aboutDetailsItem = await getAboutDetailsItem(params.aboutDetailsId)
-
-    // Redirect to the friendly URL page, if this page has a slug
-    const slug = aboutDetailsItem.fields.slug
-    if (slug && params.aboutDetailsId !== slug) {
-      redirect({
-        name: 'about-policies-and-standards-aboutDetailsId',
-        params: { aboutDetailsId: slug }
-      })
-    }
-
-    return {
-      aboutDetailsItem: aboutDetailsItem,
-      heroCopy: '',
-      copy: '',
-      breadcrumb: [
-        {
-          to: {
-            name: 'index'
-          },
-          label: 'Home'
-        },
-        {
-          label: 'About',
-          to: {
-            name: 'about'
-          }
-        },
-        {
-          label: aboutDetailsItem.fields.type,
-          to: {
-            name: 'about-policies-and-standards'
-          }
-        }
-      ]
-    }
-  },
-
-  methods: {
-    /**
-     * Copy file URL to clipboard
-     * @param {Object} scope
-     */
-    copyUrl() {
-      this.$copyText(window.location.href).then(
-        () => {
-          this.$message(successMessage(`URL copied to clipboard.`))
-        },
-        () => {
-          this.$message(failMessage(`Cannot copy to clipboard.`))
-        }
-      )
-    }
-  }
-}
-</script>
-
-<style scoped lang="scss">
-@import '@/assets/_variables.scss';
-.subpage {
-  margin: 1em 0;
-  padding: 1em;
-  border: 1px solid #dcdfe6;
-  background: white;
-
-  @media (min-width: 48em) {
-    margin: 2.5em 0;
-    padding: 1em 2em;
-  }
-
-  hr {
-    opacity: 0.3;
-  }
-}
-
-.share-text {
-  font-weight: 500;
-  margin-bottom: 0;
-}
-</style>
diff --git a/pages/about/policies-and-standards/index.vue b/pages/about/policies-and-standards/index.vue
index 1a532288..47291c6b 100644
--- a/pages/about/policies-and-standards/index.vue
+++ b/pages/about/policies-and-standards/index.vue
@@ -1,318 +1,19 @@
 <template>
-  <div class="page-data">
-    <breadcrumb :breadcrumb="breadcrumb" title="Policies" />
-    <div class="container">
-      <div class="search-tabs__container">
-        <h3>
-          Browse categories
-        </h3>
-        <ul class="search-tabs">
-          <li v-for="type in searchTypes" :key="type.label">
-            <nuxt-link
-              class="search-tabs__button"
-              :class="{ active: type.path === 'policies-and-standards' }"
-              :to="{
-                path: type.path,
-                query: {
-                  ...$route.query,
-                }
-              }"
-            >
-              {{ type.label }}
-            </nuxt-link>
-          </li>
-        </ul>
-      </div>
-      <div class="search-bar__container">
-        <h5>
-          Search within category
-        </h5>
-        <search-controls-contentful
-          class="search-bar"
-          placeholder="Enter search criteria"
-          path="/about/about-sparc"
-          showSearchText
-        />
-      </div>
+  <client-only>
+    <div class="main-container">
+      Redirecting you to the SPARC Help Center...
     </div>
-    <div class="pb-16 container">
-      <el-row :gutter="32" type="flex">
-        <el-col :span="24">
-          <el-row :gutter="32">
-            <client-only>
-              <el-col
-                :sm='24'
-                :md='24'
-                :lg='24'
-              >
-                <div class="search-heading mt-32 mb-16">
-                  <div class="label1" v-show="tableData.length">
-                    {{ searchData.total }} Results | Showing
-                    <pagination-menu
-                      :page-size="searchData.limit"
-                      @update-page-size="onPaginationLimitChange"
-                    />
-                  </div>
-                  <span class="label1">
-                    Sort
-                    <sort-menu
-                      :options="sortOptions"
-                      :selected-option="selectedSortOption"
-                      @update-selected-option="onSortOptionChange"
-                    />
-                  </span>
-                </div>
-                <div class="subpage">
-                  <about-details-search-results :table-data="tableData" />
-                </div>
-                <div class="search-heading">
-                  <div class="label1" v-if="tableData.length">
-                    {{ searchData.total }} Results | Showing
-                    <pagination-menu
-                      :page-size="searchData.limit"
-                      @update-page-size="onPaginationLimitChange"
-                    />
-                  </div>
-                  <pagination
-                    v-if="searchData.limit < searchData.total"
-                    :selected="curSearchPage"
-                    :page-size="searchData.limit"
-                    :total-count="searchData.total"
-                    @select-page="onPaginationPageChange"
-                  />
-                </div>
-              </el-col>
-            </client-only>
-          </el-row>
-        </el-col>
-      </el-row>
-    </div>
-  </div>
+  </client-only>
 </template>
-
 <script>
-import { propOr } from 'ramda'
-import AboutDetailsSearchResults from '@/components/SearchResults/AboutDetailsSearchResults.vue'
-import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
-import SearchControlsContentful from '@/components/SearchControlsContentful/SearchControlsContentful.vue';
-import SortMenu from '@/components/SortMenu/SortMenu.vue'
-
-import createClient from '@/plugins/contentful.js'
-
-const client = createClient()
-
-const searchTypes = [
-  {
-    label: 'About SPARC',
-    path: 'about-sparc'
-  },
-  {
-    label: 'Policies',
-    path: 'policies-and-standards'
-  }
-]
-
-const sortOptions = [
-  {
-    label: 'A-Z',
-    id: 'alphabatical',
-    sortOrder: 'fields.title'
-  },
-  {
-    label: 'Z-A',
-    id: 'reverseAlphabatical',
-    sortOrder: '-fields.title'
-  },
-]
-
-const fetchSearchData = async function(query, limit, skip, sortOrder, types) {
-  return client
-      .getEntries({
-        content_type: 'aboutPageSecondLevel',
-        query: query,
-        limit: limit,
-        skip: skip,
-        order: sortOrder,
-        'fields.type[in]' : types
-      })
-      .then(async response => {
-        return response
-      })
-}
-
 export default {
-  name: 'PoliciesPage',
-
-  components: {
-    AboutDetailsSearchResults,
-    Breadcrumb,
-    SearchControlsContentful,
-    SortMenu
-  },
-
-  async asyncData({ route, env }) {
-    const detailsTypes = env.ctf_about_details_page_types.filter(type => type == 'Policies').toString()
-    let searchData = await fetchSearchData(route.query.search, 10, 0, 'fields.title', detailsTypes)
-    return {
-      searchData
-    }
-  },
-
-  data() {
-    return {
-      searchTypes,
-      selectedSortOption: sortOptions[0],
-      sortOptions,
-      breadcrumb: [
-        {
-          label: 'Home',
-          to: {
-            name: 'index'
-          }
-        },
-        {
-          label: 'About',
-          to: {
-            name: 'about'
-          }
-        }
-      ]
+  mounted() {
+    // It appears the only way to handle vue router redirects to external sites is by setting window.location.href directly, but the window object is only present after
+    // the page has been mounted and is viewable. Therefore we display the redirecting text before redirecting. This issue has been filed many times with Vue:
+    // https://github.com/nuxt/nuxt.js/issues/770, https://github.com/vuejs/vue-router/issues/1280, https://github.com/nuxt/nuxt.js/issues/1082
+    if (process.client) {
+        window.location.href = "https://docs.sparc.science/docs/terms-of-service";
     }
   },
-
-  watch: {
-    '$route.query': {
-      handler: async function() {
-        this.searchData = await fetchSearchData(this.$route.query.search, 10, 0, this.sortOrder, this.detailsTypes)
-      },
-      immediate: true
-    },
-  },
-
-  computed: {
-    detailsTypes: function() {
-      return process.env.ctf_about_details_page_types.filter(type => type == 'Policies').toString()
-    },
-    curSearchPage: function() {
-      return this.tableData.skip / this.tableData.limit + 1
-    },
-    sortOrder: function() {
-      return propOr('fields.title', 'sortOrder', this.selectedSortOption)
-    },
-    tableData: function() {
-      return propOr([], 'items', this.searchData)
-    },
-  },
-
-  methods: {
-    async onPaginationPageChange(page) {
-      const { limit } = this.searchData
-      const offset = (page - 1) * limit
-      this.searchData = await fetchSearchData(this.$route.query.search, limit, offset, this.sortOrder, this.detailsTypes)
-    },
-    async onPaginationLimitChange(limit) {
-      const newLimit = limit === 'View All' ? this.this.searchData.total : limit
-      this.searchData = await fetchSearchData(this.$route.query.search, newLimit, 0, this.sortOrder, this.detailsTypes)
-    },
-    async onSortOptionChange(option) {
-      this.selectedSortOption = option
-      this.searchData = await fetchSearchData(this.$route.query.search, this.searchData.limit, 0, this.sortOrder, this.detailsTypes)
-    }
-  }
 }
 </script>
-
-<style lang="scss" scoped>
-@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
-.page-data {
-  background-color: $background;
-}
-.subpage {
-  margin-bottom: .5rem;
-  margin-top: .5rem;
-}
-.page-wrap {
-  margin-bottom: 2.5rem;
-}
-.search-tabs__container {
-  margin-top: 2rem;
-  padding-top: 0.5rem;
-  background-color: white;
-  border: 0.1rem solid $lineColor2;
-  h3 {
-    padding-left: 0.75rem;
-    font-weight: 600;
-    font-size: 1.5rem;
-  }
-}
-.search-bar__container {
-  margin-top: 1em;
-  padding: 0.75rem;
-  border: 0.1rem solid $lineColor2;
-  background: white;
-  h5 {
-    line-height: 1rem;
-    font-weight: 600;
-    font-size: 1rem;
-  }
-}
-.search-tabs {
-  display: flex;
-  list-style: none;
-  overflow: auto;
-  margin: 0 0 0 0;
-  padding: 0 0;
-  outline: 0.1rem solid $purple;
-  @media (max-width: 40rem) {
-    display: block;
-  }
-  li {
-    width: 100%;
-    text-align: center;
-    color: $purple;
-  }
-  li:last-child > a {
-    border-right: none;
-  }
-}
-.search-tabs__button {
-  background: #f9f2fc;
-  display: block;
-  font-size: 0.75rem;
-  font-weight: 500;
-  outline: none;
-  padding: 0;
-  text-decoration: none;
-  text-transform: uppercase;
-  line-height: 3.5rem;
-  @media (min-width: 40rem) {
-    font-size: 0.65rem;
-    border-right: 0.1rem solid $purple;
-  }
-  @media (min-width: 50rem) {
-    font-size: .75rem;
-  }
-  @media (min-width: 64rem) {
-    font-size: 1.25rem;
-    font-weight: 600;
-    text-transform: none;
-  }
-  &:hover,
-  &:focus,
-  &.active {
-    color: white;
-    background-color: $purple;
-    font-weight: 500;
-  }
-}
-.search-heading {
-  align-items: flex-end;
-  display: flex;
-  justify-content: space-between;
-  @media screen and (max-width: 28em) {
-    flex-direction: column;
-    align-items: flex-start;
-    margin-bottom: 0;
-  }
-}
-</style>
diff --git a/pages/about/sparc-portal/_aboutDetailsId.vue b/pages/about/sparc-portal/_aboutDetailsId.vue
index 35de6feb..c4fb3216 100644
--- a/pages/about/sparc-portal/_aboutDetailsId.vue
+++ b/pages/about/sparc-portal/_aboutDetailsId.vue
@@ -83,7 +83,7 @@ export default {
           label: 'Home'
         },
         {
-          label: 'About',
+          label: 'About SPARC',
           to: {
             name: 'about'
           }
@@ -98,6 +98,19 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.aboutDetailsItem.fields.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.aboutDetailsItem.fields.title,
+        },
+      ]
+    }
+  },
+
   methods: {
     /**
      * Copy file URL to clipboard
diff --git a/pages/about/sparc-portal/index.vue b/pages/about/sparc-portal/index.vue
index 280326cc..1dc60da5 100644
--- a/pages/about/sparc-portal/index.vue
+++ b/pages/about/sparc-portal/index.vue
@@ -1,126 +1,9 @@
-<template>
-  <div class="page-data pb-16">
-    <breadcrumb :breadcrumb="breadcrumb" :title="type" />
-    <page-hero>
-      <h1>{{ title }}</h1>
-      <p>{{ summary }}</p>
-    </page-hero>
-    <div class="container">
-      <div class="subpage px-32 py-16">
-        <div v-html="parseMarkdown(description)" />
-        <hr />
-        <div class="body1">
-          SHARE
-        </div>
-        <share-links />
-      </div>
-      <div v-if="learnMore" class="subpage px-32 mb-0">
-        <div class="heading1 mb-16">Learn More</div>
-        <learn-more-card
-          v-for="(item, index) in learnMore"
-          :key="`${item}-${index}`"
-          :about-details-item="item"
-          :parent-path="slug"
-        />
-      </div>
-    </div>
-  </div>
-</template>
-
 <script>
-import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
-import LearnMoreCard from '@/components/LearnMoreCard/LearnMoreCard.vue'
-import PageHero from '@/components/PageHero/PageHero.vue'
-import ShareLinks from '~/components/ShareLinks/ShareLinks.vue'
-
-import MarkedMixin from '@/mixins/marked'
-import createClient from '@/plugins/contentful.js'
-
-import { successMessage, failMessage } from '@/utils/notification-messages'
-
-const client = createClient()
-
 export default {
   name: 'SparcPortalAboutPage',
 
-  components: {
-    Breadcrumb,
-    PageHero,
-    LearnMoreCard,
-    ShareLinks
-  },
-
-  mixins: [MarkedMixin],
-
-  async asyncData() {
-    const page = await client.getEntry(process.env.ctf_about_portal_page_id)
-    return {
-      title : page.fields.title,
-      type: page.fields.type,
-      summary: page.fields.summary,
-      description: page.fields.description,
-      learnMore: page.fields.learnMore,
-      slug: page.fields.slug,
-    }
-  },
-
-  data: () => {
-    return {
-      breadcrumb: [
-        {
-          to: {
-            name: 'index'
-          },
-          label: 'Home'
-        },
-        {
-          label: 'About',
-          to: {
-            name: 'about'
-          }
-        }
-      ]
-    }
+  async asyncData({ redirect }) {
+    redirect("/about")
   },
-
-  computed: {
-    pageUrl: function() {
-      return `${process.env.ROOT_URL}${this.$route.fullPath}`
-    }
-  },
-
-  methods: {
-    /**
-     * Copy file URL to clipboard
-     * @param {Object} scope
-     */
-    copyUrl() {
-      this.$copyText(this.pageUrl).then(
-        () => {
-          this.$message(successMessage(`URL copied to clipboard.`))
-        },
-        () => {
-          this.$message(failMessage(`Cannot copy to clipboard.`))
-        }
-      )
-    }
-  }
 }
 </script>
-
-<style scoped lang="scss">
-@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
-.page-data {
-  background-color: $background;
-}
-.heading1 {
-  font-weight: 300;
-}
-
-hr {
-  opacity: 0.3;
-}
-h1 {
-  font-weight: 300;
-}
-</style>
diff --git a/pages/about/sparc-portal/metrics/index.vue b/pages/about/sparc-portal/metrics/index.vue
new file mode 100644
index 00000000..c38ca719
--- /dev/null
+++ b/pages/about/sparc-portal/metrics/index.vue
@@ -0,0 +1,9 @@
+<script>
+export default {
+  name: 'MetricsPage',
+
+  async asyncData({ redirect }) {
+    redirect("/about/metrics")
+  },
+}
+</script>
diff --git a/pages/about/team-and-leadership/_aboutDetailsId.vue b/pages/about/team-and-leadership/_aboutDetailsId.vue
index 13bd58ce..585ef1f5 100644
--- a/pages/about/team-and-leadership/_aboutDetailsId.vue
+++ b/pages/about/team-and-leadership/_aboutDetailsId.vue
@@ -83,7 +83,7 @@ export default {
           label: 'Home'
         },
         {
-          label: 'About',
+          label: 'About SPARC',
           to: {
             name: 'about'
           }
@@ -98,6 +98,19 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.aboutDetailsItem.fields.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.aboutDetailsItem.fields.title,
+        },
+      ]
+    }
+  },
+
   methods: {
     /**
      * Copy file URL to clipboard
diff --git a/pages/about/team-and-leadership/index.vue b/pages/about/team-and-leadership/index.vue
index 8fc9d977..97808d47 100644
--- a/pages/about/team-and-leadership/index.vue
+++ b/pages/about/team-and-leadership/index.vue
@@ -16,12 +16,15 @@
       </div>
       <div v-if="learnMore" class="subpage px-32 mb-0">
         <div class="heading1 mb-16">Learn More</div>
-        <learn-more-card
-          v-for="(item, index) in learnMore"
-          :key="`${item}-${index}`"
-          :about-details-item="item"
-          :parent-path="slug"
-        />
+        <template v-for="(item, index) in learnMore">
+          <div :key="`${item}-${index}`">
+            <learn-more-card
+              :about-details-item="item"
+              :parent-path="slug"
+            />
+            <hr v-if="learnMore.length > 1 && index != learnMore.length - 1" />
+          </div>
+        </template>
       </div>
     </div>
   </div>
@@ -74,7 +77,7 @@ export default {
           label: 'Home'
         },
         {
-          label: 'About',
+          label: 'About SPARC',
           to: {
             name: 'about'
           }
@@ -83,6 +86,24 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.summary ? this.summary : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
+
   methods: {
     /**
      * Copy file URL to clipboard
@@ -107,14 +128,24 @@ export default {
 .page-data {
   background-color: $background;
 }
-.heading1 {
-  font-weight: 300;
-}
-
 hr {
   opacity: 0.3;
 }
-h1 {
-  font-weight: 300;
+::v-deep h1 {
+  font-size:2rem;
+  font-weight:500;
+  line-height:2.75rem;
+}
+
+::v-deep h2 {
+  font-size:1.5rem;
+  font-weight:500;
+  line-height:2.25rem;
+}
+
+::v-deep h3 {
+  font-size:1rem;
+  font-weight:500;
+  line-height:1.875rem;
 }
 </style>
diff --git a/pages/about/what-we-offer/_aboutDetailsId.vue b/pages/about/what-we-offer/_aboutDetailsId.vue
index d62a7a44..69eb7784 100644
--- a/pages/about/what-we-offer/_aboutDetailsId.vue
+++ b/pages/about/what-we-offer/_aboutDetailsId.vue
@@ -83,7 +83,7 @@ export default {
           }
         },
         {
-          label: 'About',
+          label: 'About SPARC',
           to: {
             name: 'about'
           }
@@ -98,6 +98,19 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.aboutDetailsItem.fields.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.aboutDetailsItem.fields.title,
+        },
+      ]
+    }
+  },
+
   methods: {
     /**
      * Copy file URL to clipboard
diff --git a/pages/about/what-we-offer/index.vue b/pages/about/what-we-offer/index.vue
index dfb84a83..a5749ee8 100644
--- a/pages/about/what-we-offer/index.vue
+++ b/pages/about/what-we-offer/index.vue
@@ -16,12 +16,15 @@
       </div>
       <div v-if="learnMore" class="subpage px-32 mb-0">
         <div class="heading1 mb-16">Learn More</div>
-        <learn-more-card
-          v-for="(item, index) in learnMore"
-          :key="`${item}-${index}`"
-          :about-details-item="item"
-          :parent-path="slug"
-        />
+        <template v-for="(item, index) in learnMore">
+          <div :key="`${item}-${index}`">
+            <learn-more-card
+              :about-details-item="item"
+              :parent-path="slug"
+            />
+            <hr v-if="learnMore.length > 1 && index != learnMore.length - 1" />
+          </div>
+        </template>
       </div>
     </div>
   </div>
@@ -74,7 +77,7 @@ export default {
           label: 'Home'
         },
         {
-          label: 'About',
+          label: 'About SPARC',
           to: {
             name: 'about'
           }
@@ -83,6 +86,24 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.summary ? this.summary : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
+
   methods: {
     /**
      * Copy file URL to clipboard
@@ -114,14 +135,27 @@ export default {
 .page-data {
   background-color: $background;
 }
-.heading1 {
-  font-weight: 300;
-}
-
 hr {
   opacity: 0.3;
 }
-h1 {
-  font-weight: 300;
+::v-deep h1 {
+  font-size:2rem;
+  font-weight:500;
+  line-height:2.75rem;
+}
+
+::v-deep h2 {
+  font-size:1.5rem;
+  font-weight:500;
+  line-height:2.25rem;
+}
+
+::v-deep h3 {
+  font-size:1rem;
+  font-weight:500;
+  line-height:1.875rem;
+}
+::v-deep img {
+  width: 100%;
 }
 </style>
diff --git a/pages/contact-us/index.vue b/pages/contact-us/index.vue
index b1ed1a60..af2a862e 100644
--- a/pages/contact-us/index.vue
+++ b/pages/contact-us/index.vue
@@ -1,57 +1,71 @@
 <template>
   <div class="contact-us-page pb-16">
-    <breadcrumb :breadcrumb="breadcrumb" :title="pageTitle" />
-    <page-hero v-if="heroCopy">
-      <h1>{{ pageTitle }}</h1>
-      <!-- eslint-disable vue/no-v-html -->
-      <!-- marked will sanitize the HTML injected -->
-      <div v-html="parseMarkdown(heroCopy)" />
-    </page-hero>
+    <breadcrumb :breadcrumb="breadcrumb" :title="breadcrumbTitle" />
+    <div class="container">
+      <div class="tabs__container">
+        <h3>
+          Select Form
+        </h3>
+        <ul class="tabs">
+          <li v-for="type in formTypes" :key="type.label">
+            <nuxt-link
+              class="tabs__button"
+              @click.native="resetForms"
+              :class="{ active: type.type === $route.query.type || (type.subtypes != undefined && type.subtypes.includes($route.query.type)) || ($route.query.type === undefined && type.type === 'research') }"
+              :to="{
+                name: 'contact-us',
+                query: {
+                  ...$route.query,
+                  type: type.type,
+                }
+              }"
+            >
+              {{ type.label }}
+            </nuxt-link>
+          </li>
+        </ul>
+      </div>
+    </div>
+    <div class="page-wrap container">
+      <div class="subpage">
+        <div v-if="formTypeObject" class="body1" v-html="formTypeObject.description"></div>
+      </div>
+    </div>
     <div class="page-wrap container">
       <div class="subpage mb-0">
-        <template v-if="!isBugSubmitted && !isGeneralSubmitted">
-          <h2>Let us know why you are contacting us:</h2>
-          <el-select
-            v-model="formType"
-            class="input-reason"
-            placeholder="Select a reason"
-            :popper-append-to-body="false"
-          >
-            <el-option
-              v-for="option in formTypeOptions"
-              :key="option.key"
-              :label="option.label"
-              :value="option.value"
-            />
-          </el-select>
-
-          <hr v-if="formType" class="mt-32 mb-32" />
-
-          <general-form
-            v-if="formType === 'general'"
-            @submit="onGeneralFormSubmit($event)"
-          />
-          <bug-form v-if="formType === 'bug'" @submit="isBugSubmitted = true" />
+        <template v-if="isFeedbackForm">
+          <template v-if="!isSubmitted">
+            <div class="heading2 mb-8">Let us know why you are contacting us:</div>
+            <el-select
+              v-model="formType"
+              class="input-reason"
+              placeholder="Select a reason"
+              :popper-append-to-body="false"
+            >
+              <el-option
+                v-for="option in feedbackFormTypeOptions"
+                :key="option.key"
+                :label="option.label"
+                :value="option.value"
+              />
+            </el-select>
+            <hr v-if="isFeedbackForm && formType != undefined && formType != 'feedback'" class="mt-32 mb-32" />  
+          </template>
         </template>
+        <component
+          v-if="!isSubmitted"
+          :is="formComponent"
+          @submit="formSubmitted"
+        />
 
-        <div v-if="isGeneralSubmitted" class="msg-success">
+        <div v-if="isSubmitted" class="msg-success">
           <template v-if="firstName">
             <p>{{ firstName }},</p>
           </template>
           <p>
-            Thank you for your inquiry. A member of the SPARC team will contact
-            you as soon as possible.
-          </p>
-          <a href="#" @click="resetForms">Submit another inquiry</a>
-        </div>
-
-        <div v-if="isBugSubmitted" class="msg-success">
-          <p>
-            Thank you for letting us know about this error or issue. If you
-            requested a response, a member of the SPARC team will contact you
-            as soon as possible.
+            Thank you for your submission!
           </p>
-          <a href="#" @click="resetForms">Submit another inquiry</a>
+          <a href="#" @click="resetForms">Create another submission</a>
         </div>
       </div>
     </div>
@@ -63,11 +77,54 @@ import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
 import PageHero from '@/components/PageHero/PageHero.vue'
 import GeneralForm from '@/components/ContactUsForms/GeneralForm/GeneralForm.vue'
 import BugForm from '@/components/ContactUsForms/BugForm/BugForm.vue'
-
+import FeedbackForm from '@/components/ContactUsForms/FeedbackForm/FeedbackForm.vue'
+import InterestForm from '@/components/ContactUsForms/InterestForm/InterestForm.vue'
+import ResearchForm from '@/components/ContactUsForms/ResearchForm/ResearchForm.vue'
+import ToolsAndResourcesForm from '@/components/ContactUsForms/ToolsAndResourcesForm/ToolsAndResourcesForm.vue'
+import NewsAndEventsForm from '@/components/ContactUsForms/NewsAndEventsForm/NewsAndEventsForm.vue'
+import CommunitySpotlightForm from '@/components/ContactUsForms/CommunitySpotlightForm/CommunitySpotlightForm.vue'
+import { defaultTo, pathOr, propOr } from 'ramda'
 import MarkedMixin from '@/mixins/marked'
 import createClient from '@/plugins/contentful.js'
 
 const client = createClient()
+let formTypes = [
+  {
+    type: 'research',
+    id: '3gBm9CkPV1QiqevHHtQxqP',
+    subtypes: []
+  },
+  {
+    type: 'feedback',
+    id: '1PEIbcIV21upAq55ocnakO',
+    subtypes: ['bug', 'portal-feedback', 'sparc-service', 'general']
+  },
+  {
+    type: 'news-event',
+    id: '6yyjWHw7jfpH4qOqDXwfmi',
+    subtypes: []
+  },
+  {
+    type: 'story',
+    id: '5ZoMC1OGTj1ibNXJ5Na4Ja',
+    subtypes: []
+  },
+  {
+    type: 'tool',
+    id: '2FGDIx61NO5VBV3GBiXH2C',
+    subtypes: []
+  }
+]
+const formComponents = {
+  bug: BugForm,
+  'portal-feedback': FeedbackForm,
+  'sparc-service': InterestForm,
+  general: GeneralForm,
+  research: ResearchForm,
+  tool: ToolsAndResourcesForm,
+  'news-event': NewsAndEventsForm,
+  story: CommunitySpotlightForm,
+}
 
 export default {
   name: 'ContactUsPage',
@@ -76,20 +133,37 @@ export default {
     Breadcrumb,
     PageHero,
     GeneralForm,
-    BugForm
+    BugForm,
+    FeedbackForm,
+    InterestForm,
+    ResearchForm,
+    ToolsAndResourcesForm,
+    NewsAndEventsForm,
+    CommunitySpotlightForm
   },
 
   mixins: [MarkedMixin],
 
   asyncData() {
     return Promise.all([
-      // Get page content
-      client.getEntry(process.env.ctf_contact_us_page_id)
+      client.getEntries({
+        content_type: process.env.ctf_contact_us_form_type_id,
+      })
     ])
-      .then(([page]) => {
-        return { ...page.fields }
+    .then(([page]) => {
+      const entries = propOr({}, 'items', page)
+      formTypes.forEach(formType => {
+        const formTypeId = formType.id
+        const entry = entries.find(item => {
+          const entryId = pathOr('', ['sys','id'], item)
+          return entryId == formTypeId
+        })
+        formType.label = pathOr('', ['fields', 'title'], entry)
+        formType.description = pathOr('', ['fields', 'description'], entry)
       })
-      .catch(console.error)
+      return { formTypes }
+    })
+    .catch(console.error)
   },
 
   data: () => {
@@ -101,25 +175,84 @@ export default {
             name: 'index'
           },
           label: 'Home'
-        }
-      ],
-      formType: '',
-      formTypeOptions: [
+        },
         {
-          label: 'I could not find the information in Help',
-          value: 'general'
+          to: {
+            name: 'contact-us',
+          },
+          label: 'Contact Us'
         },
+      ],
+      formType: '',
+      feedbackFormTypeOptions: [
         {
           label: 'I want to report an error or an issue',
           value: 'bug'
-        }
+        },
+        {
+          label: 'I have feedback about the SPARC Portal',
+          value: 'portal-feedback'
+        },
+        {
+          label: 'I am interested in a SPARC Service',
+          value: 'sparc-service'
+        },
+        {
+          label: 'I have another question or inquiry',
+          value: 'general'
+        },
       ],
-      isBugSubmitted: false,
-      isGeneralSubmitted: false,
+      isSubmitted: false,
       firstName: ''
     }
   },
 
+  computed: {
+    breadcrumbTitle() {
+      if (this.formTypeObject != undefined)
+        return this.formTypeObject.label
+      return this.formTypes[0].label
+    },
+    isFeedbackForm() {
+      const feedbackFormType = this.formTypes.find(formType => formType.type === 'feedback')
+      return this.$route.query.type === 'feedback' || this.formType === feedbackFormType.type || feedbackFormType.subtypes.includes(this.formType)
+    },
+    formComponent: function() {
+      if (this.$route.query.type === 'feedback') {
+        return ''
+      }
+      return defaultTo(ResearchForm, formComponents[this.$route.query.type])
+    },
+    formTypeObject() {
+      if (this.formType == undefined)
+        return this.formTypes[0]
+      return this.formTypes.find(formType => {
+        if (formType.type === this.formType)
+          return true
+        if (formType.subtypes.includes(this.formType))
+          return true
+      })
+    }
+  },
+
+  head() {
+    return {
+      title: this.breadcrumbTitle,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.breadcrumbTitle,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.formTypeObject.description ? this.formTypeObject.description : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
+
   watch: {
     /**
      * Set formType data based on query param
@@ -127,7 +260,7 @@ export default {
      */
     $route: {
       handler(to) {
-        this.formType = to.query.type
+        this.formType = to.query.type === 'research' ? undefined : to.query.type
       },
       immediate: true
     },
@@ -146,19 +279,12 @@ export default {
      * Reset all form data
      */
     resetForms: function() {
-      this.isBugSubmitted = false
-      this.isGeneralSubmitted = false
-      this.formType = ''
+      this.isSubmitted = false
       this.firstName = ''
     },
-
-    /**
-     * On general form meetings
-     * @param {String} firstName
-     */
-    onGeneralFormSubmit: function(firstName) {
+    formSubmitted(firstName) {
       this.firstName = firstName
-      this.isGeneralSubmitted = true
+      this.isSubmitted = true
     }
   }
 }
@@ -187,41 +313,111 @@ h2 {
 }
 </style>
 
-<style lang="scss">
-@import '@/assets/_variables.scss';
+<style scoped lang="scss">
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+.tabs__container {
+  margin-top: 2rem;
+  padding-top: 0.5rem;
+  background-color: white;
+  border: 0.1rem solid $lineColor2;
+  h3 {
+    padding-left: 0.75rem;
+    font-weight: 600;
+    font-size: 1.5rem;
+  }
+}
+.tabs {
+  display: flex;
+  list-style: none;
+  overflow: auto;
+  margin: 0 0 0 0;
+  padding: 0 0;
+  outline: 0.1rem solid $purple;
+  @media (max-width: 40rem) {
+    display: block;
+  }
+  li {
+    width: 100%;
+    text-align: center;
+    color: $purple;
+  }
+  li:last-child > a {
+    border-right: none;
+  }
+}
+hr {
+  border-top: none;
+  border-left: none;
+  border-width: 2px;
+  border-color: $lineColor1;
+  margin: 2rem 0;
+}
+.tabs__button {
+  background: #f9f2fc;
+  display: block;
+  font-size: 0.75rem;
+  font-weight: 500;
+  outline: none;
+  padding: 0;
+  text-decoration: none !important;
+  text-transform: uppercase;
+  line-height: 3.5rem;
+  @media (min-width: 40rem) {
+    font-size: 0.65rem;
+    border-right: 0.1rem solid $purple;
+  }
+  @media (min-width: 50rem) {
+    font-size: .75rem;
+  }
+  @media (min-width: 64rem) {
+    font-size: 1.25rem;
+    font-weight: 600;
+    text-transform: none;
+  }
+  &:hover,
+  &.active {
+    color: white;
+    background-color: $purple;
+    font-weight: 500;
+  }
+}
 .contact-us-page {
-  .el-form-item__label {
-    color: #000;
-    font-size: 1.625rem;
-    line-height: 1.2;
-    margin-bottom: 1rem;
+  ::v-deep .el-form-item__label {
+    color: $grey;
+    font-size: 1.5rem;
+    line-height: 2.25rem;
+    font-weight: 500;
+    margin-bottom: .5rem;
     padding-bottom: 0;
   }
-  .el-select {
+  ::v-deep .el-select {
     max-width: 20rem;
     width: 100%;
   }
-  .el-input,
+  ::v-deep .el-input,
   .el-textarea,
-  .el-select-dropdown__item {
+  ::v-deep .el-select-dropdown__item {
     ::placeholder {
-      color: $medium-gray;
+      color: $lightGrey;
     }
   }
-  .el-input__inner,
-  .el-textarea__inner {
-    border-color: $medium-gray;
+  ::v-deep .el-textarea__inner {
+    border-color: $lightGrey;
     border-radius: 4px;
-    padding: 0.5rem 1rem;
-  }
-  .el-textarea__inner {
+    padding-top: .75rem;
+    padding-bottom: .75rem;
     font-family: inherit;
   }
+  ::v-deep .el-textarea {
+    ::placeholder {
+      color: $lightGrey;
+    }
+  }
   .input-reason {
     max-width: 36rem;
     width: 100%;
     ::placeholder {
-      color: $dark-sky;
+      color: $grey;
     }
   }
 }
diff --git a/pages/data/index.vue b/pages/data/index.vue
index c98ed6e8..abfc56dc 100644
--- a/pages/data/index.vue
+++ b/pages/data/index.vue
@@ -64,7 +64,8 @@
                 :lg="6"
               >
                 <projects-facet-menu
-                  :anatomicalFocusFacets="projectsFacets"
+                  :anatomicalFocusFacets="projectsAnatomicalFocusFacets"
+                  :fundingFacets="projectsFundingFacets"
                   @projects-selections-changed="onPaginationPageChange(1)"
                   @hook:mounted="facetMenuMounted"
                   ref="projectsFacetMenu"
@@ -111,6 +112,34 @@
                     :table-data="tableData"
                     :title-column-width="titleColumnWidth"
                   />
+
+                  <!-- Alternative search suggestions -->
+                  <div v-if="searchHasAltResults" class="mt-24">
+                    <template v-if="searchData.total === 0">
+                      No results were found for <strong>{{ searchType.label }}</strong>.
+                    </template>
+                    The following results were discovered for the other categories:
+                    <br />
+                    <br />
+                    <template v-for="dataType in dataTypes">
+                      <dd v-if="resultCounts[dataType] > 0 && dataType !== 'projects'" :key="dataType">
+                        <nuxt-link
+                          :to="{
+                            name: 'data',
+                            query: {
+                              ...$route.query,
+                              type: dataType
+                            }
+                          }"
+                        >
+                          {{ resultCounts[dataType] }} result{{
+                            resultCounts[dataType] > 1 ? 's' : ''
+                          }}
+                        </nuxt-link>
+                        - {{ humanReadableDataTypesLookup[dataType] }}
+                      </dd>
+                    </template>
+                  </div>
                 </div>
                 <div class="search-heading">
                   <p v-if="!isLoadingSearch && searchData.items.length">
@@ -198,14 +227,14 @@ const searchTypes = [
 
 const algoliaSortOptions = [
   {
-    label: 'Published (desc)',
+    label: 'Date (desc)',
     id: 'newest',
-    algoliaIndexName: process.env.ALGOLIA_INDEX_PUBLISHED_TIME_DESC
+    algoliaIndexName: process.env.ALGOLIA_INDEX_VERSION_PUBLISHED_TIME_DESC
   },
   {
-    label: 'Published (asc)',
+    label: 'Date (asc)',
     id: 'oldest',
-    algoliaIndexName: process.env.ALGOLIA_INDEX_PUBLISHED_TIME_ASC
+    algoliaIndexName: process.env.ALGOLIA_INDEX_VERSION_PUBLISHED_TIME_ASC
   },
   {
     label: 'A-Z',
@@ -253,36 +282,83 @@ export default {
   mixins: [],
 
   async asyncData() {
-    let projectsFacets = []
+    let projectsAnatomicalFocusFacets = []
+    let projectsFundingFacets = []
     await client.getEntries({
-        content_type: 'awardSection',
+      content_type: 'awardSection',
+    })
+    .then(response => {
+      let facetData = []
+      const items = propOr([], 'items', response)
+      items.forEach(item => {
+        const label = pathOr('', ['fields','title'], item)
+        facetData.push({
+          label: label,
+          id: label,
+        })
       })
-      .then(async response => {
-        let facetData = []
-        const items = propOr([], 'items', response)
-        items.forEach(item => {
-          const label = pathOr('', ['fields','title'], item)
-          facetData.push({
-            label: label,
-            id: label,
+      projectsAnatomicalFocusFacets = facetData
+    })
+    await client.getContentType('sparcAward').then(contentType => {
+      contentType.fields.forEach((field) => {
+        if (field.name === 'Funding') {
+          let fundingItems = field.items?.validations[0]['in']
+          let facetData = []
+          fundingItems.forEach(itemLabel => {
+            facetData.push({
+              label: itemLabel,
+              id: itemLabel,
+            })
           })
-        })
-        projectsFacets = facetData
+          projectsFundingFacets = facetData
+        }
       })
+    })
     return {
-      projectsFacets
+      projectsAnatomicalFocusFacets,
+      projectsFundingFacets
+    }
+  },
+
+  head() {
+    return {
+      title: propOr("", "label", this.breadcrumb[this.breadcrumb.length - 1]),
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: propOr("", "label", this.breadcrumb[this.breadcrumb.length - 1]),
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'Browse datasets'
+        },
+      ]
     }
   },
 
   data: () => {
     return {
-      algoliaIndex: algoliaClient.initIndex(process.env.ALGOLIA_INDEX_PUBLISHED_TIME_DESC),
+      algoliaIndex: algoliaClient.initIndex(process.env.ALGOLIA_INDEX_VERSION_PUBLISHED_TIME_DESC),
       selectedAlgoliaSortOption: algoliaSortOptions[0],
       algoliaSortOptions,
       selectedProjectsSortOption: projectsSortOptions[0],
       projectsSortOptions,
       searchQuery: '',
       facets: [],
+      dataTypes: ['dataset', 'simulation', 'model', 'projects'],
+      humanReadableDataTypesLookup: {
+        dataset: 'Datasets',
+        model: 'Anatomical Models',
+        simulation: 'Computational Models',
+      },
+      resultCounts: {
+        model: 0,
+        dataset: 0,
+        simulation: 0,
+      },
+      searchHasAltResults: false,
       visibleFacets: {},
       searchTypes,
       searchData: clone(searchData),
@@ -304,7 +380,7 @@ export default {
               type: 'dataset'
             }
           },
-          label: 'Find Data'
+          label: 'Data & Models'
         },
       ],
       titleColumnWidth: 300,
@@ -376,18 +452,36 @@ export default {
   },
 
   watch: {
-    '$route.query.type': function(val) {
-      /**
-       * Clear table data so the new table that is rendered can
-       * properly render data and account for any missing data
-       */
-      if (!this.$route.query.type) {
-        const firstTabType = compose(propOr('', 'type'), head)(searchTypes)
-        this.$router.replace({ query: { type: firstTabType } })
-      } else {
-        this.searchData = clone(searchData)
-        this.fetchResults()
-      }
+    '$route.query.type': {
+      handler: function() {
+        /**
+         * Clear table data so the new table that is rendered can
+         * properly render data and account for any missing data
+         */
+        if (!this.$route.query.type) {
+          const firstTabType = compose(propOr('', 'type'), head)(searchTypes)
+          this.$router.replace({ query: { type: firstTabType } })
+        } else {
+          this.searchData = clone(searchData)
+          this.fetchResults()
+        }
+        const category = searchTypes.find(searchType => searchType.type == this.$route.query.type)
+        this.$gtm.push({
+          event: "",
+          event_name: '',
+          category: propOr('Datasets', 'label', category),
+          files: "",
+          file_name: "",
+          file_path: "",
+          file_type: "",
+          location: "",
+          dataset_id: "",
+          version_id: "",
+          doi: "",
+          citation_type: ""
+        })
+      },
+      immediate: true
     },
 
     '$route.query.search': {
@@ -395,7 +489,6 @@ export default {
         this.searchQuery = this.$route.query.search
         this.fetchResults()
       },
-      immediate: true
     },
 
     selectedAlgoliaSortOption: function(option) {
@@ -532,6 +625,10 @@ export default {
                 }
                 this.searchData = mergeLeft(searchData, this.searchData)
                 this.isLoadingSearch = false
+
+                // Update alternative search results
+                this.alternativeSearchUpdate()
+
                 // update facet result numbers
                 /*for (const [key, value] of Object.entries(this.visibleFacets)) {
                   if ( (this.$refs.datasetFacetMenu?.getLatestUpdateKey() === key && !this.$refs.datasetFacetMenu?.hasKeys()) || (this.$refs.datasetFacetMenu?.getLatestUpdateKey() !== key) ){
@@ -553,6 +650,51 @@ export default {
           }) 
     },
 
+    // alternaticeSearchUpdate: Updates this.resultCounts which is used for displaying other search options to the user
+    //    when a search returns 0 results
+    alternativeSearchUpdate: function() {
+      const searchTypeInURL = pathOr('dataset', ['query', 'type'], this.$route) // Get current data type
+
+      this.searchHasAltResults = false
+      for (let key in this.resultCounts) { // reset reults list
+        this.resultCounts[key] = 0
+      }
+      let altSearchTypes = this.dataTypes.filter(e => e !== searchTypeInURL) // Remove from list of data types
+
+      altSearchTypes.forEach(type => {  // Search on each data type remaining
+        this.searchContentsCheck(type)
+      })
+    },
+
+    //  searchContentsCheck(searchType): Takes in a search type and returns the number of datasets found with the current filters
+    searchContentsCheck: function(searchType) {
+      const query = this.$route.query.search
+
+      if (searchType !== 'projects'){
+
+        // Alogilia searches
+        const datasetsFilter =
+          searchType === 'simulation' ? '(NOT item.types.name:Dataset AND NOT item.types.name:Scaffold)' 
+            : searchType === 'model' ? '(NOT item.types.name:Dataset AND item.types.name:Scaffold)' 
+            : "item.types.name:Dataset"
+
+        var filters = this.$refs.datasetFacetMenu?.getFilters()
+        filters = filters === undefined ? 
+          `${datasetsFilter}` : 
+          filters + ` AND ${datasetsFilter}`
+
+        this.algoliaIndex
+          .search(query, {
+            facets: ['*'],
+            filters: filters
+          })
+          .then(response => {
+            response.nbHits > 0 ? (this.searchHasAltResults = true) : null
+            this.resultCounts[searchType] = response.nbHits
+          })
+      }
+    },
+
     /**
      * Get search results
      * This is using the contentful.js client
@@ -561,17 +703,19 @@ export default {
       this.isLoadingSearch = true
 
       var contentType = this.$route.query.type  
-      var sortOrder = undefined;
-      var anatomicalFocus = undefined;
+      var sortOrder = undefined
+      var anatomicalFocus = undefined
+      var funding = undefined
       var linkedEntriesTargetType = undefined
       if (this.$route.query.type === "projects") {
         contentType = 'sparcAward',
         sortOrder = this.selectedProjectsSortOption.sortOrder,
         anatomicalFocus = this.$refs.projectsFacetMenu?.getSelectedAnatomicalFocusTypes()
+        funding = this.$refs.projectsFacetMenu?.getSelectedFundingTypes()
         linkedEntriesTargetType = 'awardSection'
       }
       if (contentType === undefined) {
-        this.isLoadingSearch = false;
+        this.isLoadingSearch = false
       }
       else {
         client
@@ -583,10 +727,13 @@ export default {
             order: sortOrder,
             include: 2,
             'fields.projectSection.sys.contentType.sys.id': linkedEntriesTargetType,
-            'fields.projectSection.fields.title[in]' : anatomicalFocus
+            'fields.projectSection.fields.title[in]' : anatomicalFocus,
+            'fields.program[in]' : funding
           })
           .then(async response => {
             this.searchData = { ...response }
+            // Update alternative search results
+            this.alternativeSearchUpdate()
           })
           .catch(() => {
             this.searchData = clone(searchData)
@@ -756,7 +903,6 @@ export default {
     text-transform: none;
   }
   &:hover,
-  &:focus,
   &.active {
     color: white;
     background-color: $median;
diff --git a/pages/data/utils.ts b/pages/data/utils.ts
index a93ca710..14a69b18 100644
--- a/pages/data/utils.ts
+++ b/pages/data/utils.ts
@@ -155,45 +155,100 @@ export const extractExtension = (
 
 // Mapping between display categories and their Algolia index property path
 // Used for populating the Dataset Search Results facet menu dynamically
-export const facetPropPathMapping = {
-  'item.types.name' : 'Type',
-  'anatomy.organ.name' : 'Anatomical Structure',
-  'organisms.primary.species.name' : 'Species',
-  'item.modalities.keyword' : 'Experimental Approach',
-  'attributes.subject.sex.value' : 'Sex',
-  'attributes.subject.ageCategory.value' : 'Age Categories',
-}
-
-export const getAlgoliaFacets = function(algoliaIndex : SearchIndex, propPathMapping : Object, filters : string) {
-  const map = new Map(Object.entries(propPathMapping));
-  const facetPropPaths = Array.from(map.keys() );
-  var facetData: { label: string; id: number; children: object[]; key: string; }[] = []
+export const facetPropPathMapping = [
+  {
+    label: 'Type',
+    id: 'item.types',
+    facetPropPath: 'item.types.name',
+    facetSubpropPath: 'item.types.subcategory.name'
+  },
+  {
+    label: 'Anatomical Structure',
+    id: 'anatomy.organ.category',
+    facetPropPath: 'anatomy.organ.category.name',
+    facetSubpropPath: 'anatomy.organ.subcategory.name'
+  },
+  // This cannot be removed until the maps sidebar implements heirarchal facets. So in the meantime we simply don't make this category visible on the facet menu
+  {
+    label: 'Anatomical Structure',
+    id: 'anatomy.organ',
+    facetPropPath: 'anatomy.organ.name',
+    facetSubpropPath: 'anatomy.organ.subcategory.name'
+  },
+  {
+    label: 'Species',
+    id: 'organisms.primary.species',
+    facetPropPath: 'organisms.primary.species.name',
+    facetSubpropPath: 'organisms.primary.species.subcategory.name'
+  },
+  {
+    label: 'Experimental Approach',
+    id: 'item.modalities',
+    facetPropPath: 'item.modalities.keyword',
+    facetSubpropPath: 'item.modalities.subcategory.name'
+  },
+  {
+    label: 'Sex',
+    id: 'attributes.subject.sex',
+    facetPropPath: 'attributes.subject.sex.value',
+    facetSubpropPath: 'attributes.subject.sex.subcategory.name'
+  },
+  {
+    label: 'Age Categories',
+    id: 'attributes.subject.ageCategory',
+    facetPropPath: 'attributes.subject.ageCategory.value',
+    facetSubpropPath: 'attributes.subject.ageCategory.subcategory.name'
+  },
+]
+
+export const getAlgoliaFacets = function(algoliaIndex : SearchIndex, propPathMapping : Array<{id: string, facetPropPath: string, facetSubpropPath: string, label: string}>, filters : string) {
+  const facetPropPaths = propPathMapping.map(item => item.facetPropPath)
+  const facetSubpropPaths = propPathMapping.map(item => item.facetSubpropPath)
+  var facetData: { label: String, id: number, children: object[], key: string }[] = []
   var facetId = 0
   return algoliaIndex
     .search('', {
       sortFacetValuesBy: 'alpha',
-      facets: facetPropPaths,
+      facets: facetPropPaths.concat(facetSubpropPaths),
       filters: filters || ''
     })
     .then(response => {
       facetPropPaths.map((facetPropPath: string) => {
-        var children: { label: string; id: number; facetPropPath: string; }[] = []
+        const parentFacet = propPathMapping.find(item => item.facetPropPath == facetPropPath)
+        var children: { label: string, id: number, children: Object, facetPropPath: string }[] = []
         const responseFacets = response.facets
         if (responseFacets === undefined) {return}
         const responseFacetChildren =
           responseFacets[facetPropPath] == undefined
             ? {}
             : responseFacets[facetPropPath]
+        const allPossibleChildrenSubfacets = parentFacet && responseFacets[parentFacet.facetSubpropPath] ? Object.keys(responseFacets[parentFacet.facetSubpropPath]) : []
         Object.keys(responseFacetChildren).map(facet => {
+          const childrenSubfacets = allPossibleChildrenSubfacets.reduce((filtered, childFacetInfo) => {
+            const info = childFacetInfo.split('.')
+            if (info.length != 2) {
+              return filtered
+            }
+            if (facet == info[0]) {
+              filtered.push({
+                label: childFacetInfo, 
+                id: facetId++,
+                facetPropPath: `${parentFacet?.facetSubpropPath}`
+              })
+            }
+           return filtered;
+          }
+          , Array<{label: string, id: number, facetPropPath: string}>())
           children.push({
             label: facet,
             id: facetId++,
+            children: childrenSubfacets,
             facetPropPath: facetPropPath
           })
         })
         if (children.length > 0) {
           facetData.push({
-            label: map.get(facetPropPath),
+            label: parentFacet?.label || '',
             id: facetId++,
             children: children,
             key: facetPropPath
@@ -220,13 +275,103 @@ export const HIGHLIGHT_HTML_TAG = 'b'
  */
 export const highlightMatches = (text: string, search: string): string => {
   if (text && search) {
+    // Replacement fn
+    const replaceHtmlTextNoHref = (html: string, term: string) => {
+      let savedIndex = 0
+      let i = 0
+      let j = 0
+      let quoteChar = '"'
+      let res = ''
+      const regExp = new RegExp(term, 'ig')
+      while (i < html.length - 6) {
+        if (html[i] === 'h' && html[i + 1] === 'r' && html[i + 2] === 'e' && html[i + 3] === 'f' && html[i + 4] === '=') {
+          // Found an href
+          quoteChar = html[i + 5]
+          // Add previous substr with replaced hits
+          res += html.slice(savedIndex, i + 6).replace(regExp, `<${HIGHLIGHT_HTML_TAG}>$&</${HIGHLIGHT_HTML_TAG}>`)
+          savedIndex = i + 6
+          j = savedIndex
+          while (j < html.length && html[j] !== quoteChar) {
+            j++
+          }
+          // j contains end of href, add without replacement
+          res += html.slice(savedIndex, j)
+          savedIndex = i = j
+        }
+        else {
+          i++
+        }
+      }
+      // Add remaining
+      res += html.slice(savedIndex).replace(regExp, '<b>$&</b>')
+      return res
+    }
     const terms = search.split(' ')
     let result = text
     terms.forEach(t => {
       const trimmed = t.replace(/^"|"$/, '') // Trims out double quotes that could be used in searching
-      result = result.replace(new RegExp(trimmed, 'ig'), `<${HIGHLIGHT_HTML_TAG}>$&</${HIGHLIGHT_HTML_TAG}>`)
+      result = replaceHtmlTextNoHref(result, trimmed)
     })
     return result
   }
   return text
 }
+
+export const saveForm = (payload: any): void => {
+  const { user, ...rest } = payload
+  saveJsonToSessionStorage(user, 'userDataForm')
+}
+
+export const loadForm = (): any => {
+  const user = loadJsonFromSessionStorage('userDataForm')
+  if (user == null) {
+    return null
+  }
+  return {
+    user
+  }
+}
+
+export const saveJsonToSessionStorage = (payload: any, storageKey: string): void => {
+  try {
+    const json = JSON.stringify(payload)
+    sessionStorage.setItem(storageKey, json)
+  }
+  catch {
+    console.error('Could not serialize object to JSON for storing it')
+  }
+}
+
+export const loadJsonFromSessionStorage = (storageKey: string): any => {
+  const json = sessionStorage.getItem(storageKey)
+  if (json) {
+    try {
+      return JSON.parse(json)
+    }
+    catch {
+      console.error('Could not deserialize stored form to a JS object')
+    }
+  }
+}
+
+/**
+ * Function used in contact form templates to populate the form with the user info
+ * coming from its login profile.
+ * @param form Form data to populate
+ * @param firstName First name of the user as found in log in info
+ * @param lastName Last Name of the user as found in log in info
+ * @param email Email of the user as found in log in info
+ */
+export const populateFormWithUserData = (form: any, firstName?: string, lastName?: string, email?: string) => {
+  if (form.user) {
+    if (firstName) {
+      form.user.firstName = firstName
+    }
+    if (lastName) {
+      form.user.lastName = lastName
+    }
+    if (email) {
+      form.user.email = email
+    }
+  }
+}
diff --git a/pages/datasets/_datasetId.vue b/pages/datasets/_datasetId.vue
index 5ee9b099..f4868fee 100644
--- a/pages/datasets/_datasetId.vue
+++ b/pages/datasets/_datasetId.vue
@@ -25,60 +25,59 @@
                 :numCitations="numCitations"
                 :numDownloads="numDownloads"
               />
-              <div class="tabs-container mt-16 mb-0 mx-0 p-16">
-                <content-tab-card
-                  id="datasetDetailsTabsContainer"
-                  :tabs="tabs"
-                  :active-tab-id="activeTabId"
-                  @tab-changed="tabChanged"
-                  linkComponent="nuxt-link"
-                  routeName="datasetDetailsTab"
-                >
-                  <dataset-description-info
-                    v-show="activeTabId === 'abstract'"
-                    :markdown="markdown"
-                    :dataset-records="datasetRecords"
-                    :loading-markdown="loadingMarkdown"
-                    :dataset-tags="datasetTags"
-                  />
-                  <dataset-about-info
-                    v-show="activeTabId === 'about'"
-                    :latestVersionRevision="latestVersionRevision"
-                    :latestVersionDate="latestVersionDate"
-                    :associated-projects="associatedProjects"
-                  />
-                  <citation-details
-                    v-show="activeTabId === 'cite'"
-                    :doi-value="datasetInfo.doi"
-                  />
-                  <dataset-files-info
-                    v-if="hasFiles"
-                    v-show="activeTabId === 'files'"
-                    :osparc-viewers="osparcViewers"
-                    :dataset-scicrunch="scicrunchData"
-                  />
-                  <images-gallery
-                    v-if="hasGalleryImages"
-                    v-show="activeTabId === 'images'"
-                    :markdown="markdown.markdownTop"
-                    :dataset-biolucida="biolucidaImageData"
-                    :dataset-scicrunch="scicrunchData"
-                    :timeseries-data="timeseriesData"
-                  />
-                  <dataset-references
-                    v-if="hasCitations"
-                    v-show="activeTabId === 'references'"
-                    :primary-publications="primaryPublications"
-                    :associated-publications="associatedPublications"
-                  />
-                  <version-history
-                    v-if="canViewVersions"
-                    v-show="activeTabId === 'versions'"
-                    :versions="versions"
-                    :changelog-files="changelogFiles"
-                  />
-                </content-tab-card>
-              </div>
+              <content-tab-card
+                class="mt-32"
+                id="datasetDetailsTabsContainer"
+                :tabs="tabs"
+                :active-tab-id="activeTabId"
+                @tab-changed="tabChanged"
+                linkComponent="nuxt-link"
+                routeName="datasetDetailsTab"
+              >
+                <dataset-description-info
+                  class="body1"
+                  v-show="activeTabId === 'abstract'"
+                  :markdown="markdown"
+                  :dataset-records="datasetRecords"
+                  :loading-markdown="loadingMarkdown"
+                  :dataset-tags="datasetTags"
+                />
+                <dataset-about-info
+                  class="body1"
+                  v-show="activeTabId === 'about'"
+                  :latestVersionRevision="latestVersionRevision"
+                  :latestVersionDate="latestVersionDate"
+                  :associated-projects="associatedProjects"
+                />
+                <citation-details
+                  class="body1"
+                  v-show="activeTabId === 'cite'"
+                  :doi-value="datasetInfo.doi"
+                />
+                <dataset-files-info
+                  class="body1"
+                  v-if="hasFiles"
+                  v-show="activeTabId === 'files'"
+                />
+                <images-gallery
+                  class="body1"
+                  :markdown="markdown.markdownTop"
+                  v-show="activeTabId === 'images'"
+                />
+                <dataset-references
+                  v-if="hasCitations"
+                  class="body1"
+                  v-show="activeTabId === 'references'"
+                  :primary-publications="primaryPublications"
+                  :associated-publications="associatedPublications"
+                />
+                <version-history
+                  v-if="canViewVersions"
+                  class="body1"
+                  v-show="activeTabId === 'versions'"
+                  :versions="versions"
+                />
+              </content-tab-card>
             </div>
           </div>
         </div>
@@ -95,7 +94,7 @@
 <script>
 import marked from 'marked'
 import { mapState } from 'vuex'
-import { clone, propOr, isEmpty, pathOr, head, compose } from 'ramda'
+import { clone, propOr, pathOr, head, compose } from 'ramda'
 import { getAlgoliaFacets, facetPropPathMapping } from '../../pages/data/utils'
 import createAlgoliaClient from '@/plugins/algolia.js'
 
@@ -121,14 +120,9 @@ import FormatStorage from '@/mixins/bf-storage-metrics'
 import { getLicenseLink, getLicenseAbbr } from '@/static/js/license-util'
 
 import Scaffolds from '@/static/js/scaffolds.js'
-import Uberons from '@/static/js/uberon-map.js'
 
 import createClient from '@/plugins/contentful.js'
 
-import biolucida from '@/services/biolucida'
-import scicrunch from '@/services/scicrunch'
-import flatmaps from '~/services/flatmaps'
-
 import { failMessage } from '@/utils/notification-messages'
 
 const client = createClient()
@@ -152,6 +146,10 @@ const tabs = [
     label: 'Cite',
     id: 'cite'
   },
+  {
+    label: 'Gallery',
+    id: 'images'
+  },
 ]
 
 const getDatasetFacetsData = async (route) => {
@@ -162,21 +160,6 @@ const getDatasetFacetsData = async (route) => {
   })
 }
 
-/**
- * Get organ entries from contentful
- * @returns {Array}
- */
-const getOrganEntries = async () => {
-  try {
-    const organEntries = await client.getEntries({
-      content_type: process.env.ctf_organ_id
-    })
-    return organEntries.items || []
-  } catch (error) {
-    return []
-  }
-}
-
 /**
  * Get associated project from contentful
  * @returns {Array}
@@ -235,19 +218,6 @@ const getDatasetDetails = async (datasetId, version, userToken, datasetTypeName,
           }
         })
 
-  const datasetOwnerId = propOr('', 'ownerId', datasetDetails)
-  const datasetOwnerEmail = await $axios
-    .$get(`${process.env.portal_api}/get_owner_email/${datasetOwnerId}`)
-    .then(resp => {
-      return resp.email
-    })
-    .catch(() => {
-      return ''
-    })
-
-  if (datasetDetails)
-    datasetDetails.ownerEmail = datasetOwnerEmail
-
   return datasetDetails
 }
 
@@ -283,100 +253,6 @@ const getDownloadsSummary = async ($axios) => {
   }
 }
 
-const getBiolucidaData = async datasetId => {
-  try {
-    return biolucida.searchDataset(datasetId)
-  } catch (e) {
-    return {}
-  }
-}
-
-/**
- * Get data for objects that have a data specific viewer.
- * @param {Number} datasetId
- */
-const getThumbnailData = async (datasetDoi, datasetId, datasetVersion, datasetFacetsData) => {
-  let biolucidaImageData = {}
-  let scicrunchData = {}
-  try {
-    const [biolucida_response, scicrunch_response] = await Promise.all([
-      getBiolucidaData(datasetId),
-      scicrunch.getDatasetInfoFromDOI(datasetDoi)
-    ])
-
-    if (biolucida_response.status === 'success') {
-      biolucidaImageData = biolucida_response
-      biolucidaImageData['discover_dataset_version'] = datasetVersion
-    }
-    if (scicrunch_response.data.result.length > 0) {
-      scicrunchData = scicrunch_response.data.result[0]
-      scicrunchData.discover_dataset = {
-        id: Number(datasetId),
-        version: datasetVersion
-      }
-      // Check for flatmap data
-      if (scicrunchData.organs) {
-        let flatmapData = []
-        let species = undefined
-        // Get species data from algolia if it exists
-        if (datasetFacetsData){
-          let speciesArray = datasetFacetsData.filter(item=>item.label==="Species")
-          if (speciesArray && speciesArray.length > 0)
-            species = speciesArray[0].children[0].label.toLowerCase()
-        }
-
-        // check if there is a flatmap for the given species, use a rat if there is not
-        const taxo = species && species in Uberons.species ? Uberons.species[species] : Uberons.species['rat']
-
-        // Check if flatmap has the anatomy for this species. This is done by asking the flatmap knowledge base
-        // if a flatmap of (species) has (anatomy)
-        let foundAnatomy = []
-        if (scicrunchData.organs[0]) { // Check if dataset has organ annotation
-          // Send a requst to flatmap knowledgebase
-          const anatomy = scicrunchData.organs.map(organ => organ.curie)
-          const data = await flatmaps.anatomyQuery(taxo, anatomy)
-
-          // Check request was successful
-          const anatomyResponse = data.data ? data.data.values : undefined
-          if (anatomyResponse && anatomyResponse.length > 0) {
-            foundAnatomy = anatomyResponse.map(val => val[1]) // uberon is stored in second element of tuple
-          }
-        }
-
-        // Add flatmaps that match the anatomy and taxonomy to the gallery
-        scicrunchData.organs.forEach(organ => {
-          if (foundAnatomy.includes(organ.curie)){
-            let organData = {
-              taxo,
-              uberonid: organ.curie,
-              organ: organ.name,
-              id: datasetId,
-              version: datasetVersion,
-              species: species
-            }
-            flatmapData.push(organData)
-          }
-        })
-        //Only create a flatmaps field if flatmapData is not empty
-        if (flatmapData.length > 0)
-          scicrunchData['flatmaps'] = flatmapData
-      }
-    }
-  } catch (e) {
-    console.error(
-      'Hit error in the scicrunch processing. ( pages/_datasetId.vue ). Error: ',
-      e
-    )
-    return {
-      biolucidaImageData: {},
-      scicrunchData: {}
-    }
-  }
-  return {
-    biolucidaImageData,
-    scicrunchData
-  }
-}
 
 export default {
   name: 'DatasetDetails',
@@ -407,12 +283,11 @@ export default {
     const datasetFacetsData = await getDatasetFacetsData(route)
     const typeFacet = datasetFacetsData.find(child => child.key === 'item.types.name')
     const datasetTypeName = typeFacet !== undefined ? typeFacet.children[0].label : 'dataset'
-    const userToken = app.$cookies.get('user-token')
+    const userToken = app.$cookies.get('user-token') || store.getters.cognitoUserToken
 
     const errorMessages = []
 
-    const [organEntries, datasetDetails, versions, downloadsSummary] = await Promise.all([
-      getOrganEntries(),
+    const [datasetDetails, versions, downloadsSummary] = await Promise.all([
       getDatasetDetails(
         datasetId,
         route.params.version,
@@ -429,89 +304,16 @@ export default {
       error({ statusCode: 400, message: ErrorMessages.methods.discover(), display: true})
     }
 
-    const { biolucidaImageData, scicrunchData } = await getThumbnailData(
-      datasetDetails.doi,
-      datasetId,
-      datasetDetails.version,
-      datasetFacetsData
-    )
- 
-    if ( Object.keys(biolucidaImageData).length === 0 &&
-      Object.keys(scicrunchData).length === 0 ) {
-      //Non critical error
-      errorMessages.push(ErrorMessages.methods.scicrunch())
-    }
-
-    datasetDetails.sciCrunch = scicrunchData;
-
-    // Get oSPARC file viewers
-    const osparcViewers = await $axios
-      .$get(`${process.env.portal_api}/get_osparc_data`)
-      .then(osparcData => osparcData['file_viewers'])
-      .catch(() => {
-        return {}
-      })
-    
-    // Get all timeseries files (those with an '.edf' extension)
-    const timeseriesData = process.env.SHOW_TIMESERIES_VIEWER
-      ? await $axios.$get(`${process.env.discover_api_host}/search/files?fileType=edf&datasetId=${datasetId}`)
-        .then(({ files }) => {
-          let data = []
-          files.forEach(file => {
-            const filePath = file.uri.substring(file.uri.indexOf('files'))
-            const linkUrl =
-                process.env.ROOT_URL +
-                `/datasets/timeseriesviewer?&dataset_id=${file.datasetId}&dataset_version=${file.datasetVersion}&file_path=${filePath}`
-
-            data.push({
-              title: file.name,
-              type: 'Timeseries',
-              thumbnail: undefined,
-              link: linkUrl
-            })
-          })
-          return data
-        })
-        .catch(() => {
-          return []
-        }) 
-      : []
-
-    const changelogFileRequests = []
-    versions.forEach(({ version }) => {
-      var changelogEndpoint = `${process.env.discover_api_host}/datasets/${datasetId}/versions/${version}/files?path=changelog.md`
-      if (userToken) { changelogEndpoint += `&api_key=${userToken}` }
-      changelogFileRequests.push(
-        $axios.$get(changelogEndpoint).then(response => {
-          return [{
-            ...response,
-            version: version
-          }]
-        }).catch(() => {
-          console.log("There is no changelog file associated with this dataset")
-          return [{}]
-        })
-      )
-    })
-
-    const [changelogFiles] = await Promise.all(changelogFileRequests)
-
     store.dispatch('pages/datasets/datasetId/setDatasetInfo', datasetDetails)
     store.dispatch('pages/datasets/datasetId/setDatasetFacetsData', datasetFacetsData)
     store.dispatch('pages/datasets/datasetId/setDatasetTypeName', datasetTypeName)
 
     return {
-      biolucidaImageData,
-      entries: organEntries,
-      osparcViewers,
-      scicrunchData,
       tabs: tabsData,
       versions,
       datasetTypeName,
       downloadsSummary,
-      showTombstone: datasetDetails.isUnpublished,
-      changelogFiles,
-      timeseriesData,
+      showTombstone: propOr(false, 'isUnpublished', datasetDetails),
       errorMessages
     }
   },
@@ -542,17 +344,50 @@ export default {
               type: this.$route.query.type
             }
           },
-          label: 'Find Data'
+          label: 'Data & Models'
         }
       ],
       subtitles: [],
-      ctfDatasetFormatInfoPageId: process.env.ctf_dataset_format_info_page_id,
       errorMessages: [],
     }
   },
 
+  async fetch() {
+    const datasetOwnerId = propOr('', 'ownerId', this.datasetInfo)
+    const datasetOwnerEmail = await this.$axios
+      .$get(`${process.env.portal_api}/get_owner_email/${datasetOwnerId}`)
+      .then(resp => {
+        return resp.email
+      })
+      .catch(() => {
+        return ''
+      })
+
+    if (this.datasetInfo)
+      this.$store.dispatch('pages/datasets/datasetId/setDatasetInfo', { ...this.datasetInfo, 'ownerEmail': datasetOwnerEmail })
+  },
+
+  mounted() {
+    this.$gtm.push({
+      event: "",
+      category: "",
+      dataset_id: propOr(this.$route.params.datasetId, 'id', this.datasetInfo),
+      version_id: propOr('', 'version', this.datasetInfo),
+      doi: propOr('', 'doi', this.datasetInfo),
+      event_name: "",
+      citation_type: "",
+      location: "",
+      files: "",
+      file_name: "",
+      file_path: "",
+      file_type: "",
+    })
+  },
+
   computed: {
-    ...mapState('pages/datasets/datasetId', ['datasetInfo']),
+    ...mapState('pages/datasets/datasetId', 
+      ['datasetInfo', 'datasetFacetsData']
+    ),
     defaultTab() {
       return this.tabs[0].id
     },
@@ -619,7 +454,13 @@ export default {
     datasetLicenseName: function() {
       return propOr('', 'license', this.datasetInfo)
     },
-
+    /**
+     * Returns dataset banner
+     * @returns {String}
+     */
+     getDatasetImage: function() {
+      return propOr('', 'banner', this.datasetInfo)
+    },
     /**
      * Returns the list of contributors who contributed to the dataset
      * @returns {String}
@@ -769,19 +610,6 @@ export default {
     hasFiles: function() {
       return this.fileCount >= 1
     },
-    hasGalleryImages: function() {
-      //Check if the data compatible with image gallery exists in biolucida image data and scicrunch data
-      return !this.embargoed &&
-        (('dataset_images' in this.biolucidaImageData &&
-          this.biolucidaImageData.dataset_images.length > 0) ||
-        ('abi-scaffold-metadata-file' in this.scicrunchData) ||
-        ('video' in this.scicrunchData) ||
-        ('flatmaps' in this.scicrunchData) ||
-        ('mbf-segmentation' in this.scicrunchData) ||
-        ('abi-plot' in this.scicrunchData) ||
-        ('common-images' in this.scicrunchData) ||
-        !isEmpty(this.timeseriesData))
-    },
     fileCount: function() {
       return propOr('0', 'fileCount', this.datasetInfo)
     },
@@ -823,7 +651,6 @@ export default {
     errorMessages: {
       handler: function() {
         //Non critical error messages
-        console.log(this.errorMessages)
         this.errorMessages.forEach(message => {
           this.$message(failMessage(message))
         })
@@ -843,17 +670,6 @@ export default {
       },
       immediate: true
     },
-    hasGalleryImages: {
-      handler: function(newValue) {
-        if (newValue) {
-          const hasGalleryTab = this.tabs.find(tab => tab.id === 'images') !== undefined
-          if (!hasGalleryTab) {
-            this.tabs.splice(4, 0, { label: 'Gallery', id: 'images' })
-          }
-        }
-      },
-      immediate: true
-    },
     hasCitations: {
       handler: function(newValue) {
         if (newValue) {
@@ -876,19 +692,6 @@ export default {
       },
       immediate: true
     },
-    datasetTags: {
-      handler: function(val) {
-        if (val) {
-          this.entries.forEach(entry => {
-            const name = pathOr('', ['fields', 'name'], entry)
-            if (this.datasetTags.includes(name.toLowerCase())) {
-              this.subtitles.push(entry.fields.name)
-            }
-          })
-        }
-      },
-      immediate: true
-    }
   },
   methods: {
     tabChanged(newTab) {
@@ -1023,7 +826,7 @@ export default {
     const creators = contributors.concat(org)
 
     return {
-      title: `${this.datasetTitle} - SPARC Portal`,
+      title: this.datasetTitle,
       meta: [
         {
           name: 'DC.type',
@@ -1046,11 +849,13 @@ export default {
           content: 'website'
         },
         {
+          hid: 'og:title',
           property: 'og:title',
           content: this.datasetTitle
         },
         {
-          property: 'og:description',
+          hid: 'description',
+          name: 'description',
           content: this.datasetDescription
         },
         {
@@ -1102,10 +907,6 @@ export default {
         {
           name: 'DC.version',
           content: this.datasetInfo.version
-        },
-        {
-          property: 'og:url',
-          content: process.env.siteUrl
         }
       ],
       script: [
@@ -1123,7 +924,7 @@ export default {
             description: this.datasetDescription,
             license: this.licenseLink,
             version: this.datasetInfo.version,
-            url: process.env.siteUrl,
+            url: process.env.ROOT_URL,
             citation: this.citationText,
             identifier: this.doiLink,
             isAccessibleForFree: true
@@ -1135,7 +936,7 @@ export default {
           json: {
             '@context': 'http://schema.org',
             '@type': 'WebSite',
-            url: process.env.siteUrl,
+            url: process.env.ROOT_URL,
             name: 'Pennsieve Discover'
           },
           type: 'application/ld+json'
@@ -1154,10 +955,6 @@ export default {
     margin-top: 0;
   }
 }
-.tabs-container {
-  border: solid 1px $lineColor1;
-  background: white;
-}
 ::v-deep .details-tabs__container--data {
   padding-top: 0;
 }
diff --git a/pages/datasets/biolucidaviewer/_id.vue b/pages/datasets/biolucidaviewer/_id.vue
index 3747bb28..aeaf51cb 100644
--- a/pages/datasets/biolucidaviewer/_id.vue
+++ b/pages/datasets/biolucidaviewer/_id.vue
@@ -1,248 +1,46 @@
-<template>
-  <div class="file-detail-page">
-    <div class="page-wrap container">
-      <detail-tabs
-        :tabs="tabs"
-        :active-tab="activeTab"
-        class="container"
-        @set-active-tab="activeTab = $event"
-      >
-        <biolucida-viewer
-          v-show="activeTab === 'viewer'"
-          :data="biolucidaData"
-        />
-      </detail-tabs>
-      <div class="subpage pt-0 pb-16">
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Dataset</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: 'datasets-datasetId',
-                params: {
-                  datasetId
-                }
-              }"
-            >
-              {{ title }}
-            </nuxt-link>
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Filename</strong>
-          <div class="file-detail__column_2">
-            {{ image_info.name }}
-          </div>
-        </div>
-        <div v-if="filePath" class="file-detail">
-          <strong class="file-detail__column_1">File location</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: `datasets-datasetId`,
-                params: {
-                  datasetId: datasetId
-                },
-                query: {
-                  datasetDetailsTab: 'files',
-                  path: fileFolderLocation
-                }
-              }"
-            >
-              {{ filePath }}
-            </nuxt-link>
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Data collection</strong>
-          <div class="file-detail__column_2">
-            {{ data_collection }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Modality</strong>
-          <div class="file-detail__column_2">
-            {{ xmp_metadata.modality }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Channel target labels</strong>
-          <div class="file-detail__column_2">
-            <image-channels :channel-colours="xmp_metadata.channel_colours" />
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Image scaling</strong>
-          <div class="file-detail__column_2">
-            <image-scaling
-              :x-scale="xmp_metadata.pixel_height"
-              :y-scale="xmp_metadata.pixel_width"
-              :z-scale="xmp_metadata.z_spacing"
-            />
-          </div>
-        </div>
-        <div v-if="filePath" class="pt-16">
-          <bf-button @click="requestDownloadFile(file)">
-            Download file
-          </bf-button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
 <script>
 import biolucida from '@/services/biolucida'
 import scicrunch from '@/services/scicrunch'
-
-import BiolucidaViewer from '@/components/BiolucidaViewer/BiolucidaViewer'
-import DetailTabs from '@/components/DetailTabs/DetailTabs.vue'
-import ImageScaling from '@/components/Images/ImageScaling.vue'
-import ImageChannels from '@/components/Images/ImageChannels.vue'
-import BfButton from '@/components/shared/BfButton/BfButton.vue'
-
 import { pathOr } from 'ramda'
-
-import ErrorMessages from '@/mixins/error-messages'
-import RequestDownloadFile from '@/mixins/request-download-file'
-import FetchPennsieveFile from '@/mixins/fetch-pennsieve-file'
-import MarkedMixin from '@/mixins/marked'
-import FileDetails from '@/mixins/file-details'
-
-import { extractSection } from '@/utils/common'
-
+// Need to re-direct from the old path of /datasets/biolucidaviewer/{imageId}?view={viewId}&dataset_version={id}&dataset_id={id}&item_id={packageId} to the corresponding file with that viewer:
+// Example: https://sparc.science/datasets/biolucidaviewer/7543?view=NzU0My1jb2wtMTk0&dataset_version=2&dataset_id=226&item_id=N%3Apackage%3A2c9b015d-1357-42be-945d-f8099adea9b5 now maps to
+// https://sparc.science/datasets/file/226/2?path=files%2Fderivative%2Fsub-10896%2Fsam-3%2F896-5_F1.jp2
 export default {
   name: 'BiolucidaViewerPage',
 
-  components: {
-    BiolucidaViewer,
-    BfButton,
-    DetailTabs,
-    ImageScaling,
-    ImageChannels
-  },
-
-  mixins: [FileDetails, MarkedMixin, RequestDownloadFile, FetchPennsieveFile],
-
-  async asyncData({ route, error, $axios }) {
-    try {
-      const image_identifier = route.params.id
-      const identifier = route.query.item_id.substring(2)
-
-      const [
-        blv_link,
-        image_info,
-        dataset_response,
-        xmp_metadata
-      ] = await Promise.all([
-        biolucida.getBLVLink(image_identifier),
-        biolucida.getImageInfo(image_identifier),
-        scicrunch.getDatasetInfoFromObjectIdentifier(identifier),
-        biolucida.getXMPInfo(image_identifier)
-      ])
-
-      let dataset_info = dataset_response.data.result[0]
-      let file = {}
-      if (dataset_info === undefined) {
-        dataset_info = { readme: '', title: '' }
-      } else {
-        // Find the biolucida object with the same image name to determine the file path
-        const biolucidaObjects = pathOr(
-          [],
-          ['biolucida-2d'],
-          dataset_info
-        ).concat(pathOr([], ['biolucida-3d'], dataset_info))
-        const biolucidaObject = biolucidaObjects.find(biolucidaObject => {
-          return pathOr('', ['dataset', 'path'], biolucidaObject).includes(
-            image_info.name
-          )
-        })
-        const filePath = `files/${pathOr(
-          '',
-          ['dataset', 'path'],
-          biolucidaObject
-        )}`
-        file = await FetchPennsieveFile.methods.fetchPennsieveFile(
-          $axios,
-          filePath,
-          route.query.dataset_id,
-          route.query.dataset_version,
-          error
+  async asyncData({ redirect, route }) {
+    const image_identifier = route.params.id
+    const datasetId = route.query.dataset_id
+    const versionId = route.query.dataset_version
+    const [
+      image_info,
+      dataset_response
+    ] = await Promise.all([
+      biolucida.getImageInfo(image_identifier),
+      scicrunch.getDatasetInfoFromPennsieveIdentifier(datasetId)
+    ])
+    let dataset_info = dataset_response.data.result[0]
+    if (dataset_info === undefined) {
+      redirect(`/datasets/file/${datasetId}/${versionId}`)
+    } else {
+      // Find the biolucida object with the same image name to determine the file path
+      const biolucidaObjects = pathOr(
+        [],
+        ['biolucida-2d'],
+        dataset_info
+      ).concat(pathOr([], ['biolucida-3d'], dataset_info))
+      const biolucidaObject = biolucidaObjects.find(biolucidaObject => {
+        return pathOr('', ['dataset', 'path'], biolucidaObject).includes(
+          image_info.name
         )
-      }
-
-      return {
-        blv_link: blv_link['link'],
-        image_info,
-        xmp_metadata,
-        dataset_info,
-        file
-      }
-    }
-    catch (e) {
-      const message = ErrorMessages.methods.biolucida()
-      return error({ statusCode: 400, message: message, display: true, error: e})
-    }
-  },
-
-  data: () => {
-    return {
-      tabs: [
-        {
-          label: 'Image Viewer',
-          type: 'viewer'
-        }
-      ],
-      activeTab: 'viewer',
-      data_collection: '',
-      queryView: false
-    }
-  },
-
-  computed: {
-    /**
-     * Compute biolucida data
-     * @returns {Object}
-     */
-    biolucidaData: function() {
-      return {
-        biolucida_image_id: '',
-        blv_link: this.blv_link,
-        share_link: process.env.BL_SHARE_LINK_PREFIX + this.$route.query.view,
-        status: '',
-        location: this.$route.query.location
-      }
-    },
-
-    title: function() {
-      return this.dataset_info.title
-    },
-
-    readme: function() {
-      return this.dataset_info.readme
-    },
-
-    /**
-     * Return the dataset id from the route query.
-     * @returns String
-     */
-    datasetId: function() {
-      return this.$route.query.dataset_id
-    }
-  },
-
-  mounted: function() {
-    const html = this.parseMarkdown(this.readme)
-    this.data_collection = extractSection(/data collect[^:]+:/i, html)
-  },
-  methods: {
-    copyLink: function() {
-      this.queryView = !this.queryView
+      })
+      const filePath = `files/${pathOr(
+        '',
+        ['dataset', 'path'],
+        biolucidaObject
+      )}`
+      redirect(`/datasets/file/${datasetId}/${versionId}?path=${filePath}`)
     }
   }
 }
 </script>
-
-<style scoped lang="scss">
-@import '@/assets/_viewer.scss';
-</style>
diff --git a/pages/datasets/file/_datasetId/_datasetVersion/index.vue b/pages/datasets/file/_datasetId/_datasetVersion/index.vue
new file mode 100644
index 00000000..e31a0f87
--- /dev/null
+++ b/pages/datasets/file/_datasetId/_datasetVersion/index.vue
@@ -0,0 +1,388 @@
+<template>
+  <div class="pb-32">
+    <breadcrumb :breadcrumb="breadcrumb" :title="fileName" />
+    <div class="page-wrap container">
+      <form ref="zipForm" method="POST" :action="zipitUrl">
+        <input v-model="zipData" type="hidden" name="data" />
+      </form>
+      <client-only>
+        <content-tab-card
+          v-if="hasViewer"
+          class="mt-24"
+          :tabs="tabs"
+          :active-tab-id="activeTabId"
+        >
+          <biolucida-viewer
+            v-if="hasBiolucidaViewer"
+            v-show="activeTabId === 'imageViewer'"
+            :data="biolucidaData"
+            :datasetInfo="datasetInfo"
+            :file="file"
+          />
+          <segmentation-viewer
+            v-if="hasSegmentationViewer"
+            v-show="activeTabId === 'segmentationViewer'"
+            :data="segmentationData"
+            :datasetInfo="datasetInfo"
+            :file="file"
+          />
+          <plot-viewer
+            v-if="hasPlotViewer"
+            v-show="activeTabId === 'plotViewer'"
+            :plotData="plotData"
+            :datasetInfo="datasetInfo"
+            :file="file"
+          />
+          <video-viewer
+            v-if="hasVideoViewer"
+            v-show="activeTabId === 'videoViewer'"
+            :videoData="videoData"
+            :videoSource="signedUrl"
+            :datasetInfo="datasetInfo"
+            :file="file"
+          />
+        </content-tab-card>
+      </client-only>
+      <file-viewer-metadata
+        v-if="!hasViewer"
+        :datasetInfo="datasetInfo"
+        :file="file"
+        @download-file="executeDownload"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import discover from '@/services/discover'
+import biolucida from '@/services/biolucida'
+import scicrunch from '@/services/scicrunch'
+import BiolucidaViewer from '@/components/BiolucidaViewer/BiolucidaViewer'
+import PlotViewer from '@/components/PlotViewer/PlotViewer'
+import VideoViewer from '@/components/VideoViewer/VideoViewer'
+import SegmentationViewer from '@/components/SegmentationViewer/SegmentationViewer'
+import DetailTabs from '@/components/DetailTabs/DetailTabs.vue'
+import FileViewerMetadata from '@/components/ViewersMetadata/FileViewerMetadata.vue'
+import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
+
+import DatasetInfo from '@/mixins/dataset-info'
+import FormatDate from '@/mixins/format-date'
+import FetchPennsieveFile from '@/mixins/fetch-pennsieve-file'
+import FileDetails from '@/mixins/file-details'
+
+import { extractS3BucketName } from '@/utils/common'
+
+import { isEmpty, pathOr, propOr } from 'ramda'
+
+export default {
+  name: 'DatasetFileDetailPage',
+
+  components: {
+    Breadcrumb,
+    BiolucidaViewer,
+    PlotViewer,
+    VideoViewer,
+    SegmentationViewer,
+    FileViewerMetadata,
+    DetailTabs,
+  },
+
+  mixins: [
+    DatasetInfo,
+    FormatDate,
+    FetchPennsieveFile,
+    FileDetails
+  ],
+
+  async asyncData({ app, redirect, route, error, $axios }) {
+    const datasetInfo = await DatasetInfo.methods.getDatasetInfo(
+      $axios,
+      route.params.datasetId,
+      route.params.datasetVersion,
+      app.$cookies.get('user-token')
+    )
+    const s3Bucket = datasetInfo ? extractS3BucketName(datasetInfo.uri) : undefined
+    const filePath = route.query.path   
+    const file = await FetchPennsieveFile.methods.fetchPennsieveFile(
+      $axios,
+      filePath,
+      route.params.datasetId,
+      route.params.datasetVersion,
+      error
+    )
+
+    // We should just be able to do as below and pull the source package id from file, but there are sometimes discrepancies between the pennsieve file sourcePackageId and the biolucida image data sourcePackageId returned from sparc.biolucida.net
+    // const sourcePackageId = file.sourcePackageId
+    // So now we must pull all the images from the dataset, then get each ones dataset info (to use the file name to map it) so that we can get the source package id from the right image 
+    let sourcePackageId = ""
+    const biolucidaSearchResults = await biolucida.searchDataset(route.params.datasetId)
+    const imagesData = biolucidaSearchResults['dataset_images']
+    if (imagesData != undefined) {
+      await Promise.all(imagesData.map(async image => {
+        const imageInfo = await biolucida.getImageInfo(image.image_id)
+        if (imageInfo['name'] == file.name)
+        {
+          sourcePackageId = image['sourcepkg_id']
+          return
+        }
+      }))
+    }
+    
+    let biolucidaData = {}
+    try {
+      if (sourcePackageId != "")
+        biolucidaData = await $axios.$get(`${process.env.BL_API_URL}imagemap/sharelink/${sourcePackageId}/${route.params.datasetId}`)
+    } catch(e) {
+      console.log(`Error retrieving biolucida data (possibly because there is none for this file): ${e}`)
+    }
+    const hasBiolucidaViewer = !isEmpty(biolucidaData) && biolucidaData.status !== 'error'
+
+    // We must remove the N: in order for scicrunch to realize the package
+    sourcePackageId = file.sourcePackageId
+    const expectedScicrunchIdentifier = sourcePackageId != "" ? sourcePackageId.replace("N:", "") : ""
+    let scicrunchData = {}
+    try {
+      if (expectedScicrunchIdentifier != "") {
+        const scicrunchResponse = await scicrunch.getDatasetInfoFromObjectIdentifier(expectedScicrunchIdentifier)
+        const result = pathOr([], ['data', 'result'], scicrunchResponse)
+        scicrunchData = result?.length > 0 ? result[0] : []
+      }
+    } catch(e) {
+      console.log(`Error retrieving sci crunch data (possibly because there is none for this file): ${e}`)
+    }
+
+    let segmentationData = {}
+    // We should just be able to just pull from scicrunch response as shown below, but due to discrepancies we pull from the sparc api endpoint
+    // const matchedSegmentationData = scicrunchData['mbf-segmentation']?.filter(function(el) {
+    //   return el.identifier == expectedScicrunchIdentifier
+    // })
+    // segmentationData = segmentationData?.length > 0 ? matchedSegmentationData[0] : {}*/
+    try {
+      await discover.getSegmentationInfo(route.params.datasetId, filePath, s3Bucket).then(({ data }) => {
+        segmentationData = data
+      })
+    } catch(e) {
+      console.log(`Error retrieving segmentation data (possibly because there is none for this file): ${e}`)
+    }
+    const hasSegmentationViewer = !isEmpty(segmentationData)
+    
+    let plotData = {}
+    const matchedPlotData = scicrunchData['abi-plot']?.filter(function(el) {
+      return el.identifier == expectedScicrunchIdentifier
+    })
+    plotData = matchedPlotData?.length > 0 ? matchedPlotData[0] : {}
+    const hasPlotViewer = !isEmpty(plotData)
+
+    let videoData = {}
+    const matchedVideoData = scicrunchData['video']?.filter(function(el) {
+      return el.identifier == expectedScicrunchIdentifier
+    })
+    videoData = matchedVideoData?.length > 0 ? matchedVideoData[0] : {}
+    const hasVideoViewer = !isEmpty(videoData)
+    let signedUrl = ""
+    if (hasVideoViewer) {
+      const config = {
+        params: {
+          key: `${route.params.datasetId}/${filePath}`,
+          contentType: videoData.mimetype.name,
+          s3BucketName: s3Bucket
+        }
+      }
+      signedUrl = await $axios.$get(
+          `${process.env.portal_api}/download`,
+          config
+        )
+        .then(response => {
+          return response
+        })
+    }
+
+    let packageType = "None"
+    if (sourcePackageId !== 'details') {
+      packageType = file.packageType
+    }
+    const hasTimeseriesViewer = packageType === 'TimeSeries'
+    if (hasTimeseriesViewer && process.env.SHOW_TIMESERIES_VIEWER) {
+      redirect(`/datasets/timeseriesviewer?dataset_id=${route.params.datasetId}&dataset_version=${route.params.datasetVersion}&file_path=${filePath}`)
+    }
+
+    let activeTabId = hasBiolucidaViewer ? 'imageViewer' :
+      hasTimeseriesViewer ? 'timeseriesViewer' :
+      hasSegmentationViewer ? 'segmentationViewer' : 
+      hasPlotViewer ? 'plotViewer' :
+      hasVideoViewer ? 'videoViewer' : ''
+
+    return {
+      biolucidaData,
+      videoData,
+      plotData,
+      segmentationData: {
+        share_link: `${process.env.NL_LINK_PREFIX}/dataviewer?datasetId=${route.params.datasetId}&version=${route.params.datasetVersion}&path=${filePath}`,
+        status: ''
+      },
+      file,
+      hasBiolucidaViewer,
+      hasPlotViewer,
+      hasVideoViewer,
+      hasSegmentationViewer,
+      sourcePackageId,
+      signedUrl,
+      packageType,
+      activeTabId,
+      datasetInfo
+    }
+  },
+
+  data: () => {
+    return {
+      biolucidaData: {
+        biolucida_image_id: '',
+        share_link: '',
+        status: ''
+      },
+      tabs: [],
+      file: {},
+      zipData: '',
+      zipitUrl: process.env.zipit_api_host
+    }
+  },
+
+  computed: {
+    hasViewer: function() {
+      return this.hasBiolucidaViewer || this.hasSegmentationViewer || this.hasPlotViewer || this.hasVideoViewer
+    },
+    datasetId: function() {
+      return this.$route.params.datasetId
+    },
+    readme: function() {
+      return propOr('', 'readme', this.datasetInfo)
+    },
+    breadcrumb: function() {
+      return [
+        {
+          to: {
+            name: 'index'
+          },
+          label: 'Home'
+        },
+        {
+          to: {
+            name: 'data'
+          },
+          label: 'Data & Models'
+        },
+        {
+          to: {
+            name: 'datasets-datasetId',
+            params: {
+              datasetId: this.datasetInfo.id
+            },
+          },
+          label: `${this.datasetInfo.name}`
+        },
+        {
+          to: {
+            name: 'datasets-datasetId',
+            params: {
+              datasetId: this.datasetInfo.id
+            },
+            query: {
+              datasetDetailsTab: 'files',
+              path: `${this.fileFolderLocation}`
+            }
+          },
+          label: 'File'
+        }
+      ]
+    }
+  },
+
+  watch: {
+    hasBiolucidaViewer: {
+      handler: function(hasViewer) {
+        if (hasViewer) {
+          this.tabs.push({
+            label: 'Biolucida Viewer',
+            id: 'imageViewer'
+          })
+        } else {
+          this.tabs = this.tabs.filter(tab => tab.id !== 'imageViewer')
+        }
+      },
+      immediate: true
+    },
+    hasPlotViewer: {
+      handler: function(hasViewer) {
+        if (hasViewer) {
+          this.tabs.push({
+            label: 'Plot Viewer',
+            id: 'plotViewer'
+          })
+        } else {
+          this.tabs = this.tabs.filter(tab => tab.id !== 'plotViewer')
+        }
+      },
+      immediate: true
+    },
+    hasVideoViewer: {
+      handler: function(hasViewer) {
+        if (hasViewer) {
+          this.tabs.push({
+            label: 'Video Viewer',
+            id: 'videoViewer'
+          })
+        } else {
+          this.tabs = this.tabs.filter(tab => tab.id !== 'videoViewer')
+        }
+      },
+      immediate: true
+    },
+    hasSegmentationViewer: {
+      handler: function(hasViewer) {
+        if (hasViewer) {
+          this.tabs.push({
+            label: 'Segmentation Viewer',
+            id: 'segmentationViewer'
+          })
+        } else {
+          this.tabs = this.tabs.filter(tab => tab.id !== 'segmentationViewer')
+        }
+      },
+      immediate: true
+    }
+  },
+
+  methods: {
+    executeDownload(file) {
+      const version = this.$route.params.datasetVersion
+      const datasetVersionRegexp = /(?<datasetId>\d*)\/(?<filePath>.*)/
+      let params = file.uri.replace("s3://", "")
+      let firstIndex = params.indexOf("/") + 1
+      params = params.substr(firstIndex)
+      const matches = params.match(datasetVersionRegexp)
+
+      const payload = {
+        paths: [matches.groups.filePath],
+        datasetId: matches.groups.datasetId,
+        version: version
+      }
+
+      this.zipData = JSON.stringify(payload, undefined)
+      this.$nextTick(() => {
+        this.$refs.zipForm.submit() // eslint-disable-line no-undef
+      })
+    },
+    /**
+     * Checks if file is MS Word, MS Excel, or MS Powerpoint
+     * @param {Object} file
+     */
+    isMicrosoftFileType: function(file) {
+      return (
+        file.fileType === 'MSWord' ||
+        file.fileType === 'MSExcel' ||
+        file.fileType === 'PowerPoint'
+      )
+    },
+  }
+}
+</script>
diff --git a/pages/datasets/flatmapviewer/_id.vue b/pages/datasets/flatmapviewer/_id.vue
index 0af0c9c6..6a320caf 100644
--- a/pages/datasets/flatmapviewer/_id.vue
+++ b/pages/datasets/flatmapviewer/_id.vue
@@ -1,241 +1,13 @@
 <template>
-  <div class="flatmap-viewer-page">
-    <div class="page-wrap container">
-      <detail-tabs
-        :tabs="tabs"
-        :active-tab="activeTab"
-        class="container"
-        @set-active-tab="activeTab = $event"
-      >
-        <client-only placeholder="Loading flatmap ...">
-          <div class="flatmap-container">
-            <FlatmapVuer
-              ref="flatmap"
-              :entry="taxo"
-              :name="taxo"
-              style="height:100%;width:100%;"
-              :display-minimap="false"
-              :flatmap-a-p-i="flatmapAPI"
-              @ready="flatmapReady"
-            />
-          </div>
-        </client-only>
-      </detail-tabs>
-      <div class="subpage">
-        <div class="page-heading" />
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Type</strong>
-          <div class="file-detail__column_2">
-            Flatmap
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Dataset</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: 'datasets-datasetId',
-                params: {
-                  datasetId
-                }
-              }"
-            >
-              {{ datasetTitle }}
-            </nuxt-link>
-          </div>
-        </div>
-        <div v-if="species" class="file-detail">
-          <strong class="file-detail__column_1">Species</strong>
-          <div class="file-detail__column_2">
-            {{ capitalize(species) }}
-          </div>
-        </div>
-        <div v-else class="file-detail">
-          <strong class="file-detail__column_1">taxo</strong>
-          <div class="file-detail__column_2">
-            {{ taxo }}
-          </div>
-        </div>
-        <div v-if="organ_name" class="file-detail">
-          <strong class="file-detail__column_1">Organ</strong>
-          <div class="file-detail__column_2">
-            {{ capitalize(organ_name) }}
-          </div>
-        </div>
-        <div v-else class="file-detail">
-          <strong class="file-detail__column_1">uberon</strong>
-          <div class="file-detail__column_2">
-            {{ uberonid }}
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
 </template>
-
 <script>
-import DetailTabs from '@/components/DetailTabs/DetailTabs.vue'
-import idMaps from '@/static/js/uberon-map.js'
-import flatmaps from '@/services/flatmaps'
-import scicrunch from '@/services/scicrunch'
-import FormatString from '@/mixins/format-string'
-
-import { failMessage } from '@/utils/notification-messages'
-
 export default {
   name: 'FlatmapViewerPage',
-  components: {
-    DetailTabs,
-    FlatmapVuer: process.client
-      ? () => import('@abi-software/flatmapvuer').then(m => m.FlatmapVuer)
-      : null
-  },
-
-  mixins: [FormatString],
-
-  async asyncData({ $axios, app, route }) {
-    //Get the organ name from uberon id
-    const uberonid = route.query.uberonid
-    let organ_name = undefined
-    try {
-      organ_name = await scicrunch.getOrganFromUberonId(uberonid)
-    } catch (e) {
-      // Error caught return empty data.
-    }
-    const url = `${process.env.discover_api_host}/datasets/${route.query.dataset_id}`
-    var datasetUrl = route.query.dataset_version ? `${url}/versions/${route.query.dataset_version}` : url
-    const userToken = app.$cookies.get('user-token')
-    if (userToken) {
-      datasetUrl += `?api_key=${userToken}`
-    }
-    const datasetInfo = await $axios.$get(datasetUrl).catch(error => {
-      console.log(`Could not get the dataset's info: ${error}`)
+  created: function() {
+    this.$router.replace({
+      name: 'maps',
+      query: {type: "flatmap", ...this.$route.query}
     })
-    return {
-      organ_name,
-      datasetInfo
-    }
-  },
-  data: () => {
-    return {
-      tabs: [
-        {
-          label: 'Flatmap Viewer',
-          type: 'flatmap'
-        }
-      ],
-      activeTab: 'flatmap',
-      file: {},
-      flatmapAPI: process.env.flatmap_api
-    }
-  },
-  computed: {
-    /**
-     * Get the taxo from the query parameter.
-     * @returns String
-     */
-    taxo: function() {
-      return this.$route.query.taxo
-    },
-    /**
-     * Get the species name using the static mapping
-     * @returns String
-     */
-    species: function() {
-      for (const [key, value] of Object.entries(idMaps.species)) {
-        if (value === this.$route.query.taxo) return key
-      }
-      return undefined
-    },
-    /**
-     * Get the species name of the dataset. This is used if the datasets's species does not have a flatmap. (It will then use a rat flatmap)
-     * @returns String
-     */
-    forSpecies: function() {
-      return this.$route.query.for_species
-    },
-    /**
-     * Get the uberon id from the query parameter.
-     * @returns Number
-     */
-    uberonid: function() {
-      return this.$route.query.uberonid
-    },
-    /**
-     * Get the organ from the query parameter.
-     * @returns Number
-     */
-    organ: function() {
-      return this.$route.query.organ
-    },
-    /**
-     * Return the dataset id from the route query.
-     * @returns String
-     */
-    datasetId: function() {
-      return this.$route.query.dataset_id
-    },
-    /**
-     * Return the version number from the route query.
-     * @returns String
-     */
-    versionNumber: function() {
-      return this.$route.query.dataset_version
-    },
-    /**
-     * Return the dataset's name.
-     * @returns String
-     */
-    datasetTitle: function() {
-      return this.datasetInfo ? this.datasetInfo.name : 'Go to dataset'
-    }
   },
-  mounted: function() {
-    this.checkSpeciesMatch()
-  },
-  methods: {
-    flatmapReady: function(component) {
-      let id = this.checkForIlxtr(this.uberonid)
-      component.mapImp.zoomToFeatures(id)
-
-      // **NOTE: This is commented out until fCCB approves the popups
-      // component.checkAndCreatePopups({
-      //   resource: [id],
-      //   eventType: 'click'
-      // })
-    },
-    checkForIlxtr: function(id) {
-      if (id.includes('neuron-type-keast') && !id.includes('ilxtr')) {
-        return 'ilxtr:' + id
-      }
-      return id
-    },
-    checkSpeciesMatch: function() {
-      if (
-        this.forSpecies &&
-        this.forSpecies !== flatmaps.speciesMap[this.taxo] // if they don't match, we know that a rat was used
-      ) {
-        this.$message(
-          failMessage(
-            `Sorry! A flatmap for a ${this.forSpecies} does not yet exist. The ${this.organ} of a rat has been shown instead.`
-          )
-        )
-      }
-    }
-  }
 }
 </script>
-
-<style scoped lang="scss">
-@import '@/assets/_viewer.scss';
-</style>
-
-<style lang="scss">
-.flatmap-container {
-  margin-top: 1.5rem;
-  height: 90vh;
-  max-width: calc(100% - 48px);
-  padding-left: 24px;
-  @import '~@abi-software/flatmapvuer/dist/flatmapvuer';
-}
-</style>
diff --git a/pages/datasets/imageviewer/_id.vue b/pages/datasets/imageviewer/_id.vue
index de90858f..3229e2cb 100644
--- a/pages/datasets/imageviewer/_id.vue
+++ b/pages/datasets/imageviewer/_id.vue
@@ -80,11 +80,12 @@ import DetailTabs from '@/components/DetailTabs/DetailTabs.vue'
 import discover from '@/services/discover'
 import BfButton from '@/components/shared/BfButton/BfButton.vue'
 
+import DatasetInfo from '@/mixins/dataset-info'
 import FetchPennsieveFile from '@/mixins/fetch-pennsieve-file'
 import RequestDownloadFile from '@/mixins/request-download-file'
 import FileDetails from '@/mixins/file-details'
 
-import { baseName } from '@/utils/common'
+import { baseName, extractS3BucketName } from '@/utils/common'
 
 export default {
   name: 'ImageViewerPage',
@@ -94,14 +95,24 @@ export default {
     BfButton
   },
 
-  mixins: [FileDetails, RequestDownloadFile, FetchPennsieveFile],
+  mixins: [DatasetInfo, FileDetails, RequestDownloadFile, FetchPennsieveFile],
 
   async asyncData({ route, error, $axios, app }) {
-    const response = await discover.fetch(
+
+    const datasetInfo = await DatasetInfo.methods.getDatasetInfo(
+      $axios,
       route.query.dataset_id,
       route.query.dataset_version,
+      app.$cookies.get('user-token')
+    )
+
+    const s3Bucket = datasetInfo ? extractS3BucketName(datasetInfo.uri) : undefined
+
+    const response = await discover.fetch(
+      route.query.dataset_id,
       route.query.file_path,
-      true
+      true, 
+      s3Bucket
     )
 
     const imageInfo = {
@@ -121,16 +132,6 @@ export default {
       error
     )
 
-    const url = `${process.env.discover_api_host}/datasets/${route.query.dataset_id}`
-    var datasetUrl = route.query.dataset_version ? `${url}/versions/${route.query.dataset_version}` : url
-    const userToken = app.$cookies.get('user-token')
-    if (userToken) {
-      datasetUrl += `?api_key=${userToken}`
-    }
-    const datasetInfo = await $axios.$get(datasetUrl).catch(error => {
-      console.log(`Could not get the dataset's info: ${error}`)
-    })
-
     return {
       imageInfo,
       file,
diff --git a/pages/datasets/plotviewer/_id.vue b/pages/datasets/plotviewer/_id.vue
index ae4e2cae..e62a0ee8 100644
--- a/pages/datasets/plotviewer/_id.vue
+++ b/pages/datasets/plotviewer/_id.vue
@@ -1,102 +1,24 @@
-<template>
-  <div class="plot-viewer-page">
-    <div class="page-wrap container">
-      <detail-tabs
-        :tabs="tabs"
-        :active-tab="activeTab"
-        class="container"
-        @set-active-tab="activeTab = $event"
-      >
-        <client-only placeholder="Loading plot ...">
-          <div class="plotvuer-container">
-            <plot-vuer
-              :data-source="{ url: source_url }"
-              :metadata="metadata"
-              :supplemental-data="supplemental_data"
-            />
-          </div>
-        </client-only>
-      </detail-tabs>
-      <div class="subpage">
-        <div class="page-heading">
-          <h2>{{ fileName }}</h2>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Type</strong>
-          <div class="file-detail__column_2">
-            {{ plotType.charAt(0).toUpperCase() + plotType.slice(1) }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Dataset</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: 'datasets-datasetId',
-                params: {
-                  datasetId
-                }
-              }"
-            >
-              {{ datasetTitle }}
-            </nuxt-link>
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">File location</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: `datasets-datasetId`,
-                params: {
-                  datasetId: datasetId
-                },
-                query: {
-                  datasetDetailsTab: 'files',
-                  path: fileFolderLocation
-                }
-              }"
-            >
-              {{ filePath }}
-            </nuxt-link>
-          </div>
-        </div>
-        <div class="pt-16">
-          <bf-button @click="requestDownloadFile(file)">
-            Download file
-          </bf-button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
 <script>
-import DetailTabs from '@/components/DetailTabs/DetailTabs.vue'
 import scicrunch from '@/services/scicrunch'
-import discover from '@/services/discover'
-
-import BfButton from '@/components/shared/BfButton/BfButton.vue'
-import RequestDownloadFile from '@/mixins/request-download-file'
-import FetchPennsieveFile from '@/mixins/fetch-pennsieve-file'
-import FileDetails from '@/mixins/file-details'
-
+import DatasetInfo from '@/mixins/dataset-info'
+// Need to re-direct from the old path of /datasets/plotviewer?dataset_id={id}&dataset_version={id}&identifier={packageId} to the corresponding file with that viewer:
+// Example: https://sparc.science/datasets/plotviewer?dataset_id=46&dataset_version=2&identifier=package%3Acd272e68-94cb-497c-bb17-fbedceadabe8 now maps to
+// https://sparc.science/datasets/file/46/2?path=files%2Fderivative%2FExperiment2_Meal-size.csv
 export default {
   name: 'PlotViewerPage',
 
-  components: {
-    DetailTabs,
-    BfButton,
-    PlotVuer: process.client
-      ? () => import('@abi-software/plotvuer').then(m => m.PlotVuer)
-      : null
-  },
+  async asyncData({ redirect, route, $axios, app }) {
+    const datasetId = route.query.dataset_id
+    const versionId = route.query.dataset_version
 
-  mixins: [FileDetails, RequestDownloadFile, FetchPennsieveFile],
+    const datasetInfo = await DatasetInfo.methods.getDatasetInfo(
+      $axios,
+      datasetId,
+      versionId,
+      app.$cookies.get('user-token')
+    )
 
-  async asyncData({ route, error, $axios, app }) {
     const identifier = route.query.identifier
-
     const scicrunchResponse = await scicrunch.getDatasetInfoFromObjectIdentifier(
       identifier
     )
@@ -104,124 +26,10 @@ export default {
     const matchedData = scicrunchData['abi-plot'].filter(function(el) {
       return el.identifier === identifier
     })
-
     const plot_info = matchedData[0]
-    const plot_annotation = plot_info.datacite
-    const file_path = `${route.query.dataset_id}/${route.query.dataset_version}/files/${plot_info.dataset.path}`
-    const source_url_response = await discover.downloadLink(file_path)
-    let source_url = source_url_response.data
-    if (process.env.portal_api === 'http://localhost:8000') {
-      source_url = `${process.env.portal_api}/s3-resource/${file_path}`
-    }
-
     const filePath = `files/${plot_info.dataset.path}`
-    const file = await FetchPennsieveFile.methods.fetchPennsieveFile(
-      $axios,
-      filePath,
-      route.query.dataset_id,
-      route.query.dataset_version,
-      error
-    )
-
-    const metadata = JSON.parse(
-      plot_annotation.supplemental_json_metadata.description
-    )
-
-    let supplemental_data = []
-    if (plot_annotation.isDescribedBy) {
-      let tmp_path = plot_annotation.isDescribedBy.path
-      // Hack to fix path entry.
-      if (tmp_path === '../derivative/sub-1/subject1_header.txt') {
-        tmp_path = 'derivative/sub-1/sam-1/subject1_header.txt'
-      }
-
-      const supplemental_file_path = `${route.query.dataset_id}/${route.query.dataset_version}/files/${tmp_path}`
-
-      const supplemental_url_response = await discover.downloadLink(
-        supplemental_file_path
-      )
-      let supplemental_url = supplemental_url_response.data
-      if (process.env.portal_api === 'http://localhost:8000') {
-        supplemental_url = `${process.env.portal_api}/s3-resource/${supplemental_file_path}`
-      }
-      supplemental_data.push({
-        url: supplemental_url
-      })
-    }
-
-    const url = `${process.env.discover_api_host}/datasets/${route.query.dataset_id}`
-    var datasetUrl = route.query.dataset_version ? `${url}/versions/${route.query.dataset_version}` : url
-    const userToken = app.$cookies.get('user-token')
-    if (userToken) {
-      datasetUrl += `?api_key=${userToken}`
-    }
-    const datasetInfo = await $axios.$get(datasetUrl).catch(error => {
-      console.log(`Could not get the dataset's info: ${error}`)
-    })
-
-    return {
-      source_url,
-      metadata,
-      supplemental_data,
-      plot_info,
-      file,
-      datasetInfo
-    }
-  },
-
-  data: () => {
-    return {
-      tabs: [
-        {
-          label: 'Plot Viewer',
-          type: 'plot'
-        }
-      ],
-      activeTab: 'plot'
-    }
-  },
-  computed: {
-    /**
-     * Get the dataset id from the query parameter.
-     * @returns Number
-     */
-    datasetId: function() {
-      return this.$route.query.dataset_id
-    },
-
-    /**
-     * Get the version number from the query parameter.
-     * @returns Number
-     */
-    versionNumber: function() {
-      return this.$route.query.dataset_version
-    },
-
-    plotType: function() {
-      return this.metadata.attrs.style
-    },
-    /**
-     * Return the dataset's name.
-     * @returns String
-     */
-    datasetTitle: function() {
-      return this.datasetInfo ? this.datasetInfo.name : 'Go to dataset'
-    }
+    
+    redirect(`/datasets/file/${datasetId}/${versionId}?path=${filePath}`)
   }
 }
 </script>
-
-<style scoped lang="scss">
-@import '@/assets/_viewer.scss';
-</style>
-<style lang="scss">
-.plotvuer-container {
-  margin-top: 1.5rem;
-  height: 90vh;
-  max-width: calc(100% - 48px);
-  @import '~@abi-software/plotvuer/dist/plotvuer';
-}
-.page-heading {
-  margin-bottom: 1.375rem;
-}
-</style>
diff --git a/pages/datasets/scaffoldviewer/_id.vue b/pages/datasets/scaffoldviewer/_id.vue
index 240ee1d1..3adce66c 100644
--- a/pages/datasets/scaffoldviewer/_id.vue
+++ b/pages/datasets/scaffoldviewer/_id.vue
@@ -1,78 +1,7 @@
 <template>
-  <div class="scaffold-viewer-page">
-    <div class="page-wrap container">
-      <detail-tabs
-        :tabs="tabs"
-        :active-tab="activeTab"
-        class="container"
-        @set-active-tab="activeTab = $event"
-      >
-        <ScaffoldViewer
-          v-show="activeTab === 'viewer'"
-          :scaffold-u-r-l="scaffoldURL"
-          :view-u-r-l="viewURL"
-          :region="region"
-          :state="state"
-        />
-      </detail-tabs>
-      <div class="subpage">
-        <div class="page-heading">
-          <h2>{{ fileName }}</h2>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Type</strong>
-          <div class="file-detail__column_2">
-            3D Scaffold
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Dataset</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: 'datasets-datasetId',
-                params: {
-                  datasetId
-                }
-              }"
-            >
-              {{ datasetTitle }}
-            </nuxt-link>
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">File location</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: `datasets-datasetId`,
-                params: {
-                  datasetId
-                },
-                query: {
-                  datasetDetailsTab: 'files',
-                  path: fileFolderLocation
-                }
-              }"
-            >
-              {{ filePath }}
-            </nuxt-link>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
 </template>
 
 <script>
-// :scaffold-selected="scaffoldSelected"
-import DetailTabs from '@/components/DetailTabs/DetailTabs.vue'
-import FetchPennsieveFile from '@/mixins/fetch-pennsieve-file'
-
-import FirstCol from '@/mixins/first-col/index'
-import FileDetails from '@/mixins/file-details'
-import ScaffoldViewer from '@/components/ScaffoldViewer/ScaffoldViewer.vue'
-
 // supportOldRoutes:
 //  Modifies the incoming $route.query to add the needed query parameters used in the new /scaffoldviewer route.
 //  Note that modifying routes from Vue does not change the url, only the $route objecti in this component.
@@ -80,25 +9,20 @@ const supportOldRoutes = function(query) {
   if (query.scaffold) {
     // file_name
     const scaffold = query.scaffold
-    let name =
-      scaffold.substring(scaffold.lastIndexOf('/') + 1, scaffold.length) ||
-      scaffold
-    let nameWE = name.substring(0, name.lastIndexOf('.')) || name
-    query.file_name = nameWE
-
+    const new_query = { }
     // dataset_id
-    query.dataset_id = scaffold.substring(0, scaffold.indexOf('/')) || ''
+    new_query.dataset_id = scaffold.substring(0, scaffold.indexOf('/')) || ''
 
     // version_number
     const postId =
       scaffold.substring(scaffold.indexOf('/') + 1, scaffold.length) || ''
-    query.dataset_version = postId.substring(0, postId.indexOf('/')) || ''
+    new_query.dataset_version = postId.substring(0, postId.indexOf('/')) || ''
 
     // file_path
-    query.file_path =
+    new_query.file_path =
       postId.substring(postId.indexOf('/') + 1, postId.length) || ''
 
-    return query
+    return new_query
   } else {
     return query
   }
@@ -106,127 +30,17 @@ const supportOldRoutes = function(query) {
 
 export default {
   name: 'ScaffoldViewerPage',
-
-  components: {
-    DetailTabs,
-    ScaffoldViewer
-  },
-
-  mixins: [FileDetails, FirstCol, FetchPennsieveFile],
-
-  async fetch() {
-    //Get id for retrieving state on the server,
-    //Id is prioritized before viewURL and region.
-    let uuid = this.$route.query.id
-    if (uuid) {
-      if (this.currentId != uuid) {
-        this.currentId = uuid
-        let url = this.api + 'scaffold/getstate'
-        await fetch(url, {
-          method: 'POST',
-          headers: {
-            'Content-type': 'application/json'
-          },
-          body: JSON.stringify({ uuid: uuid })
-        })
-          .then(response => response.json())
-          .then(data => {
-            this.state = data.state
-          })
-      }
-    } else if (this.$route.query.viewURL) {
-      this.viewURL = this.$route.query.viewURL
-    } else if (this.$route.query.region) {
-      this.region = this.$route.query.region
-    }
-  },
-
-  async asyncData({ app, route, error, $axios }) {
-    const processedQuery = supportOldRoutes(route.query)
-    const filePath = processedQuery.file_path
-    const file = await FetchPennsieveFile.methods.fetchPennsieveFile(
-      $axios,
-      filePath,
-      processedQuery.dataset_id,
-      processedQuery.dataset_version,
-      error
-    )
-
-    const url = `${process.env.discover_api_host}/datasets/${route.query.dataset_id}`
-    var datasetUrl = route.query.dataset_version ? `${url}/versions/${route.query.dataset_version}` : url
-    const userToken = app.$cookies.get('user-token')
-    if (userToken) {
-      datasetUrl += `?api_key=${userToken}`
-    }
-    const datasetInfo = await $axios.$get(datasetUrl).catch(error => {
-      console.log(`Could not get the dataset's info: ${error}`)
-    })
-
-    return {
-      file,
-      processedQuery,
-      datasetInfo
-    }
-  },
-  data: () => {
-    return {
-      tabs: [
-        {
-          label: 'Scaffold Viewer',
-          type: 'scaffold'
-        }
-      ],
-      activeTab: 'viewer',
-      viewURL: '',
-      region: '',
-      state: undefined
-    }
-  },
-
-  computed: {
-    /**
-     * Get the dataset id from the scaffold query parameter.
-     * @returns Number
-     */
-    datasetId: function() {
-      return this.processedQuery.dataset_id
-    },
-    /**
-     * Get the version scaffold query parameter.
-     * @returns Number
-     */
-    versionNumber: function() {
-      return this.processedQuery.dataset_version
-    },
-    /**
-     * Return the url for the scaffold metadata file.
-     * @returns String
-     */
-    scaffoldURL: function() {
-      return `${process.env.portal_api}/s3-resource/${this.datasetId}/${this.versionNumber}/${this.filePath}`
-    },
-    /**
-     * Return the dataset's name.
-     * @returns String
-     */
-    datasetTitle: function() {
-      return this.datasetInfo ? this.datasetInfo.name : 'Go to dataset'
-    }
-  },
   created: function() {
-    this.currentId = undefined
-    this.api = process.env.portal_api
-    let lastChar = this.api.substr(-1)
-    if (lastChar != '/') {
-      this.api = this.api + '/'
+    const query = supportOldRoutes(this.$route.query)
+    if (query && query.id) {
+      query.scaffoldid = query.id
+      delete query.id
     }
+    this.$router.replace({
+      name: 'maps',
+      query: {type: "scaffold", ...query}
+    })
   }
 }
 </script>
 
-<style scoped lang="scss">
-@import '@/assets/_viewer.scss';
-.page-heading {
-  margin-bottom: 1.375rem;
-}
-</style>
diff --git a/pages/datasets/segmentationviewer/_id.vue b/pages/datasets/segmentationviewer/_id.vue
index 02a3045b..a4b7d093 100644
--- a/pages/datasets/segmentationviewer/_id.vue
+++ b/pages/datasets/segmentationviewer/_id.vue
@@ -1,244 +1,16 @@
-<template>
-  <div class="file-detail-page">
-    <div class="page-wrap container">
-      <detail-tabs
-        :tabs="tabs"
-        :active-tab="activeTab"
-        class="container"
-        @set-active-tab="activeTab = $event"
-      >
-        <segmentation-viewer
-          v-show="activeTab === 'viewer'"
-          :data="segmentationData"
-        />
-      </detail-tabs>
-      <div class="subpage pt-0 pb-16">
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Dataset</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: 'datasets-datasetId',
-                params: {
-                  datasetId
-                }
-              }"
-            >
-              {{ title }}
-            </nuxt-link>
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Filename</strong>
-          <div class="file-detail__column_2">
-            {{ segmentation_info.name }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">File location</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: `datasets-datasetId`,
-                params: {
-                  datasetId: datasetId
-                },
-                query: {
-                  datasetDetailsTab: 'files',
-                  path: fileFolderLocation
-                }
-              }"
-            >
-              {{ filePath }}
-            </nuxt-link>
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Data collection</strong>
-          <div class="file-detail__column_2">
-            {{ data_collection }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Subject</strong>
-          <div class="file-detail__column_2">
-            {{ segmentation_info.subject.subjectid }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Species</strong>
-          <div class="file-detail__column_2">
-            {{ human_readable_species }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Sex</strong>
-          <div class="file-detail__column_2">
-            {{ segmentation_info.subject.sex }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Age</strong>
-          <div class="file-detail__column_2">
-            {{ segmentation_info.subject.age }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Organ</strong>
-          <div class="file-detail__column_2">
-            {{ segmentation_info.atlas.organ }}
-          </div>
-        </div>
-        <div class="pt-16">
-          <bf-button @click="requestDownloadFile(file)">
-            Download file
-          </bf-button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
 <script>
-import discover from '@/services/discover'
-import scicrunch from '@/services/scicrunch'
-import general from '@/services/general'
-
-import SegmentationViewer from '@/components/SegmentationViewer/SegmentationViewer'
-import DetailTabs from '@/components/DetailTabs/DetailTabs.vue'
-import BfButton from '@/components/shared/BfButton/BfButton.vue'
-
-import ErrorMessages from '@/mixins/error-messages'
-import RequestDownloadFile from '@/mixins/request-download-file'
-import FetchPennsieveFile from '@/mixins/fetch-pennsieve-file'
-import MarkedMixin from '@/mixins/marked'
-import FileDetails from '@/mixins/file-details'
-
-import { extractSection } from '@/utils/common'
-import { baseName } from '@/utils/common'
-
+// Need to re-direct from the old path of /datasets/segmentationviewer?dataset_version={id}&dataset_id={id}&file_path={filePath} to the corresponding file with that viewer:
+// Example: https://sparc.science/datasets/segmentationviewer?dataset_id=295&dataset_version=1&file_path=files%2Fprimary%2Fsub-9902%2Fsam-9902%2F9902_P_6_4_2.xml now maps to
+// https://sparc.science/datasets/file/295/1?path=files%2Fprimary%2Fsub-9902%2Fsam-9902%2F9902_P_6_4_2.xml
 export default {
   name: 'SegmentationViewerPage',
 
-  components: {
-    SegmentationViewer,
-    DetailTabs,
-    BfButton
-  },
-
-  mixins: [FileDetails, MarkedMixin, RequestDownloadFile, FetchPennsieveFile],
-
-  async asyncData({ route, error, $axios }) {
-    const identifier = route.query.dataset_id
-
-    try {
-      const [segmentation_info_response, dataset_response] = await Promise.all([
-        discover.getSegmentationInfo(
-          route.query.dataset_id,
-          route.query.dataset_version,
-          route.query.file_path
-        ),
-        scicrunch.getDatasetInfoFromPennsieveIdentifier(identifier)
-      ])
-
-      const segmentation_info = {
-        ...segmentation_info_response.data,
-        name: baseName(route.query.file_path)
-      }
-
-      const species_lookup_response = await general.lookupOntoTerm(
-        segmentation_info.subject.species
-      )
+  async asyncData({ redirect, route }) {
+    const datasetId = route.query.dataset_id
+    const versionId = route.query.dataset_version
+    const filePath = route.query.file_path
 
-      const human_readable_species = species_lookup_response.label
-
-      let dataset_info = dataset_response.data.result[0]
-      if (dataset_info === undefined) {
-        dataset_info = { readme: '', title: '' }
-      }
-
-      const filePath = route.query.file_path
-      const file = await FetchPennsieveFile.methods.fetchPennsieveFile(
-        $axios,
-        filePath,
-        route.query.dataset_id,
-        route.query.dataset_version,
-        error
-      )
-
-      return {
-        segmentation_info,
-        human_readable_species,
-        readme: dataset_info.readme,
-        title: dataset_info.title,
-        file
-      }
-    } catch (e) {
-      const message = ErrorMessages.methods.biolucida()
-      return error({ statusCode: 400, message: message, display: true, error: e})
-    }
-  },
-
-  data: () => {
-    return {
-      tabs: [
-        {
-          label: 'Segmentation Viewer',
-          type: 'viewer'
-        }
-      ],
-      activeTab: 'viewer',
-      data_collection: ''
-    }
-  },
-
-  computed: {
-    /**
-     * Compute segmentation data
-     * @returns {Object}
-     */
-    segmentationData: function() {
-      const datasetId = this.$route.query.dataset_id
-      const version = this.$route.query.dataset_version
-      const path = this.$route.query.file_path
-
-      return {
-        share_link: `${process.env.NL_LINK_PREFIX}/dataviewer?datasetId=${datasetId}&version=${version}&path=${path}`,
-        status: ''
-      }
-    },
-
-    /**
-     * Return the dataset id from the route query.
-     * @returns String
-     */
-    datasetId: function() {
-      return this.$route.query.dataset_id
-    },
-
-    /**
-     * Return the version number from the route query.
-     * @returns String
-     */
-    versionNumber: function() {
-      return this.$route.query.dataset_version
-    },
-    /**
-     * Return the type of an segmentation.
-     * @returns String
-     */
-    segmentationType: function() {
-      return 'application/vnd.mbfbioscience.neurolucida+xml'
-    }
-  },
-
-  mounted: function() {
-    const html = this.parseMarkdown(this.readme)
-    this.data_collection = extractSection(/data collect[^:]+:/i, html)
+    redirect(`/datasets/file/${datasetId}/${versionId}?path=${filePath}`)
   }
 }
 </script>
-
-<style scoped lang="scss">
-@import '@/assets/_viewer.scss';
-</style>
diff --git a/pages/datasets/timeseriesviewer/index.vue b/pages/datasets/timeseriesviewer/index.vue
index 5eeb4a48..d7388e09 100644
--- a/pages/datasets/timeseriesviewer/index.vue
+++ b/pages/datasets/timeseriesviewer/index.vue
@@ -1,15 +1,10 @@
 <template>
   <div class="file-detail-page">
-    <breadcrumb
-      class="mb-16"
-      :breadcrumb="breadcrumb"
-      :title="file.name"
-    />
     <div class="page-wrap container">
       <client-only>
         <content-tab-card
           v-if="hasTimeseriesViewer"
-          class="tabs p-32"
+          class="tabs p-32 pt-48"
           :tabs="tabs"
           :active-tab-id="activeTabId"
         >
@@ -78,12 +73,12 @@
 </template>
 
 <script>
-import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
 import { mapGetters } from 'vuex'
 import DetailTabs from '@/components/DetailTabs/DetailTabs.vue'
 import BfButton from '@/components/shared/BfButton/BfButton.vue'
 import { propOr } from 'ramda'
 
+import DatasetInfo from '@/mixins/dataset-info'
 import RequestDownloadFile from '@/mixins/request-download-file'
 import FetchPennsieveFile from '@/mixins/fetch-pennsieve-file'
 import FileDetails from '@/mixins/file-details'
@@ -93,22 +88,19 @@ export default {
 
   components: {
     BfButton,
-    DetailTabs,
-    Breadcrumb
+    DetailTabs
   },
 
-  mixins: [FileDetails, RequestDownloadFile, FetchPennsieveFile],
+  mixins: [DatasetInfo, FileDetails, RequestDownloadFile, FetchPennsieveFile],
 
   async asyncData({ app, route, error, $axios }) {
-    const url = `${process.env.discover_api_host}/datasets/${route.query.dataset_id}`
-    var datasetUrl = route.query.dataset_version ? `${url}/versions/${route.query.dataset_version}` : url
-    const userToken = app.$cookies.get('user-token')
-    if (userToken) {
-      datasetUrl += `?api_key=${userToken}`
-    }
-    const datasetInfo = await $axios.$get(datasetUrl).catch(error => {
-      console.log(`Could not get the dataset's info: ${error}`)
-    })
+    const datasetInfo = await DatasetInfo.methods.getDatasetInfo(
+      $axios,
+      route.query.dataset_id,
+      route.query.dataset_version,
+      app.$cookies.get('user-token')
+    )
+
     const file = await FetchPennsieveFile.methods.fetchPennsieveFile(
       $axios,
       route.query.file_path,
@@ -161,34 +153,6 @@ export default {
     filePath: function() {
       return this.$route.query.file_path
     },
-    breadcrumb: function() {
-      return [
-        {
-          to: {
-            name: 'index'
-          },
-          label: 'Home'
-        },
-        {
-          to: {
-            name: 'data',
-            query: {
-              type: 'dataset'
-            }
-          },
-          label: 'Find Data'
-        },
-        {
-          to: {
-            path: `/datasets/${this.$route.query.dataset_id}`,
-            query: {
-              type: 'dataset'
-            }
-          },
-          label: `${this.title}`
-        },
-      ]
-    }
   },
 }
 </script>
diff --git a/pages/datasets/videoviewer/_id.vue b/pages/datasets/videoviewer/_id.vue
index b715c762..66585196 100644
--- a/pages/datasets/videoviewer/_id.vue
+++ b/pages/datasets/videoviewer/_id.vue
@@ -1,178 +1,18 @@
-<template>
-  <div class="video-viewer-page">
-    <div class="page-wrap container">
-      <detail-tabs
-        :tabs="tabs"
-        :active-tab="activeTab"
-        class="container"
-        @set-active-tab="activeTab = $event"
-      >
-        <client-only placeholder="Loading video ...">
-          <div class="video-container">
-            <video ref="vid" class="video" controls crossorigin playsinline>
-              <source :src="video_src" :type="mimetype" size="1080" />
-              <p>
-                Your browser doesn't support HTML5 video. Here is a a
-                <a :href="video_src">link to the video</a> instead.
-              </p>
-            </video>
-          </div>
-        </client-only>
-      </detail-tabs>
-      <div class="subpage">
-        <div class="page-heading">
-          <h2>{{ fileName }}</h2>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Type</strong>
-          <div class="file-detail__column_2">
-            {{ fileType }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">Dataset</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: 'datasets-datasetId',
-                params: {
-                  datasetId
-                }
-              }"
-            >
-              Go to dataset
-            </nuxt-link>
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column_1">File location</strong>
-          <div class="file-detail__column_2">
-            <nuxt-link
-              :to="{
-                name: `datasets-datasetId`,
-                params: {
-                  datasetId: datasetId
-                },
-                query: {
-                  datasetDetailsTab: 'files',
-                  path: fileFolderLocation
-                }
-              }"
-            >
-              {{ filePath }}
-            </nuxt-link>
-          </div>
-        </div>
-        <div class="pt-16">
-          <bf-button @click="requestDownloadFile(file)">
-            Download file
-          </bf-button>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
 <script>
-import Plyr from 'plyr'
-
-import DetailTabs from '@/components/DetailTabs/DetailTabs.vue'
-import BfButton from '@/components/shared/BfButton/BfButton.vue'
-
-import RequestDownloadFile from '@/mixins/request-download-file'
-import FetchPennsieveFile from '@/mixins/fetch-pennsieve-file'
-import FileDetails from '@/mixins/file-details'
-
+// Need to re-direct from the old path of /datasets/videoviewer?dataset_version={id}&dataset_id={id}&file_path={filePath} to the corresponding file with that viewer:
+// Example: https://sparc.science/datasets/videoviewer?dataset_version=1&dataset_id=316&file_path=316%2F1%2Ffiles%2Fprimary%2Fsub-VN120219%2Fperf-12-17-19-awake%2FVN120219_2019-12-17_15-18-05.mp4&mimetype=video%2Fmp4 now maps to
+// https://sparc.science/datasets/file/316/1?path=files%2Fprimary%2Fsub-VN120219%2Fperf-12-17-19-awake%2FVN120219_2019-12-17_15-18-05.mp4
 export default {
-  name: 'VideoViewerPage',
-
-  components: {
-    DetailTabs,
-    BfButton
-  },
-
-  mixins: [FileDetails, RequestDownloadFile, FetchPennsieveFile],
+  name: 'SegmentationViewerPage',
 
-  async asyncData({ route, error, $axios }) {
-    let signedUrl = await $axios
-      .$get(
-        `${process.env.portal_api}/download?key=${route.query.file_path}&contentType=${route.query.mimetype}`
-      )
-      .then(response => {
-        return response
-      })
-    let filePath = route.query.file_path
-    filePath = filePath.substring(filePath.indexOf('files'))
-    const file = await FetchPennsieveFile.methods.fetchPennsieveFile(
-      $axios,
-      filePath,
-      route.query.dataset_id,
-      route.query.dataset_version,
-      error
-    )
-    return {
-      video_src: signedUrl,
-      mimetype: route.query.mimetype,
-      file
-    }
-  },
+  async asyncData({ redirect, route }) {
+    const datasetId = route.query.dataset_id
+    const versionId = route.query.dataset_version
+    // For some reason the file_path query param is preceded by datasetId/versionId/
+    const index = route.query.file_path.indexOf('files')
+    const filePath = route.query.file_path.substring(index)
 
-  data: () => {
-    return {
-      tabs: [
-        {
-          label: 'Video Viewer',
-          type: 'video'
-        }
-      ],
-      activeTab: 'video',
-      file: {},
-      traditional: true,
-      backgroundToggle: true
-    }
-  },
-  computed: {
-    /**
-     * Get the file type from the file prop.
-     * @returns String
-     */
-    fileType: function() {
-      return this.file.fileType
-    },
-
-    /**
-     * Get the dataset id from the query parameter.
-     * @returns Number
-     */
-    datasetId: function() {
-      return this.$route.query.dataset_id
-    },
-
-    /**
-     * Get the version number from the query parameter.
-     * @returns Number
-     */
-    versionNumber: function() {
-      return this.$route.query.dataset_version
-    }
-  },
-  mounted() {
-    this.player = new Plyr(this.$refs.vid)
+    redirect(`/datasets/file/${datasetId}/${versionId}?path=${filePath}`)
   }
 }
 </script>
-
-<style scoped lang="scss">
-@import '@/assets/_viewer.scss';
-</style>
-<style lang="scss">
-.video-container {
-  padding-top: 0.5rem;
-}
-.video {
-  width: 100%;
-}
-.page-heading {
-  margin-bottom: 1.375rem;
-}
-</style>
diff --git a/pages/file/_datasetId/_datasetVersion/index.vue b/pages/file/_datasetId/_datasetVersion/index.vue
index 908c0ac7..eb06a844 100644
--- a/pages/file/_datasetId/_datasetVersion/index.vue
+++ b/pages/file/_datasetId/_datasetVersion/index.vue
@@ -1,354 +1,20 @@
-<template>
-  <div class="pb-32">
-    <div class="page-wrap container">
-      <div class="subpage">
-        <div class="page-heading">
-          <h1>{{ file.name }}</h1>
-          <div class="page-heading__button">
-            <bf-button @click="executeDownload(file)">
-              Download
-            </bf-button>
-            <form ref="zipForm" method="POST" :action="zipitUrl">
-              <input v-model="zipData" type="hidden" name="data" />
-            </form>
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column">Type</strong>
-          <div class="file-detail__column">
-            {{ file.fileType }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column">Size</strong>
-          <div class="file-detail__column">
-            {{ file.size ? formatMetric(file.size) : 'undefined' }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column">Date Created</strong>
-          <div class="file-detail__column">
-            {{ file.createdAt ? formatDate(file.createdAt) : 'undefined' }}
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column">Dataset</strong>
-          <div class="file-detail__column">
-            <nuxt-link
-              :to="{
-                name: 'datasets-datasetId',
-                params: {
-                  datasetId
-                }
-              }"
-            >
-              {{ datasetTitle }}
-            </nuxt-link>
-          </div>
-        </div>
-        <div class="file-detail">
-          <strong class="file-detail__column">File location</strong>
-          <div class="file-detail__column">
-            <nuxt-link
-              :to="{
-                name: `datasets-datasetId`,
-                params: {
-                  datasetId
-                },
-                query: {
-                  datasetDetailsTab: 'files',
-                  path: location
-                }
-              }"
-            >
-              {{ location }}
-            </nuxt-link>
-          </div>
-        </div>
-      </div>
-      <client-only>
-        <content-tab-card
-          v-if="hasViewer"
-          class="tabs p-32"
-          :tabs="tabs"
-          :active-tab-id="activeTabId"
-        >
-          <biolucida-viewer
-            v-if="hasBiolucidaViewer"
-            v-show="activeTabId === 'imageViewer'"
-            :data="biolucidaData"
-          />
-        </content-tab-card>
-      </client-only>
-    </div>
-  </div>
-</template>
-
 <script>
-import BiolucidaViewer from '@/components/BiolucidaViewer/BiolucidaViewer'
-import DetailTabs from '@/components/DetailTabs/DetailTabs.vue'
-import BfButton from '@/components/shared/BfButton/BfButton.vue'
-
-import BfStorageMetrics from '@/mixins/bf-storage-metrics'
-import FormatDate from '@/mixins/format-date'
-import FetchPennsieveFile from '@/mixins/fetch-pennsieve-file'
-import FileDetails from '@/mixins/file-details'
-
-import {
-  compose,
-  split,
-  last,
-  defaultTo,
-  propOr
-} from 'ramda'
+const decodeQuery = function(queryParams) {
+  // Convert to URL schema
+  const urlSearchParams = new URLSearchParams();
+  for (const key in queryParams) {
+    if (queryParams.hasOwnProperty(key)) {
+      urlSearchParams.append(key, queryParams[key]);
+    }
+  }
 
-export const contentTypes = {
-  pdf: 'application/pdf',
-  text: 'text/plain',
-  jpeg: 'image/jpeg',
-  png: 'image/png',
-  svg: 'img/svg+xml',
-  mp4: 'video/mp4',
-  csv: 'text/csv'
+  return `?${urlSearchParams.toString()}`;
 }
-
 export default {
   name: 'FileDetailPage',
 
-  components: {
-    BiolucidaViewer,
-    DetailTabs,
-    BfButton
-  },
-
-  mixins: [
-    BfStorageMetrics,
-    FormatDate,
-    FetchPennsieveFile,
-    FileDetails
-  ],
-
-  async asyncData({ redirect, route, error, $axios, app }) {
-    const filePath = route.query.path
-    const file = await FetchPennsieveFile.methods.fetchPennsieveFile(
-      $axios,
-      filePath,
-      route.params.datasetId,
-      route.params.datasetVersion,
-      error
-    )
-
-    const sourcePackageId = file.sourcePackageId
-    const biolucidaData = await $axios.$get(
-      `${process.env.BL_API_URL}imagemap/sharelink/${sourcePackageId}/${route.params.datasetId}`
-    )
-
-    const hasBiolucidaViewer = biolucidaData.status !== 'error'
-
-    let packageType = "None"
-    if (sourcePackageId !== 'details') {
-      packageType = file.packageType
-    }
-    const hasTimeseriesViewer = packageType === 'TimeSeries'
-    if (hasTimeseriesViewer && process.env.SHOW_TIMESERIES_VIEWER) {
-      redirect(`/datasets/timeseriesviewer?dataset_id=${route.params.datasetId}&dataset_version=${route.params.datasetVersion}&file_path=${filePath}`)
-    }
-
-    let activeTabId = hasBiolucidaViewer ? 'imageViewer' :
-      hasTimeseriesViewer ? 'timeseriesViewer' : ''
-
-    const url = `${process.env.discover_api_host}/datasets/${route.params.datasetId}`
-    var datasetUrl = route.query.datasetVersion ? `${url}/versions/${route.query.datasetVersion}` : url
-    const userToken = app.$cookies.get('user-token')
-    if (userToken) {
-      datasetUrl += `?api_key=${userToken}`
-    }
-    const datasetInfo = await $axios.$get(datasetUrl).catch(error => {
-      console.log(`Could not get the dataset's info: ${error}`)
-    })
-
-    return {
-      biolucidaData,
-      file,
-      hasBiolucidaViewer,
-      sourcePackageId,
-      packageType,
-      activeTabId,
-      datasetInfo
-    }
-  },
-
-  data: () => {
-    return {
-      biolucidaData: {
-        biolucida_image_id: '',
-        share_link: '',
-        status: ''
-      },
-      tabs: [],
-      file: {},
-      zipData: '',
-      zipitUrl: process.env.zipit_api_host
-    }
-  },
-
-  computed: {
-    /**
-     * Compute location of the file
-     * @returns {String}
-     */
-    location: function() {
-      return this.file.path.replace(`/${this.file.name}`, '')
-    },
-    hasViewer: function() {
-      return this.hasBiolucidaViewer
-    },
-    datasetId: function() {
-      return this.$route.params.datasetId
-    },
-    /**
-     * Return the dataset's name.
-     * @returns String
-     */
-    datasetTitle: function() {
-      return this.datasetInfo ? this.datasetInfo.name : 'Go to dataset'
-    }
-  },
-
-  watch: {
-    hasBiolucidaViewer: {
-      handler: function(hasViewer) {
-        if (hasViewer) {
-          this.tabs.push({
-            label: 'Image Viewer',
-            id: 'imageViewer'
-          })
-        } else {
-          this.tabs = this.tabs.filter(tab => tab.id !== 'imageViewer')
-        }
-      },
-      immediate: true
-    }
-  },
-
-  methods: {
-    executeDownload(file) {
-      const datasetVersionRegexp = /s3:\/\/pennsieve-prod-discover-publish-use1\/(?<datasetId>\d*)\/(?<version>\d*)\/(?<filePath>.*)/
-      const matches = file.uri.match(datasetVersionRegexp)
-
-      const payload = {
-        paths: [matches.groups.filePath],
-        datasetId: matches.groups.datasetId,
-        version: matches.groups.version
-      }
-
-      this.zipData = JSON.stringify(payload, undefined)
-      this.$nextTick(() => {
-        this.$refs.zipForm.submit() // eslint-disable-line no-undef
-      })
-    },
-    /**
-     * Check if the file is openable
-     * MS Office files and native browser files
-     * - Documents (pdf, text)
-     * - Images (jpg, png)
-     * - Video (MP4)
-     * - Vector Drawings (svg)
-     */
-    isFileOpenable(file) {
-      if (!file.fileType) {
-        return false
-      }
-      const allowableExtensions = Object.keys(contentTypes).map(key => key)
-      const fileType = file.fileType.toLowerCase()
-      return (
-        this.isMicrosoftFileType(file) || allowableExtensions.includes(fileType)
-      )
-    },
-    /**
-     * Checks if file is MS Word, MS Excel, or MS Powerpoint
-     * @param {Object} file
-     */
-    isMicrosoftFileType: function(file) {
-      return (
-        file.fileType === 'MSWord' ||
-        file.fileType === 'MSExcel' ||
-        file.fileType === 'PowerPoint'
-      )
-    },
-    /**
-     * Opens a file in a new tab
-     * This is currently for MS Word, MS Excel, and Powerpoint files only
-     * @param {Object} scope
-     */
-    openFile: function(file) {
-      this.getViewFileUrl(file).then(response => {
-        window.open(response, '_blank')
-      })
-    },
-    getViewFileUrl(file) {
-      const filePath = compose(
-        last,
-        defaultTo([]),
-        split('s3://pennsieve-prod-discover-publish-use1/'),
-        propOr('', 'uri')
-      )(file)
-
-      const fileType = file.fileType.toLowerCase()
-      const contentType = contentTypes[fileType]
-
-      const requestUrl = `${process.env.portal_api}/download?key=${filePath}&contentType=${contentType}`
-
-      return this.$axios.$get(requestUrl).then(response => {
-        const url = response
-        const encodedUrl = encodeURIComponent(url)
-        return this.isMicrosoftFileType(file)
-          ? `https://view.officeapps.live.com/op/view.aspx?src=${encodedUrl}`
-          : url
-      })
-    }
+  async asyncData({ redirect, route }) {
+    redirect(`/datasets/file/${route.params.datasetId}/${route.params.datasetVersion}?${decodeQuery(route.query)}`)
   }
 }
 </script>
-
-<style scoped lang="scss">
-@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
-h1 {
-  flex: 1;
-  font-size: 1.5em;
-  line-height: 2rem;
-}
-.page-heading {
-  display: flex;
-  flex-direction: column;
-  margin-bottom: 1.375rem;
-  @media (min-width: 48em) {
-    flex-direction: row;
-  }
-  align-items: center;
-}
-.page-heading__button {
-  flex-shrink: 0;
-}
-
-.file-detail {
-  border-bottom: 1px solid $lineColor2;
-  flex-direction: column;
-  font-size: 0.875em;
-  display: flex;
-  padding: 1rem 0.625rem;
-  @media (min-width: 48em) {
-    flex-direction: row;
-  }
-}
-.file-detail__column {
-  flex: 1;
-}
-
-.tabs {
-  border: 1px solid $lineColor2;
-}
-.link-to-dataset {
-  margin-right: 10px;
-}
-</style>
diff --git a/pages/help/_helpId.vue b/pages/help/_helpId.vue
deleted file mode 100644
index 558a2565..00000000
--- a/pages/help/_helpId.vue
+++ /dev/null
@@ -1,133 +0,0 @@
-<template>
-  <div id="top" class="events-page">
-    <breadcrumb :breadcrumb="breadcrumb" :title="helpItem.fields.title" />
-    <div class="page-wrap container">
-      <div class="subpage">
-        <div class="header">
-          <h2>{{ helpItem.fields.title }}</h2>
-          <div class="summary">
-            {{ helpItem.fields.summary }}
-          </div>
-          <div class="updated">
-            <i>Updated at: {{ updateDate }} </i>
-          </div>
-        </div>
-        <!-- eslint-disable vue/no-v-html -->
-        <!-- marked will sanitize the HTML injected -->
-        <div class="content" v-html="parseMarkdown(htmlContent)" />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import { format, parseISO } from 'date-fns'
-import { pathOr } from 'ramda'
-
-import MarkedMixin from '@/mixins/marked'
-import Breadcrumb from '../../components/Breadcrumb/Breadcrumb'
-
-import createClient from '@/plugins/contentful.js'
-
-const client = createClient()
-
-const getHelpItem = async id => {
-  try {
-    const isSlug = id.split('-').length > 1
-
-    const item = isSlug
-      ? await client.getEntries({
-          content_type: process.env.ctf_help_id,
-          'fields.slug': id
-        })
-      : await client.getEntry(id)
-    return isSlug ? item.items[0] : item
-  } catch (error) {
-    return {}
-  }
-}
-
-export default {
-  name: 'EventPage',
-
-  components: {
-    Breadcrumb
-  },
-
-  mixins: [MarkedMixin],
-
-  async asyncData({ params, redirect }) {
-    const helpItem = await getHelpItem(params.helpId)
-
-    // Redirect to the friendly URL page, if this page has a slug
-    const slug = helpItem.fields.slug
-    if (slug && params.helpId !== slug) {
-      redirect({
-        name: 'help-helpId',
-        params: { helpId: slug },
-        hash: '#top'
-      })
-    }
-
-    const allHelpData = await client.getEntry(process.env.ctf_support_page_id, {
-      include: 2
-    })
-
-    return {
-      helpHeroData: allHelpData.fields,
-      helpItem: helpItem,
-      breadcrumb: [
-        {
-          to: {
-            name: 'index'
-          },
-          label: 'Home'
-        },
-      ]
-    }
-  },
-
-  computed: {
-    /**
-     * Compute HTML Content for the page
-     * @returns {String}
-     */
-    htmlContent() {
-      return pathOr('', ['fields', 'helpContent'], this.helpItem)
-    },
-
-    /**
-     * Compute and convert the date the article was created
-     * @returns {String}
-     */
-    updateDate: function() {
-      return format(parseISO(this.helpItem.sys.updatedAt), 'MM/dd/yyyy')
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-@import '@/assets/_variables.scss';
-
-.content {
-  & ::v-deep {
-    color: $vestibular;
-  }
-  & ::v-deep p {
-    margin-bottom: 1em;
-  }
-  & ::v-deep img {
-    height: auto;
-    margin: 0.5em 0;
-    max-width: 100%;
-  }
-}
-
-.header {
-  margin-bottom: 3em;
-  .updated {
-    color: #aaa;
-  }
-}
-</style>
diff --git a/pages/index.vue b/pages/index.vue
index 3b08742f..b1103b7f 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -13,6 +13,11 @@
         class="page-hero-img"
         :src="heroImage.fields.file.url"
       />
+      <nuxt-link v-if="heroButtonLink && heroButtonLabel" class="btn-link" :to="heroButtonLink">
+        <el-button @click="heroButtonClick" class="secondary">
+          {{ heroButtonLabel }}
+        </el-button>
+      </nuxt-link>
     </page-hero>
     <div class="secondary-background">
       <featured-data :featured-data="featuredData" />
@@ -21,20 +26,23 @@
     <portal-features :features="portalFeatures" />
     <hr />
     <div class="secondary-background">
-      <projects-and-datasets :project="featuredProject" :dataset="featuredDataset" />
+      <projects-and-datasets :datasetSectionTitle="datasetSectionTitle" :projectOrResource="featuredProject" :dataset="featuredDataset" />
     </div>
     <hr />
-    <latest-news-and-events />
-    <stay-connected />
+    <homepage-news :news="newsAndEvents" />
+    <hr />
+    <div class="secondary-background">
+      <stay-connected />
+    </div>
   </div>
 </template>
 
 <script>
 import PageHero from '@/components/PageHero/PageHero.vue'
 import FeaturedData from '@/components/FeaturedData/FeaturedData.vue'
+import HomepageNews from '@/components/HomepageNews/HomepageNews.vue'
 import PortalFeatures from '@/components/PortalFeatures/PortalFeatures.vue'
 import ProjectsAndDatasets from '@/components/ProjectsAndDatasets/ProjectsAndDatasets.vue'
-import LatestNewsAndEvents from '@/components/LatestNewsAndEvents/LatestNewsAndEvents.vue'
 import StayConnected from '@/components/StayConnected/StayConnected.vue'
 
 import createClient from '@/plugins/contentful.js'
@@ -42,6 +50,7 @@ import ContentfulErrorHandle from '@/mixins/contentful-error-handle'
 import marked from '@/mixins/marked/index'
 import getHomepageFields from '@/utils/homepageFields'
 import { mapGetters } from 'vuex'
+import { pathOr, isEmpty } from 'ramda'
 
 const client = createClient()
 export default {
@@ -50,9 +59,9 @@ export default {
   components: {
     PageHero,
     FeaturedData,
+    HomepageNews,
     PortalFeatures,
     ProjectsAndDatasets,
-    LatestNewsAndEvents,
     StayConnected
   },
 
@@ -64,15 +73,16 @@ export default {
       client.getEntry(process.env.ctf_home_page_id)
     ]).then(async ([homepage]) => {
         let fields = getHomepageFields(homepage.fields)
-        const featuredDatasetId = homepage.fields.featuredDatasetId
-        if (featuredDatasetId != '') {
-          const url = `${process.env.discover_api_host}/datasets/${featuredDatasetId}`
-          await $axios.$get(url).then(({ name, description, banner }) => {
-            fields = { ...fields, 'featuredDataset': { 'title': name, 'description': description, 'banner': banner, 'id': featuredDatasetId } }
-          })
-        }
-        if (fields.featuredProject.fields.institution != undefined) {
-          const institutionId = fields.featuredProject.fields.institution.sys.id
+        const datasetSectionTitle = homepage.fields.datasetSectionTitle
+        const url = `${process.env.portal_api}/get_featured_dataset`
+        await $axios.$get(url).then(({ datasets }) => {
+          if (isEmpty(datasets)) {
+            return
+          }
+          fields = { ...fields, 'featuredDataset': { 'title': datasets[0].name, 'description': datasets[0].description, 'banner': datasets[0].banner, 'id': datasets[0].id }, 'datasetSectionTitle': datasetSectionTitle }
+        })
+        if (pathOr(undefined, ["featuredProject","fields","institution"], fields) != undefined) {
+          const institutionId = pathOr("", ["featuredProject","fields","institution","sys","id"], fields)
           await client.getEntry(institutionId).then(( response ) => {
             fields.featuredProject.fields = { ...fields.featuredProject.fields, 'banner': response.fields.logo.fields.file.url }
           })
@@ -89,7 +99,7 @@ export default {
   watch: {
     cognitoUserToken: function (val) {
       if (val != '') {
-        const profileComplete = this.$cookies.get('profile-complete')
+        const profileComplete = this.$cookies.get('profile-complete') || this.profileComplete
         if (!profileComplete) {
           this.$router.push("/welcome")
         }
@@ -98,7 +108,7 @@ export default {
   },
 
   computed: {
-    ...mapGetters('user', ['cognitoUserToken']),
+    ...mapGetters('user', ['cognitoUserToken', 'profileComplete']),
   },
 
   beforeMount() {
@@ -117,9 +127,10 @@ export default {
   data: () => {
     return {
       featuredData: [],
+      newsAndEvents: [],
       portalFeatures: [],
       featuredProject: {},
-      featuredDatasetId: '',
+      datasetSectionTitle: '',
       featuredDataset: {},
       heroCopy: '',
       heroHeading: '',
@@ -127,12 +138,30 @@ export default {
     }
   },
 
+  methods: {
+    heroButtonClick() {
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'submit_to_sparc_button_click',
+        files: "",
+        file_name: "",
+        file_path: "",
+        file_type: "",
+        location: "Banner",
+        category: "",
+        dataset_id: "",
+        version_id: "",
+        doi: "",
+        citation_type: ""
+      })
+    }
+  },
+
   head() {
     return {
-      title: 'SPARC Portal',
-      titleTemplate: '%s - SPARC Portal',
       meta: [
         {
+          hid: 'description',
           name: 'description',
           content:
             'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
@@ -142,13 +171,17 @@ export default {
           content: 'website'
         },
         {
-          name: 'og:title',
+          hid: 'og:title',
+          property: 'og:title',
           content: 'SPARC Portal'
         },
         {
-          name: 'og:description',
-          content:
-            'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+          hid: 'og:image',
+          property: 'og:image',
+          content: 'https://images.ctfassets.net/6bya4tyw8399/7r5WTb92QnHkub8RsExuc1/2ac134de2ddfd65eb6316421df7578f9/sparc-logo-primary.png'
+        },
+        { hid: 'og:image:secure_url', property: 'og:image:secure_url',
+          content: 'https://images.ctfassets.net/6bya4tyw8399/7r5WTb92QnHkub8RsExuc1/2ac134de2ddfd65eb6316421df7578f9/sparc-logo-primary.png'
         },
         {
           name: 'og:site_name',
@@ -162,10 +195,17 @@ export default {
           name: 'twitter:site',
           content: '@sparc_science'
         },
+        {
+          name: 'twitter:title',
+          content: 'SPARC Portal'
+        },
+        {
+          name: 'twitter:image',
+          content: 'https://images.ctfassets.net/6bya4tyw8399/7r5WTb92QnHkub8RsExuc1/2ac134de2ddfd65eb6316421df7578f9/sparc-logo-primary.png'
+        },
         {
           name: 'twitter:description',
-          content:
-            'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+          content: 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
         }
       ]
     }
@@ -176,10 +216,10 @@ export default {
 <style lang="scss" scoped>
 @import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
 .page-data {
-  background-color: $background;
+  background-color: #f8faff;
 }
 .secondary-background {
-  background-color: #f8faff;
+  background-color: $background;
 }
 ::v-deep h2 {
   font-size: 1.5em;
diff --git a/pages/maps/index.vue b/pages/maps/index.vue
index e2a3dbac..75b760bd 100644
--- a/pages/maps/index.vue
+++ b/pages/maps/index.vue
@@ -5,22 +5,31 @@
       <h1>Maps</h1>
       <p>
         SPARC is creating detailed PNS maps based on SPARC data and information
-        available from the literature. The flatmaps you see here are not yet
+        available from the literature. The maps you see here are not yet
         comprehensive and are largely derived from regions of the nervous system
-        where SPARC data has been published on this site, supplemented in some regions
-        by published knowledge of rat anatomy. New connectivity and species
-        specificity will be added as the SPARC program progresses.
+        where SPARC data has been published on this site, supplemented in some
+        regions by published knowledge of rat anatomy. New connectivity and
+        species specificity in anatomy and connectivity will be added as the 
+        SPARC program progresses.
       </p>
     </page-hero>
-    <div ref="mappage" class="page-wrap portalmapcontainer">
+    <portal-features
+      v-if="isLandingPage"
+      :features="entries"
+      title="What can I do with Maps?"
+      :icon-is-top-element="false"
+    />
+    <div v-else ref="mappage" class="page-wrap portalmapcontainer">
       <client-only placeholder="Loading...">
         <div class="mapClass">
           <MapContent
             ref="map"
             :state="state"
+            :starting-map="startingMap"
             :options="options"
             :share-link="shareLink"
             @updateShareLinkRequested="updateUUID"
+            @isReady="mapMounted" 
           />
         </div>
       </client-only>
@@ -29,34 +38,117 @@
 </template>
 
 <script>
+import createAlgoliaClient from '@/plugins/algolia.js'
+
 import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
 import PageHero from '@/components/PageHero/PageHero.vue'
+
+import flatmaps from '@/services/flatmaps'
+import scicrunch from '@/services/scicrunch'
+
+import DatasetInfo from '@/mixins/dataset-info'
+import FetchPennsieveFile from '@/mixins/fetch-pennsieve-file'
+
+import PortalFeatures from '@/components/PortalFeatures/PortalFeatures.vue'
+
+import { extractS3BucketName } from '@/utils/common'
+import { successMessage, failMessage } from '@/utils/notification-messages'
+import { getAlgoliaFacets, facetPropPathMapping } from '../data/utils'
+
+const algoliaClient = createAlgoliaClient()
+const algoliaIndex = algoliaClient.initIndex(process.env.ALGOLIA_INDEX)
+
+const formatLabel = (text) => {
+  if (text && (typeof text === 'string' || text instanceof String))
+    return text.charAt(0).toUpperCase() + text.slice(1).toLowerCase()
+  return text
+}
+
+const getScaffoldState = async (uuid, $axios) => {
+  if (uuid) {
+    let url = `${process.env.portal_api}/scaffold/getstate`
+    return await $axios.$post(url, { uuid: uuid }).then((response) => response)
+  }
+}
+
+const getScaffoldEntry = async (route, $axios, s3Bucket) => {
+  //Check if file path from scicrunch can be found on the server
+  const filePath = route.query.file_path
+  let path = `${route.query.dataset_id}/${filePath}`
+  if (s3Bucket) {
+    path = path + `?s3BucketName=${s3Bucket}`
+  }
+  let result = await $axios
+    .$get(`${process.env.portal_api}/exists/${path}`)
+    .then(({ exists }) => {
+      if (exists && exists !== 'false') {
+        return {
+          type: 'Scaffold',
+          label: `Dataset ${route.query.dataset_id}`,
+          url: `${process.env.portal_api}/s3-resource/${path}`,
+          viewUrl: route.query.ViewURL,
+        }
+      } else {
+        return undefined
+      }
+    })
+
+  //Cannot be found using the file path from SciCrunch, use Pennsieve
+  //instead
+  if (!result) {
+    const file = await FetchPennsieveFile.methods.fetchPennsieveFile(
+      $axios,
+      filePath,
+      route.query.dataset_id,
+      route.query.dataset_version
+    )
+    path = `${route.query.dataset_id}/${file.path}`
+    if (s3Bucket) {
+      path = path + `?s3BucketName=${s3Bucket}`
+    }
+    result = await $axios
+      .$get(`${process.env.portal_api}/exists/${path}`, config)
+      .then(({ exists }) => {
+        if (exists && exists !== 'false') {
+          return {
+            type: 'Scaffold',
+            label: `Dataset ${route.query.dataset_id}`,
+            url: `${process.env.portal_api}/s3-resource/${path}`,
+            viewUrl: route.query.ViewURL,
+          }
+        }
+      })
+  }
+  //Finally check if an old id was used for storing the viewport.
+  //If so, get it from the server
+  if (result) {
+    if (route.query.scaffoldid) {
+      const state = await getScaffoldState(route.query.scaffoldid, $axios)
+      result.state = state.state
+    }
+    return result
+  }
+}
+
 export default {
   name: 'MapsPage',
   components: {
     Breadcrumb,
     PageHero,
+    PortalFeatures,
     MapContent: process.client
-      ? () => import('@abi-software/mapintegratedvuer').then(m => m.MapContent)
-      : null
+      ? () =>
+          import('@abi-software/mapintegratedvuer').then((m) => m.MapContent)
+      : null,
   },
+  mixins: [DatasetInfo],
   async fetch() {
-    if (this.uuid != this.$route.query.id) {
-      this.uuid = this.$route.query.id
-      if (this.uuid) {
-        let url = this.options.sparcApi + `map/getstate`
-        await fetch(url, {
-          method: 'POST',
-          headers: {
-            'Content-type': 'application/json'
-          },
-          body: JSON.stringify({ uuid: this.uuid })
-        })
-          .then(response => response.json())
-          .then(data => {
-            this.state = data.state
-          })
-      }
+    //First check if map should be restore from a provided id
+    if (this.$route.query.id) {
+      this.restoreStateWithUUID()
+    } else {
+      //Now check if it should open a specific view based on query
+      this.openViewWithQuery()
     }
   },
   data() {
@@ -66,60 +158,324 @@ export default {
       breadcrumb: [
         {
           to: {
-            name: 'index'
+            name: 'index',
           },
-          label: 'Home'
-        }
+          label: 'Home',
+        },
       ],
+      currentEntry: undefined,
+      organ_name: undefined,
+      facets: [],
       uuid: undefined,
+      startingMap: "AC",
       state: undefined,
-      options:{
+      options: {
         sparcApi: process.env.portal_api,
         algoliaIndex: process.env.ALGOLIA_INDEX,
         algoliaKey: process.env.ALGOLIA_API_KEY,
         algoliaId: process.env.ALGOLIA_APP_ID,
-        pennsieveApi: (process.env.discover_api_host).replace('/discover', ''),
+        pennsieveApi: process.env.discover_api_host.replace('/discover', ''),
         flatmapAPI: process.env.flatmap_api,
         nlLinkPrefix: process.env.NL_LINK_PREFIX,
         rootUrl: process.env.ROOT_URL,
       },
-      shareLink: `${process.env.ROOT_URL}${this.$route.fullPath}`
+      shareLink: `${process.env.ROOT_URL}${this.$route.fullPath}`,
+      entries: [
+        {
+          fields: {
+            buttonLink: 'maps?type=ac',
+            buttonText: 'View AC Map',
+            description:
+              'The Anatomical Connectivity (AC) flatmaps show physical connectivity derived from SCKAN in an anatomical schematic context.',
+            title: 'Anatomical Connectivity',
+            icon: {
+              fields: {
+                file: {
+                  url: require('~/assets/ac-map.png'),
+                },
+              },
+            },
+          },
+        },
+        {
+          fields: {
+            buttonLink: 'maps?type=fc',
+            buttonText: 'View FC Map',
+            description:
+              'The Functional Connectivity (FC) flatmap provides a visualisation of semantic connectivity and a future interface to ANS models.',
+            title: 'Functional Connectivity',
+            icon: {
+              fields: {
+                file: {
+                  url: require('~/assets/fc-map.png'),
+                },
+              },
+            },
+          },
+        },
+        {
+          fields: {
+            buttonLink: 'maps?type=wholebody',
+            buttonText: 'View 3D Body',
+            description:
+              'The 3D whole-body shows physical connectivity derived from SCKAN in an anatomically realistic context.',
+            title: '3D Whole Body',
+            icon: {
+              fields: {
+                file: {
+                  url: require('~/assets/3d-map.png'),
+                },
+              },
+            },
+          },
+        },
+      ],
+    }
+  },
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'SPARC is creating detailed PNS maps based on SPARC data and information available from the literature.'
+        },
+      ]
     }
   },
   watch: {
-    '$route.query': '$fetch'
+    currentEntry: 'currentEntryUpdated',
+    facets: 'facetsUpdated',
+    isLandingPage: 'openViewWithQuery',
   },
   fetchOnServer: false,
-  created: function() {
+  created: function () {
     this.options.sparcApi = process.env.portal_api
     let lastChar = this.options.sparcApi.substr(-1)
     if (lastChar != '/') {
       this.options.sparcApi = this.options.sparcApi + '/'
     }
   },
+  computed: {
+    isLandingPage: function () {
+      return Object.keys(this.$route.query).length === 0
+    },
+  },
   methods: {
-    updateUUID: function() {
+    restoreStateWithUUID: async function () {
+      //Restore settings from a saved state
+      if (this.$route.query.id) {
+        if (this.uuid != this.$route.query.id) {
+          this.uuid = this.$route.query.id
+          if (this.uuid) {
+            await this.$axios
+              .$post(`${process.env.portal_api}/map/getstate`, {
+                uuid: this.uuid,
+              })
+              .then((response) => {
+                if (response.state) {
+                  this.state = response.state
+                  this.$message(
+                    successMessage(
+                      `Saved state retrieved succesfuly, please wait while the state is being resumed.`
+                    )
+                  )
+                }
+              })
+              .catch(() => {
+                this.$message(
+                  failMessage(
+                    `Sorry! We can not retrieve the saved stated. Please check later or consider submitting a bug report.`
+                  )
+                )
+              })
+          }
+        }
+      }
+    },
+    updateUUID: function () {
       let url = this.options.sparcApi + `map/getshareid`
       let state = this.$refs.map.getState()
       fetch(url, {
         method: 'POST',
         headers: {
-          'Content-type': 'application/json'
+          'Content-type': 'application/json',
         },
-        body: JSON.stringify({ state: state })
+        body: JSON.stringify({ state: state }),
       })
-        .then(response => response.json())
-        .then(data => {
+        .then((response) => response.json())
+        .then((data) => {
           this.uuid = data.uuid
-          this.$router.replace(
-            { query: { ...this.$route.query, id: data.uuid } },
-            () => {
-              this.shareLink = `${process.env.ROOT_URL}${this.$route.fullPath}`
-            }
-          )
+          this.$router.replace({ query: { id: data.uuid } }, () => {
+            this.shareLink = `${process.env.ROOT_URL}${this.$route.fullPath}`
+          })
         })
-    }
-  }
+    },
+    checkSpecies: function () {
+      //Display error message if species information is missing or cannot be found
+      //Old link may contain the for_species as undefined
+      if (this.currentEntry.type === 'MultiFlatmap') {
+        if (
+          this.$route.query.for_species &&
+          this.$route.query.for_species !== 'undefined'
+        ) {
+          if (
+            this.$route.query.for_species !==
+            flatmaps.speciesMap[this.currentEntry.taxo]
+          ) {
+            this.$message(
+              failMessage(
+                `Sorry! A flatmap for a ${this.forSpecies} does not yet exist. The ${this.organ_name} of a rat has been shown instead.`
+              )
+            )
+          }
+        } else if (this.$route.query.fid) {
+          this.$message(
+            successMessage(
+              `A flatmap's unique id is provided, a legacy map may be displayed instead.`
+            )
+          )
+        } else {
+          this.$message(
+            failMessage(
+              `Sorry! Species information cannot be found. The ${this.currentEntry.organ} of a rat has been shown instead.`
+            )
+          )
+        }
+      }
+    },
+    updateFacets: async function(dataset_id) {
+      //Create the array of facets to pass onto the sidebar
+      const filter = `objectID:${dataset_id}`
+      const facets = await getAlgoliaFacets(algoliaIndex, facetPropPathMapping, filter).then(data => {
+        return data
+      });
+      facets.forEach(facet => {
+        if (facet.key && facet.key === 'anatomy.organ.name' ||
+        facet.key === 'organisms.primary.species.name') {
+          let term = formatLabel(facet.label);
+          facet.children.forEach(child => {
+            this.facets.push({
+              facet: formatLabel(child.label),
+              term: term,
+              facetPropPath: facet.key,
+            });
+          });
+        }
+      });
+    },
+    //Process any taxon or anatomy parameters if they are available
+    processEntry: async function(route) {
+      //uberionid and taxo are now deprecated and replaced by Anatomy and taxon
+      const anatomy = route.query.anatomy ? route.query.anatomy : route.query.uberonid
+      const taxon = route.query.taxon ? route.query.taxon : route.query.taxo
+      if (anatomy || taxon) {
+        //Specify the gender of human
+        let biologicalSex = route.query.biologicalSex
+        if (taxon && taxon === 'NCBITaxon:9606') {
+          if (!biologicalSex) {
+            biologicalSex = 'PATO:0000384'
+          }
+        }
+        try {
+          this.organ_name = await scicrunch.getOrganFromUberonId(anatomy)
+          //We do not want to display the body proper
+          if (this.organ_name && this.organ_name.toLowerCase() === 'body proper') {
+            anatomy = undefined
+          }
+        } catch (e) {
+          // Error caught return empty data.
+        }
+        if (this.$route.query.type === 'ac' || this.$route.query.type === 'flatmap') {
+          this.currentEntry = {
+            type: 'MultiFlatmap',
+            taxo: taxon,
+            biologicalSex: biologicalSex,
+            uuid: route.query.fid,
+            organ: anatomy,
+          }
+          this.checkSpecies()
+          return
+        }
+        if (this.$route.query.type === 'fc' && anatomy) {
+          this.currentEntry = {
+            type: 'Flatmap',
+            resource: 'FunctionalConnectivity',
+            label: 'Functional',
+            state: {searchTerm: anatomy}
+          }
+          return
+        }
+      }
+      if (this.$route.query.type === 'ac' || this.$route.query.type === 'flatmap') {
+        this.startingMap = "AC"
+        return
+      }
+      if (this.$route.query.type === 'fc') {
+        this.startingMap = "FC"
+        return
+      }
+    },
+    openViewWithQuery: async function () {
+      //Open the map with specific view defined by the query.
+      //First get the bucket and facets information if available
+      let s3Bucket = undefined
+      this.startingMap = "AC"
+      
+      if (this.$route.query.dataset_id && this.$route.query.dataset_version) {
+        const datasetInfo = await this.getDatasetInfo(
+          this.$axios,
+          this.$route.query.dataset_id,
+          this.$route.query.dataset_version,
+          this.$cookies.get('user-token')
+        )
+        s3Bucket = datasetInfo
+          ? extractS3BucketName(datasetInfo.uri)
+          : undefined
+        await this.updateFacets(this.$route.query.dataset_id)
+      }
+      //Get the entry information if we are not opening with the default settings or
+      //resuming from previous saved state
+      if (this.$route.query.type === 'scaffold') {
+        this.currentEntry = await getScaffoldEntry(
+          this.$route,
+          this.$axios,
+          s3Bucket
+        )
+        if (!this.currentEntry) {
+          this.$message(
+            failMessage(
+              `Sorry! The specified scaffold cannot be found. Please check later or consider submitting a bug report.`
+            )
+          )
+        }
+      } else if (this.$route.query.type === 'fc' || 
+        this.$route.query.type === 'ac' || 
+        this.$route.query.type === 'flatmap') {
+        await this.processEntry(this.$route)
+      } else if (this.$route.query.type === 'wholebody') {
+        this.startingMap = "WholeBody"
+      }
+    },
+    facetsUpdated: function () {
+      if (this.facets.length > 0 && this.$refs.map) this.$refs.map.openSearch(this.facets, "")
+    },
+    currentEntryUpdated: function () {
+      if (this.$refs.map && this.currentEntry) {
+        this.$refs.map.setCurrentEntry(this.currentEntry)
+      }
+    },
+    mapMounted: function () {
+      this.currentEntryUpdated()
+      this.facetsUpdated()
+    },
+  },
 }
 </script>
 
@@ -156,6 +512,8 @@ export default {
 }
 </style>
 <style lang="scss">
+@import '@/assets/_variables.scss';
+
 .mapClass {
   position: relative;
   width: 100%;
@@ -163,6 +521,24 @@ export default {
   border: solid 1px #dcdfe6;
   box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.06);
   @import '~@abi-software/mapintegratedvuer/dist/mapintegratedvuer';
+
+  .map-icon {
+    color: #8300bf!important;
+  }
+
+
+  .pathway-container {
+    .container {
+      padding-left: 0px;
+    }
+  }
+
+  .el-popover.right-popper {
+    .popper__arrow {
+      border-top-color:transparent!important;
+      border-bottom-color:transparent!important;
+    }
+  }
 }
 
 .gallery-popper {
diff --git a/pages/news-and-events/community-spotlight/index.vue b/pages/news-and-events/community-spotlight/index.vue
index 4e81eab8..5fa295b9 100644
--- a/pages/news-and-events/community-spotlight/index.vue
+++ b/pages/news-and-events/community-spotlight/index.vue
@@ -89,6 +89,10 @@
                       <hr />
                     </div>
                   </template>
+                  <alternative-search-results-news
+                    ref="altSearchResults"
+                    :search-had-results="communitySpotlightItems.items.length > 0"
+                  />
                 </div>
                 <div class="search-heading">
                   <div class="label1" v-if="communitySpotlightItems.items.length">
@@ -112,6 +116,9 @@
         </el-col>
       </el-row>
     </div>
+    <div class="pb-16 pt-16 container">
+      <submit-community-section/>
+    </div>
   </div>
 </template>
 
@@ -125,6 +132,8 @@ import CommunitySpotlightFacetMenu from '@/components/FacetMenu/CommunitySpotlig
 import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
 import SearchControlsContentful from '@/components/SearchControlsContentful/SearchControlsContentful.vue'
 import SortMenu from '@/components/SortMenu/SortMenu.vue'
+import SubmitCommunitySection from '~/components/NewsEventsResourcesPage/SubmitCommunitySection.vue'
+import AlternativeSearchResultsNews from '~/components/AlternativeSearchResults/AlternativeSearchResultsNews.vue'
 
 import { fetchCommunitySpotlightItems, CommunitySpotlightData, CommunitySpotlightComputed, CommunitySpotlightMethods } from '../model'
 
@@ -182,7 +191,9 @@ export default Vue.extend<CommunitySpotlightData, CommunitySpotlightMethods, Com
     CommunitySpotlightItem,
     CommunitySpotlightFacetMenu,
     SearchControlsContentful,
-    SortMenu
+    SortMenu,
+    SubmitCommunitySection,
+    AlternativeSearchResultsNews
   },
 
   // In order to allow for sorting or fireside chats and success stories we needed
@@ -191,25 +202,26 @@ export default Vue.extend<CommunitySpotlightData, CommunitySpotlightMethods, Com
   // https://www.contentfulcommunity.com/t/how-to-query-on-multiple-content-types/473
   async asyncData({ route }) {
     const communitySpotlightItems = await fetchCommunitySpotlightItems(client, route.query.search, undefined, undefined, undefined, 10, 0)
-    const anatomicalStructures = await client.getEntries({
-      content_type: 'communitySpotlightAnatomicalStructure',
-      order: 'fields.name',
-    }).then(async ({ items }) => {
-      let data = []
-      items.forEach(( item ) => {
-        const name = pathOr('', ['fields','name'], item)
-        const entryId = pathOr('', ['sys','id'], item)
-        data.push({
-          label: name,
-          id: name,
-          entryId
-        })
+    // get all the available pre-defined values for creating the facet menu
+    let anatomicalStructures = {}
+    await client.getContentType('communitySpotlight').then(contentType => {
+      contentType.fields.forEach((field) => {
+        if (field.id === 'anatomicalStructure') {
+          let structures = field.items?.validations[0]['in']
+          let facetData = []
+          structures.forEach(itemLabel => {
+            facetData.push({
+              label: itemLabel,
+              id: itemLabel,
+            })
+          })
+          anatomicalStructures = {
+            label: 'Focus',
+            id: 'spotlightAnatomicalStructure',
+            data: facetData
+          }
+        }
       })
-      return {
-        label: 'Anatomical Structure',
-        id: 'spotlightAnatomicalStructure',
-        data: data
-      }
     })
 
     return {
@@ -238,12 +250,30 @@ export default Vue.extend<CommunitySpotlightData, CommunitySpotlightMethods, Com
       ]
     }
   },
+  head() {
+    return {
+      title: this.searchTypes[2].label,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.searchTypes[2].label,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'Browse community spotlight'
+        },
+      ]
+    }
+  },
   watch: {
     '$route.query': {
       handler: async function() {
         // we use next tick to wait for the facet menu to be mounted
         this.$nextTick(async () => {
-          this.communitySpotlightItems = await fetchCommunitySpotlightItems(client, this.$route.query.search, this.spotlightTypes, this.selectedAnatomicalStructuresEntryIds, this.sortOrder, 10, 0)
+          this.communitySpotlightItems = await fetchCommunitySpotlightItems(client, this.$route.query.search, this.spotlightTypes, this.selectedAnatomicalStructures, this.sortOrder, 10, 0)
+          this.$refs.altSearchResults?.retrieveAltTotals()
         })
       },
       immediate: true
@@ -253,22 +283,8 @@ export default Vue.extend<CommunitySpotlightData, CommunitySpotlightMethods, Com
     spotlightTypes: function() {
       return this.$route.query.selectedSpotlightTypes || undefined
     },
-    selectedAnatomicalStructuresEntryIds: function() {
-      const selectedStructures = this.$route.query.selectedAnatomicalStructures?.split(",") || undefined
-      let ids = []
-      const data = this.anatomicalStructures.data
-
-      if (selectedStructures == undefined) { return undefined }
-
-      selectedStructures.forEach((structure) => {
-        // check if the anatomical structure name is in the list, and if so grab its entry id (we need to use the entry ID for contentful query purposes)
-        data.some((dataItem) => {
-          if (dataItem.id == structure) {
-            ids.push(`${dataItem.entryId}`)
-          }
-        })
-      })
-      return ids
+    selectedAnatomicalStructures: function() {
+      return this.$route.query.selectedAnatomicalStructures?.split(",") || undefined
     },
     sortOrder: function() {
       return propOr('-fields.startDate', 'sortOrder', this.selectedSortOption)
@@ -282,7 +298,7 @@ export default Vue.extend<CommunitySpotlightData, CommunitySpotlightMethods, Com
     async onPaginationPageChange(page) {
       const { limit } = this.communitySpotlightItems
       const offset = (page - 1) * limit
-      const response = await fetchCommunitySpotlightItems(client, this.$route.query.search, this.spotlightTypes, this.selectedAnatomicalStructuresEntryIds, this.sortOrder, limit, offset)
+      const response = await fetchCommunitySpotlightItems(client, this.$route.query.search, this.spotlightTypes, this.selectedAnatomicalStructures, this.sortOrder, limit, offset)
       this.communitySpotlightItems = response
     },
     /**
@@ -291,21 +307,18 @@ export default Vue.extend<CommunitySpotlightData, CommunitySpotlightMethods, Com
      */
     async onPaginationLimitChange(limit) {
       const newLimit = limit === 'View All' ? this.communitySpotlightItems.total : limit
-      const response = await fetchCommunitySpotlightItems(client, this.$route.query.search, this.spotlightTypes, this.selectedAnatomicalStructuresEntryIds, this.sortOrder, newLimit, 0)
+      const response = await fetchCommunitySpotlightItems(client, this.$route.query.search, this.spotlightTypes, this.selectedAnatomicalStructures, this.sortOrder, newLimit, 0)
       this.communitySpotlightItems = response
     },
     async onSortOptionChange(option) {
       this.selectedSortOption = option
-      const response = await fetchCommunitySpotlightItems(client, this.$route.query.search, this.spotlightTypes, this.selectedAnatomicalStructuresEntryIds, this.sortOrder, this.communitySpotlightItems.limit, 0)
+      const response = await fetchCommunitySpotlightItems(client, this.$route.query.search, this.spotlightTypes, this.selectedAnatomicalStructures, this.sortOrder, this.communitySpotlightItems.limit, 0)
       this.communitySpotlightItems = response
     },
     // The community spotlight item component needs to use the properties off the actual success stories/fireside chats
     getLinkedItems(communitySpotlightItem) {
       const linkedItem = pathOr('', ['fields','linkedItem'], communitySpotlightItem)
-      const anatomicalFocus = pathOr('', ['fields','anatomicalFocus'], communitySpotlightItem)
-      const anatomicalStructures = anatomicalFocus.map((focusItem) => {
-        return pathOr('', ['fields', 'name'], focusItem)
-      })
+      const anatomicalStructures = pathOr('', ['fields','anatomicalStructure'], communitySpotlightItem)
       const spotlightTypeId = pathOr('', ['fields','itemType'], communitySpotlightItem)
       const spotlightType = SPOTLIGHT_TYPE_MAPPING.find(item => {
         return item.id == spotlightTypeId
@@ -327,8 +340,8 @@ export default Vue.extend<CommunitySpotlightData, CommunitySpotlightMethods, Com
 }
 .story-result {
   border-top: 1px solid $lineColor2;
-  padding-top: 1.5em;
-  padding-bottom: 0;
+  padding-top: 1rem;
+  padding-bottom: 1rem;
   &:first-child {
     border: none;
     padding-top: 0;
@@ -409,7 +422,6 @@ export default Vue.extend<CommunitySpotlightData, CommunitySpotlightMethods, Com
     text-transform: none;
   }
   &:hover,
-  &:focus,
   &.active {
     color: white;
     background-color: $purple;
diff --git a/pages/news-and-events/community-spotlight/submit/index.vue b/pages/news-and-events/community-spotlight/submit/index.vue
index c1cf5c3e..531c0ef8 100644
--- a/pages/news-and-events/community-spotlight/submit/index.vue
+++ b/pages/news-and-events/community-spotlight/submit/index.vue
@@ -31,7 +31,7 @@
 <script>
 import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
 import PageHero from '@/components/PageHero/PageHero.vue'
-import CommunitySpotlightForm from '@/components/CommunitySpotlightForm/CommunitySpotlightForm.vue'
+import CommunitySpotlightForm from '@/components/ContactUsForms/CommunitySpotlightForm/CommunitySpotlightForm.vue'
 
 export default {
   name: 'SubmitCommunitySpotlightPage',
@@ -129,6 +129,7 @@ h2 {
 ::v-deep .el-textarea__inner {
   font-family: inherit;
   padding-top: .75rem;
+  padding-bottom: .75rem;
 }
 ::v-deep .input-reason {
   max-width: 36rem;
diff --git a/pages/news-and-events/community-spotlight/success-stories/_id.vue b/pages/news-and-events/community-spotlight/success-stories/_id.vue
index e0308056..d3fa0b94 100644
--- a/pages/news-and-events/community-spotlight/success-stories/_id.vue
+++ b/pages/news-and-events/community-spotlight/success-stories/_id.vue
@@ -12,7 +12,10 @@
       <div class="subpage">
         <el-row :gutter="38">
           <el-col :sm="13">
-            <div class="content" v-html="parseMarkdown(entry.story)" />
+            <div
+              class="content"
+              v-html="parseMarkdown(entry.story)"
+            />
           </el-col>
           <el-col :sm="11">
             <div class="banner-wrapper">
@@ -178,6 +181,23 @@ export default {
       ]
     }
   },
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.entry.summary ? this.entry.summary : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
   computed: {
     pageUrl: function() {
       return `${process.env.ROOT_URL}${this.$route.fullPath}`
diff --git a/pages/news-and-events/events/_eventId/event-details/index.vue b/pages/news-and-events/events/_eventId/event-details/index.vue
index 192463d5..79e2c02f 100644
--- a/pages/news-and-events/events/_eventId/event-details/index.vue
+++ b/pages/news-and-events/events/_eventId/event-details/index.vue
@@ -81,6 +81,24 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.heroTitle,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.heroTitle,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.heroSummary ? this.heroSummary : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
+
   computed: {
     /**
      * Compute HTML Event Details for the page
@@ -155,8 +173,9 @@ export default {
 }
 .content {
   ::v-deep img {
+    display: block;
+    margin: auto;
     height: auto;
-    margin: 0.5em 0;
     max-width: 100%;
   }
 }
diff --git a/pages/news-and-events/events/_id.vue b/pages/news-and-events/events/_id.vue
index b990c110..4eb400ed 100644
--- a/pages/news-and-events/events/_id.vue
+++ b/pages/news-and-events/events/_id.vue
@@ -106,6 +106,24 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.page.fields.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.page.fields.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.page.fields.summary ? this.page.fields.summary : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
+
   computed: {
     /**
      * Get news and event image
diff --git a/pages/news-and-events/events/index.vue b/pages/news-and-events/events/index.vue
index 8afab582..9189007a 100644
--- a/pages/news-and-events/events/index.vue
+++ b/pages/news-and-events/events/index.vue
@@ -79,6 +79,11 @@
                     v-for="item in events.items"
                     :key="item.sys.id"
                     :item="item"
+                    :show-past-events-divider="showPastEventsDivider && item.sys.id == firstPastEventId"
+                  />
+                  <alternative-search-results-news
+                    ref="altSearchResults"
+                    :search-had-results="events.items.length > 0"
                   />
                 </div>
                 <div class="search-heading">
@@ -103,19 +108,24 @@
         </el-col>
       </el-row>
     </div>
+    <div class="pb-16 pt-16 container">
+      <submit-news-section/>
+    </div>
   </div>
 </template>
 
 <script lang="ts">
 // @ts-nocheck
 import Vue from 'vue'
-import { propOr } from 'ramda'
+import { pathOr, propOr } from 'ramda'
 import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
 import EventsFacetMenu from '@/components/FacetMenu/EventsFacetMenu.vue'
 import EventListItem from '@/components/EventListItem/EventListItem.vue'
 import SearchControlsContentful from '@/components/SearchControlsContentful/SearchControlsContentful.vue'
 import SortMenu from '@/components/SortMenu/SortMenu.vue'
 import createClient from '@/plugins/contentful.js'
+import SubmitNewsSection from '~/components/NewsEventsResourcesPage/SubmitNewsSection.vue'
+import AlternativeSearchResultsNews from '~/components/AlternativeSearchResults/AlternativeSearchResultsNews.vue'
 
 import { fetchEvents, EventsData, EventsComputed, EventsMethods } from '../model'
 
@@ -137,6 +147,11 @@ const searchTypes = [
 ]
 
 const sortOptions = [
+  {
+    label: 'Upcoming',
+    id: 'upcoming',
+    sortOrder: '-fields.upcomingSortOrder'
+  },
   {
     label: 'Latest',
     id: 'latest',
@@ -158,11 +173,13 @@ export default Vue.extend<EventsData, EventsMethods, EventsComputed, never>({
   name: 'EventsPage',
 
   components: {
+    AlternativeSearchResultsNews,
     Breadcrumb,
     EventsFacetMenu,
     EventListItem,
     SearchControlsContentful,
-    SortMenu
+    SortMenu,
+    SubmitNewsSection
   },
 
   async asyncData({ route }) {
@@ -195,12 +212,31 @@ export default Vue.extend<EventsData, EventsMethods, EventsComputed, never>({
     }
   },
 
+  head() {
+    return {
+      title: this.searchTypes[1].label,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.searchTypes[1].label,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'Browse events'
+        },
+      ]
+    }
+  },
+
   watch: {
     '$route.query': {
       handler: async function() {
         // we use next tick to wait for the facet menu to be mounted
         this.$nextTick(async () => {
           this.events = await fetchEvents(client, this.$route.query.search, this.startLessThanDate, this.startGreaterThanOrEqualToDate, this.eventTypes, this.sortOrder, 10, 0)
+          this.$refs.altSearchResults?.retrieveAltTotals()
         })
       },
       immediate: true
@@ -226,6 +262,28 @@ export default Vue.extend<EventsData, EventsMethods, EventsComputed, never>({
     },
     sortOrder: function() {
       return propOr('-fields.startDate', 'sortOrder', this.selectedSortOption)
+    },
+    firstPastEventId: function() {
+      const events = propOr([], 'items', this.events)
+      for (let i = 0; i < events.length; i++) {
+        const event = events[i]
+        const upcomingSortOrder = pathOr("", ['fields','upcomingSortOrder'], event)
+        if (upcomingSortOrder < 0) {
+          return pathOr("", ['sys','id'], event)
+        }
+      }
+      return -1
+    },
+    showPastEventsDivider: function() {
+      if (this.selectedSortOption.id != "upcoming") {
+        return false
+      }
+      const events = propOr([], 'items', this.events)
+      if (events.length == 0) {
+        return false
+      }
+      const firstEventId = pathOr(-1, ['sys', 'id'], events[0])
+      return this.firstPastEventId != firstEventId
     }
   },
 
@@ -274,6 +332,10 @@ export default Vue.extend<EventsData, EventsMethods, EventsComputed, never>({
     padding-bottom: 0;
   }
 }
+::v-deep .past-events-divider {
+  border-top: none;
+  padding-top: 0;
+}
 .subpage {
   margin-bottom: 1rem;
   margin-top: 1rem;
@@ -346,7 +408,6 @@ export default Vue.extend<EventsData, EventsMethods, EventsComputed, never>({
     text-transform: none;
   }
   &:hover,
-  &:focus,
   &.active {
     color: white;
     background-color: $purple;
diff --git a/pages/news-and-events/index.vue b/pages/news-and-events/index.vue
index 7914a34c..c3b2ea04 100644
--- a/pages/news-and-events/index.vue
+++ b/pages/news-and-events/index.vue
@@ -12,6 +12,9 @@
         class="page-hero-img"
         :src="page.fields.heroImage.fields.file.url"
       />
+      <NuxtLink to="/news-and-events/news">
+        <el-button class="secondary mb-16">Browse all News &amp; Events</el-button>
+      </NuxtLink>
     </page-hero>
 
     <div class="pt-32 pb-16">
@@ -34,7 +37,7 @@
                     name: 'news-and-events-news'
                   }"
                 >
-                  View All News &gt;
+                  View All News
                 </nuxt-link>
               </div>
             </div>
@@ -46,43 +49,23 @@
               combination of components
             -->
             <client-only>
-              <content-tab-card
-                class="tabs p-32"
-                :tabs="eventsTabs"
-                :active-tab-id="activeTabId"
-                @tab-changed="eventsTabChanged"
-              >
-                <template v-if="activeTabId === 'upcoming'">
-                  <div class="upcoming-events">
-                    <event-card
-                      v-for="event in upcomingEvents.items"
-                      :key="event.sys.id"
-                      :event="event"
-                    />
-                  </div>
-
-                </template>
-
-                <template v-if="activeTabId === 'past'">
-                  <div class="past-events">
-                    <event-card
-                      v-for="event in pastEvents.items"
-                      :key="event.sys.id"
-                      :event="event"
-                    />
-                  </div>
-                </template>
-                <div class="mt-16">
-                  <nuxt-link
-                    class="btn-load-more"
-                    :to="{
-                      name: 'news-and-events-events',
-                    }"
-                  >
-                    View All Events >
-                  </nuxt-link>
-                </div>
-              </content-tab-card>
+              <div class="upcoming-events">
+                <event-card
+                  v-for="event in upcomingEvents.items"
+                  :key="event.sys.id"
+                  :event="event"
+                />
+              </div>
+              <div class="mt-16">
+                <nuxt-link
+                  class="btn-load-more"
+                  :to="{
+                    name: 'news-and-events-events',
+                  }"
+                >
+                  View All Events
+                </nuxt-link>
+              </div>
             </client-only>
           </el-col>
         </el-row>
@@ -98,7 +81,9 @@
             <el-col :xs="24" :sm="12" class="newsletter-wrap">
               <div class="heading2">Sign up for the SPARC Newsletter</div>
               <div class="body1 mb-16 mt-8">Keep up to date with all the latest news and events from the SPARC Portal.</div>
-              <newsletter-form />
+              <newsletter-form
+                location="news and events"
+              />
               <div class="newsletter-archive mt-16">
                 <style type="text/css">
                   .campaign { margin-top: .5rem; }
@@ -112,24 +97,32 @@
               <div class="heading2 mt-24">Get Involved</div>
               <div class="body1 mb-16 mt-8">Empower SPARC to promote your science and interests by submitting your science story, news, or event.</div>
               <div class="get-involved-buttons-container">
-                <el-button class="get-involved-button secondary">
-                  <nuxt-link
-                    :to="{
-                      name: 'news-and-events-submit',
-                    }"
-                  >
+                <nuxt-link
+                  :to="{
+                    name: 'contact-us',
+                    query: {
+                      type: 'news-event'
+                    }
+                  }"
+                  target="_blank"
+                >
+                  <el-button class="get-involved-button secondary">
                     Share news or events
-                  </nuxt-link>
-                </el-button>
-                <el-button class="get-involved-button secondary mt-8">
-                  <nuxt-link
-                    :to="{
-                      name: 'news-and-events-community-spotlight-submit',
-                    }"
-                  >
+                  </el-button>
+                </nuxt-link>
+                <nuxt-link
+                  :to="{
+                    name: 'contact-us',
+                    query: {
+                      type: 'story'
+                    }
+                  }"
+                  target="_blank"
+                >
+                  <el-button class="get-involved-button secondary mt-8">
                     Submit a community spotlight idea
-                  </nuxt-link>
-                </el-button>
+                  </el-button>
+                </nuxt-link>
               </div>
             </el-col>
             <el-col :xs="24" :sm="12" class="twitter-wrap">
@@ -209,9 +202,8 @@ export default Vue.extend<Data, Methods, Computed, never>({
   watch: {
     '$route.query': {
       handler: async function(this: NewsAndEventsComponent) {
-        const { upcomingEvents, pastEvents, news, page, stories } = await fetchData(client, this.$route.query.search as string, 2)
+        const { upcomingEvents, news, page, stories } = await fetchData(client, this.$route.query.search as string, 2)
         this.upcomingEvents = upcomingEvents;
-        this.pastEvents = pastEvents;
         this.news = news;
         this.page = page;
         this.stories = stories;
@@ -231,25 +223,31 @@ export default Vue.extend<Data, Methods, Computed, never>({
           label: 'Home'
         }
       ],
-      activeTabId: 'upcoming',
-      eventsTabs: [
-        {
-          label: 'Upcoming',
-          id: 'upcoming'
-        },
-        {
-          label: 'Past',
-          id: 'past'
-        }
-      ],
       upcomingEvents: {} as EventsCollection,
-      pastEvents: {} as EventsCollection,
       news: {} as NewsCollection,
       page: {} as PageEntry,
       stories: {} as CommunitySpotlightItemsCollection
     }
   },
 
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.page.fields.heroCopy ? this.page.fields.heroCopy : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
+
   computed: {
     /**
      * Compute featured event
@@ -268,20 +266,6 @@ export default Vue.extend<Data, Methods, Computed, never>({
       const news = await fetchNews(client, this.$route.query.search as string, undefined, undefined, undefined, undefined, this.news.total, 2)
       this.news = { ...this.news, items: { ...this.news.items, ...news.items } }
     },
-    eventsTabChanged(newTab) {
-      this.activeTabId = newTab.id
-    },
-    // Calculate the eventYear param based off the tab being shown
-    eventYear() {
-      if (this.activeTabId === 'upcoming')
-      {
-
-      }
-      else if (this.activeTabId === 'past') {
-
-      }
-      return undefined
-    },
     currentMonth() {
       return new Date().getMonth()
     }
@@ -313,7 +297,7 @@ export default Vue.extend<Data, Methods, Computed, never>({
   margin: 1em 0;
   padding: 0;
 }
-.upcoming-events, .past-events {
+.upcoming-events {
   justify-content: space-between;
   display: flex;
   flex-wrap: wrap;
@@ -352,16 +336,13 @@ export default Vue.extend<Data, Methods, Computed, never>({
 .btn-load-more {
   background: none;
   border: none;
-  color: $darkBlue;
+  color: $purple;
   cursor: pointer;
   display: block;
   font-size: 1rem;
-  font-weight: 700;
+  font-weight: 500;
   padding: 0;
-  &:hover,
-  &:active {
-    text-decoration: underline;
-  }
+  text-decoration: underline;
 }
 
 .newsletter-archive {
diff --git a/pages/news-and-events/model.ts b/pages/news-and-events/model.ts
index a33767f2..2da6dad4 100644
--- a/pages/news-and-events/model.ts
+++ b/pages/news-and-events/model.ts
@@ -28,15 +28,6 @@ export const fetchData = async (client: ContentfulClientApi, terms?: string, lim
       limit
     })
 
-    const pastEvents = await client.getEntries<EventsEntry>({
-      content_type: process.env.ctf_event_id,
-      order: '-fields.startDate',
-      'fields.startDate[lt]': todaysDate.toISOString(),
-      'fields.startDate[gte]': sub(todaysDate, { years: 2 }).toISOString(),
-      query,
-      limit
-    })
-
     const news = await fetchNews(client, query, undefined, undefined, undefined, undefined, limit)
 
     const page = await client.getEntry<PageData>(process.env.ctf_news_and_events_page_id ?? '')
@@ -45,7 +36,6 @@ export const fetchData = async (client: ContentfulClientApi, terms?: string, lim
 
     return {
       upcomingEvents,
-      pastEvents,
       news,
       page,
       stories
@@ -54,7 +44,6 @@ export const fetchData = async (client: ContentfulClientApi, terms?: string, lim
     console.error(e)
     return {
       upcomingEvents: {} as unknown as EventsCollection,
-      pastEvents: {} as unknown as EventsCollection,
       news: {} as unknown as NewsCollection,
       page: {} as unknown as PageEntry,
       stories: {} as unknown as CommunitySpotlightItemsCollection
@@ -100,11 +89,11 @@ export const fetchNews = async (client: ContentfulClientApi, terms?: string, pub
     })
   } catch (e) {
     console.error(e)
-    return {} as unknown as CommunitySpotlightItemsCollection
+    return {} as unknown as NewsCollection
   }
 }
 
-export const fetchCommunitySpotlightItems = async (client: ContentfulClientApi, terms?: string, spotlightTypes?: Array<string>, anatomicalStructuresEntryIds?: Array<string>, sortOrder?: string, limit?: number, skip?: number) : Promise<CommunitySpotlightItemsCollection> => {
+export const fetchCommunitySpotlightItems = async (client: ContentfulClientApi, terms?: string, spotlightTypes?: Array<string>, anatomicalStructures?: Array<string>, sortOrder?: string, limit?: number, skip?: number) : Promise<CommunitySpotlightItemsCollection> => {
   const query = replaceTerms(terms)
   try {
     return await client.getEntries<CommunitySpotlightItemEntry>({
@@ -114,9 +103,7 @@ export const fetchCommunitySpotlightItems = async (client: ContentfulClientApi,
       limit,
       skip,
       'fields.itemType[in]': spotlightTypes?.toString(),
-      // we need to use the entry ID instead of name field like we do for the projects 'anatomical focus' facet because it is a multiple references field and not a singular
-      // https://www.contentfulcommunity.com/t/searching-on-multiple-reference-fields/377
-      'fields.anatomicalFocus.sys.id[in]': anatomicalStructuresEntryIds?.toString(),
+      'fields.anatomicalStructure[in]': anatomicalStructures?.toString()
     })
   } catch (e) {
     console.error(e)
@@ -124,7 +111,7 @@ export const fetchCommunitySpotlightItems = async (client: ContentfulClientApi,
   }
 }
 
-export type AsyncData = Pick<Data, "upcomingEvents" | "pastEvents" | "news" | "page" | "stories">
+export type AsyncData = Pick<Data, "upcomingEvents" | "news" | "page" | "stories">
 
 export interface PageData {
   featuredEvent?: EventsEntry;
@@ -179,7 +166,6 @@ export interface Data {
   activeTab: string;
   eventsTabs: Tab[];
   upcomingEvents: EventsCollection;
-  pastEvents: EventsCollection;
   news: NewsCollection;
   page: PageEntry;
   stories: CommunitySpotlightItemsCollection
diff --git a/pages/news-and-events/news/_id.vue b/pages/news-and-events/news/_id.vue
index 08658331..3468ee1f 100644
--- a/pages/news-and-events/news/_id.vue
+++ b/pages/news-and-events/news/_id.vue
@@ -76,6 +76,24 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.page.fields.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.page.fields.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.page.fields.summary ? this.page.fields.summary : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
+
   computed: {
     /**
      * Get news and event image
@@ -105,3 +123,10 @@ export default {
   }
 }
 </script>
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+
+hr {
+  margin: 1rem 0;
+}
+</style>
diff --git a/pages/news-and-events/news/index.vue b/pages/news-and-events/news/index.vue
index 66ab70e5..f5f50f9a 100644
--- a/pages/news-and-events/news/index.vue
+++ b/pages/news-and-events/news/index.vue
@@ -80,6 +80,10 @@
                     :key="item.sys.id"
                     :item="item"
                   />
+                  <alternative-search-results-news
+                    ref="altSearchResults"
+                    :search-had-results="news.items.length > 0"
+                  />
                 </div>
                 <div class="search-heading">
                   <div class="label1" v-if="news.items.length">
@@ -103,6 +107,9 @@
         </el-col>
       </el-row>
     </div>
+    <div class="pb-16 pt-16 container">
+      <submit-news-section/>
+    </div>
   </div>
 </template>
 
@@ -115,6 +122,8 @@ import NewsFacetMenu from '@/components/FacetMenu/NewsFacetMenu.vue'
 import NewsListItem from '@/components/NewsListItem/NewsListItem.vue'
 import SearchControlsContentful from '@/components/SearchControlsContentful/SearchControlsContentful.vue';
 import SortMenu from '@/components/SortMenu/SortMenu.vue'
+import SubmitNewsSection from '~/components/NewsEventsResourcesPage/SubmitNewsSection.vue'
+import AlternativeSearchResultsNews from '~/components/AlternativeSearchResults/AlternativeSearchResultsNews.vue'
 
 import createClient from '@/plugins/contentful.js'
 
@@ -163,7 +172,9 @@ export default Vue.extend<NewsData, NewsMethods, NewsComputed, never>({
     NewsFacetMenu,
     NewsListItem,
     SearchControlsContentful,
-    SortMenu
+    SortMenu,
+    SubmitNewsSection,
+    AlternativeSearchResultsNews
   },
 
   async asyncData({ route }) {
@@ -196,12 +207,31 @@ export default Vue.extend<NewsData, NewsMethods, NewsComputed, never>({
     }
   },
 
+  head() {
+    return {
+      title: this.searchTypes[0].label,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.searchTypes[0].label,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'Browse news'
+        },
+      ]
+    }
+  },
+
   watch: {
     '$route.query': {
       handler: function() {
         // we use next tick to wait for the facet menu to be mounted
         this.$nextTick(async () => {
           this.news = await fetchNews(client, this.$route.query.search, this.publishedLessThanDate, this.publishedGreaterThanOrEqualToDate, this.subjects, this.sortOrder, 10, 0)
+          this.$refs.altSearchResults?.retrieveAltTotals()
         })
       },
       immediate: true
@@ -346,7 +376,6 @@ export default Vue.extend<NewsData, NewsMethods, NewsComputed, never>({
     text-transform: none;
   }
   &:hover,
-  &:focus,
   &.active {
     color: white;
     background-color: $purple;
diff --git a/pages/news-and-events/submit/index.vue b/pages/news-and-events/submit/index.vue
index 13f603c3..dee6a6c9 100644
--- a/pages/news-and-events/submit/index.vue
+++ b/pages/news-and-events/submit/index.vue
@@ -2,7 +2,7 @@
   <div class="submit-page">
     <breadcrumb :breadcrumb="breadcrumb" title="Submit" />
     <page-hero>
-      <h1>Share your News or Event</h1>
+      <h1>{{heroTitle}}</h1>
       <p>Submit your news or event with SPARC. We will then be in contact about how we share this to the SPARC community.</p>
     </page-hero>
     <div class="page-wrap container">
@@ -31,7 +31,7 @@
 <script>
 import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
 import PageHero from '@/components/PageHero/PageHero.vue'
-import NewsAndEventsForm from '@/components/NewsAndEventsForm/NewsAndEventsForm.vue'
+import NewsAndEventsForm from '@/components/ContactUsForms/NewsAndEventsForm/NewsAndEventsForm.vue'
 
 export default {
   name: 'SubmitNewsAndEventsPage',
@@ -58,11 +58,18 @@ export default {
           }
         },
       ],
+      heroTitle: "Share your News or Event",
       isNewsAndEventsFormSubmitted: false,
       name: ''
     }
   },
 
+  head() {
+    return {
+      title: this.heroTitle
+    }
+  },
+
   methods: {
     /**
      * Reset all form data
diff --git a/pages/projects/_projectId.vue b/pages/projects/_projectId.vue
index 817dd23a..5a185fb9 100644
--- a/pages/projects/_projectId.vue
+++ b/pages/projects/_projectId.vue
@@ -16,7 +16,7 @@
             <div class="body1">
               <template v-if="projectSection">
                 <div class="label4">
-                  ANATOMICAL FOCUS
+                  FOCUS
                 </div>
                 <div class="mb-16">
                   {{ projectSection }}
@@ -38,12 +38,20 @@
                   {{ institution }}
                 </div>
               </template>
+              <template v-if="fundingProgram.length > 0">
+                <div class="label4">
+                  FUNDING PROGRAM
+                </div>
+                <div class="mb-16">
+                  {{ fundingProgram[0] }}
+                </div>
+              </template>
               <template v-if="awardId">
                 <div class="label4">
-                  NIH AWARD
+                  AWARD
                 </div>
                 <div class="mb-16">
-                  <a :href="nihReporterUrl" target="_blank">
+                  <a :href="nihReporterUrl" :target="!opensInNewTab(nihReporterUrl) ? '_self' : '_blank'">
                     {{ awardId }}
                     <svg-icon v-if="!isInternalLink(nihReporterUrl)" name="icon-open" height="25" width="25" />
                   </a>
@@ -75,9 +83,7 @@
             <div class="heading2 mb-32">
               {{ title }}
             </div>
-            <div class="body1">
-              {{ description }}
-            </div>
+            <div class="body1 content" v-html="parseMarkdown(description)" />
           </el-col>
         </div>
       </div>
@@ -92,7 +98,8 @@
 import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
 import DatasetCard from '@/components/DatasetCard/DatasetCard.vue'
 import ShareLinks from '@/components/ShareLinks/ShareLinks.vue'
-import { isInternalLink } from '@/mixins/marked/index'
+import marked from '@/mixins/marked/index'
+import { isInternalLink, opensInNewTab } from '@/mixins/marked/index'
 import { propOr, isEmpty } from 'ramda'
 
 import createClient from '@/plugins/contentful.js'
@@ -106,7 +113,7 @@ export default {
     DatasetCard,
     ShareLinks
   },
-
+  mixins: [marked],
   async asyncData({ route, $axios }) {
     try {
       const project = await client.getEntry(route.params.projectId)
@@ -148,6 +155,12 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.title
+    }
+  },
+
   computed: {
     /**
      * Get image Source
@@ -164,6 +177,9 @@ export default {
     description: function() {
       return this.fields.description
     },
+    fundingProgram: function() {
+      return this.fields.program
+    },
     awardId: function() {
       return this.fields.awardId
     },
@@ -201,6 +217,7 @@ export default {
 
   methods: {
     isInternalLink,
+    opensInNewTab
   }
 }
 </script>
@@ -241,6 +258,14 @@ hr {
   overflow-x: hidden;
   text-overflow: hidden;
 }
+.content {
+  ::v-deep img {
+    display: block;
+    margin: auto;
+    height: auto;
+    max-width: 100%;
+  }
+}
 @media screen and (max-width: 760px) {
   .row {
     flex-direction: column;
diff --git a/pages/resources/_resourceId.vue b/pages/resources/_resourceId.vue
index 6a14b521..295ffb14 100644
--- a/pages/resources/_resourceId.vue
+++ b/pages/resources/_resourceId.vue
@@ -18,16 +18,43 @@
               {{ resource.fields.name }}
             </div>
           </sparc-tooltip>
-          <span v-if="resource.fields.developedBySparc" class="mb-16 resource-category">
+          <span v-if="resource.fields.developedBySparc" class="mb-4 resource-category">
             SPARC
           </span>
+          <span v-if="resource.fields.codeathon" class="mb-16 resource-category">
+            Codeathon
+          </span>
           <div class="label4">
             URL
           </div>
           <a class="resource-url truncated" :href="resource.fields.url" target="_blank">
             {{ resource.fields.url }}
           </a>
-          <div class="mt-16 label4">
+          <template v-if="resource.fields.owner">
+            <div class="label4">
+              Owner
+            </div>
+            <div class="truncated">
+              {{ resource.fields.owner }}
+            </div>
+          </template>
+          <template v-if="resource.fields.contactEmail">
+            <div class="label4">
+              Contact Email
+            </div>
+            <div class="truncated">
+              {{ resource.fields.contactEmail }}
+            </div>
+          </template>
+          <template v-if="resource.fields.program">
+            <div class="label4">
+              Funding Program
+            </div>
+            <div class="truncated">
+              {{ resource.fields.program[0] }}
+            </div>
+          </template>
+          <div class="mt-4 label4">
             Share
           </div>
           <share-links class="mb-16"/>
@@ -85,6 +112,24 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.resource.fields.name,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.resource.fields.name,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.resource.fields.description ? this.resource.fields.description : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
+    }
+  },
+
   computed: {
     /**
      * Compute the URL for the resource's logo
@@ -118,10 +163,10 @@ export default {
   background: $purple;
   border-radius: 15px;
   color: #fff;
-  display: block;
+  margin-right: .25rem;
   font-size: 0.875rem;
   top: 10px;
-  padding: 0 0.65rem;
+  padding: 0.2rem 0.6rem;
   right: 14px;
   width: fit-content;
 }
diff --git a/pages/resources/biological/index.vue b/pages/resources/biological/index.vue
index f182e1f4..92f5d213 100644
--- a/pages/resources/biological/index.vue
+++ b/pages/resources/biological/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="page-data">
-    <breadcrumb :breadcrumb="breadcrumb" title="Biological" />
+    <breadcrumb :breadcrumb="breadcrumb" :title=title />
     <div class="container">
       <div class="search-tabs__container">
         <h3>
@@ -73,8 +73,10 @@
                   </span>
                 </div>
                 <div class="subpage">
-                  <resources-search-results
-                    :table-data="resources.items"
+                  <resources-search-results :table-data="resources.items" />
+                  <alternative-search-results
+                    ref="alternativeSearchResults"
+                    :search-had-results="resources.items.length > 0"
                   />
                 </div>
                 <div class="search-heading">
@@ -99,6 +101,9 @@
         </el-col>
       </el-row>
     </div>
+    <div class="pb-16 pt-16 container">
+      <submit-tool-section />
+    </div>
   </div>
 </template>
 
@@ -110,6 +115,8 @@ import SortMenu from '@/components/SortMenu/SortMenu.vue'
 import ResourcesSearchResults from '@/components/Resources/ResourcesSearchResults.vue'
 import ToolsAndResourcesFacetMenu from '@/components/FacetMenu/ToolsAndResourcesFacetMenu.vue'
 import { fetchResources, searchTypes, sortOptions } from '../utils.ts'
+import SubmitToolSection from '@/components/Resources/SubmitToolSection.vue'
+import AlternativeSearchResults from '~/components/AlternativeSearchResults/AlternativeSearchResultsResources.vue'
 
 export default {
   name: 'BiologicalPage',
@@ -119,7 +126,9 @@ export default {
     SearchControlsContentful,
     ResourcesSearchResults,
     ToolsAndResourcesFacetMenu,
-    SortMenu
+    SortMenu,
+    SubmitToolSection,
+    AlternativeSearchResults
   },
 
   async asyncData({ route }) {
@@ -131,6 +140,7 @@ export default {
 
   data() {
     return {
+      title: 'Biological',
       searchTypes,
       selectedSortOption: sortOptions[0],
       sortOptions,
@@ -151,12 +161,31 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'Browse biological'
+        },
+      ]
+    }
+  },
+
   watch: {
     '$route.query': {
       handler: async function() {
         // we use next tick to wait for the facet menu to be mounted
         this.$nextTick(async () => {
-          this.resources = await fetchResources('Biologicals', this.$route.query.search, this.sortOrder, this.developedBySparc, 10, 0)
+          this.resources = await fetchResources('Biologicals', this.$route.query.search, this.sortOrder, this.type, 10, 0)
+          this.$refs.alternativeSearchResults.retrieveAltTotals()
         })
       },
       immediate: true
@@ -174,8 +203,8 @@ export default {
     sortOrder: function() {
       return propOr('-fields.name', 'sortOrder', this.selectedSortOption)
     },
-    developedBySparc: function() {
-      return this.$route.query.developedBySparc || undefined
+    type: function() {
+      return this.$route.query.type || undefined
     },
   },
 
@@ -187,7 +216,7 @@ export default {
     async onPaginationPageChange(page) {
       const { limit } = this.resources
       const offset = (page - 1) * limit
-      const response = await fetchResources('Biologicals', this.$route.query.search, this.sortOrder, this.developedBySparc, limit, offset)
+      const response = await fetchResources('Biologicals', this.$route.query.search, this.sortOrder, this.type, limit, offset)
       this.resources = response
     },
     /**
@@ -196,12 +225,12 @@ export default {
      */
     async onPaginationLimitChange(limit) {
       const newLimit = limit === 'View All' ? this.resources.total : limit
-      const response = await fetchResources('Biologicals', this.$route.query.search, this.sortOrder, this.developedBySparc, newLimit, 0)
+      const response = await fetchResources('Biologicals', this.$route.query.search, this.sortOrder, this.type, newLimit, 0)
       this.resources = response
     },
     async onSortOptionChange(option) {
       this.selectedSortOption = option
-      const response = await fetchResources('Biologicals', this.$route.query.search, this.sortOrder, this.developedBySparc, this.resources.limit, 0)
+      const response = await fetchResources('Biologicals', this.$route.query.search, this.sortOrder, this.type, this.resources.limit, 0)
       this.resources = response
     }
   }
@@ -213,7 +242,7 @@ export default {
 .page-data {
   background-color: $background;
 }
-.event-list-item {
+::v-deep .resources-search-results__items {
   border-top: 1px solid $lineColor2;
   padding: 1rem 0;
   &:first-child {
@@ -296,7 +325,6 @@ export default {
     text-transform: none;
   }
   &:hover,
-  &:focus,
   &.active {
     color: white;
     background-color: $purple;
diff --git a/pages/resources/databases/index.vue b/pages/resources/databases/index.vue
index 89e076b6..1ef3a02c 100644
--- a/pages/resources/databases/index.vue
+++ b/pages/resources/databases/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="page-data">
-    <breadcrumb :breadcrumb="breadcrumb" title="Databases" />
+    <breadcrumb :breadcrumb="breadcrumb" :title=title />
     <div class="container">
       <div class="search-tabs__container">
         <h3>
@@ -73,8 +73,10 @@
                   </span>
                 </div>
                 <div class="subpage">
-                  <resources-search-results
-                    :table-data="resources.items"
+                  <resources-search-results :table-data="resources.items" />
+                  <alternative-search-results
+                    ref="alternativeSearchResults"
+                    :search-had-results="resources.items.length > 0"
                   />
                 </div>
                 <div class="search-heading">
@@ -99,6 +101,9 @@
         </el-col>
       </el-row>
     </div>
+    <div class="pb-16 pt-16 container">
+      <submit-tool-section/>
+    </div>
   </div>
 </template>
 
@@ -109,7 +114,9 @@ import SearchControlsContentful from '@/components/SearchControlsContentful/Sear
 import SortMenu from '@/components/SortMenu/SortMenu.vue'
 import ResourcesSearchResults from '@/components/Resources/ResourcesSearchResults.vue'
 import ToolsAndResourcesFacetMenu from '@/components/FacetMenu/ToolsAndResourcesFacetMenu.vue'
+import AlternativeSearchResults from '~/components/AlternativeSearchResults/AlternativeSearchResultsResources.vue'
 import { fetchResources, searchTypes, sortOptions } from '../utils.ts'
+import SubmitToolSection from '@/components/Resources/SubmitToolSection.vue'
 
 export default {
   name: 'DatabasesPage',
@@ -119,7 +126,9 @@ export default {
     SearchControlsContentful,
     ResourcesSearchResults,
     ToolsAndResourcesFacetMenu,
-    SortMenu
+    SortMenu,
+    SubmitToolSection,
+    AlternativeSearchResults
   },
 
   async asyncData({ route }) {
@@ -131,6 +140,7 @@ export default {
 
   data() {
     return {
+      title: 'Databases',
       searchTypes,
       selectedSortOption: sortOptions[0],
       sortOptions,
@@ -151,12 +161,31 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'Browse databases'
+        },
+      ]
+    }
+  },
+
   watch: {
     '$route.query': {
       handler: async function() {
         // we use next tick to wait for the facet menu to be mounted
         this.$nextTick(async () => {
-          this.resources = await fetchResources('Data and Models', this.$route.query.search, this.sortOrder, this.developedBySparc, 10, 0)
+          this.resources = await fetchResources('Data and Models', this.$route.query.search, this.sortOrder, this.type, 10, 0)
+          this.$refs.alternativeSearchResults.retrieveAltTotals()
         })
       },
       immediate: true
@@ -174,8 +203,8 @@ export default {
     sortOrder: function() {
       return propOr('-fields.name', 'sortOrder', this.selectedSortOption)
     },
-    developedBySparc: function() {
-      return this.$route.query.developedBySparc || undefined
+    type: function() {
+      return this.$route.query.type || undefined
     },
   },
 
@@ -187,7 +216,7 @@ export default {
     async onPaginationPageChange(page) {
       const { limit } = this.resources
       const offset = (page - 1) * limit
-      const response = await fetchResources('Data and Models', this.$route.query.search, this.sortOrder, this.developedBySparc, limit, offset)
+      const response = await fetchResources('Data and Models', this.$route.query.search, this.sortOrder, this.type, limit, offset)
       this.resources = response
     },
     /**
@@ -196,12 +225,12 @@ export default {
      */
     async onPaginationLimitChange(limit) {
       const newLimit = limit === 'View All' ? this.resources.total : limit
-      const response = await fetchResources('Data and Models', this.$route.query.search, this.sortOrder, this.developedBySparc, newLimit, 0)
+      const response = await fetchResources('Data and Models', this.$route.query.search, this.sortOrder, this.type, newLimit, 0)
       this.resources = response
     },
     async onSortOptionChange(option) {
       this.selectedSortOption = option
-      const response = await fetchResources('Data and Models', this.$route.query.search, this.sortOrder, this.developedBySparc, this.resources.limit, 0)
+      const response = await fetchResources('Data and Models', this.$route.query.search, this.sortOrder, this.type, this.resources.limit, 0)
       this.resources = response
     }
   }
@@ -213,7 +242,7 @@ export default {
 .page-data {
   background-color: $background;
 }
-.event-list-item {
+::v-deep .resources-search-results__items {
   border-top: 1px solid $lineColor2;
   padding: 1rem 0;
   &:first-child {
@@ -296,7 +325,6 @@ export default {
     text-transform: none;
   }
   &:hover,
-  &:focus,
   &.active {
     color: white;
     background-color: $purple;
diff --git a/pages/resources/devices/index.vue b/pages/resources/devices/index.vue
index 3260085d..eea197c9 100644
--- a/pages/resources/devices/index.vue
+++ b/pages/resources/devices/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="page-data">
-    <breadcrumb :breadcrumb="breadcrumb" title="Devices" />
+    <breadcrumb :breadcrumb="breadcrumb" :title=title />
     <div class="container">
       <div class="search-tabs__container">
         <h3>
@@ -73,8 +73,10 @@
                   </span>
                 </div>
                 <div class="subpage">
-                  <resources-search-results
-                    :table-data="resources.items"
+                  <resources-search-results :table-data="resources.items" />
+                  <alternative-search-results
+                    ref="alternativeSearchResults"
+                    :search-had-results="resources.items.length > 0"
                   />
                 </div>
                 <div class="search-heading">
@@ -99,6 +101,9 @@
         </el-col>
       </el-row>
     </div>
+    <div class="pb-16 pt-16 container">
+      <submit-tool-section/>
+    </div>
   </div>
 </template>
 
@@ -110,6 +115,8 @@ import SortMenu from '@/components/SortMenu/SortMenu.vue'
 import ResourcesSearchResults from '@/components/Resources/ResourcesSearchResults.vue'
 import ToolsAndResourcesFacetMenu from '@/components/FacetMenu/ToolsAndResourcesFacetMenu.vue'
 import { fetchResources, searchTypes, sortOptions } from '../utils.ts'
+import SubmitToolSection from '@/components/Resources/SubmitToolSection.vue'
+import AlternativeSearchResults from '~/components/AlternativeSearchResults/AlternativeSearchResultsResources.vue'
 
 export default {
   name: 'DevicesPage',
@@ -119,7 +126,9 @@ export default {
     SearchControlsContentful,
     ResourcesSearchResults,
     ToolsAndResourcesFacetMenu,
-    SortMenu
+    SortMenu,
+    SubmitToolSection,
+    AlternativeSearchResults
   },
 
   async asyncData({ route }) {
@@ -131,6 +140,7 @@ export default {
 
   data() {
     return {
+      title: "Devices",
       searchTypes,
       selectedSortOption: sortOptions[0],
       sortOptions,
@@ -151,12 +161,31 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'Browse devices'
+        },
+      ]
+    }
+  },
+
   watch: {
     '$route.query': {
       handler: async function() {
         // we use next tick to wait for the facet menu to be mounted
         this.$nextTick(async () => {
-          this.resources = await fetchResources('Devices', this.$route.query.search, this.sortOrder, this.developedBySparc, 10, 0)
+          this.resources = await fetchResources('Devices', this.$route.query.search, this.sortOrder, this.type, 10, 0)
+          this.$refs.alternativeSearchResults.retrieveAltTotals()
         })
       },
       immediate: true
@@ -174,8 +203,8 @@ export default {
     sortOrder: function() {
       return propOr('-fields.name', 'sortOrder', this.selectedSortOption)
     },
-    developedBySparc: function() {
-      return this.$route.query.developedBySparc || undefined
+    type: function() {
+      return this.$route.query.type || undefined
     },
   },
 
@@ -187,7 +216,7 @@ export default {
     async onPaginationPageChange(page) {
       const { limit } = this.resources
       const offset = (page - 1) * limit
-      const response = await fetchResources('Devices', this.$route.query.search, this.sortOrder, this.developedBySparc, limit, offset)
+      const response = await fetchResources('Devices', this.$route.query.search, this.sortOrder, this.type, limit, offset)
       this.resources = response
     },
     /**
@@ -196,12 +225,12 @@ export default {
      */
     async onPaginationLimitChange(limit) {
       const newLimit = limit === 'View All' ? this.resources.total : limit
-      const response = await fetchResources('Devices', this.$route.query.search, this.sortOrder, this.developedBySparc, newLimit, 0)
+      const response = await fetchResources('Devices', this.$route.query.search, this.sortOrder, this.type, newLimit, 0)
       this.resources = response
     },
     async onSortOptionChange(option) {
       this.selectedSortOption = option
-      const response = await fetchResources('Devices', this.$route.query.search, this.sortOrder, this.developedBySparc, this.resources.limit, 0)
+      const response = await fetchResources('Devices', this.$route.query.search, this.sortOrder, this.type, this.resources.limit, 0)
       this.resources = response
     }
   }
@@ -213,7 +242,7 @@ export default {
 .page-data {
   background-color: $background;
 }
-.event-list-item {
+::v-deep .resources-search-results__items {
   border-top: 1px solid $lineColor2;
   padding: 1rem 0;
   &:first-child {
@@ -296,7 +325,6 @@ export default {
     text-transform: none;
   }
   &:hover,
-  &:focus,
   &.active {
     color: white;
     background-color: $purple;
diff --git a/pages/resources/index.vue b/pages/resources/index.vue
index 9dd6a806..72d1c9d5 100644
--- a/pages/resources/index.vue
+++ b/pages/resources/index.vue
@@ -6,18 +6,19 @@
       <!-- eslint-disable vue/no-v-html -->
       <!-- marked will sanitize the HTML injected -->
       <div v-html="parseMarkdown(fields.summary)" />
-      <NuxtLink to="/resources/biological">
+      <NuxtLink to="/resources/databases">
         <el-button class="secondary mb-16">Browse all Tools &amp; Resources</el-button>
       </NuxtLink>
     </page-hero>
     <div class="page-wrap container">
       <div v-if="fields.featured !== undefined">
         <div class="heading2 my-32">Featured Tools &amp; Resources</div>
-        <resources-gallery
+        <gallery
+          galleryItemType="resources"
           :items="fields.featured"
         />
         <div class="link-container mt-16">
-          <NuxtLink class="browse-all-link" to="/resources/biological">
+          <NuxtLink class="browse-all-link" to="/resources/databases">
             Browse All Tools &amp; Resources
           </NuxtLink>
         </div>
@@ -27,7 +28,8 @@
         <paper
           :text="parseMarkdown(fields.paperText)"
           :button-text="'Submit a recommendation'"
-          :button-link="submissionLink"
+          :button-link="{ name: 'contact-us', query: { type: 'tool'} }"
+          new-tab
         />
       </div>
     </div>
@@ -41,7 +43,7 @@ import createClient from '@/plugins/contentful.js'
 import ErrorMessages from '@/mixins/error-messages'
 import marked from '@/mixins/marked/index'
 import Paper from '~/components/Paper/Paper.vue'
-import ResourcesGallery from '~/components/ResourcesGallery/ResourcesGallery.vue'
+import Gallery from '~/components/Gallery/Gallery.vue'
 
 const client = createClient()
 
@@ -54,7 +56,7 @@ export default {
     Breadcrumb,
     PageHero,
     Paper,
-    ResourcesGallery,
+    Gallery,
   },
 
   asyncData( { error } ) {
@@ -83,10 +85,21 @@ export default {
     }
   },
 
-  computed: {
-    submissionLink() {
-      const route = 'resources-submit'
-      return { name: route }
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: this.fields.summary ? this.fields.summary : 'Stimulating Peripheral Activity to Relieve Conditions (SPARC)'
+        },
+      ]
     }
   }
 }
diff --git a/pages/resources/information-services/index.vue b/pages/resources/information-services/index.vue
index 67738b1a..822b5cf2 100644
--- a/pages/resources/information-services/index.vue
+++ b/pages/resources/information-services/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="page-data">
-    <breadcrumb :breadcrumb="breadcrumb" title="Information Services" />
+    <breadcrumb :breadcrumb="breadcrumb" :title=title />
     <div class="container">
       <div class="search-tabs__container">
         <h3>
@@ -73,8 +73,10 @@
                   </span>
                 </div>
                 <div class="subpage">
-                  <resources-search-results
-                    :table-data="resources.items"
+                  <resources-search-results :table-data="resources.items" />
+                  <alternative-search-results
+                    ref="alternativeSearchResults"
+                    :search-had-results="resources.items.length > 0"
                   />
                 </div>
                 <div class="search-heading">
@@ -99,6 +101,9 @@
         </el-col>
       </el-row>
     </div>
+    <div class="pb-16 pt-16 container">
+      <submit-tool-section/>
+    </div>
   </div>
 </template>
 
@@ -110,6 +115,8 @@ import SortMenu from '@/components/SortMenu/SortMenu.vue'
 import ResourcesSearchResults from '@/components/Resources/ResourcesSearchResults.vue'
 import ToolsAndResourcesFacetMenu from '@/components/FacetMenu/ToolsAndResourcesFacetMenu.vue'
 import { fetchResources, searchTypes, sortOptions } from '../utils.ts'
+import SubmitToolSection from '@/components/Resources/SubmitToolSection.vue'
+import AlternativeSearchResults from '~/components/AlternativeSearchResults/AlternativeSearchResultsResources.vue'
 
 export default {
   name: 'InformationServicesPage',
@@ -119,7 +126,9 @@ export default {
     SearchControlsContentful,
     ResourcesSearchResults,
     ToolsAndResourcesFacetMenu,
-    SortMenu
+    SortMenu,
+    SubmitToolSection,
+    AlternativeSearchResults
   },
 
   async asyncData({ route }) {
@@ -131,6 +140,7 @@ export default {
 
   data() {
     return {
+      title: "Information Services",
       searchTypes,
       selectedSortOption: sortOptions[0],
       sortOptions,
@@ -151,12 +161,31 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'Browse information services'
+        },
+      ]
+    }
+  },
+
   watch: {
     '$route.query': {
       handler: async function() {
         // we use next tick to wait for the facet menu to be mounted
         this.$nextTick(async () => {
-          this.resources = await fetchResources('Information Services', this.$route.query.search, this.sortOrder, this.developedBySparc, 10, 0)
+          this.resources = await fetchResources('Information Services', this.$route.query.search, this.sortOrder, this.type, 10, 0)
+          this.$refs.alternativeSearchResults.retrieveAltTotals()
         })
       },
       immediate: true
@@ -174,8 +203,8 @@ export default {
     sortOrder: function() {
       return propOr('-fields.name', 'sortOrder', this.selectedSortOption)
     },
-    developedBySparc: function() {
-      return this.$route.query.developedBySparc || undefined
+    type: function() {
+      return this.$route.query.type || undefined
     },
   },
 
@@ -187,7 +216,7 @@ export default {
     async onPaginationPageChange(page) {
       const { limit } = this.resources
       const offset = (page - 1) * limit
-      const response = await fetchResources('Information Services', this.$route.query.search, this.sortOrder, this.developedBySparc, limit, offset)
+      const response = await fetchResources('Information Services', this.$route.query.search, this.sortOrder, this.type, limit, offset)
       this.resources = response
     },
     /**
@@ -196,12 +225,12 @@ export default {
      */
     async onPaginationLimitChange(limit) {
       const newLimit = limit === 'View All' ? this.resources.total : limit
-      const response = await fetchResources('Information Services', this.$route.query.search, this.sortOrder, this.developedBySparc, newLimit, 0)
+      const response = await fetchResources('Information Services', this.$route.query.search, this.sortOrder, this.type, newLimit, 0)
       this.resources = response
     },
     async onSortOptionChange(option) {
       this.selectedSortOption = option
-      const response = await fetchResources('Information Services', this.$route.query.search, this.sortOrder, this.developedBySparc, this.resources.limit, 0)
+      const response = await fetchResources('Information Services', this.$route.query.search, this.sortOrder, this.type, this.resources.limit, 0)
       this.resources = response
     }
   }
@@ -213,7 +242,7 @@ export default {
 .page-data {
   background-color: $background;
 }
-.event-list-item {
+::v-deep .resources-search-results__items {
   border-top: 1px solid $lineColor2;
   padding: 1rem 0;
   &:first-child {
@@ -296,7 +325,6 @@ export default {
     text-transform: none;
   }
   &:hover,
-  &:focus,
   &.active {
     color: white;
     background-color: $purple;
diff --git a/pages/resources/osparc-services/index.vue b/pages/resources/osparc-services/index.vue
new file mode 100644
index 00000000..35b95234
--- /dev/null
+++ b/pages/resources/osparc-services/index.vue
@@ -0,0 +1,341 @@
+<template>
+  <div class="page-data">
+    <breadcrumb :breadcrumb="breadcrumb" :title=title />
+    <div class="container">
+      <div class="search-tabs__container">
+        <h3>
+          Browse categories
+        </h3>
+        <ul class="search-tabs">
+          <li v-for="type in searchTypes" :key="type.label">
+            <nuxt-link
+              class="search-tabs__button"
+              :class="{ active: type.path === 'osparc-services' }"
+              :to="{
+                path: type.path,
+                query: {
+                  ...$route.query,
+                }
+              }"
+            >
+              {{ type.label }}
+            </nuxt-link>
+          </li>
+        </ul>
+      </div>
+      <div class="search-bar__container">
+        <h5>
+          Search within category
+        </h5>
+        <search-controls-contentful
+          class="search-bar"
+          placeholder="Enter search criteria"
+          path="/resources/osparc-services"
+          showSearchText
+        />
+      </div>
+    </div>
+    <div class="pb-16 container mt-32">
+      <el-row :gutter="32" type="flex">
+        <el-col :span="24">
+          <el-row :gutter="32">
+            <client-only>
+              <el-col>
+                <p><em>By clicking on the button next to each search result, you can instantiate the service in the
+                  <a href="/resources/4LkLiH5s4FV0LVJd3htsvH">o<sup>2</sup>S<sup>2</sup>PARC cloud platform</a>.</em></p>
+                <div class="search-heading mb-16">
+                  <div class="label1" v-show="resources.items.length">
+                    {{ resources.total }} Results | Showing
+                    <pagination-menu
+                      :page-size="resources.limit"
+                      @update-page-size="onPaginationLimitChange"
+                    />
+                  </div>
+                  <!--
+                  <span v-if="resources.items.length" class="label1">
+                    Sort
+                    <sort-menu
+                      :options="sortOptions"
+                      :selected-option="selectedSortOption"
+                      @update-selected-option="onSortOptionChange"
+                    />
+                  </span>
+                  -->
+                </div>
+                <div class="subpage">
+                  <services-search-results
+                    :services="resources.items"
+                  />
+                  <alternative-search-results
+                    ref="alternativeSearchResults"
+                    :search-had-results="resources.items.length > 0"
+                  />
+                </div>
+                <div class="search-heading">
+                  <div class="label1" v-if="resources.items.length">
+                    {{ resources.total }} Results | Showing
+                    <pagination-menu
+                      :page-size="resources.limit"
+                      @update-page-size="onPaginationLimitChange"
+                    />
+                  </div>
+                  <pagination
+                    v-if="resources.limit < resources.total"
+                    :selected="curSearchPage"
+                    :page-size="resources.limit"
+                    :total-count="resources.total"
+                    @select-page="onPaginationPageChange"
+                  />
+                </div>
+              </el-col>
+            </client-only>
+          </el-row>
+        </el-col>
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<script>
+import { propOr } from 'ramda'
+import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
+import SearchControlsContentful from '@/components/SearchControlsContentful/SearchControlsContentful.vue'
+import SortMenu from '@/components/SortMenu/SortMenu.vue'
+import ServicesSearchResults from '@/components/Resources/ServicesSearchResults.vue'
+import ToolsAndResourcesFacetMenu from '@/components/FacetMenu/ToolsAndResourcesFacetMenu.vue'
+import { fetchResources, searchTypes, sortOptions } from '../utils.ts'
+import SubmitToolSection from '@/components/Resources/SubmitToolSection.vue'
+import AlternativeSearchResults from '~/components/AlternativeSearchResults/AlternativeSearchResultsResources.vue'
+
+export default {
+  name: 'OsparcServicesPage',
+
+  components: {
+    Breadcrumb,
+    SearchControlsContentful,
+    ServicesSearchResults,
+    ToolsAndResourcesFacetMenu,
+    SortMenu,
+    SubmitToolSection,
+    AlternativeSearchResults
+  },
+
+  async asyncData({ route, redirect, env, $axios }) {
+    const url = new URL(`${process.env.portal_api}/sim/service`)
+    if (route.query.search) {
+      url.searchParams.append('search', route.query.search)
+    }
+    const resources = await $axios.$get(url.toString())
+    return {
+      resources
+    }
+  },
+
+  data() {
+    return {
+      title: 'oSPARC Services',
+      searchTypes,
+      selectedSortOption: sortOptions[0],
+      sortOptions,
+      breadcrumb: [
+        {
+          label: 'Home',
+          to: {
+            name: 'index'
+          }
+        },
+        {
+          label: 'Tools & Resources',
+          to: {
+            name: 'resources'
+          }
+        }
+      ]
+    }
+  },
+
+  head() {
+    return {
+      title: this.title
+    }
+  },
+
+  watch: {
+    '$route.query': {
+      handler: async function() {
+        // we use next tick to wait for the facet menu to be mounted
+        this.$nextTick(async () => {
+          this.resources = await this.getResources()
+          this.$refs.alternativeSearchResults.retrieveAltTotals()
+        })
+      },
+      immediate: true
+    },
+  },
+
+  computed: {
+    /**
+     * Compute the current page based off the limit and the offset
+     * @returns {Number}
+     */
+    curSearchPage: function() {
+      return this.resources.skip / this.resources.limit + 1
+    },
+    sortOrder: function() {
+      return propOr('-fields.name', 'sortOrder', this.selectedSortOption)
+    },
+    type: function() {
+      return this.$route.query.type || undefined
+    },
+  },
+
+  methods: {
+    /**
+     * Get more events for the new page
+     * @param {Number} page
+     */
+    async onPaginationPageChange(page) {
+      const { limit } = this.resources
+      const offset = (page - 1) * limit
+      const response = await this.getResources(limit, offset)
+      this.resources = response
+    },
+    /**
+     * Update limit based on pagination menu selection and get more events
+     * @param {Number} limit
+     */
+    async onPaginationLimitChange(limit) {
+      const newLimit = limit === 'View All' ? this.resources.total : limit
+      const response = await this.getResources(newLimit)
+      this.resources = response
+    },
+    // async onSortOptionChange(option) {
+    //   this.selectedSortOption = option
+    //   const response = await fetchResources('Software', this.$route.query.search, this.sortOrder, this.type, this.resources.limit, 0)
+    //   this.resources = response
+    // },
+    async getResources(limit, skip) {
+      const url = new URL(`${process.env.portal_api}/sim/service`)
+      if (this.$route.query.search) {
+        url.searchParams.set('search', this.$route.query.search)
+      }
+      if (this.resources && limit) {
+        url.searchParams.set('limit', limit)
+      }
+      if (this.resources && skip) {
+        url.searchParams.set('skip', skip)
+      }
+      return await this.$axios.$get(url.toString())
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+.page-data {
+  background-color: $background;
+}
+::v-deep .resources-search-results__items {
+  border-top: 1px solid $lineColor2;
+  padding: 1rem 0;
+  &:first-child {
+    border: none;
+    padding-top: 0;
+  }
+  &:last-child {
+    padding-bottom: 0;
+  }
+}
+.subpage {
+  margin-bottom: 1rem;
+  margin-top: 1rem;
+  padding-bottom: 1rem;
+}
+.page-wrap {
+  margin-bottom: 2.5rem;
+}
+.search-tabs__container {
+  margin-top: 2rem;
+  padding-top: 0.5rem;
+  background-color: white;
+  border: 0.1rem solid $lineColor2;
+  h3 {
+    padding-left: 0.75rem;
+    font-weight: 600;
+    font-size: 1.5rem;
+  }
+}
+.search-bar__container {
+  margin-top: 1em;
+  padding: 0.75rem;
+  border: 0.1rem solid $lineColor2;
+  background: white;
+  h5 {
+    line-height: 1rem;
+    font-weight: 600;
+    font-size: 1rem;
+  }
+}
+.search-tabs {
+  display: flex;
+  list-style: none;
+  overflow: auto;
+  margin: 0 0 0 0;
+  padding: 0 0;
+  outline: 0.1rem solid $purple;
+  @media (max-width: 40rem) {
+    display: block;
+  }
+  li {
+    width: 100%;
+    text-align: center;
+    color: $purple;
+  }
+  li:last-child > a {
+    border-right: none;
+  }
+}
+.search-tabs__button {
+  background: #f9f2fc;
+  display: block;
+  font-size: 0.75rem;
+  font-weight: 500;
+  outline: none;
+  padding: 0;
+  text-decoration: none;
+  text-transform: uppercase;
+  line-height: 3.5rem;
+  @media (min-width: 40rem) {
+    font-size: 0.65rem;
+    border-right: 0.1rem solid $purple;
+  }
+  @media (min-width: 50rem) {
+    font-size: .75rem;
+  }
+  @media (min-width: 64rem) {
+    font-size: 1.25rem;
+    font-weight: 600;
+    text-transform: none;
+  }
+  &:hover,
+  &.active {
+    color: white;
+    background-color: $purple;
+    font-weight: 500;
+  }
+}
+.search-heading {
+  align-items: flex-end;
+  display: flex;
+  justify-content: space-between;
+  @media screen and (max-width: 28em) {
+    flex-direction: column;
+    align-items: flex-start;
+    margin-bottom: 0;
+  }
+}
+.events-facet-menu {
+  margin-top: 2rem;
+}
+</style>
diff --git a/pages/resources/software/index.vue b/pages/resources/software/index.vue
index f432028c..df3899bb 100644
--- a/pages/resources/software/index.vue
+++ b/pages/resources/software/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="page-data">
-    <breadcrumb :breadcrumb="breadcrumb" title="Software" />
+    <breadcrumb :breadcrumb="breadcrumb" :title=title />
     <div class="container">
       <div class="search-tabs__container">
         <h3>
@@ -73,8 +73,10 @@
                   </span>
                 </div>
                 <div class="subpage">
-                  <resources-search-results
-                    :table-data="resources.items"
+                  <resources-search-results :table-data="resources.items" />
+                  <alternative-search-results
+                    ref="alternativeSearchResults"
+                    :search-had-results="resources.items.length > 0"
                   />
                 </div>
                 <div class="search-heading">
@@ -99,6 +101,9 @@
         </el-col>
       </el-row>
     </div>
+    <div class="pb-16 pt-16 container">
+      <submit-tool-section/>
+    </div>
   </div>
 </template>
 
@@ -110,6 +115,8 @@ import SortMenu from '@/components/SortMenu/SortMenu.vue'
 import ResourcesSearchResults from '@/components/Resources/ResourcesSearchResults.vue'
 import ToolsAndResourcesFacetMenu from '@/components/FacetMenu/ToolsAndResourcesFacetMenu.vue'
 import { fetchResources, searchTypes, sortOptions } from '../utils.ts'
+import SubmitToolSection from '@/components/Resources/SubmitToolSection.vue'
+import AlternativeSearchResults from '~/components/AlternativeSearchResults/AlternativeSearchResultsResources.vue'
 
 export default {
   name: 'SoftwarePage',
@@ -119,7 +126,9 @@ export default {
     SearchControlsContentful,
     ResourcesSearchResults,
     ToolsAndResourcesFacetMenu,
-    SortMenu
+    SortMenu,
+    SubmitToolSection,
+    AlternativeSearchResults
   },
 
   async asyncData({ route }) {
@@ -131,6 +140,7 @@ export default {
 
   data() {
     return {
+      title: 'Software',
       searchTypes,
       selectedSortOption: sortOptions[0],
       sortOptions,
@@ -151,12 +161,31 @@ export default {
     }
   },
 
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'Browse software'
+        },
+      ]
+    }
+  },
+
   watch: {
     '$route.query': {
       handler: async function() {
         // we use next tick to wait for the facet menu to be mounted
         this.$nextTick(async () => {
-          this.resources = await fetchResources('Software', this.$route.query.search, this.sortOrder, this.developedBySparc, 10, 0)
+          this.resources = await fetchResources('Software', this.$route.query.search, this.sortOrder, this.type, 10, 0)
+          this.$refs.alternativeSearchResults.retrieveAltTotals()
         })
       },
       immediate: true
@@ -174,8 +203,8 @@ export default {
     sortOrder: function() {
       return propOr('-fields.name', 'sortOrder', this.selectedSortOption)
     },
-    developedBySparc: function() {
-      return this.$route.query.developedBySparc || undefined
+    type: function() {
+      return this.$route.query.type || undefined
     },
   },
 
@@ -187,7 +216,7 @@ export default {
     async onPaginationPageChange(page) {
       const { limit } = this.resources
       const offset = (page - 1) * limit
-      const response = await fetchResources('Software', this.$route.query.search, this.sortOrder, this.developedBySparc, limit, offset)
+      const response = await fetchResources('Software', this.$route.query.search, this.sortOrder, this.type, limit, offset)
       this.resources = response
     },
     /**
@@ -196,12 +225,12 @@ export default {
      */
     async onPaginationLimitChange(limit) {
       const newLimit = limit === 'View All' ? this.resources.total : limit
-      const response = await fetchResources('Software', this.$route.query.search, this.sortOrder, this.developedBySparc, newLimit, 0)
+      const response = await fetchResources('Software', this.$route.query.search, this.sortOrder, this.type, newLimit, 0)
       this.resources = response
     },
     async onSortOptionChange(option) {
       this.selectedSortOption = option
-      const response = await fetchResources('Software', this.$route.query.search, this.sortOrder, this.developedBySparc, this.resources.limit, 0)
+      const response = await fetchResources('Software', this.$route.query.search, this.sortOrder, this.type, this.resources.limit, 0)
       this.resources = response
     }
   }
@@ -213,7 +242,7 @@ export default {
 .page-data {
   background-color: $background;
 }
-.event-list-item {
+::v-deep .resources-search-results__items {
   border-top: 1px solid $lineColor2;
   padding: 1rem 0;
   &:first-child {
@@ -296,7 +325,6 @@ export default {
     text-transform: none;
   }
   &:hover,
-  &:focus,
   &.active {
     color: white;
     background-color: $purple;
diff --git a/pages/resources/submit/index.vue b/pages/resources/submit/index.vue
index 75fb8567..9564e607 100644
--- a/pages/resources/submit/index.vue
+++ b/pages/resources/submit/index.vue
@@ -31,7 +31,7 @@
 <script>
 import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
 import PageHero from '@/components/PageHero/PageHero.vue'
-import ToolsAndResourcesForm from '@/components/ToolsAndResourcesForm/ToolsAndResourcesForm.vue'
+import ToolsAndResourcesForm from '@/components/ContactUsForms/ToolsAndResourcesForm/ToolsAndResourcesForm.vue'
 
 export default {
   name: 'SubmitToolsAndResourcesPage',
@@ -115,14 +115,13 @@ h2 {
     color: $lightGrey;
   }
 }
-::v-deep .el-input__inner, ::v-deep .el-textarea__inner {
+::v-deep .el-textarea__inner {
   border-color: $lightGrey;
   border-radius: 4px;
   padding-right: 1rem;
-}
-::v-deep .el-textarea__inner {
   font-family: inherit;
   padding-top: .75rem;
+  padding-bottom: .75rem;
 }
 ::v-deep .input-reason {
   max-width: 36rem;
diff --git a/pages/resources/utils.ts b/pages/resources/utils.ts
index de3e960a..87fb355a 100644
--- a/pages/resources/utils.ts
+++ b/pages/resources/utils.ts
@@ -10,8 +10,12 @@ const replaceTerms = (terms?: String) => {
   }
   return result
 }
-export const fetchResources = async (resourceType: String, terms?: String, sortOrder?: String, developedBySparc?: Boolean, limit?: Number, skip?: Number) => {
+export const fetchResources = async (resourceType: String, terms?: String, sortOrder?: String, type?: Array<String>, limit?: Number, skip?: Number) => {
   const query = replaceTerms(terms)
+  // Since these are different fields in contentful, we must set them to undefined instead of false or else the query will always return false when it and's the values.
+  // Eventually, we should update the content type to be one field that can have multiple tags/values set on it
+  const developedBySparc = type?.includes('developedBySparc') ? true : undefined
+  const codeathon = type?.includes('codeathon') ? true : undefined
 
   try {
     return await client.getEntries({
@@ -22,6 +26,7 @@ export const fetchResources = async (resourceType: String, terms?: String, sortO
       skip,
       'fields.resourceType[in]': resourceType,
       'fields.developedBySparc' : developedBySparc,
+      'fields.codeathon' : codeathon
     }).then(async response => {
       return { ...response }
     })
@@ -31,33 +36,38 @@ export const fetchResources = async (resourceType: String, terms?: String, sortO
   }
 }
 
-export const searchTypes = [
-  {
-    label: 'Biological',
-    path: 'biological',
-    contentfulLabel: 'Biologicals'
-  },
-  {
-    label: 'Databases',
-    path: 'databases',
-    contentfulLabel: 'Data and Models'
-  },
-  {
-    label: 'Devices',
-    path: 'devices',
-    contentfulLabel: 'Devices'
-  },
-  {
-    label: 'Information Services',
-    path: 'information-services',
-    contentfulLabel: 'Information Services'
-  },
-  {
-    label: 'Software',
-    path: 'software',
-    contentfulLabel: 'Software'
-  }
-]
+export const searchTypes = 
+  [
+    {
+      label: 'Databases',
+      path: 'databases',
+      contentfulLabel: 'Data and Models'
+    },
+    {
+      label: 'Software',
+      path: 'software',
+      contentfulLabel: 'Software'
+    },
+    {
+      label: 'Information Services',
+      path: 'information-services',
+      contentfulLabel: 'Information Services'
+    },
+    {
+      label: 'Devices',
+      path: 'devices',
+      contentfulLabel: 'Devices'
+    },
+    {
+      label: 'Biological',
+      path: 'biological',
+      contentfulLabel: 'Biologicals'
+    },
+    {
+      label: 'o²S²PARC Services',
+      path: 'osparc-services'
+    }
+  ]
 
 export const sortOptions = [
   {
diff --git a/pages/share-data/index.vue b/pages/share-data/index.vue
new file mode 100644
index 00000000..d73ff5ba
--- /dev/null
+++ b/pages/share-data/index.vue
@@ -0,0 +1,110 @@
+<template>
+  <div class="page-data pb-16">
+    <breadcrumb :breadcrumb="breadcrumb" :title="title" />
+    <page-hero>
+      <h1>{{ title }}</h1>
+      <p>{{ summary }}</p>
+    </page-hero>
+    <div class="container">
+      <div class="subpage px-32 py-16">
+        <div v-html="parseMarkdown(description)" />
+        <hr />
+        <div v-for="callToAction in callsToAction" :key="callToAction.sys.id" class="mb-16">
+          <call-to-action :data="callToAction.fields" @click="showLoginDialog = true"/>
+        </div>
+      </div>
+      <div v-if="learnMore" class="subpage px-32 mb-0">
+        <div class="heading1 mb-16">Learn More</div>
+        <div v-for="(item, i) in learnMore" :key="item.sys.id">
+          <learn-more-card
+            :about-details-item="item"
+            :parent-path="slug"
+          />
+          <hr v-if="i < learnMore.length - 1" />
+        </div>
+      </div>
+    </div>
+    <login-modal
+      :show-dialog="showLoginDialog"
+      redirectUrl="/user/profile"
+      @dialog-closed="showLoginDialog = false"
+    />
+  </div>
+</template>
+
+<script>
+import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
+import LearnMoreCard from '@/components/LearnMoreCard/LearnMoreCard.vue'
+import PageHero from '@/components/PageHero/PageHero.vue'
+import MarkedMixin from '@/mixins/marked'
+import createClient from '@/plugins/contentful.js'
+import CallToAction from '~/components/CallToAction/CallToAction.vue'
+import LoginModal from '@/components/LoginModal/LoginModal.vue'
+
+const client = createClient()
+
+export default {
+  name: 'ShareDataPage',
+  components: {
+    Breadcrumb,
+    PageHero,
+    LearnMoreCard,
+    CallToAction,
+    LoginModal
+  },
+  mixins: [MarkedMixin],
+
+  async asyncData() {
+    const pageData = await client.getEntry(process.env.ctf_share_data_page_id)
+    return {
+      title: pageData.fields.title,
+      summary: pageData.fields.summary,
+      description: pageData.fields.description,
+      learnMore: pageData.fields.learnMore,
+      callsToAction: pageData.fields.callsToAction,
+      slug: pageData.fields.slug
+    }
+  },
+
+  data: () => {
+    return {
+      breadcrumb: [
+        {
+          to: {
+            name: 'index'
+          },
+          label: 'Home'
+        }
+      ],
+      showLoginDialog: false
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
+.page-data {
+  background-color: $background;
+}
+hr {
+  opacity: 0.3;
+}
+::v-deep h1 {
+  font-size:2rem;
+  font-weight:500;
+  line-height:2.75rem;
+}
+
+::v-deep h2 {
+  font-size:1.5rem;
+  font-weight:500;
+  line-height:2.25rem;
+}
+
+::v-deep h3 {
+  font-size:1rem;
+  font-weight:500;
+  line-height:1.875rem;
+}
+</style>
diff --git a/pages/signup/index.vue b/pages/signup/index.vue
index 93f50a90..4154d88c 100644
--- a/pages/signup/index.vue
+++ b/pages/signup/index.vue
@@ -12,7 +12,7 @@ export default {
     // the page has been mounted and is viewable. Therefore we display the redirecting text before redirecting. This issue has been filed many times with Vue:
     // https://github.com/nuxt/nuxt.js/issues/770, https://github.com/vuejs/vue-router/issues/1280, https://github.com/nuxt/nuxt.js/issues/1082
     if (process.client) {
-        window.location.href = "https://mailchi.mp/199fe3626d97/signup";
+        window.location.href = "https://eepurl.com/hgBxgv";
     }
   },
 }
diff --git a/pages/user/profile/index.vue b/pages/user/profile/index.vue
index f7d51edc..746b9a6d 100644
--- a/pages/user/profile/index.vue
+++ b/pages/user/profile/index.vue
@@ -1,66 +1,244 @@
 <template>
   <div>
-    <breadcrumb :breadcrumb="breadcrumb" title="Profile" />
+    <breadcrumb :breadcrumb="breadcrumb" :title=title />
     <page-hero>
-      <h1>SPARC Profile</h1>
+      <h1>{{ title }}</h1>
       <p>
         The SPARC Portal account allows you to fully utilize portal functionality. <a href="https://docs.sparc.science/docs/sparc-portal-login" target="_blank">Learn more</a> about which features require login and find out more details about why a Pennsieve account is created for you in the process.
       </p>
     </page-hero>
-    <div class="container my-24">
-      <div class="heading2 py-8">
-        My Information
-      </div>
-      <div class="body1">First name: <span class="heading3">{{firstName}}</span></div>
-      <div class="body1">Last name: <span class="heading3">{{lastName}}</span></div>
-      <div class="body1">E-mail: <span class="heading3">{{profileEmail}}</span></div>
-      <div class="heading2 py-8">
-        Communication Preferences
-        <div class="body1">
-          SPARC Newsletter: 
-          <template v-if="!isSubscribed">
-            <span class="heading3">You are not subscribed.</span>
-            <div class="body1">
-              Keep up to date with all the latest news and events from the SPARC Portal by subscribing to our newsletter. View all past newsletters <a href="//us2.campaign-archive.com/home/?u=e60c48f231a30b544eed731ea&id=c81a347bd8" target="_blank">here</a>.
-            </div>
-            <div class="mt-8">
-              <el-button class='secondary' v-on:click='subscribeToNewsletter(profileEmail, firstName, lastName)'>Subscribe to newsletter</el-button>
-            </div>
-          </template>
-          <template v-else>
-            <span class="heading3">You are currently subscribed.</span>
-            <div class="body1">
-              View all past newsletters <nuxt-link to="/news-and-events#stayConnected">here</nuxt-link>.
+    <div class="background-container">
+      <div class="container py-24">
+        <div class="section p-16 mt-16">
+          <div class="heading2">
+            My Information
+          </div>
+          <el-row>
+            <el-col :span=12>
+              <div class="body1">First name: <span class="heading3"><b>{{firstName}}</b></span></div>
+              <div class="body1">Last name: <span class="heading3"><b>{{lastName}}</b></span></div>
+              <div class="body1">E-mail: <span class="heading3"><b>{{profileEmail}}</b></span></div>
+            </el-col>
+            <el-col :span=12>
+              <div v-if="orcid" class="body1">ORCID: 
+                <span>
+                  <a :href="orcidUri" target="_blank">{{ orcid }}</a>
+                </span>
+              </div>
+            </el-col>
+          </el-row>
+        </div>
+        <div class="section heading2 p-16 mt-16">
+          Available Resources
+          <div class="resource-container body1">
+            SPARC Newsletter: 
+            <template v-if="!isSubscribed">
+              <span class="label4"><b>You are not subscribed.</b></span>
+              <div class="body4">
+                Keep up to date with all the latest news and events from the SPARC Portal by subscribing to our newsletter. View all past newsletters <a href="//us2.campaign-archive.com/home/?u=e60c48f231a30b544eed731ea&id=c81a347bd8" target="_blank">here</a>.
+              </div>
+              <div class="mt-8">
+                <el-button class='secondary' @click="handleSubscribeButtonClicked">Subscribe to newsletter</el-button>
+              </div>
+            </template>
+            <template v-else>
+              <span class="label4"><b>You are currently subscribed.</b></span>
+              <div class="body1">
+                View all past newsletters <nuxt-link to="/news-and-events#stayConnected">here</nuxt-link>.
+              </div>
+              <div class="mt-8">
+                <el-button class='secondary' @click="unsubscribeFromNewsletter(profileEmail)">Un-subscribe from newsletter</el-button>
+              </div>
+            </template>
+          </div>
+          <div class="resource-container body1">
+            Pennsieve: 
+            <span class="label4"><b>You are registered.</b></span>
+            <div class="body4">
+              The Pennsieve Data Management Platform provides a scalable cloud-based solution for managing, analyzing, and sharing scientific datasets.
             </div>
             <div class="mt-8">
-              <el-button class='secondary' v-on:click='unsubscribeFromNewsletter(profileEmail)'>Un-subscribe from newsletter</el-button>
+              <a href="https://app.pennsieve.io/#" target="_blank">
+                <el-button class='secondary'>
+                  Launch Pennsieve <svg-icon icon="icon-open" height="16" width="16" />
+                </el-button>
+              </a>
             </div>
-          </template>
+          </div>
+        </div>
+
+        <div class="section heading2 p-16 mt-16">
+          <div class="datasets-container-title">
+            <span class="heading2 mb-16">Published Datasets ({{ datasets.length }})</span>
+            <span>
+              <el-popover
+                width="fit-content"
+                trigger="hover"
+                :append-to-body=false
+                popper-class="popover"
+                >
+                <svg-icon slot="reference" class="icon-help" icon="icon-help" width="26" height="26" />
+                <div>
+                  My published Datasets relates to all Datasets, Computational and Anatomical models where you have been associated to the dataset using your ORCID number. If there are datasets that you feel should be linked to you please contact curation@sparc.science
+                </div>
+              </el-popover>
+            </span>
+          </div>
+          <gallery
+            v-loading="datasetsLoading"
+            galleryItemType="datasets"
+            :items="datasets"
+          />
+        </div>
+        <div  v-if="showDatasetSubmissionFeature" class="section heading2 p-16 mt-16">
+          <div class="datasets-container-title">
+            <span class="heading2">Dataset Submission Requests ({{ datasetSubmissions.length }})</span>
+            <span>
+              <el-popover
+                width="fit-content"
+                trigger="hover"
+                :append-to-body=false
+                popper-class="popover"
+                >
+                <svg-icon slot="reference" class="icon-help" icon="icon-help" width="26" height="26" />
+                <div>
+                  In order to publish a dataset on the SPARC Portal your submission must first be approved by the curation team. If there are dataset requests that you think are missing please contact curation@sparc.science
+                </div>
+              </el-popover>
+            </span>
+          </div>
+          <div v-loading="submissionsLoading">
+            <template v-for="datasetSubmission in datasetSubmissions">
+              <div :key="datasetSubmission.id" class="resource-container row">
+                <span class="body1 left-col mr-16">
+                  <div class="link1 submission-name" v-on:click="submissionNameClicked(datasetSubmission)">{{ datasetSubmission.name }}</div>
+                  <div v-if="isDraft(datasetSubmission)" class="body4">
+                    Updated: {{ getUpdatedDate(datasetSubmission) }}
+                  </div>
+                  <div v-else class="body4">
+                    Submitted: {{ getSubmittedDate(datasetSubmission) }}
+                  </div>
+                  <div class="label1">
+                    Status: {{ getStatus(datasetSubmission) }}
+                  </div>
+                </span>
+                <span class="right-col">
+                  <template v-if="isDraft(datasetSubmission)">
+                    <el-button @click="submitDraft(datasetSubmission.nodeId)"  class="secondary submit-button">
+                      Submit Draft
+                    </el-button>
+                    <el-button @click="deleteClicked(datasetSubmission)" class="danger">
+                      Delete Draft
+                    </el-button>
+                  </template>
+                  <el-button v-else-if="isSubmitted(datasetSubmission)" @click="retractClicked(datasetSubmission)" class="secondary">
+                    Retract Request
+                  </el-button>
+                  <el-button v-else-if="isWithdrawn(datasetSubmission) || isRejected(datasetSubmission)" @click="deleteClicked(datasetSubmission)" class="danger">
+                    Delete Request
+                  </el-button>
+                </span>
+              </div>
+            </template>
+          </div>
+          <el-button class='secondary mt-16' @click="newRequestClicked">Submit new request</el-button>
         </div>
-        
       </div>
     </div>
+    <dataset-submission-modal
+      :show-modal="showDatasetSubmissionModal"
+      :questions="questions"
+      :default-form="defaultForm"
+      :disabled="datasetSubmissionDisabled"
+      @modal-closed="showDatasetSubmissionModal = false"
+      @proposal-submitted="fetchDatasetSubmissions"
+    />
+    <confirmation-modal
+      :show-modal="showDeleteConfirmationModal"
+      @confirmed="deleteSubmission"
+      @cancelled="showDeleteConfirmationModal = false"
+      @modal-closed="submissionToDelete = ''"
+    >
+      <template slot="confirmation-body">
+        <div class="confirmation-body">
+          <p class="label4">
+            Delete Dataset Proposal: "{{submissionToDelete.name}}"?
+          </p>
+          <p class="body4 danger-text">
+            This will permanently delete the dataset proposal.
+          </p>
+        </div>
+      </template>
+    </confirmation-modal>
+    <confirmation-modal
+      :show-modal="showRetractConfirmationModal"
+      @confirmed="retractSubmission"
+      @cancelled="showRetractConfirmationModal = false"
+      @modal-closed="submissionToRetract = ''"
+    >
+      <template slot="confirmation-body">
+        <div class="confirmation-body">
+          <p class="label4">
+            Withdraw Dataset Proposal: "{{submissionToRetract.name}}"?
+          </p>
+          <p class="body4 danger-text">
+            This will withdraw the request to review and consider the dataset proposal from SPARC.
+          </p>
+        </div>
+      </template>
+    </confirmation-modal>
   </div>
 </template>
 
 <script>
-
-import { propOr } from 'ramda'
+import { failMessage } from '@/utils/notification-messages'
+import { pathOr, propOr } from 'ramda'
 import { mapGetters } from 'vuex'
 import Breadcrumb from '@/components/Breadcrumb/Breadcrumb.vue'
+import Gallery from '~/components/Gallery/Gallery.vue'
 import PageHero from '@/components/PageHero/PageHero.vue'
 import NewsletterMixin from '@/components/ContactUsForms/NewsletterMixin'
+import AuthenticatedMixin from '@/mixins/authenticated/index'
+import DatasetSubmissionModal from '@/components/DatasetSubmissionModal/DatasetSubmissionModal.vue'
+import createAlgoliaClient from '@/plugins/algolia.js'
+import ConfirmationModal from '@/components/ConfirmationModal/ConfirmationModal.vue'
+
+const algoliaClient = createAlgoliaClient()
+const algoliaIndex = algoliaClient.initIndex(process.env.ALGOLIA_INDEX)
 
 export default {
   name: 'profile',
 
   components: {
     Breadcrumb,
+    ConfirmationModal,
+    DatasetSubmissionModal,
+    Gallery,
     PageHero
   },
 
+  async asyncData({env, $axios}) {
+    let downloadsSummary = 0
+    try {
+      const startDate = new Date('2000','1');
+      const currentDate = new Date()
+      const url = `${env.LOGIN_API_URL}/discover/metrics/dataset/downloads/summary`
+      downloadsSummary = await $axios.$get(url, {
+          params: { startDate: startDate, endDate: currentDate }
+        }).then(response => {
+          return response
+      })
+    } catch (error) {
+      return 0
+    }
+    return {
+      downloadsSummary
+    }
+  },
+
   data: () => {
     return {
+      title: "SPARC Profile",
       breadcrumb: [
         {
           to: {
@@ -69,19 +247,59 @@ export default {
           label: 'Home'
         }
       ],
+      datasets: [],
+      datasetSubmissions: [],
+      showDatasetSubmissionModal: false,
+      datasetsLoading: true,
+      submissionsLoading: true,
+      questions: [],
+      defaultForm: {},
+      datasetSubmissionDisabled: false,
+      submissionToDelete: '',
+      showDeleteConfirmationModal: false,
+      submissionToRetract: '',
+      showRetractConfirmationModal: false,
+    }
+  },
+
+  head() {
+    return {
+      title: this.title,
+      meta: [
+        {
+          hid: 'og:title',
+          property: 'og:title',
+          content: this.title,
+        },
+        {
+          hid: 'description',
+          name: 'description',
+          content: 'The SPARC Portal account allows you to fully utilize portal functionality.'
+        },
+      ]
     }
   },
 
   computed: {
-    ...mapGetters('user', ['firstName', 'lastName', 'profileEmail']),
+    ...mapGetters('user', ['firstName', 'lastName', 'profileEmail', 'cognitoUserToken', 'pennsieveUser']),
+    userToken() {
+      return this.cognitoUserToken || this.$cookies.get('user-token')
+    },
     isSubscribed: function() {
       return propOr('unsubscribed', 'status', this.memberInfo) === 'subscribed'
+    },
+    orcid() {
+      return pathOr(null, ['orcid', 'orcid'], this.pennsieveUser)
+    },
+    orcidUri() {
+      return `https://orcid.org/${this.orcid}`
+    },
+    showDatasetSubmissionFeature() {
+      return process.env.SHOW_DATASET_SUBMISSION_FEATURE == 'true'
     }
   },
 
-  middleware: 'authenticated',
-
-  mixins: [NewsletterMixin],
+  mixins: [AuthenticatedMixin, NewsletterMixin],
 
   watch: {
     profileEmail: {
@@ -91,6 +309,194 @@ export default {
         }
       },
       immediate: true
+    },
+    orcid: {
+      handler: async function(newValue) {
+        if (newValue && newValue !== '') {
+          this.fetchPublishedDatasets(newValue)
+          this.fetchDatasetSubmissions()
+          this.fetchQuestions()
+        }
+      },
+      immediate: true
+    },
+  },
+  methods: {
+    async fetchPublishedDatasets(orcid) {
+      const filter = `contributors.curie:\"ORCID:${orcid}\"`
+      this.datasets = await algoliaIndex.search('', {
+        filters:filter,
+        hitsPerPage: 999
+      }).then(async ({ hits }) => {
+        let items = []
+        await hits.forEach(async hit => {
+          const datasetName = pathOr('', ['item','name'], hit)
+          const datasetId = propOr('', 'objectID', hit)
+          const pennsieveIdentifier = pathOr('', ['item', 'identifier'], hit)
+          const numCitations = await this.getCitationsCount(pennsieveIdentifier)
+          const numDownloads = this.getDownloadsCount(datasetId)
+          items.push({
+            'name': datasetName,
+            'intId': datasetId,
+            'banner': pathOr('', ['pennsieve','banner','uri'], hit),
+            'numDownloads': numDownloads,
+            'numCitations': numCitations
+          })
+        })
+        return items
+      })
+      .catch(() => {
+        return []
+      }).finally(() => {
+        this.datasetsLoading = false
+      })
+    },
+    async fetchDatasetSubmissions() {
+      const headers = { 'Authorization': `Bearer ${this.userToken}` }
+      this.datasetSubmissions = await this.$axios
+        .get(`${process.env.PENNSIEVE_API_VERSION_2}/publishing/proposal`, { headers })
+        .then(({ data }) => {
+          return data == null ? [] : data
+        }).catch(() => {
+          return []
+        }).finally(() => {
+          this.submissionsLoading = false
+        })
+    },
+    async fetchQuestions() {
+      const headers = { 'Authorization': `Bearer ${this.userToken}` }
+      const repoUrl = `${process.env.PENNSIEVE_API_VERSION_2}/publishing/repositories`
+      await this.$axios
+        .get(repoUrl, { headers })
+        .then(({ data }) => {
+          this.questions = data.find(repo => repo.name === 'sparc')?.questions
+        }).catch(() => {
+          this.hasError = true
+        })
+    },
+    async getCitationsCount(id) {
+      try {
+        const headers = { 'Authorization': `Bearer ${this.userToken}` }
+        const url = `${process.env.LOGIN_API_URL}/datasets/${id}/external-publications`
+        return this.$axios.$get(url, { headers }).then(response => {
+            let numCitations = propOr('0', 'length', response)
+            return numCitations
+        })
+      } catch (error) {
+        return 0
+      }
+    },
+    getDownloadsCount(id) {
+      let numDownloads = 0
+      this.downloadsSummary.filter(download => download.datasetId == id).forEach(item => {
+        numDownloads += item.downloads;
+      })
+      return numDownloads
+    },
+    getSubmittedDate(submission) {
+      const unixTime = propOr('0', 'submittedAt', submission)
+      const submittedDate = new Date(unixTime * 1000)
+      const month = submittedDate.toLocaleString('default', { month: 'long' })
+      return `${submittedDate.getDate()} ${month} ${submittedDate.getFullYear()}`
+    },
+    getUpdatedDate(submission) {
+      const unixTime = propOr('0', 'updatedAt', submission)
+      const updatedDate = new Date(unixTime * 1000)
+      const month = updatedDate.toLocaleString('default', { month: 'long' })
+      return `${updatedDate.getDate()} ${month} ${updatedDate.getFullYear()}`
+    },
+    isDraft(submission) {
+      return propOr('', 'proposalStatus', submission) === 'DRAFT'
+    },
+    isSubmitted(submission) {
+      return propOr('', 'proposalStatus', submission) === 'SUBMITTED'
+    },
+    isWithdrawn(submission) {
+      return propOr('', 'proposalStatus', submission) === 'WITHDRAWN'
+    },
+    isRejected(submission) {
+      return propOr('', 'proposalStatus', submission) === 'REJECTED'
+    },
+    getStatus(submission) {
+      return propOr('UNKNOWN', 'proposalStatus', submission)
+    },
+    newRequestClicked() {
+      this.defaultForm = {}
+      this.datasetSubmissionDisabled = false
+      this.showDatasetSubmissionModal = true
+    },
+    submissionNameClicked(submission) {
+      this.datasetSubmissionDisabled = true
+      let form = {
+        detailedDescription: submission.description,
+        shortDescription: submission.name
+      }
+      this.questions.forEach(question => {
+        const key = question.id
+        form[key] = submission.survey?.find(question => question.questionId == key).response || ''
+      })
+      this.defaultForm = form
+      this.showDatasetSubmissionModal = true
+    },
+    submitDraft(nodeId) {
+      const headers = { 'Authorization': `Bearer ${this.userToken}` }
+      this.$axios
+        .post(`${process.env.PENNSIEVE_API_VERSION_2}/publishing/proposal/submit?node_id=${nodeId}`, {}, { headers })
+        .catch(() => {
+          this.$message(failMessage('Failed to submit draft.'))
+        }).finally(() => {
+          this.fetchDatasetSubmissions()
+        })
+    },
+    deleteClicked(nodeId) {
+      this.submissionToDelete = nodeId
+      this.showDeleteConfirmationModal = true
+    },
+    deleteSubmission() {
+      const headers = { 'Authorization': `Bearer ${this.userToken}` }
+      this.$axios
+        .delete(`${process.env.PENNSIEVE_API_VERSION_2}/publishing/proposal?proposal_node_id=${this.submissionToDelete.nodeId}`, { headers })
+        .catch(() => {
+          this.$message(failMessage('Failed to delete.'))
+        }).finally(() => {
+          this.fetchDatasetSubmissions()
+          this.showDeleteConfirmationModal = false
+        })
+    },
+    retractClicked(submission) {
+      this.submissionToRetract = submission
+      this.showRetractConfirmationModal = true
+    },
+    retractSubmission() {
+      const headers = { 'Authorization': `Bearer ${this.userToken}` }
+      this.$axios
+        .post(`${process.env.PENNSIEVE_API_VERSION_2}/publishing/proposal/withdraw?node_id=${this.submissionToRetract.nodeId}`, {}, { headers })
+        .catch(() => {
+          this.$message(failMessage('Failed to retract request.'))
+        }).finally(() => {
+          this.fetchDatasetSubmissions()
+          this.showRetractConfirmationModal = false
+        })
+    },
+    handleSubscribeButtonClicked() {
+      this.sendGtmEvent()
+      this.subscribeToNewsletter(this.profileEmail, this.firstName, this.lastName)
+    },
+    sendGtmEvent() {
+      this.$gtm.push({
+        event: 'interaction_event',
+        event_name: 'newsletter_signup',
+        files: "",
+        file_name: "",
+        file_path: "",
+        file_type: "",
+        location: "profile page",
+        category: "",
+        dataset_id: "",
+        version_id: "",
+        doi: "",
+        citation_type: ""
+      })
     }
   }
 }
@@ -99,9 +505,65 @@ export default {
 
 <style lang="scss" scoped>
 @import '@nih-sparc/sparc-design-system-components/src/assets/_variables.scss';
-
+.submission-request {
+  border: 1px solid $lineColor2;
+}
 a {
   text-decoration: underline;
 }
-
+.section {
+  background-color: white;
+  border: 2px solid $lineColor1;
+}
+.icon-help {
+  fill: $purple;
+}
+.background-container {
+  background-color: #f5f7fa
+}
+.resource-container {
+  padding: .5rem;
+  margin-top: .5rem;
+  border: 1px solid $lineColor2;
+}
+.datasets-container-title {
+  display: flex;
+  justify-content: space-between;
+}
+.row {
+  display: flex;
+  .right-col {
+    width: fit-content;
+    .secondary, .danger {
+      display: block;
+      margin: 0;
+      min-width: 9.75rem;
+    }
+    .submit-button {
+      margin-bottom: .25rem;
+    }
+  }
+  .left-col {
+    width: 100%;
+  }
+}
+.link1 {
+  text-decoration: underline;
+  cursor: pointer;
+}
+.submission-name {
+  width: fit-content;
+}
+.danger-text {
+  color: $danger !important
+}
+.confirmation-body {
+  text-align: center;
+}
+::v-deep .popover {
+  background-color: #f9f2fc;
+  word-wrap: normal;
+  word-break: normal;
+  max-width: 300px;
+}
 </style>
diff --git a/pages/welcome/index.vue b/pages/welcome/index.vue
index 3fb932d1..223bccd0 100644
--- a/pages/welcome/index.vue
+++ b/pages/welcome/index.vue
@@ -5,6 +5,7 @@
 </template>
 
 <script>
+import AuthenticatedMixin from '@/mixins/authenticated/index'
 import SetupNewUser from '@/components/SetupNewUser/SetupNewUser.vue'
 
 export default {
@@ -12,7 +13,12 @@ export default {
   components: {
     SetupNewUser
   },
-  middleware: 'authenticated'
+  mixins: [AuthenticatedMixin],
+  head() {
+    return {
+      title: "Welcome"
+    }
+  },
 }
 </script>
 
diff --git a/plugins/bootstrap.js b/plugins/bootstrap.js
index b138c3a7..413d5cdf 100644
--- a/plugins/bootstrap.js
+++ b/plugins/bootstrap.js
@@ -14,7 +14,7 @@ import VueClipboard from 'vue-clipboard2'
 // // import SocialSharing from 'vue-social-sharing'
 
 import striptags from 'striptags'
-Vue.prototype.$sanitize = (html, allowedTags = ['br']) =>
+Vue.prototype.$sanitize = (html, allowedTags = ['br', 'sup']) =>
   striptags(html, allowedTags)
 
 // // configure language
diff --git a/plugins/documentation-hub-redirects.js b/plugins/documentation-hub-redirects.js
deleted file mode 100644
index 801bde82..00000000
--- a/plugins/documentation-hub-redirects.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import createClient from "~/plugins/contentful";
-import { propOr } from 'ramda'
-
-const client = createClient()
-
-let redirectsMapping = {}
-
-client.getEntry(process.env.ctf_documentation_hub_redirects_id).then(({fields}) => {
-  redirectsMapping = propOr({}, 'redirectsMapping', fields)
-})
-
-export default function getRedirectsMapping() {
-  return redirectsMapping
-}
diff --git a/plugins/persisted-state.js b/plugins/persisted-state.js
deleted file mode 100644
index e33ac2a6..00000000
--- a/plugins/persisted-state.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import createPersistedState from 'vuex-persistedstate'
-
-export default ({ store, isHMR }) => {
-  // In case of HMR, mutation occurs before nuxReady, so previously saved state
-  // gets replaced with original state received from server. So, we've to skip HMR.
-  // Also nuxtReady event fires for HMR as well, which results multiple registration of
-  // vuex-persistedstate plugin
-  if (isHMR) return
-
-  window.onNuxtReady((nuxt) => {
-    createPersistedState()(store) // vuex plugins can be connected to store, even after creation
-  })
-}
diff --git a/plugins/vue-gtag.client.js b/plugins/vue-gtag.client.js
deleted file mode 100644
index b3fe8c08..00000000
--- a/plugins/vue-gtag.client.js
+++ /dev/null
@@ -1,10 +0,0 @@
-
-import Vue from 'vue'
-import VueGtag from 'vue-gtag'
-
-export default ({ app }) => {
-  Vue.use(VueGtag, {
-    config: { id: process.env.GOOGLE_ANALYTICS_GA4 },
-    appName: 'SPARC Portal',
-  }, app.router)
-}
diff --git a/services/biolucida.js b/services/biolucida.js
index cdb3610e..2abe3f5d 100644
--- a/services/biolucida.js
+++ b/services/biolucida.js
@@ -6,6 +6,12 @@ const apiClient = axios.create({
   timeout: 25007
 })
 
+const mbfSparcApiClient = axios.create({
+  baseURL: process.env.MBF_SPARC_API,
+  withCredentials: false,
+  timeout: 9988
+})
+
 const searchDataset = async id => {
   const response = await apiClient.get('image_search/' + id)
   return response.data
@@ -46,7 +52,19 @@ const getBLVLink = async id => {
   return response.data
 }
 
+const decodeViewParameter = encodedView => {
+  const urlDecodedView = decodeURIComponent(encodedView)
+  const decodedView = Buffer.from(urlDecodedView, 'base64').toString('binary')
+  return decodedView.split('-')
+}
+
+const fetchNeurolucida360Url = payload => {
+  return mbfSparcApiClient.post('', payload)
+}
+
 export default {
+  decodeViewParameter,
+  fetchNeurolucida360Url,
   getBLVLink,
   getThumbnail,
   getNeurolucidaThumbnail,
diff --git a/services/discover.js b/services/discover.js
index 6793e0af..067176f3 100644
--- a/services/discover.js
+++ b/services/discover.js
@@ -19,42 +19,54 @@ const browse = async (id, version, path = undefined) => {
   return apiClient.get(`/${id}/versions/${version}/files/browse`, config)
 }
 
-const fetch = async (id, version, path, encode_base_64) => {
+const fetch = async (id, path, encode_base_64, s3Bucket) => {
   const config = {
     params: {
       encodeBase64: encode_base_64
     }
   }
+  if (s3Bucket) {
+    config.params.s3BucketName = s3Bucket
+  }
   return await apiClient.get(
-    `/s3-resource/${id}/${version}/files/${path}`,
+    `/s3-resource/${id}/files/${path}`,
     config
   )
 }
 
-const fetchEmbeddedThumbnail = async (id, version, path) => {
+const fetchEmbeddedThumbnail = async (id, path, s3Bucket) => {
   const config = {
     params: {
-      path: `${id}/${version}/files/${path}`
+      path: `${id}/files/${path}`
     }
   }
+  if (s3Bucket) {
+    config.params.s3BucketName = s3Bucket
+  }
   return await apiClient.get('/thumbnail/segmentation', config)
 }
 
-const getSegmentationInfo = async (id, version, path) => {
+const getSegmentationInfo = async (id, path, s3Bucket) => {
   const config = {
     params: {
-      dataset_path: `${id}/${version}/${path}`
+      dataset_path: `${id}/${path}`
     }
   }
+  if (s3Bucket) {
+    config.params.s3BucketName = s3Bucket
+  }
   return apiClient.get('/segmentation_info', config)
 }
 
-const downloadLink = async file_path => {
+const downloadLink = async (file_path, s3Bucket) => {
   const config = {
     params: {
       key: file_path
     }
   }
+  if (s3Bucket) {
+    config.params.s3BucketName = s3Bucket
+  }
   return await apiClient.get('/download', config)
 }
 
diff --git a/static/icons-js/icon-osparc.js b/static/icons-js/icon-osparc.js
new file mode 100644
index 00000000..1924e6c5
--- /dev/null
+++ b/static/icons-js/icon-osparc.js
@@ -0,0 +1,10 @@
+/* eslint-disable */
+var icon = require('vue-svgicon')
+icon.register({
+  'icon-osparc': {
+    width: 24,
+    height: 24,
+    viewBox: '0 0 24 24',
+    data: '<g _fill="none" fill-rule="evenodd"><circle pid="0" cx="12" cy="12" r="12" _fill="#8300BF"/><circle pid="1" _stroke="#FFF" cx="12" cy="12" r="8.5"/><path pid="2" d="M7 14.697h7.874v-1.58H9.105c-1.403 0-2.105-.513-2.105-1.54V8.755c0-1.237.702-1.855 2.105-1.855h5.769C16.29 6.899 17 7.67 17 9.213H9.105v1.622h5.769c1.417 0 2.126.637 2.126 1.913v2.307c0 1.268-.709 1.903-2.126 1.903H9.105c-1.403 0-2.105-.754-2.105-2.26z" _fill="#FFF"/></g>'
+  }
+})
diff --git a/static/icons-js/index.js b/static/icons-js/index.js
index 3a015da0..f0f0e3ca 100644
--- a/static/icons-js/index.js
+++ b/static/icons-js/index.js
@@ -15,6 +15,7 @@ require('./icon-linkedin')
 require('./icon-magnifying-glass')
 require('./icon-map')
 require('./icon-open')
+require('./icon-osparc')
 require('./icon-permalink-nobg')
 require('./icon-permalink')
 require('./icon-preset')
diff --git a/static/icons-svg/icon-osparc.svg b/static/icons-svg/icon-osparc.svg
new file mode 100644
index 00000000..4f54c6e2
--- /dev/null
+++ b/static/icons-svg/icon-osparc.svg
@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>oSPARC</title>
+    <g id="oSPARC" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="Group-5-Copy" fill="#8300BF">
+            <circle id="Oval-Copy" cx="12" cy="12" r="12"></circle>
+        </g>
+        <circle id="Oval" stroke="#FFFFFF" cx="12" cy="12" r="8.5"></circle>
+        <path d="M7,14.6970681 L14.8735167,14.6970681 L14.8735167,13.1173916 L9.10522509,13.1173916 C7.7017417,13.1173916 7,12.6041878 7,11.5777804 C7,10.5513729 7,9.61006325 7,8.75385149 C7,7.517183 7.7017417,6.89884876 9.10522509,6.89884876 C11.2104502,6.89884876 12.7470335,6.89884876 14.8735167,6.89884876 C16.2911722,6.89884876 17,7.67017648 17,9.21283192 L9.10522509,9.21283192 L9.10522509,10.8345035 C11.5330973,10.8345035 13.4558612,10.8345035 14.8735167,10.8345035 C16.2911722,10.8345035 17,11.4721734 17,12.7475133 C17,13.0173853 17,13.7865434 17,15.0549876 C17,16.3234318 16.2911722,16.9576539 14.8735167,16.9576539 C12.4314724,16.9576539 10.5087085,16.9576539 9.10522509,16.9576539 C7.7017417,16.9576539 7,16.2041253 7,14.6970681 Z" id="Rectangle" fill="#FFFFFF"></path>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/static/images/100013719.svg b/static/images/100013719.svg
new file mode 100644
index 00000000..dd499c47
--- /dev/null
+++ b/static/images/100013719.svg
@@ -0,0 +1,153 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" version="1.1" width="300" height="100">
+    <title>SPARC.Science</title>
+    <svg id="r3dlogo">
+    <defs xmlns="http://www.w3.org/2000/svg" id="defs4">
+        <clipPath id="clipPath3371">
+          <path d="M 0,1620.76 0,0 l 5545.7,0 0,1620.76 -5545.7,0 z" id="path3373"/>
+        </clipPath>
+    </defs>
+    <metadata xmlns="http://www.w3.org/2000/svg" id="metadata7">
+        <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
+          <cc:Work xmlns:cc="http://creativecommons.org/ns#" rdf:about="">
+            <dc:format xmlns:dc="http://purl.org/dc/elements/1.1/">image/svg+xml</dc:format>
+            <dc:type xmlns:dc="http://purl.org/dc/elements/1.1/" rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+            <dc:title xmlns:dc="http://purl.org/dc/elements/1.1/"/>
+          </cc:Work>
+        </rdf:RDF>
+    </metadata>
+    <g transform="translate(0,-952.36217)" id="layer1">
+        <g transform="matrix(0.62775663,0,0,0.62775663,1.8598719,442.73102)" id="layer1-1">
+            <g transform="matrix(0.04861219,0,0,-0.04861219,15.218302,911.62439)" id="g3365">
+                <g id="g3367">
+                    <g clip-path="url(#clipPath3371)" id="g3369">
+                        <path d="m 5.99609,1050.78 c 0,98.99 -1.5,171 -5.99609,235.49 l 158.992,0 7.496,-137.99 4.504,0 c 36,101.99 121.492,154.49 200.988,154.49 18,0 28.504,-1.5 43.504,-4.5 l 0,-172.49 c -16.5,3 -33.004,4.49 -55.5,4.49 -86.996,0 -148.496,-55.5 -164.996,-139.489 -2.996,-16.496 -4.5,-36 -4.5,-55.5 l 0,-379.48 -184.49191,0 0,494.979" id="path3375" style="fill:#00adef;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 940.48,998.281 c 1.497,67.499 -28.503,178.499 -151.496,178.499 -113.996,0 -161.992,-103.5 -169.492,-178.499 l 320.988,0 z M 619.492,869.285 c 4.496,-131.992 106.492,-188.992 224.988,-188.992 85.5,0 145.497,13.504 202.49,32.996 l 27,-126 c -62.99,-26.988 -149.99,-46.488 -254.986,-46.488 -236.992,0 -376.484,145.496 -376.484,368.98 0,202.489 122.992,392.989 356.98,392.989 236.99,0 314.99,-195 314.99,-355.489 0,-34.5 -3,-61.492 -6,-77.996 l -488.978,0" id="path3377" style="fill:#00adef;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 1235.12,795.898 c 41.31,-21.418 140.76,-59.668 235.62,-59.668 97.92,0 162.18,35.184 162.18,105.567 0,81.094 -84.15,119.344 -175.95,119.344 l -102.51,0 0,195.839 97.92,0 c 68.85,0 156.06,21.42 156.06,90.26 0,50.5 -47.43,84.15 -134.64,84.15 -82.62,0 -171.36,-35.18 -211.14,-56.6 l -52.02,197.37 c 62.73,39.78 189.72,74.97 327.42,74.97 220.32,0 348.84,-110.16 348.84,-252.45 0,-105.57 -58.14,-186.66 -180.54,-229.5 l 0,-3.06 c 117.81,-19.89 212.67,-108.636 212.67,-237.151 0,-182.071 -166.77,-306 -425.34,-306 -136.17,0 -249.39,32.133 -310.59,70.383 l 52.02,206.546" id="path3379" style="fill:#80cc28;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 2550.65,990.781 c 0,19.499 -3,46.499 -7.5,65.999 -25.5,95.99 -109.5,176.99 -226.49,176.99 -157.49,0 -256.49,-136.5 -256.49,-323.989 0,-161.988 81,-310.48 251.99,-310.48 103.49,0 199.49,67.496 230.99,187.484 4.5,19.5 7.5,37.5 7.5,60 l 0,143.996 z m 70.5,629.979 0,-896.975 c 0,-53.992 3,-116.984 6,-167.984 l -64.5,0 -4.5,136.492 -3,0 c -37.5,-79.492 -123,-152.992 -256.49,-152.992 -176.99,0 -310.49,148.492 -310.49,362.98 -1.5,239.989 147,389.989 323.99,389.989 124.5,0 202.49,-64.5 235.49,-125.99 l 3,0 0,454.48 70.5,0" id="path3381" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 3203.14,941.285 c -157.49,4.496 -364.48,-19.5 -364.48,-191.988 0,-103.496 69,-149.996 144,-149.996 119.99,0 187.49,73.492 212.98,143.988 4.51,15 7.5,30 7.5,43.496 l 0,154.5 z m 70.5,-214.488 c 0,-57.004 3,-115.496 10.5,-170.996 l -64.49,0 -10.5,103.496 -4.5,0 c -34.5,-55.496 -114,-119.996 -229.49,-119.996 -144,0 -211.5,101.996 -211.5,197.992 0,166.492 146.99,266.997 439.48,263.987 l 0,18 c 0,72 -13.49,214.49 -184.49,212.99 -63,0 -128.99,-16.5 -179.99,-54 l -22.5,52.5 c 64.49,43.5 145.5,61.5 209.99,61.5 208.5,0 247.49,-155.99 247.49,-284.99 l 0,-280.483" id="path3383" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 3569.16,1434.77 0,-159 205.48,0 0,-57 -205.48,0 0,-467.981 c 0,-91.492 28.49,-149.988 105,-149.988 37.5,0 64.49,6 82.5,12 l 8.98,-55.5 c -23.98,-10.5 -56.99,-18 -100.49,-18 -52.5,0 -95.99,18 -122.99,52.5 -33,37.496 -45,97.496 -45,170.992 l 0,455.977 -121.5,0 0,57 121.5,0 0,131.99 72,27.01" id="path3385" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 4272.63,941.285 c -157.5,4.496 -364.49,-19.5 -364.49,-191.988 0,-103.496 69,-149.996 144,-149.996 119.98,0 187.48,73.492 212.99,143.988 4.49,15 7.5,30 7.5,43.496 l 0,154.5 z m 70.49,-214.488 c 0,-57.004 3.01,-115.496 10.51,-170.996 l -64.49,0 -10.51,103.496 -4.49,0 c -34.52,-55.496 -114.01,-119.996 -229.5,-119.996 -144,0 -211.5,101.996 -211.5,197.992 0,166.492 146.99,266.997 439.49,263.987 l 0,18 c 0,72 -13.49,214.49 -184.49,212.99 -63.01,0 -129,-16.5 -180,-54 l -22.5,52.5 c 64.49,43.5 145.51,61.5 210,61.5 208.5,0 247.48,-155.99 247.48,-284.99 l 0,-280.483" id="path3387" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 4455.58,593.238 c 0,25.934 18.01,45.364 43.2,45.364 25.22,0 42.5,-18.723 42.5,-45.364 0,-25.918 -17.28,-45.359 -43.92,-45.359 -24.49,0 -41.78,19.441 -41.78,45.359" id="path3389" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 4659.35,729.336 c 0,-76.328 43.2,-133.938 105.12,-133.938 60.49,0 105.86,56.883 105.86,135.372 0,59.05 -29.53,133.214 -104.42,133.214 -74.16,0 -106.56,-69.121 -106.56,-134.648 z m 275.78,3.602 c 0,-128.899 -90.02,-185.059 -173.53,-185.059 -93.62,0 -167.05,69.121 -167.05,179.297 0,115.929 77.03,184.336 172.81,184.336 100.08,0 167.77,-72.727 167.77,-178.574" id="path3391" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 5015.01,795.586 c 0,41.031 -0.72,76.316 -2.87,108.719 l 55.43,0 2.89,-69.121 2.15,0 c 15.86,46.804 54.73,76.328 97.23,76.328 6.46,0 11.5,-0.723 17.26,-1.446 l 0,-59.765 c -6.46,1.445 -12.94,1.445 -21.6,1.445 -44.63,0 -76.33,-33.125 -84.96,-80.644 -1.44,-8.641 -2.17,-19.446 -2.17,-29.532 l 0,-185.769 -63.36,0 0,239.785" id="path3393" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 5479.45,766.777 c 0,10.797 -0.72,20.164 -3.62,28.086 -11.5,37.442 -41.75,67.684 -88.55,67.684 -60.49,0 -103.69,-51.121 -103.69,-131.777 0,-68.399 35.27,-125.282 102.97,-125.282 39.61,0 74.88,24.481 87.85,64.805 3.59,10.801 5.04,23.035 5.04,33.836 l 0,62.648 z m 63.36,-159.855 c 0,-80.641 -16.56,-128.883 -49.69,-159.852 -34.55,-30.961 -83.52,-41.761 -127.44,-41.761 -41.78,0 -87.85,10.082 -115.94,28.8 l 15.84,48.961 c 23.05,-15.121 59.04,-28.082 102.25,-28.082 64.8,0 112.34,33.852 112.34,122.41 l 0,38.161 -1.44,0 c -18.73,-32.399 -56.9,-58.329 -110.9,-58.329 -86.41,0 -148.32,73.454 -148.32,169.946 0,118.086 77.03,184.336 157.69,184.336 60.47,0 92.87,-30.965 108.73,-59.766 l 1.43,0 2.17,52.559 56.17,0 c -2.17,-24.485 -2.89,-53.282 -2.89,-95.047 l 0,-202.336" id="path3395" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 38.1367,151.25 13.8281,0 c 30.5821,0 51.1172,22.629 51.1172,56.559 0,32.703 -13.4101,52.8 -47.7656,53.222 -6.7031,0 -12.9922,-0.422 -17.1797,-1.679 l 0,-108.102 z M 6.29297,281.57 c 13.41013,3.77 30.16793,5.442 46.08983,5.442 28.0703,0 49.0232,-5.864 63.6872,-20.121 13.828,-14.243 19.696,-33.09 19.696,-55.301 0,-36.039 -16.762,-59.5 -45.2543,-72.899 l 0,-0.839 c 20.9493,-6.293 31.8473,-26.411 37.7113,-63.2817 6.703,-38.5391 12.152,-62.4219 16.343,-71.23046 l -32.687,0 C 107.691,11.7188 102.246,38.5312 96.7969,72.8906 90.5117,111.871 78.3594,126.109 50.707,126.109 l -12.5703,0 0,-122.76916 -31.84373,0 0,278.23016" id="path3397" style="fill:#00adef;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 280.316,137.422 -70.812,0 0,-106.0001 80.445,0 0,-28.08206 -112.707,0 0,282.42216 107.684,0 0,-28.09 -75.422,0 0,-93 70.812,0 0,-27.25" id="path3399" style="fill:#00adef;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="M 464.254,10.4688 C 452.52,5.44922 431.988,0.839844 414.391,0.839844 c -24.723,0 -47.77,6.699216 -66.621,27.218756 -20.536,21.8008 -34.364,60.7734 -33.942,112.7224 0.418,110.188 56.567,147.481 106.426,147.481 17.601,0 31.426,-3.34 39.808,-7.953 l -7.124,-27.661 c -7.543,3.774 -17.18,6.704 -32.262,6.704 -35.196,0 -73.328,-28.063 -73.328,-115.641 0,-87.1524 33.101,-115.2422 67.043,-115.2422 10.89,0 17.175,1.6796 19.691,3.3593 l 0,92.1919 -36.449,0 0,26.82 66.621,0 0,-140.3712" id="path3401" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 508.242,3.33984 32.2617,0 0,282.422 -32.2617,0 0,-282.422 z" id="path3403" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 585.336,40.6406 c 9.215,-6.289 26.398,-11.332 40.226,-11.332 29.747,0 47.344,19.2812 47.344,47.7812 0,25.9692 -15.086,41.8902 -37.293,58.6482 -22.625,15.512 -53.211,41.91 -53.211,78.364 0,42.738 29.75,74.16 74.586,74.16 17.598,0 32.68,-5.442 39.383,-10.473 l -7.543,-27.66 c -7.125,5.031 -18.851,9.641 -33.519,9.641 -28.075,0 -41.063,-20.938 -41.063,-40.219 0,-28.071 14.664,-38.973 41.481,-58.242 33.941,-23.887 49.023,-49.868 49.023,-81.2895 0,-48.5976 -33.938,-79.179656 -79.188,-79.179656 -19.277,0 -39.39,6.269536 -47.347,12.148456 l 7.121,27.6523" id="path3405" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 775.977,256.84 -51.539,0 0,28.922 135.335,0 0,-28.922 -51.535,0 0,-253.50016 -32.261,0 0,253.50016" id="path3407" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 923.457,151.25 13.828,0 c 30.586,0 51.117,22.629 51.117,56.559 0,32.703 -13.406,52.8 -47.761,53.222 -6.703,0 -12.996,-0.422 -17.184,-1.679 l 0,-108.102 z m -31.84,130.32 c 13.406,3.77 30.164,5.442 46.086,5.442 28.074,0 49.027,-5.864 63.687,-20.121 13.83,-14.243 19.7,-33.09 19.7,-55.301 0,-36.039 -16.76,-59.5 -45.254,-72.899 l 0,-0.839 c 20.945,-6.293 31.844,-26.411 37.704,-63.2817 6.71,-38.5391 12.16,-62.4219 16.35,-71.23046 l -32.687,0 c -4.191,8.37896 -9.637,35.19136 -15.086,69.55076 -6.281,38.9804 -18.433,53.2184 -46.086,53.2184 l -12.574,0 0,-122.76916 -31.84,0 0,278.23016" id="path3409" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 1097.34,3.33984 0,119.41016 -62.43,163.012 34.36,0 25.14,-70.821 c 6.7,-19.691 14.66,-41.89 20.95,-63.691 l 0.84,0 c 5.45,21.801 12.98,43.16 20.53,64.949 l 23.88,69.563 33.52,0 -64.53,-161.742 0,-120.68016 -32.26,0" id="path3411" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 1308.93,144.551 c 0,-58.2424 11.31,-116.0822 47.35,-116.0822 36.03,0 45.67,61.6132 45.67,116.9222 0,52.789 -9.64,115.218 -46.09,115.218 -35.62,0 -46.93,-58.66 -46.93,-116.058 z m 126.54,2.09 C 1435.47,40.6406 1399.44,0 1353.76,0 c -46.92,0 -78.35,49.8594 -78.35,144.961 0,93.449 33.94,144.141 82.96,144.141 48.19,0 77.1,-52.364 77.1,-142.461" id="path3413" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 1474.02,285.762 107.68,0 0,-28.09 -75.42,0 0,-98.883 70.39,0 0,-27.23 -70.39,0 0,-128.21916 -32.26,0 0,282.42216" id="path3415" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 1716.61,151.25 13.83,0 c 30.59,0 51.12,22.629 51.12,56.559 0,32.703 -13.41,52.8 -47.77,53.222 -6.7,0 -12.99,-0.422 -17.18,-1.679 l 0,-108.102 z m -31.84,130.32 c 13.41,3.77 30.17,5.442 46.09,5.442 28.07,0 49.02,-5.864 63.69,-20.121 13.82,-14.243 19.69,-33.09 19.69,-55.301 0,-36.039 -16.76,-59.5 -45.25,-72.899 l 0,-0.839 c 20.95,-6.293 31.84,-26.411 37.71,-63.2817 6.7,-38.5391 12.15,-62.4219 16.34,-71.23046 l -32.68,0 c -4.19,8.37896 -9.64,35.19136 -15.09,69.55076 -6.28,38.9804 -18.43,53.2184 -46.09,53.2184 l -12.57,0 0,-122.76916 -31.84,0 0,278.23016" id="path3417" style="fill:#00adef;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 1958.79,137.422 -70.81,0 0,-106.0001 80.45,0 0,-28.08206 -112.71,0 0,282.42216 107.68,0 0,-28.09 -75.42,0 0,-93 70.81,0 0,-27.25" id="path3419" style="fill:#00adef;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 1997.75,40.6406 c 9.22,-6.289 26.4,-11.332 40.23,-11.332 29.74,0 47.34,19.2812 47.34,47.7812 0,25.9692 -15.08,41.8902 -37.29,58.6482 -22.62,15.512 -53.21,41.91 -53.21,78.364 0,42.738 29.75,74.16 74.58,74.16 17.6,0 32.68,-5.442 39.39,-10.473 l -7.54,-27.66 c -7.13,5.031 -18.86,9.641 -33.53,9.641 -28.07,0 -41.05,-20.938 -41.05,-40.219 0,-28.071 14.66,-38.973 41.47,-58.242 33.94,-23.887 49.03,-49.868 49.03,-81.2895 0,-48.5976 -33.94,-79.179656 -79.19,-79.179656 -19.28,0 -39.39,6.269536 -47.35,12.148456 l 7.12,27.6523" id="path3421" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 2258.37,137.422 -70.82,0 0,-106.0001 80.45,0 0,-28.08206 -112.71,0 0,282.42216 107.69,0 0,-28.09 -75.43,0 0,-93 70.82,0 0,-27.25" id="path3423" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 2395.8,113.961 -14.67,71.641 c -4.19,20.117 -7.96,43.589 -11.32,64.527 l -1.25,0 c -3.35,-21.359 -7.54,-45.66 -11.73,-64.527 l -14.67,-71.641 53.64,0 z m -58.25,-25.9727 -18.43,-84.64846 -31.43,0 64.53,282.42216 35.61,0 62.85,-282.42216 -31.84,0 -18.44,84.64846 -62.85,0" id="path3425" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 2518.14,151.25 13.83,0 c 30.58,0 51.12,22.629 51.12,56.559 0,32.703 -13.41,52.8 -47.77,53.222 -6.7,0 -12.99,-0.422 -17.18,-1.679 l 0,-108.102 z m -31.84,130.32 c 13.41,3.77 30.16,5.442 46.09,5.442 28.07,0 49.02,-5.864 63.69,-20.121 13.83,-14.243 19.69,-33.09 19.69,-55.301 0,-36.039 -16.76,-59.5 -45.25,-72.899 l 0,-0.839 c 20.95,-6.293 31.84,-26.411 37.71,-63.2817 6.71,-38.5391 12.15,-62.4219 16.34,-71.23046 l -32.68,0 c -4.19,8.37896 -9.64,35.19136 -15.09,69.55076 -6.28,38.9804 -18.44,53.2184 -46.09,53.2184 l -12.57,0 0,-122.76916 -31.84,0 0,278.23016" id="path3427" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 2780.85,8.37891 c -8.79,-4.60938 -23.04,-7.539066 -40.64,-7.539066 -54.89,0 -94.7,44.410156 -94.7,140.351156 0,111.457 55.32,147.071 100.15,147.071 16.76,0 29.33,-3.34 34.77,-7.114 l -7.12,-27.25 c -6.7,2.942 -13.41,5.872 -28.07,5.872 -30.18,0 -65.79,-29.321 -65.79,-115.629 0,-86.3324 31.84,-114.8324 66.62,-114.8324 12.16,0 22.63,2.9531 29.34,5.8828 l 5.44,-26.81249" id="path3429" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 2845.79,285.762 0,-121.09 79.19,0 0,121.09 32.26,0 0,-282.42216 -32.26,0 0,131.99216 -79.19,0 0,-131.99216 -32.27,0 0,282.42216 32.27,0" id="path3431" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 3105.56,29.3086 c 4.61,-0.8398 9.22,-0.8398 12.15,-0.8398 35.62,0 69.98,26 69.98,121.9412 0,71.231 -21.79,110.199 -67.04,110.199 -5.03,0 -10.9,-0.418 -15.09,-1.668 l 0,-229.6324 z M 3073.72,281.57 c 12.15,3.77 27.23,5.442 43.16,5.442 29.75,0 50.69,-7.543 66.2,-21.371 21.79,-18.852 38.13,-55.309 38.13,-114.391 0,-64.5312 -15.92,-99.7305 -33.94,-119.4219 -18.44,-20.5195 -45.25,-30.16794 -77.94,-30.16794 -12.99,0 -26.4,0.83984 -35.61,2.94922 l 0,276.96062" id="path3433" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 3343.57,113.961 -14.67,71.641 c -4.19,20.117 -7.96,43.589 -11.31,64.527 l -1.26,0 c -3.35,-21.359 -7.54,-45.66 -11.74,-64.527 l -14.65,-71.641 53.63,0 z m -58.24,-25.9727 -18.44,-84.64846 -31.43,0 64.54,282.42216 35.61,0 62.84,-282.42216 -31.83,0 -18.44,84.64846 -62.85,0" id="path3435" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 3441.62,256.84 -51.55,0 0,28.922 135.35,0 0,-28.922 -51.54,0 0,-253.50016 -32.26,0 0,253.50016" id="path3437" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 3630.16,113.961 -14.67,71.641 c -4.19,20.117 -7.96,43.589 -11.31,64.527 l -1.26,0 c -3.34,-21.359 -7.53,-45.66 -11.73,-64.527 l -14.66,-71.641 53.63,0 z m -58.24,-25.9727 -18.44,-84.64846 -31.42,0 64.52,282.42216 35.62,0 62.84,-282.42216 -31.83,0 -18.44,84.64846 -62.85,0" id="path3439" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 3818.29,151.25 13.82,0 c 30.59,0 51.13,22.629 51.13,56.559 0,32.703 -13.41,52.8 -47.78,53.222 -6.7,0 -12.98,-0.422 -17.17,-1.679 l 0,-108.102 z m -31.85,130.32 c 13.41,3.77 30.18,5.442 46.09,5.442 28.08,0 49.03,-5.864 63.7,-20.121 13.82,-14.243 19.68,-33.09 19.68,-55.301 0,-36.039 -16.75,-59.5 -45.25,-72.899 l 0,-0.839 c 20.96,-6.293 31.84,-26.411 37.71,-63.2817 6.7,-38.5391 12.15,-62.4219 16.34,-71.23046 l -32.67,0 c -4.19,8.37896 -9.64,35.19136 -15.09,69.55076 -6.29,38.9804 -18.44,53.2184 -46.1,53.2184 l -12.56,0 0,-122.76916 -31.85,0 0,278.23016" id="path3441" style="fill:#00adef;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 4060.46,137.422 -70.81,0 0,-106.0001 80.45,0 0,-28.08206 -112.71,0 0,282.42216 107.68,0 0,-28.09 -75.42,0 0,-93 70.81,0 0,-27.25" id="path3443" style="fill:#00adef;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 4137.97,145.801 c 3.77,-0.41 7.54,-0.84 12.99,-0.84 31.43,0 52.79,20.551 52.79,60.758 0,28.91 -11.72,54.89 -47.76,54.89 -7.54,0 -13.83,-0.839 -18.02,-2.097 l 0,-112.711 z m -31.84,135.769 c 12.99,3.352 28.07,5.442 46.51,5.442 25.98,0 48.19,-6.282 62.85,-20.532 13.41,-13.421 20.53,-33.941 20.53,-58.671 0,-25.981 -6.28,-43.571 -17.18,-57.809 -15.09,-20.961 -41.48,-31.43 -66.62,-31.43 -5.45,0 -9.64,0 -14.25,0.41 l 0,-115.64016 -31.84,0 0,278.23016" id="path3445" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 4294.68,144.551 c 0,-58.2424 11.31,-116.0822 47.35,-116.0822 36.03,0 45.67,61.6132 45.67,116.9222 0,52.789 -9.64,115.218 -46.09,115.218 -35.62,0 -46.93,-58.66 -46.93,-116.058 z m 126.54,2.09 C 4421.22,40.6406 4385.18,0 4339.51,0 c -46.93,0 -78.35,49.8594 -78.35,144.961 0,93.449 33.93,144.141 82.96,144.141 48.19,0 77.1,-52.364 77.1,-142.461" id="path3447" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 4453.48,40.6406 c 9.22,-6.289 26.4,-11.332 40.23,-11.332 29.74,0 47.34,19.2812 47.34,47.7812 0,25.9692 -15.08,41.8902 -37.29,58.6482 -22.62,15.512 -53.22,41.91 -53.22,78.364 0,42.738 29.76,74.16 74.59,74.16 17.6,0 32.68,-5.442 39.39,-10.473 l -7.54,-27.66 c -7.13,5.031 -18.86,9.641 -33.53,9.641 -28.07,0 -41.06,-20.938 -41.06,-40.219 0,-28.071 14.67,-38.973 41.48,-58.242 33.94,-23.887 49.03,-49.868 49.03,-81.2895 0,-48.5976 -33.94,-79.179656 -79.19,-79.179656 -19.28,0 -39.39,6.269536 -47.36,12.148456 l 7.13,27.6523" id="path3449" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 4611.02,3.33984 32.2695,0 0,282.422 -32.2695,0 0,-282.422 z" id="path3451" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 4727.5,256.84 -51.53,0 0,28.922 135.33,0 0,-28.922 -51.53,0 0,-253.50016 -32.27,0 0,253.50016" id="path3453" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 4851.11,144.551 c 0,-58.2424 11.31,-116.0822 47.34,-116.0822 36.04,0 45.68,61.6132 45.68,116.9222 0,52.789 -9.64,115.218 -46.1,115.218 -35.61,0 -46.92,-58.66 -46.92,-116.058 z m 126.53,2.09 C 4977.64,40.6406 4941.61,0 4895.93,0 c -46.92,0 -78.35,49.8594 -78.35,144.961 0,93.449 33.94,144.141 82.96,144.141 48.2,0 77.1,-52.364 77.1,-142.461" id="path3455" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 5048.45,151.25 13.83,0 c 30.59,0 51.12,22.629 51.12,56.559 0,32.703 -13.4,52.8 -47.77,53.222 -6.7,0 -12.99,-0.422 -17.18,-1.679 l 0,-108.102 z m -31.84,130.32 c 13.4,3.77 30.17,5.442 46.09,5.442 28.08,0 49.02,-5.864 63.69,-20.121 13.83,-14.243 19.69,-33.09 19.69,-55.301 0,-36.039 -16.76,-59.5 -45.25,-72.899 l 0,-0.839 c 20.95,-6.293 31.84,-26.411 37.71,-63.2817 6.71,-38.5391 12.15,-62.4219 16.34,-71.23046 l -32.68,0 c -4.19,8.37896 -9.64,35.19136 -15.09,69.55076 -6.28,38.9804 -18.43,53.2184 -46.09,53.2184 l -12.57,0 0,-122.76916 -31.84,0 0,278.23016" id="path3457" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 5187.55,3.33984 32.2695,0 0,282.422 -32.2695,0 0,-282.422 z" id="path3459" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 5374.01,137.422 -70.81,0 0,-106.0001 80.45,0 0,-28.08206 -112.72,0 0,282.42216 107.69,0 0,-28.09 -75.42,0 0,-93 70.81,0 0,-27.25" id="path3461" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                        <path d="m 5412.97,40.6406 c 9.22,-6.289 26.4,-11.332 40.23,-11.332 29.74,0 47.34,19.2812 47.34,47.7812 0,25.9692 -15.08,41.8902 -37.28,58.6482 -22.63,15.512 -53.23,41.91 -53.23,78.364 0,42.738 29.76,74.16 74.59,74.16 17.6,0 32.68,-5.442 39.39,-10.473 l -7.54,-27.66 c -7.13,5.031 -18.86,9.641 -33.53,9.641 -28.07,0 -41.06,-20.938 -41.06,-40.219 0,-28.071 14.67,-38.973 41.48,-58.242 33.94,-23.887 49.03,-49.868 49.03,-81.2895 0,-48.5976 -33.94,-79.179656 -79.19,-79.179656 -19.28,0 -39.39,6.269536 -47.36,12.148456 l 7.13,27.6523" id="path3463" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none" />
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>    
+    </svg>
+
+    <!-- info -->
+            <svg id="info_active" x="190" y="15">
+        <title>The research data repository provides additional information on its service.</title>
+        <g id="surface1">
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(73.333333%,78.039216%,46.666667%);fill-opacity:1;" d="M 29.484375 28.503906 C 29.484375 29.109375 28.992188 29.605469 28.382812 29.605469 L 1.261719 29.605469 C 0.652344 29.605469 0.160156 29.109375 0.160156 28.503906 L 0.160156 1.382812 C 0.160156 0.773438 0.652344 0.28125 1.261719 0.28125 L 28.382812 0.28125 C 28.992188 0.28125 29.484375 0.773438 29.484375 1.382812 Z M 29.484375 28.503906 "/>
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 14.8125 10.152344 C 14.5625 10.152344 14.347656 10.066406 14.167969 9.894531 C 13.992188 9.726562 13.902344 9.507812 13.902344 9.242188 C 13.902344 8.980469 13.992188 8.761719 14.167969 8.585938 C 14.347656 8.414062 14.5625 8.324219 14.8125 8.324219 C 15.070312 8.324219 15.289062 8.414062 15.46875 8.585938 C 15.652344 8.761719 15.738281 8.980469 15.738281 9.242188 C 15.738281 9.496094 15.648438 9.710938 15.46875 9.886719 C 15.289062 10.066406 15.070312 10.152344 14.8125 10.152344 M 15.5 21.179688 L 14.089844 21.179688 L 14.089844 12.386719 L 15.5 12.386719 Z M 15.5 21.179688 "/>
+        </g>
+    </svg>
+        
+    <!-- open access -->
+        <svg id="open_access_active" x="225" y="15">
+        <title>The research data repository provides open access to its data.</title>
+        <g id="surface1">
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(96.470588%,57.254902%,11.764706%);fill-opacity:1;" d="M 29.660156 28.5625 C 29.660156 29.167969 29.167969 29.660156 28.5625 29.660156 L 1.4375 29.660156 C 0.832031 29.660156 0.339844 29.167969 0.339844 28.5625 L 0.339844 1.441406 C 0.339844 0.832031 0.832031 0.339844 1.4375 0.339844 L 28.5625 0.339844 C 29.167969 0.339844 29.660156 0.832031 29.660156 1.441406 Z M 29.660156 28.5625 "/>
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 9.636719 10.324219 L 9.636719 11.054688 L 11.789062 11.054688 L 11.789062 10.324219 C 11.789062 8.542969 13.234375 7.097656 15.011719 7.097656 C 16.789062 7.097656 18.234375 8.542969 18.234375 10.324219 L 18.234375 15.632812 L 20.386719 15.632812 L 20.386719 10.324219 C 20.386719 7.355469 17.976562 4.945312 15.011719 4.945312 C 12.046875 4.945312 9.636719 7.355469 9.636719 10.324219 "/>
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 16.796875 18.734375 C 16.796875 19.714844 16.003906 20.511719 15.019531 20.511719 C 14.039062 20.511719 13.242188 19.714844 13.242188 18.734375 C 13.242188 17.753906 14.039062 16.957031 15.019531 16.957031 C 16.003906 16.957031 16.796875 17.75 16.796875 18.734375 "/>
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 10.8125 18.714844 C 10.8125 16.40625 12.691406 14.527344 15 14.527344 C 17.308594 14.527344 19.1875 16.40625 19.1875 18.714844 C 19.1875 21.023438 17.308594 22.902344 15 22.902344 C 12.691406 22.902344 10.8125 21.023438 10.8125 18.714844 M 8.660156 18.714844 C 8.660156 22.210938 11.503906 25.054688 15 25.054688 C 18.496094 25.054688 21.339844 22.210938 21.339844 18.714844 C 21.339844 15.21875 18.496094 12.375 15 12.375 C 11.503906 12.375 8.660156 15.21875 8.660156 18.714844 "/>
+        </g>
+    </svg>
+            
+            <svg id="licenses_active" x="260" y="15">
+        <title>The terms of use and licenses of the data are provided by the research data repository.</title>
+        <g id="surface1">
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(25.098039%,25.098039%,25.490196%);fill-opacity:1;" d="M 29.664062 28.558594 C 29.664062 29.167969 29.167969 29.660156 28.5625 29.660156 L 1.441406 29.660156 C 0.832031 29.660156 0.339844 29.167969 0.339844 28.558594 L 0.339844 1.4375 C 0.339844 0.832031 0.832031 0.339844 1.441406 0.339844 L 28.5625 0.339844 C 29.167969 0.339844 29.664062 0.832031 29.664062 1.4375 Z M 29.664062 28.558594 "/>
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 18.300781 20.394531 C 17.773438 20.667969 16.664062 20.941406 15.261719 20.941406 C 12.019531 20.941406 9.59375 18.890625 9.59375 15.101562 C 9.59375 11.484375 12.035156 9.058594 15.605469 9.058594 C 17.019531 9.058594 17.945312 9.367188 18.335938 9.570312 L 17.960938 10.785156 C 17.414062 10.511719 16.609375 10.304688 15.65625 10.304688 C 12.957031 10.304688 11.164062 12.03125 11.164062 15.050781 C 11.164062 17.886719 12.789062 19.679688 15.570312 19.679688 C 16.492188 19.679688 17.414062 19.488281 18.011719 19.199219 Z M 18.300781 20.394531 "/>
+        <path style="fill:none;stroke-width:2;stroke-linecap:butt;stroke-linejoin:miter;stroke:rgb(100%,100%,100%);stroke-opacity:1;stroke-miterlimit:4;" d="M 49.307552 29 C 49.307552 40.214844 40.214844 49.307552 29 49.307552 C 17.785156 49.307552 8.692448 40.214844 8.692448 29 C 8.692448 17.785156 17.785156 8.692448 29 8.692448 C 40.214844 8.692448 49.307552 17.785156 49.307552 29 Z M 49.307552 29 " transform="matrix(0.517241,0,0,0.517241,0,0)"/>
+        </g>
+    </svg>
+    
+    <!-- persistant id -->
+        <svg id="persistant_active" x="190" y="50">
+        <title>The research data repository uses a persistent identifier system to make its provided data persistent, unique and citable.</title>
+        <g id="surface1">
+          <path style=" stroke:none;fill-rule:nonzero;fill:rgb(4.313725%,61.568627%,85.098039%);fill-opacity:1;" d="M 29.664062 28.5625 C 29.664062 29.167969 29.167969 29.660156 28.5625 29.660156 L 1.4375 29.660156 C 0.832031 29.660156 0.335938 29.167969 0.335938 28.5625 L 0.335938 1.4375 C 0.335938 0.832031 0.832031 0.339844 1.4375 0.339844 L 28.5625 0.339844 C 29.167969 0.339844 29.664062 0.832031 29.664062 1.4375 Z M 29.664062 28.5625 " />
+          <path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 11.089844 19.761719 L 11.058594 19.761719 L 11.058594 24.332031 L 9.847656 24.332031 L 9.847656 13.296875 L 11.058594 13.296875 L 11.058594 14.625 L 11.089844 14.625 C 11.683594 13.621094 12.554688 13.121094 13.703125 13.121094 C 14.675781 13.121094 15.4375 13.460938 15.980469 14.136719 C 16.527344 14.8125 16.800781 15.71875 16.800781 16.855469 C 16.800781 18.117188 16.496094 19.132812 15.878906 19.894531 C 15.265625 20.652344 14.421875 21.03125 13.355469 21.03125 C 12.375 21.03125 11.621094 20.609375 11.089844 19.761719 M 11.058594 16.714844 L 11.058594 17.769531 C 11.058594 18.394531 11.261719 18.925781 11.667969 19.359375 C 12.074219 19.796875 12.589844 20.015625 13.214844 20.015625 C 13.945312 20.015625 14.523438 19.734375 14.9375 19.171875 C 15.355469 18.613281 15.5625 17.832031 15.5625 16.832031 C 15.5625 15.992188 15.367188 15.332031 14.976562 14.855469 C 14.589844 14.378906 14.0625 14.140625 13.398438 14.140625 C 12.695312 14.140625 12.128906 14.382812 11.699219 14.875 C 11.273438 15.363281 11.058594 15.976562 11.058594 16.714844 " />
+          <path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 19.355469 11.378906 C 19.136719 11.378906 18.953125 11.304688 18.800781 11.15625 C 18.648438 11.007812 18.574219 10.824219 18.574219 10.597656 C 18.574219 10.371094 18.648438 10.183594 18.800781 10.03125 C 18.953125 9.882812 19.136719 9.804688 19.355469 9.804688 C 19.578125 9.804688 19.765625 9.882812 19.921875 10.03125 C 20.074219 10.183594 20.152344 10.371094 20.152344 10.597656 C 20.152344 10.8125 20.074219 10.996094 19.921875 11.148438 C 19.765625 11.304688 19.578125 11.378906 19.355469 11.378906 M 19.945312 20.855469 L 18.734375 20.855469 L 18.734375 13.296875 L 19.945312 13.296875 Z M 19.945312 20.855469 " />
+        </g>
+    </svg>
+    
+    <!-- certificates and standards -->
+        <svg id="certificate_inactive" x="225" y="50">
+        <g id="surface1">
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(94.509804%,94.901961%,94.901961%);fill-opacity:1;" d="M 29.664062 28.5625 C 29.664062 29.167969 29.167969 29.664062 28.5625 29.664062 L 1.4375 29.664062 C 0.832031 29.664062 0.335938 29.167969 0.335938 28.5625 L 0.335938 1.4375 C 0.335938 0.832031 0.832031 0.335938 1.4375 0.335938 L 28.5625 0.335938 C 29.167969 0.335938 29.664062 0.832031 29.664062 1.4375 Z M 29.664062 28.5625 "/>
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(80%,79.607843%,79.607843%);fill-opacity:1;" d="M 28.5625 0.855469 C 28.882812 0.855469 29.144531 1.117188 29.144531 1.4375 L 29.144531 28.5625 C 29.144531 28.882812 28.882812 29.144531 28.5625 29.144531 L 1.4375 29.144531 C 1.117188 29.144531 0.855469 28.882812 0.855469 28.5625 L 0.855469 1.4375 C 0.855469 1.117188 1.117188 0.855469 1.4375 0.855469 L 28.5625 0.855469 M 28.5625 0.335938 L 1.4375 0.335938 C 0.832031 0.335938 0.335938 0.832031 0.335938 1.4375 L 0.335938 28.5625 C 0.335938 29.167969 0.832031 29.664062 1.4375 29.664062 L 28.5625 29.664062 C 29.167969 29.664062 29.664062 29.167969 29.664062 28.5625 L 29.664062 1.4375 C 29.664062 0.832031 29.167969 0.335938 28.5625 0.335938 Z M 28.5625 0.335938 "/>
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(80%,79.607843%,79.607843%);fill-opacity:1;" d="M 20.957031 14.855469 C 20.957031 18.257812 18.195312 21.015625 14.792969 21.015625 C 11.390625 21.015625 8.632812 18.257812 8.632812 14.855469 C 8.632812 11.453125 11.390625 8.691406 14.792969 8.691406 C 18.195312 8.691406 20.957031 11.453125 20.957031 14.855469 "/>
+        <path style="fill:none;stroke-width:2;stroke-linecap:butt;stroke-linejoin:miter;stroke:rgb(80%,79.607843%,79.607843%);stroke-opacity:1;stroke-miterlimit:4;" d="M 45.304948 29.203906 C 45.304948 30.842708 44.753646 32.058594 44.300521 33.546354 C 43.8625 34.966146 42.19349 36.038542 41.408073 37.261979 C 40.690625 38.38724 40.947396 39.270833 39.980729 40.177083 C 38.961198 41.14375 37.752865 42.382292 36.506771 43.054427 C 35.759115 43.46224 33.795573 43.160156 32.972396 43.447135 C 31.310937 44.021094 30.706771 44.98776 28.841406 44.98776 C 27.519792 44.98776 26.60599 45.682552 25.375 45.380469 C 24.302604 45.123698 22.890365 43.892708 21.916146 43.432031 C 20.730469 42.865625 19.809115 41.596875 18.804687 40.773698 C 17.898437 40.033594 16.886458 39.754167 16.161458 38.840365 C 15.104167 37.503646 15.111719 35.804427 14.515104 34.180729 C 13.888281 32.451302 12.6875 30.77474 12.6875 28.833854 C 12.6875 27.361198 12.883854 25.941406 13.253906 24.589583 C 13.654167 23.109375 12.959375 21.75 13.744792 20.48125 C 14.552865 19.136979 17.407552 18.698958 18.555469 17.656771 C 19.771354 16.554167 21.372396 13.805208 22.882812 13.110417 C 24.929427 12.173958 26.439844 12.679948 28.841406 12.679948 C 31.069271 12.679948 33.417969 12.528906 35.351302 13.352083 C 36.75599 13.941146 37.835937 15.330729 39.00651 16.282292 C 40.101562 17.165885 40.426302 19.499479 41.257031 20.639844 C 42.110417 21.810417 43.46224 21.802865 43.983333 23.177344 C 44.640365 24.936979 45.304948 27.217708 45.304948 29.203906 Z M 45.304948 29.203906 " transform="matrix(0.517241,0,0,0.517241,0,0)"/>
+        <path style="fill:none;stroke-width:3;stroke-linecap:butt;stroke-linejoin:miter;stroke:rgb(80.392157%,80%,79.607843%);stroke-opacity:1;stroke-miterlimit:4;" d="M 43.394271 28.720573 C 43.394271 36.891927 36.771094 43.515104 28.59974 43.515104 C 20.428385 43.515104 13.805208 36.891927 13.805208 28.720573 C 13.805208 20.549219 20.428385 13.926042 28.59974 13.926042 C 36.771094 13.926042 43.394271 20.549219 43.394271 28.720573 Z M 43.394271 28.720573 " transform="matrix(0.517241,0,0,0.517241,0,0)"/>
+        </g>
+    </svg>
+        
+    <!-- policy -->
+            <svg id="policy_active" x="260" y="50">
+        <title>The research data repository provides a policy.</title>
+        <g id="surface1">
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(25.098039%,25.098039%,25.490196%);fill-opacity:1;" d="M 29.664062 28.5625 C 29.664062 29.167969 29.167969 29.664062 28.5625 29.664062 L 1.4375 29.664062 C 0.828125 29.664062 0.335938 29.167969 0.335938 28.5625 L 0.335938 1.4375 C 0.335938 0.832031 0.828125 0.335938 1.4375 0.335938 L 28.5625 0.335938 C 29.167969 0.335938 29.664062 0.832031 29.664062 1.4375 Z M 29.664062 28.5625 "/>
+        <path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 12.183594 6.019531 C 12.886719 5.320312 13.808594 4.96875 14.957031 4.96875 C 16.648438 4.96875 17.8125 5.53125 18.453125 6.648438 C 18.792969 7.234375 18.972656 7.996094 18.992188 8.933594 L 17.144531 8.933594 C 17.097656 8.261719 16.980469 7.765625 16.796875 7.445312 C 16.464844 6.867188 15.882812 6.574219 15.054688 6.574219 C 14.390625 6.574219 13.886719 6.734375 13.535156 7.046875 C 13.1875 7.363281 13.011719 7.78125 13.011719 8.304688 C 13.011719 8.609375 13.078125 8.882812 13.210938 9.125 C 13.339844 9.371094 13.535156 9.582031 13.792969 9.765625 C 14.316406 10.125 15.242188 10.675781 16.574219 11.421875 C 18.941406 12.746094 20.125 14.148438 20.125 15.625 C 20.125 16.460938 19.871094 17.195312 19.363281 17.820312 C 19.074219 18.179688 18.585938 18.605469 17.894531 19.097656 C 18.269531 19.441406 18.554688 19.820312 18.761719 20.226562 C 18.964844 20.636719 19.066406 21.078125 19.066406 21.546875 C 19.066406 22.5 18.699219 23.320312 17.957031 24.015625 C 17.21875 24.710938 16.222656 25.054688 14.96875 25.054688 C 13.3125 25.054688 12.152344 24.519531 11.492188 23.449219 C 11.125 22.871094 10.902344 22.054688 10.824219 21 L 12.707031 21 C 12.761719 21.691406 12.886719 22.195312 13.078125 22.519531 C 13.414062 23.105469 14.003906 23.394531 14.839844 23.394531 C 15.390625 23.394531 15.832031 23.324219 16.164062 23.175781 C 16.78125 22.898438 17.089844 22.382812 17.089844 21.621094 C 17.089844 21.296875 16.996094 20.996094 16.808594 20.714844 C 16.695312 20.558594 16.535156 20.398438 16.332031 20.226562 C 16.21875 20.136719 15.851562 19.878906 15.234375 19.457031 C 14.867188 19.210938 14.515625 18.976562 14.1875 18.75 L 12.304688 17.492188 C 11.558594 16.996094 11.027344 16.5625 10.710938 16.195312 C 10.152344 15.570312 9.875 14.863281 9.875 14.082031 C 9.875 13.40625 10.082031 12.796875 10.496094 12.253906 C 10.914062 11.707031 11.460938 11.226562 12.136719 10.8125 C 11.828125 10.53125 11.585938 10.226562 11.417969 9.902344 C 11.226562 9.492188 11.132812 9.0625 11.132812 8.601562 C 11.132812 7.582031 11.484375 6.722656 12.183594 6.019531 M 16.824219 18.222656 C 17.234375 17.980469 17.539062 17.742188 17.738281 17.503906 C 18.097656 17.089844 18.273438 16.574219 18.273438 15.960938 C 18.273438 15.414062 18.085938 14.945312 17.710938 14.558594 C 17.480469 14.320312 17.003906 13.980469 16.292969 13.546875 L 13.214844 11.664062 C 12.792969 11.890625 12.488281 12.109375 12.289062 12.320312 C 11.910156 12.714844 11.722656 13.191406 11.722656 13.757812 C 11.722656 14.058594 11.769531 14.324219 11.863281 14.558594 C 12.039062 14.988281 12.367188 15.355469 12.847656 15.667969 Z M 16.824219 18.222656 "/>
+        </g>
+    </svg>
+    
+            <svg id="doi" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+            <a xlink:href="http://doi.org/10.17616/R31NJN2V" target="_blank">
+              <text x="10" y="80" fill="#000000" font-family="Helvetica" font-size="12px">http://doi.org/10.17616/R31NJN2V</text>
+            </a>
+        </svg>
+        <svg id="reponame" x="10" y="85">
+        <switch>
+            <foreignObject width="285" height="15" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">                
+                <div style="color: #000000; font-weight: bold; line-height: 1.25; font-size: 12px; font-family: sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;" xmlns="http://www.w3.org/1999/xhtml">
+                    SPARC.Science
+                </div>                                    
+            </foreignObject>            
+            <text y="10" fill="#000000" font-family="Helvetica" font-size="12px" font-weight="bold">SPARC.Science</text>      
+        </switch>
+    </svg>
+
+
+    
+</svg>
\ No newline at end of file
diff --git a/static/images/child-parent-relationship.png b/static/images/child-parent-relationship.png
new file mode 100644
index 00000000..390548a0
Binary files /dev/null and b/static/images/child-parent-relationship.png differ
diff --git a/store/index.js b/store/index.js
index b6417c8c..5b9e708a 100644
--- a/store/index.js
+++ b/store/index.js
@@ -10,8 +10,10 @@ export const mutations = {
 
 const actions = {
   async nuxtServerInit({dispatch}) {
-    await dispatch('layouts/default/fetchFooterData');
-    await dispatch('user/fetchUser');
+    await dispatch('pages/contact-us/fetchContactUsFormOptions')
+    await dispatch('layouts/default/fetchFooterData')
+    await dispatch('user/fetchUser')
+    await dispatch('layouts/default/fetchPortalNotification')
   },
 };
 
diff --git a/store/layouts/default.js b/store/layouts/default.js
index 20ea6ac3..3ce8851b 100644
--- a/store/layouts/default.js
+++ b/store/layouts/default.js
@@ -1,9 +1,12 @@
 import createClient from '~/plugins/contentful'
+import { pathOr } from 'ramda'
 
 export const state = () => ({
   disableScrolling: false,
   footerData: {},
-  hasAcceptedGDPR: false
+  hasAcceptedGDPR: false,
+  portalNotification: {},
+  hasSeenPortalNotification: false
 })
 
 export const mutations = {
@@ -15,7 +18,13 @@ export const mutations = {
   },
   SET_HAS_ACCEPTED_GDPR(state, hasAcceptedGDPR) {
     state.hasAcceptedGDPR = hasAcceptedGDPR
-  }
+  },
+  SET_HAS_SEEN_PORTAL_NOTIFICATION(state, hasSeen) {
+    state.hasSeenPortalNotification = hasSeen
+  },
+  SET_PORTAL_NOTIFICATION(state, data) {
+    state.portalNotification = data
+  },
 }
 
 export const actions = {
@@ -25,6 +34,30 @@ export const actions = {
   setHasAcceptedGdpr: ({ commit }, state) => {
     commit('SET_HAS_ACCEPTED_GDPR', state)
   },
+  setPortalNotification: ({ commit }, state) => {
+    commit('SET_PORTAL_NOTIFICATION', state)
+  },
+  setHasSeenPortalNotification: ({ commit }, state) => {
+    commit('SET_HAS_SEEN_PORTAL_NOTIFICATION', state)
+  },
+  async fetchPortalNotification({ commit, dispatch }) {
+    try {
+      const client = createClient()
+      const response = await client.getEntry(process.env.ctf_portal_notification_entry_id)
+      dispatch('setPortalNotification', response.fields)
+      const newNotificationMessage = pathOr('', ['fields', 'message'], response)
+      const oldNotificationMessage = this.$cookies.get('PortalNotificationMessage')
+      // If the message has changes then reset if the user has seen it to false
+      if (newNotificationMessage != oldNotificationMessage) {
+        this.$cookies.set('PortalNotification:hasBeenSeen', false)
+        this.$cookies.set('PortalNotificationMessage', newNotificationMessage)
+      }
+      const hasSeenPortalNotification = this.$cookies.get('PortalNotification:hasBeenSeen')
+      dispatch('setHasSeenPortalNotification', hasSeenPortalNotification)
+    } catch (e) {
+      console.error(e)
+    }
+  },
   async fetchFooterData({ commit, dispatch }) {
     try {
       const client = createClient()
diff --git a/store/pages/contact-us/index.js b/store/pages/contact-us/index.js
new file mode 100644
index 00000000..a63c9d4e
--- /dev/null
+++ b/store/pages/contact-us/index.js
@@ -0,0 +1,38 @@
+import createClient from '~/plugins/contentful'
+import { propOr } from 'ramda'
+
+export const state = () => ({
+  formOptions: {
+    userTypes: [],
+    areasOfSparc: [],
+    services: [],
+    resourceCategories: []
+  }
+})
+
+export const mutations = {
+  SET_FORM_OPTIONS(state, data) {
+    state.formOptions = data
+  }
+}
+
+export const actions = {
+  async fetchContactUsFormOptions({ commit, dispatch }) {
+    try {
+      const client = createClient()
+      const response = await client.getEntry(process.env.ctf_contact_us_form_options_id)
+      const fields = response.fields
+
+      const formOptions = {
+        userTypes: propOr([], 'typeOfUser', fields),
+        areasOfSparc: propOr([], 'areaOfSparcPortal', fields),
+        services: propOr([], 'services', fields),
+        resourceCategories: propOr([], 'resourceCategories', fields)
+      }
+      
+      commit('SET_FORM_OPTIONS', formOptions)
+    } catch (e) {
+      console.error(e)
+    }
+  }
+}
diff --git a/test/cypress/e2e/datasets.cy.js b/test/cypress/e2e/datasets.cy.js
new file mode 100644
index 00000000..7b14aff4
--- /dev/null
+++ b/test/cypress/e2e/datasets.cy.js
@@ -0,0 +1,383 @@
+const datasetIds = [127];
+// const datasetIds = [127, 282, 290, 34, 76];
+
+
+datasetIds.forEach(datasetId => {
+
+  describe(`Dataset ${datasetId}`, { testIsolation: false }, function () {
+    before(function () {
+      cy.intercept('**/dataset_info/using_doi?**').as('dataset_info')
+      cy.intercept('**/knowledge/query/**').as('flatmap')
+      cy.visit(`/datasets/${datasetId}?type=dataset`)
+    });
+
+    it("Gallery Tab", function () {
+      // Should switch to 'Gallery'
+      cy.contains('#datasetDetailsTabsContainer .style1', ' Gallery ').click();
+      cy.get('.nuxt-link-exact-active').should('contain', ' Gallery ');
+
+      cy.wait(5000)
+
+      cy.get('.content > .full-size', { timeout: 30000 }).then(($content) => {
+        const gallery = $content.find('.gallery-container');
+        if (gallery && gallery.length) {
+          // Check for pagination
+          cy.wrap(gallery).find('.sparc-design-system-pagination').as('pagination');
+          cy.get('@pagination').find('li.number').should('have.length.least', 1);
+
+          // Check for gallery card
+          cy.wrap(gallery).find('.el-card').as('card').should('have.length.least', 1)
+          cy.get('@card').first().within(($card) => {
+            cy.wrap($card).get('.cursor-pointer > img').should('be.visible').and('have.prop', 'naturalWidth').should('be.greaterThan', 0)
+            cy.wrap($card).contains('span', ' View ')
+          });
+
+          // Only check for dataset when it has valid flatmap data
+          cy.wait('@dataset_info').then((intercept) => {
+            if (intercept.response.body.result[0].organs) {
+              cy.wait('@flatmap').then((intercept) => {
+                if (intercept.response.body.values.length > 0) {
+                  cy.findGalleryCard('flatmap', 'prev');
+                  cy.get('.el-card > .el-card__body').should('contain', 'flatmap');
+                }
+              })
+            }
+          })
+        } else {
+          cy.wrap($content).contains(' This dataset does not contain gallery items ');
+        }
+      });
+    });
+    it("Landing page", function () {
+      cy.intercept('**/query?**').as('query')
+
+      // Should display image with correct dataset src
+      cy.get('.dataset-image').should('have.attr', 'src').and('include', `https://assets.discover.pennsieve.io/dataset-assets/${datasetId}`)
+
+      // Check for tooltip when hover over author 
+      cy.get('.dataset-owners > :nth-child(2) > .contributor-item').then(($orcid) => {
+        if ($orcid.hasClass('has-orcid')) {
+          cy.wrap($orcid).trigger('mouseenter', { eventConstructor: 'MouseEvent' })
+          //only one visible popover
+          cy.get('.orcid-popover:visible').should('have.length', 1)
+        }
+      })
+
+      // Should reload the page
+      cy.get('.dataset-information-box > :nth-child(2) > a').click()
+      cy.origin('https://sparc.science', () => {
+        cy.url().should('contain', 'version')
+        cy.go('back')
+      })
+      // cy.get('.dataset-information-box > :nth-child(2) > a').should('have.attr', 'href').and('include', 'doi.org').then((href) => {
+      //   cy.request(href).then((resp) => {
+      //     expect(resp.status).to.eq(200);
+      //     expect(resp.body).to.include(`datasets/${datasetId}/version`);
+      //   })
+      // });
+
+      // Should search for contributor in find data page
+      cy.get(':nth-child(2) > .contributor-list > li > .el-tooltip > .tooltip-item > a').then(($name) => {
+        cy.wrap($name).click()
+
+        cy.wait('@query', { timeout: 20000 })
+
+        cy.get('.table-wrap.el-loading-parent--relative > .el-loading-mask', { timeout: 30000 }).should('not.exist')
+
+        // Check for result
+        cy.get(':nth-child(1) > p > .el-dropdown > .filter-dropdown').should('be.visible').click()
+        cy.get('.el-dropdown-menu > .el-dropdown-menu__item:visible').contains('View All').click()
+
+        let datasetShowUp = false
+        cy.get('.img-dataset > img').each(($img) => {
+          cy.wrap($img).invoke('attr', 'src').then((src) => {
+            datasetShowUp = datasetShowUp || src.includes(datasetId)
+          })
+        }).then(() => {
+          if (!datasetShowUp) {
+            throw new Error("Can not find the dataset for current contributor")
+          }
+        })
+
+        // Check for URL and search input
+        cy.url({ decode: true }).should('contain', `search=${$name.text()}`)
+        cy.get('.el-input__inner').should('have.value', $name.text());
+        cy.go('back')
+      });
+
+      // Check 'View other version' directs to Versions tab
+      cy.get('.dataset-information-box > div').contains('View other versions').click();
+      cy.get('.nuxt-link-exact-active').should('contain', ' Versions ');
+      cy.get('[style=""] > .heading2.mb-8').should('contain', 'Versions for this Dataset').and('be.visible')
+
+      //Check 'Get Dataset' directs to files tab
+      cy.contains('.button-container span', 'Get Dataset').click()
+      cy.get('.nuxt-link-exact-active').should('contain', ' Files ');
+      cy.get('[style=""] > .heading2.mb-8').should('have.text', 'Download Dataset').and('be.visible')
+
+      //Check 'Cite Dataset' directs to Cite tab
+      cy.contains('.button-container span', 'Cite Dataset').click()
+      cy.get('.nuxt-link-exact-active').should('contain', ' Cite ');
+      cy.get('.citation-details > .heading2').should('have.text', '\n    Dataset Citation\n  ').and('be.visible')
+    });
+    it("Abstract Tab", function () {
+      // Should switch to 'Abstract'
+      cy.contains('#datasetDetailsTabsContainer .style1', ' Abstract ').click();
+      cy.get('.nuxt-link-exact-active').should('contain', ' Abstract ');
+
+      //The following regular expression should capture space and letters
+      cy.get('.dataset-description-info > .col-xs-12.description-container > p').contains(/Study Purpose: (.+)/).should('exist')
+      cy.get('.dataset-description-info > .col-xs-12.description-container > p').contains(/Data (Collection|Collected):(.+)/).should('exist')
+      cy.get('.dataset-description-info > .col-xs-12.description-container > p').contains(/(Primary )?Conclusion(s)?: (.+)/).should('exist')
+
+      // Check for Experimental Design
+      cy.get('.dataset-description-info > .mb-8').contains('Experimental Design:').should('exist')
+      cy.get('.dataset-description-info').contains('Protocol Links:').should('exist')
+      cy.get('.dataset-description-info').within(($el) => {
+        if ($el.text().includes('https://doi.org/')) {
+          cy.get('.link2').should('exist')
+          cy.get('.link2').should('have.length.above', 0)
+          cy.get('.link2').should('have.attr', 'href').and('include', 'https://doi.org/')
+        }
+      })
+      cy.get('.dataset-description-info > .experimental-design-container').contains(/Experimental Approach: (.+)/).should('exist')
+
+      // Check for Subject Information
+      cy.get('.dataset-description-info > .mb-8').contains('Subject Information:').should('exist')
+      cy.get('.dataset-description-info > .experimental-design-container').contains(/Anatomical structure: (.+)/).should('exist')
+      cy.get('.dataset-description-info > .experimental-design-container').contains(/Species: (.+)/).should('exist')
+      cy.get('.dataset-description-info > .experimental-design-container').contains(/Sex: (.+)/).should('exist')
+      cy.get('.dataset-description-info > .experimental-design-container').contains(/Number of samples: (.+)/).should('exist')
+
+      // Check for Keywords
+      cy.get('.dataset-description-info').contains(/Keywords: (.+)/).should('exist')
+
+      // Check for downloading
+      cy.contains('.dataset-description-info a', 'Download Metadata file').should('have.attr', 'href').and('include', 'metadata').then((href) => {
+        cy.request(href).then((resp) => {
+          expect(resp.status).to.eq(200)
+        })
+      })
+    });
+    it("About Tab", function () {
+      // Should switch to 'About'
+      cy.contains('#datasetDetailsTabsContainer .style1', ' About ').click();
+      cy.get('.nuxt-link-exact-active').should('contain', ' About ');
+
+      // Check for content
+      cy.get('.dataset-about-info > .mb-16').contains(/Title: (.+)/).should('exist')
+      cy.get('.dataset-about-info > .mb-16').contains(/First Published: (.+)/).should('exist')
+      cy.get('.dataset-about-info > .mb-16').contains(/Last Published: (.+)/).should('exist')
+      cy.get('.dataset-about-info > .about-section-container').contains(/Contact Author: (.+)/).within(($el) => {
+        // Check for email link exist
+        cy.wrap($el).get(':nth-child(2) > :nth-child(2) > a').should('have.attr', 'href').and('include', 'mailto:');
+      })
+      cy.get('.dataset-about-info > .mb-16').contains(/Award[(]s[)]: (.+)/).should('exist')
+      cy.get('.dataset-about-info > .mb-16').contains(/Funding Program[(]s[)]: (.+)/).should('exist')
+      cy.get('.dataset-about-info > .mb-16').contains(/Associated project[(]s[)]: (.+)/).should('exist')
+      cy.get('.dataset-about-info > .mb-16').contains(/Institution[(]s[)]: (.+)/).should('exist')
+      cy.get('.dataset-about-info > .mb-16').contains(/Version (.+) Revision (.+): (.+)/).should('exist')
+      cy.get('.dataset-about-info > .mb-16').contains(/Dataset DOI: (.+)/).should('exist')
+
+      /**
+       * Contact Author may not be the contributor
+       * If should be, uncomment following code
+       */
+      // //match author to contributors
+      // cy.get('.about-section-container > :nth-child(2) > :nth-child(1)').invoke('text').then((value) => {
+      //   const author = new RegExp(value.replace(/\s+/, ' '), 'i')
+      //   cy.get('.similar-datasets-container').contains(author);
+      // })
+
+      // Ignore tests if project not exist
+      cy.get('.similar-datasets-container').then(($content) => {
+        if ($content.text().includes('project(s):')) {
+          //Match award link to associated project
+          cy.get(':nth-child(11) > :nth-child(2) > a').invoke('attr', 'href').then((value) => {
+            cy.get(':nth-child(8) > :nth-child(2) > a').should('have.attr', 'href', value);
+          });
+
+          cy.get('.dataset-about-info').contains(/Institution[(]s[)]: (.+)/).children().not('.label4').invoke('text').then((value) => {
+            cy.get('.mt-8 > a').click()
+            cy.url({ timeout: 30000 }).should('contain', 'projects')
+
+            // Check for the institution 
+            const institution = value.match(/[ a-zA-Z]+/)[0].trim()
+            cy.get('.body1 > :nth-child(6)').should('contain', institution);
+            cy.go('back')
+          })
+        }
+      })
+    });
+    it("Cite Tab", function () {
+      // Should switch to 'Cite'
+      cy.contains('#datasetDetailsTabsContainer .style1', ' Cite ').click();
+      cy.get('.nuxt-link-exact-active').should('contain', ' Cite ');
+
+      // Check for title
+      cy.get('.bx--col-md-6 > .heading2').invoke('text').then((value) => {
+        cy.get('.info-citation > .citation-text', { timeout: 30000 }).should('contain', value.trim())
+      })
+
+      cy.get('.dataset-information-box > :nth-child(2) > a > u').invoke('text').then((value) => {
+        // Check for citation doi
+        cy.get('.info-citation > .citation-text', { timeout: 30000 }).should('contain', value.toUpperCase())
+
+        // Check for source link
+        const expectedLink = 'https://citation.crosscite.org/?doi=' + value;
+        cy.get('.citation-details > p > a').should('have.attr', 'href', expectedLink);
+      })
+    });
+    it("Files Tab", function () {
+      //First check if there is a Files tab
+      cy.get('#datasetDetailsTabsContainer .style1').then(($tab) => {
+        if ($tab.text().includes(' Files ')) {
+          // Should switch to 'Files' if exist
+          cy.contains('#datasetDetailsTabsContainer .style1', ' Files ').click();
+          cy.get('.nuxt-link-exact-active').should('contain', ' Files ');
+
+          // Check for content
+          cy.get('[style=""] > .heading2.mb-8').should('have.text', 'Download Dataset');
+          cy.get('.left-column > :nth-child(1) > div > .label4').should('have.text', 'Option 1 - Direct download: ');
+          cy.get('.aws-download-column > :nth-child(1) > .label4').should('have.text', 'Option 2 - AWS download: ');
+
+          // Check for download full dataset button
+          cy.get('.left-column .el-button').contains('Download full dataset').should('be.visible');
+          cy.contains('Dataset size').parent().then(($size) => {
+            const size = parseFloat($size.text().match(/[0-9]+(.[0-9]+)?/i)[0])
+            if ($size.text().includes("GB") && size > 5) {
+              cy.get('.el-tooltip > .el-button').should('not.be.enabled')
+            } else {
+              cy.get('.left-column > :nth-child(1) > a > .el-button').should('be.enabled')
+            }
+          })
+
+          // Check for help link
+          cy.get('.aws-download-column > :nth-child(1) > a').should('have.attr', 'href', 'https://docs.sparc.science/docs/accessing-public-datasets');
+          cy.get('.aws-download-column > :nth-child(3) > a').should('have.attr', 'href', 'https://aws.amazon.com/s3/pricing/');
+
+          //Find the download file button
+          cy.contains('.content .body1 .el-table__fixed-body-wrapper .el-table__row', ' dataset_description.xlsx ').should('have.length', 1).as('datasetDescription');
+
+          //there should be 4 icons, one for each action
+          cy.get('@datasetDescription').find('.svg-icon').should('have.length', 4).as('icons')
+
+          //Check get share links
+          cy.get('@icons').eq(3).click({ force: true });
+          cy.get('.el-message').should('be.visible').and('have.text', 'File URL copied to clipboard.')
+
+          //Check oSPARC link
+          cy.get('@icons').eq(2).click({ force: true });
+          cy.get('.files-table-table .el-dialog  .svg-icon').click({ force: true });
+
+          // Check for files breadcrumb
+          cy.get('.inline > .dataset-link').should('have.attr', 'href', 'https://docs.sparc.science/docs/accessing-public-datasets');
+          cy.get('.breadcrumb-link').should('have.class', 'breadcrumb-link');
+          cy.get('.breadcrumb-link').should('have.attr', 'href').and('contain', 'datasetDetailsTab=files&path=files');
+          cy.get('.el-table__body-wrapper > .el-table__body > tbody > .el-table__row').then(($table) => {
+            if ($table.text().includes('Folder')) {
+              cy.get('.breadcrumb-link').should('have.length', 1)
+              cy.wrap($table).filter(':contains("Folder")').first().within(($link) => {
+                cy.wrap($link).get('.file-name-wrap > .el-tooltip > .file-name').click({ force: true })
+              })
+              cy.get('.breadcrumb-link').should('have.length', 2)
+              cy.get(':nth-child(1) > .breadcrumb-link').click()
+              cy.get('.breadcrumb-link').should('have.length', 1)
+            }
+          })
+        } else {
+          this.skip();
+        }
+      });
+    });
+    it("References Tab", function () {
+      //First check if reference tab is present
+      cy.get('#datasetDetailsTabsContainer .style1').then(($tab) => {
+        if ($tab.text().includes(' References ')) {
+          // Should switch to 'References' if exist
+          cy.contains('#datasetDetailsTabsContainer .style1', ' References ').click();
+          cy.get('.nuxt-link-exact-active').should('contain', ' References ');
+
+          // Check for content
+          cy.get('.dataset-references .heading2').contains('Associated Publications for this Dataset');
+          cy.get('.dataset-references .citation-container').each(el => {
+            cy.wrap(el).find('div > a').should('have.attr', 'href').and('include', 'doi.org');
+            cy.wrap(el).find('.copy-button').click();
+            cy.get('.el-message').should('be.visible').and('contain', 'Successfully copied citation.')
+          });
+
+          // Check if redundant doi exist
+          let doiList = []
+          cy.get('.dataset-references').then(($content) => {
+            if (
+              $content.text().includes('Primary Publications for this Dataset') &&
+              $content.text().includes('Preprints')
+            ) {
+              cy.get('.dataset-references .citation-container > div > a').each($doi => {
+                cy.wrap($doi).invoke('attr', 'href').then((link) => {
+                  if (!doiList.includes(link)) {
+                    doiList.push(link)
+                  } else {
+                    throw new Error("Redundant doi is found")
+                  }
+                })
+              });
+            }
+          })
+        } else {
+          this.skip();
+        }
+      });
+    });
+    it("Versions Tab", function () {
+      //First check if version tab is present
+      cy.get('#datasetDetailsTabsContainer .style1').then(($tab) => {
+        if ($tab.text().includes(' Versions ')) {
+          // Should switch to 'Versions' if exist
+          cy.contains('#datasetDetailsTabsContainer .style1', ' Versions ').click();
+          cy.get('.nuxt-link-exact-active').should('contain', ' Versions ');
+
+          // Check for file actions
+          cy.get('.version-table > :nth-child(2) > :nth-child(4)').then(($cell) => {
+            if ($cell.text().includes('Not available')) {
+              cy.wrap($cell).should('contain', 'Not available')
+            } else {
+              // Check for changelog
+              cy.wrap($cell).find('.svg-icon').as('icons').should('have.length', 2)
+              cy.get('@icons').eq(0).click()
+
+              // Check for changelog popover
+              cy.get('.optional-content-container').should('be.visible');
+              cy.get('.main-content-container').should('be.visible');
+              cy.get('.close-icon > path').click();
+
+              // Check for download
+              cy.intercept('**/zipit/discover').as('changelogDownload')
+              cy.get('@icons').eq(1).click({ force: true })
+              cy.get('@changelogDownload').should(({ request, response }) => {
+                expect(request.method).to.equal('POST')
+                expect(request.body.data.datasetId).to.equal(`${datasetId}`)
+                expect(response.statusCode).to.equal(200)
+              })
+            }
+          })
+
+          // DOI link should reload page with correct version
+          cy.get(':nth-child(2) > .el-col-push-1 > a').click()
+          cy.origin('https://sparc.science', () => {
+            cy.url().should('contain', 'version')
+            cy.go('back')
+          })
+          // cy.get('.el-col-push-1 > a').each(($link) => {
+          //   cy.wrap($link).should('have.attr', 'href').and('include', 'doi.org').then((href) => {
+          //     cy.request(href).then((resp) => {
+          //       expect(resp.status).to.eq(200);
+          //       expect(resp.body).to.include(`datasets/${datasetId}/version`);
+          //     })
+          //   });
+          // })
+        }
+      });
+    });
+  });
+});
\ No newline at end of file
diff --git a/test/cypress/e2e/finddata.cy.js b/test/cypress/e2e/finddata.cy.js
new file mode 100644
index 00000000..3fac1064
--- /dev/null
+++ b/test/cypress/e2e/finddata.cy.js
@@ -0,0 +1,301 @@
+// const categories = ['dataset']
+const categories = ['dataset', 'model', 'simulation', 'projects']
+
+const limit = 20
+
+const keywords = ['Spine', 'neck']
+
+/**
+ * 1.
+ * If multiple facets are selected which includes one or more "ANATOMICAL STRUCTURE" parent facet,
+ * place it/them to the end of the array,
+ * this is to make sure the "ANATOMICAL STRUCTURE" child facet can be closed during "close tag" process.
+ * 2.
+ * If multiple facets are selected,
+ * all facets need to be matched, 
+ * otherwise that test will be skipped.
+ */
+const facets = [['Human'], ['Heart', 'Adult']]
+
+categories.forEach((category) => {
+
+  describe(`Find Data in ${category}`, { testIsolation: false }, function () {
+    before(function () {
+      cy.visit(`/data?type=${category}`)
+    })
+
+    it('Dataset card', function () {
+      if (category === 'projects') {
+        cy.get(':nth-child(1) > .el-table_1_column_1 > .cell > .image-container > .img-project').should('have.attr', 'src').and('contain', '//images.ctfassets.net/');
+        cy.get(':nth-child(1) > .el-table_1_column_2 > .cell > .property-table > :nth-child(1) > .property-name-column').should('contain', 'Focus');
+        cy.get(':nth-child(1) > .el-table_1_column_2 > .cell > .property-table > :nth-child(2) > .property-name-column').should('contain', 'Principle Investigator');
+        cy.get(':nth-child(1) > .el-table_1_column_2 > .cell > .property-table > :nth-child(3) > .property-name-column').should('contain', 'Institution');
+        cy.get(':nth-child(1) > .el-table_1_column_2 > .cell > .property-table > :nth-child(4) > .property-name-column').should('contain', 'Funding Program');
+        cy.get(':nth-child(1) > .el-table_1_column_2 > .cell > .property-table > :nth-child(5) > .property-name-column').should('contain', 'Award');
+      } else {
+        cy.get(':nth-child(1) > .el-table_1_column_1 > .cell > :nth-child(1) > .img-dataset > img').should('have.attr', 'src').and('contain', 'https://assets.discover.pennsieve.io/dataset-assets/')
+        cy.get(':nth-child(1) > .el-table_1_column_2 > .cell > :nth-child(1) > .property-table > :nth-child(1) > .property-name-column').should('contain', 'Anatomical Structure');
+        cy.get(':nth-child(1) > .el-table_1_column_2 > .cell > :nth-child(1) > .property-table > :nth-child(2) > .property-name-column').should('contain', 'Species');
+        cy.get(':nth-child(1) > .el-table_1_column_2 > .cell > :nth-child(1) > .property-table > :nth-child(3) > .property-name-column').should('contain', 'Experimental Approach');
+        cy.get(':nth-child(1) > .el-table_1_column_2 > .cell > :nth-child(1) > .property-table > :nth-child(4) > .property-name-column').should('contain', 'Publication Date');
+      }
+    })
+    it('All Page Features', function () {
+      cy.get('h5').should('contain', 'Search within category');
+      cy.get('.heading2').should('contain', 'Refine results');
+      cy.get('.tags-container > .flex').should('contain', 'Filters applied');
+      cy.get('.el-col-md-16 > :nth-child(1) > p').should('contain', 'Results | Showing');
+      cy.get('.label1').should('contain', 'Sort');
+
+      /**
+       * Sort dropdown function testing
+       * Test whether the sort function can be triggered and text can be shown
+       */
+      cy.get('.label1 > .el-dropdown > .filter-dropdown > .el-dropdown-text-link').click()
+
+      // Change the order to 'Z-A'
+      cy.get('.el-dropdown-menu > .el-dropdown-menu__item:visible').contains('Z-A').click()
+
+      // CHeck for the order
+      cy.get('.label1 > .el-dropdown > .filter-dropdown > .el-dropdown-text-link').should('contain', 'Z-A')
+
+      /**
+       * Tooltips showup testing
+       * Test whether content will be displayed
+       */
+      // Check for tooltip content
+      cy.get('.purple-fill').trigger('mouseenter', { eventConstructor: 'MouseEvent' })
+      cy.get('[role="tooltip"]').should('be.visible')
+      cy.get('[role="tooltip"]:visible > .el-popover__title').should('have.text', 'How do filters work?')
+      cy.get('.purple-fill').trigger('mouseleave', { eventConstructor: 'MouseEvent' })
+      cy.get('[role="tooltip"]').should('not.be.visible')
+
+      cy.get('.label-header > :nth-child(1) > .label-title').then(($label) => {
+        if ($label.text().includes('Availability')) {
+          cy.get('.el-tooltip').trigger('mouseenter', { eventConstructor: 'MouseEvent' })
+          cy.get('[role="tooltip"]').should('be.visible')
+
+          // Check for tooltip content
+          cy.get('[role="tooltip"]').should('contain', 'SPARC')
+
+          cy.get('.el-tooltip').trigger('mouseleave', { eventConstructor: 'MouseEvent' })
+          cy.get('[role="tooltip"]').should('not.be.visible')
+        }
+      })
+
+      /**
+       * Dataset show testing
+       * Test whether the number of displayed datasets can be changed
+       */
+      // Change the limit
+      cy.get(':nth-child(1) > p > .el-dropdown > .filter-dropdown').click()
+      cy.get('.el-dropdown-menu > .el-dropdown-menu__item:visible').contains(limit).click()
+
+      // Check for limit change in URL
+      cy.url().should('contain', `limit=${limit}`)
+      cy.get('.el-table__row', { timeout: 30000 }).should('have.length', limit)
+    })
+
+    keywords.forEach((keyword) => {
+
+      it(`Keyword Search - ${keyword}`, function () {
+        cy.intercept('**/query?**').as('query')
+
+        cy.get('.el-input__inner').should('have.attr', 'placeholder', 'Enter search criteria')
+
+        // Type keyword
+        cy.get('.el-input__inner').clear()
+        cy.get('.el-input__inner').type(keyword)
+
+        // Check for clear search icon
+        cy.get('.btn-clear-search > .svg-icon').should('be.visible')
+
+        // Click search button
+        cy.get('.search-text').click()
+
+        // Check for keyword in URL
+        cy.url().should('contain', keyword)
+
+        cy.wait('@query', { timeout: 20000 })
+
+        cy.get('.table-wrap.el-loading-parent--relative > .el-loading-mask', { timeout: 30000 }).should('not.exist')
+
+        // Check for result
+        cy.get(':nth-child(1) > p').then(($result) => {
+          if ($result.text().includes(' 0 Results | Showing')) {
+            // Empty text should exist if no result
+            cy.get('.el-table__empty-text').should('exist').and('have.text', 'No Results')
+          } else {
+            cy.get('.table-wrap').then(($content) => {
+              const keywordExist = $content.text().toLowerCase().includes(keyword.toLowerCase())
+              if (keywordExist) {
+                // Check for keyword
+                cy.wrap($content).contains(new RegExp(keyword, 'i')).should('exist')
+
+                // Check for highlighted keyword
+                cy.get('b').contains(new RegExp(keyword, 'i')).should('exist')
+              } else {
+                // *** Ignore when keyword cannot be found or
+                // *** Find some other solutions in the future
+              }
+            })
+          }
+        })
+        // Clear search input
+        cy.get('.btn-clear-search > .svg-icon').click()
+
+        // *** There are situations that dataset cards do not show the (highlighted) keywords
+        // *** Just in case this happens for all the displayed dataset cards, extra tests may need to be added
+      })
+    })
+
+    facets.forEach((facetList) => {
+
+      it(`Faceted Browse Search - ${facetList}`, function () {
+        cy.intercept('**/query?**').as('query')
+        cy.intercept('**/entries?**').as('entries')
+
+        // Check for filters applied box
+        cy.get('.no-facets').should('contain', 'No filters applied')
+
+        cy.wait(5000)
+
+        // Expand all filters/facets
+        cy.get('.expand-all-container > .el-link > .el-link--inner').click()
+        cy.get('.label-content-container').should('be.visible').and('have.length.above', 0)
+
+        // Expand nested facet menu item if facet not found
+        cy.get('.el-tree-node__content > .custom-tree-node > .capitalize:visible').then(($label) => {
+          let facetIsObserved = true
+          facetList.forEach((facet) => {
+            facetIsObserved = facetIsObserved && $label.text().toLowerCase().includes(facet.toLowerCase())
+          })
+          if (!facetIsObserved && category !== 'projects') {
+            // If the same facet are found in multiple place, the first will be checked by default
+            // This action is used to expand all parent facets in ANATOMICAL STRUCTURE
+            // To avoid facet not found when using child facets as test facets
+            // *** Need to think of a solution to open the specific parent facet, instead of open all
+            cy.get('.el-icon-caret-right:visible').not('.is-leaf').click({ multiple: true })
+          }
+        })
+
+        cy.get('.el-tree-node__content > .custom-tree-node > .capitalize:visible').then(($label) => {
+          let facetIsObserved = true
+          facetList.forEach((facet) => {
+            facetIsObserved = facetIsObserved && $label.text().toLowerCase().includes(facet.toLowerCase())
+          })
+          if (!facetIsObserved && category !== 'projects') {
+            // If the same facet are found in multiple place, the first will be checked by default
+            // This action is used to expand all parent facets in ANATOMICAL STRUCTURE
+            // To avoid facet not found when using child facets as test facets
+            // *** Need to think of a solution to open the specific parent facet, instead of open all
+            cy.get('.el-icon-caret-right:visible').not('.is-leaf').click({ multiple: true })
+          }
+          if (facetIsObserved) {
+            facetList.forEach((facet) => {
+              // Check the matched facet checkbox
+              cy.wrap($label).contains(new RegExp(`^${facet}$`, 'i')).click()
+
+              // Check for the number of facet tags in filters applied box
+              cy.get('.el-card__body > .capitalize:visible').contains(new RegExp(facet, 'i')).should('exist')
+            })
+
+            // Check for URL
+            if (category === 'projects') {
+              cy.url().should('contain', 'selectedProjectsAnatomicalFocusIds')
+              cy.wait('@entries', { timeout: 20000 })
+            } else {
+              cy.url().should('contain', 'selectedFacetIds')
+              cy.wait('@query', { timeout: 20000 })
+            }
+
+            cy.get('.table-wrap.el-loading-parent--relative > .el-loading-mask', { timeout: 30000 }).should('not.exist')
+
+            // Check for result correctness
+            cy.get(':nth-child(1) > p').then(($result) => {
+              if ($result.text().includes(' 0 Results | Showing')) {
+                // Empty text should exist if no result
+                cy.get('.el-table__empty-text').should('exist').and('have.text', 'No Results')
+              } else {
+                // Check for facets exist in dataset card
+                cy.get('.property-table').then(($content) => {
+                  facetList.forEach((facet) => {
+                    const facetExistInCard = $content.text().toLowerCase().includes(facet.toLowerCase())
+                    if (facetExistInCard) {
+                      cy.wrap($content).contains(new RegExp(facet, 'i')).should('exist')
+                    } else {
+                      // *** Ignore when facets cannot be found or
+                      // *** Find some other solutions in the future
+                    }
+                  })
+                })
+              }
+            })
+
+            for (let index = 0; index < 2; index++) {
+              if (index === 1) {
+                // Combine with search
+                cy.get('.el-input__inner').clear()
+                cy.get('.el-input__inner').type('dataset')
+                facetList.forEach((facet) => {
+                  cy.wrap($label).contains(new RegExp(`^${facet}$`, 'i')).click()
+                })
+              }
+
+              // Uncheck
+              facetList.forEach((facet) => {
+                cy.wrap($label).contains(new RegExp(`^${facet}$`, 'i')).click()
+              })
+              cy.get('.el-card__body > .capitalize').should('not.exist')
+              cy.get('.no-facets').should('contain', 'No filters applied')
+              cy.url().should('not.contain', 'selectedFacetIds')
+
+              // Close all tags in order
+              facetList.forEach((facet) => {
+                cy.wrap($label).contains(new RegExp(`^${facet}$`, 'i')).click()
+              })
+              facetList.forEach((facet) => {
+                // Close all facet tags in filters applied box
+                cy.get('.el-card__body > .capitalize:visible').contains(new RegExp(facet, 'i')).within(() => {
+                  cy.get('.el-tag__close').click()
+                })
+              })
+              cy.get('.el-card__body > .capitalize').should('not.exist')
+              cy.get('.no-facets').should('contain', 'No filters applied')
+              cy.url().should('not.contain', 'selectedFacetIds')
+
+              // Reset all
+              facetList.forEach((facet) => {
+                cy.wrap($label).contains(new RegExp(`^${facet}$`, 'i')).click()
+              })
+              cy.get('.tags-container > .flex > .el-link > .el-link--inner').click()
+              cy.get('.el-card__body > .capitalize').should('not.exist')
+              cy.get('.no-facets').should('contain', 'No filters applied')
+              cy.url().should('not.contain', 'selectedFacetIds')
+
+              // Close the child facet tag and then click reset all
+              facetList.forEach((facet) => {
+                cy.wrap($label).contains(new RegExp(`^${facet}$`, 'i')).click()
+              })
+              cy.get('.el-card__body > .capitalize').then(($tag) => {
+                if ($tag.length > 1) {
+                  cy.get('.el-tag__close').last().click()
+                  cy.get('.tags-container > .flex > .el-link > .el-link--inner').click()
+                  cy.get('.el-card__body > .capitalize').should('not.exist')
+                  cy.get('.no-facets').should('contain', 'No filters applied')
+                  cy.url().should('not.contain', 'selectedFacetIds')
+                } else {
+                  facetList.forEach((facet) => {
+                    cy.wrap($label).contains(new RegExp(`^${facet}$`, 'i')).click()
+                  })
+                }
+              })
+            }
+          } else {
+            this.skip()
+          }
+        })
+      })
+    })
+  })
+})
\ No newline at end of file
diff --git a/test/cypress/e2e/homepage.cy.js b/test/cypress/e2e/homepage.cy.js
new file mode 100644
index 00000000..74a8f207
--- /dev/null
+++ b/test/cypress/e2e/homepage.cy.js
@@ -0,0 +1,133 @@
+describe('Homepage', { testIsolation: false }, function () {
+  before(function () {
+    cy.visit('')
+  })
+
+  it('Navigation Bar', function () {
+    // Check for navigation bar
+    cy.get('.mobile-navigation > :nth-child(1) > :nth-child(1) > a').should('contain', 'Data & Models').and('have.attr', 'href', '/data?type=dataset')
+    cy.get('.mobile-navigation > :nth-child(1) > :nth-child(2) > a').should('contain', 'Tools & Resources').and('have.attr', 'href', '/resources')
+    cy.get('.mobile-navigation > :nth-child(1) > :nth-child(3) > a').should('contain', 'Maps').and('have.attr', 'href', '/maps')
+    cy.get('.mobile-navigation > :nth-child(1) > :nth-child(4) > a').should('contain', 'News & Events').and('have.attr', 'href', '/news-and-events')
+    cy.get(':nth-child(1) > :nth-child(5) > a').should('contain', 'About').and('have.attr', 'href', '/about')
+    cy.get(':nth-child(1) > :nth-child(6) > a').should('contain', 'Submit to SPARC').and('have.attr', 'href', '/share-data')
+  })
+  it('Page hero', function () {
+    // Check for banner
+    cy.get('h1').should('contain', 'SPARC')
+    cy.get('[class="page-hero-img"]').should('exist')
+
+    // Check for button function
+    cy.get('.btn-link > .el-button').should('contain', 'Submit to SPARC')
+    cy.get('.btn-link > .el-button').click()
+    cy.url().should('contain', 'share-data')
+    cy.get('.mobile-navigation > :nth-child(1) > :nth-child(6) > a').should('have.class', 'active')
+    cy.go('back')
+  })
+  it('Featured data', function () {
+    // Check for content title
+    cy.get('.featured-data > h2').should('have.text', 'Find Data by Category')
+
+    cy.get('.data-wrap > a:visible').as('category')
+
+    cy.get('@category').first().click()
+    cy.url().should('contain', 'selectedFacetIds')
+    cy.visit('')
+
+    // Check for the number of categories
+    cy.get('@category').should('have.length', 6)
+
+    // Show more categories
+    cy.get('.featured-data > .el-button').should('have.text', '\n    View more\n  ')
+    cy.get('.featured-data > .el-button > span').click()
+
+    // Check for the number of categories after showing more
+    cy.get('@category').should('have.length.above', 6)
+
+    // Show less categories
+    cy.get('.featured-data > .el-button > span').should('have.text', '\n    View less\n  ')
+    cy.get('.featured-data > .el-button > span').click()
+
+    // Check for the number of categories after showing less
+    cy.get('@category').should('have.length', 6)
+  })
+  it('Portal features', function () {
+    // Check for the number of features
+    cy.get('.feature-container').should('have.length', 4)
+
+    // Check for feature card
+    cy.get(':nth-child(1) > .feature-container').within(() => {
+      cy.get('.icon').should('exist')
+      cy.get('.heading2').should('exist')
+      cy.get('.body1').should('exist')
+      cy.get('.button-link > .el-button > span').should('exist')
+    })
+
+    // Check for button function
+    cy.get(':nth-child(1) > .feature-container > .button-link > .el-button').click()
+    cy.url().should('contain', 'data?type=dataset')
+    cy.get('.mobile-navigation > :nth-child(1) > :nth-child(1) > a').should('have.class', 'active')
+    cy.go('back')
+  })
+  it('Projects and datasets', function () {
+    // Check for content title
+    cy.get(':nth-child(6) > .section-container > .heading2').should('contain', 'Resources & Datasets')
+
+    // Check for card description
+    cy.get('.row > :nth-child(1) > .mb-16').should('contain', 'you might be interested in:')
+    cy.get('.row > :nth-child(2) > .mb-16').should('have.text', 'Featured Datasets')
+
+    // Check for card content
+    cy.get(':nth-child(1) > .card-container > .el-row').within(() => {
+      cy.get('.el-col-6 > .image-container').should('exist')
+      cy.get('.el-col-18 > .dataset-name').should('exist')
+      cy.get('.el-col-18 > .dataset-description').should('exist')
+      cy.get('.el-col-18 > .button-link > .el-button').should('exist')
+    })
+
+    // Check for card 'view all' link
+    cy.get('.row > :nth-child(1) > .view-all-link').should('contain', 'View All')
+    cy.get(':nth-child(2) > .view-all-link').should('contain', 'View All Datasets')
+
+    // Check for button redirect to dataset
+    cy.get(':nth-child(2) > .card-container > .el-row > .el-col-18 > .dataset-name').then(($link)=>{
+      const title = $link.text().replace('\n', '').trim()
+      cy.get(':nth-child(2) > .card-container > .el-row > .el-col-18 > .button-link > .el-button').click()
+      cy.contains(title).should('exist')
+    })
+    cy.visit('')
+  })
+  it('Homepage news', function () {
+    // Check for content title
+    cy.get('.featured-datasets > .heading2').should('contain', 'News & Upcoming Events')
+
+    // Check for card image
+    cy.get('.sparc-card__image').should('exist')
+
+    // Check for card title
+    cy.get('h3 > a').should('exist')
+
+    // Check for card subtitle
+    cy.get('.markdown-text > p').should('exist')
+    cy.get(':nth-child(2) > .el-button').should('contain', 'Learn More')
+
+    // Check for card 'view all' link
+    cy.get('.sparc-card__content-wrap__content > .view-all-link').should('exist')
+  })
+  it('Stay connected', function () {
+    // Check for content title
+    cy.get('.subheader').should('have.text', 'Stay Connected')
+
+    // Check for content
+    cy.get('.newsletter-wrap > .heading2').should('have.text', 'Sign up for the SPARC Newsletter')
+    cy.get('.office-hours-column > .heading2').should('have.text', 'Open Office Hours')
+  })
+  it('Footer', function () {
+    cy.get('.footer__links > :nth-child(1) > :nth-child(1) > h3').should('have.text', 'Learn More')
+    cy.get(':nth-child(1) > :nth-child(2) > h3').should('have.text', 'Policies')
+    cy.get(':nth-child(2) > :nth-child(1) > h3').should('have.text', 'Help Us Improve')
+    cy.get(':nth-child(2) > :nth-child(2) > h3').should('have.text', 'Stay Up-to-Date')
+    cy.get('.footer__info--logo > .nuxt-link-exact-active > .logo').should('have.attr', 'src').and('contain', 'logo-sparc-wave-primary')
+    cy.get('.footer__info--blurb > p').should('contain', 'The NIH Common')
+  })
+})
diff --git a/test/cypress/e2e/mapviewer.cy.js b/test/cypress/e2e/mapviewer.cy.js
new file mode 100644
index 00000000..47adf11b
--- /dev/null
+++ b/test/cypress/e2e/mapviewer.cy.js
@@ -0,0 +1,175 @@
+// Human Female, Human Male, Rat, Mouse, Pig, Cat
+// const taxonModels = ['Rat']
+const taxonModels = ['Rat', 'Human Female']
+// x: The distance in pixels from the element's left
+// y: The distance in pixels from the element's top
+// central coordinate { 'x': 768, 'y': 373 }
+const coordinate = { 'x': 800, 'y': 333 }
+const pixelChange = 3
+
+const threeDSyncView = 'Human Male'
+
+const searchInput = 'heart'
+
+// const datasetIds = [150]
+const datasetIds = [150, 155]
+
+describe('Maps Viewer', { testIsolation: false }, function () {
+  before(function () {
+    cy.visit('/maps?type=ac')
+  })
+
+  taxonModels.forEach((model) => {
+
+    it(`Provenance card for ${model}`, function () {
+      cy.intercept('**/flatmap/**').as('flatmap')
+
+      // Loading mask should not exist after the new flatmap is loaded
+      cy.get('.multi-container > .el-loading-parent--relative > .el-loading-mask', { timeout: 30000 }).should('not.exist')
+
+      if (model !== 'Rat') {
+        // Switch to the second flatmap
+        cy.get('#flatmap-select').click()
+        cy.get('.el-select-dropdown__item').should('be.visible')
+        cy.get('.el-select-dropdown__item:visible').contains(new RegExp(model, 'i')).click({ force: true })
+      }
+
+      cy.wait('@flatmap', { timeout: 20000 })
+
+      // Loading mask should not exist after the new flatmap is loaded
+      cy.get('.multi-container > .el-loading-parent--relative > .el-loading-mask', { timeout: 30000 }).should('not.exist')
+
+      // Hide organs and outlines
+      cy.get('.settings-group > :nth-child(2):visible').click({ waitForAnimations: false })
+      cy.get('[role="radiogroup"] > .el-radio:visible').not('.is-checked').click({ multiple: true });
+      cy.get('.settings-group > :nth-child(2):visible').click({ waitForAnimations: false })
+
+      let coorX = coordinate.x
+      let coorY = coordinate.y
+      cy.get('[style="height: 100%;"] > [style="height: 100%; width: 100%; position: relative;"] > [style="height: 100%; width: 100%;"] > .maplibregl-touch-drag-pan > .maplibregl-canvas').as('canvas');
+      // Open a provenance card
+      const clickNeuron = () => {
+        cy.get('@canvas').click(coorX, coorY)
+
+        cy.wait(5000)
+
+        cy.get('body').then(($body) => {
+          if ($body.find('.maplibregl-popup-close-button').length > 0) {
+            cy.wrap($body).find('.maplibregl-popup-content > .tooltip-container > .el-main', { timeout: 30000 }).within(() => {
+
+              // Check for the popover provenance card content
+              cy.get('.title').should('exist')
+              cy.get('.subtitle').should('exist')
+              cy.get('.attribute-title').should('exist')
+              cy.get('.attribute-content').should('exist')
+            })
+            // Close the provenance card
+            cy.get('.maplibregl-popup-close-button').click({ force: true })
+          } else {
+            coorX -= pixelChange
+            clickNeuron()
+          }
+        })
+      }
+      clickNeuron()
+    })
+  })
+  it(`From 2D ${threeDSyncView}, open 3D map for synchronised view and Search within display`, function () {
+    cy.intercept('**/flatmap/**').as('flatmap')
+    cy.intercept('**/get_body_scaffold_info/**').as('get_body_scaffold_info')
+    cy.intercept('**/s3-resource/**').as('s3-resource')
+
+    // Loading mask should not exist after the default flatmap is loaded
+    cy.get('.multi-container > .el-loading-parent--relative > .el-loading-mask', { timeout: 30000 }).should('not.exist')
+
+    // Switch to the human related flatmap
+    cy.get('#flatmap-select').click()
+    cy.get('.el-select-dropdown__item').contains(new RegExp(threeDSyncView, 'i')).click({ force: true })
+
+    cy.wait('@flatmap', { timeout: 20000 })
+
+    // Loading mask should not exist after the new flatmap is loaded
+    cy.get('.multi-container > .el-loading-parent--relative > .el-loading-mask', { timeout: 30000 }).should('not.exist')
+
+    // Open the 3D view in a split viewer
+    cy.get('.settings-group > :nth-child(1):visible').contains(/Open new map/i).should('exist')
+    cy.get('.settings-group > :nth-child(1):visible').click()
+    cy.get('.open-map-popper:visible > :nth-child(4) > .el-button').contains(/Open Sync Map/i).should('exist')
+    cy.get('.open-map-popper:visible > :nth-child(4) > .el-button').click()
+
+    cy.wait(['@get_body_scaffold_info', '@s3-resource'], { timeout: 20000 })
+
+    // Check for the number of displayed viewers
+    cy.get('.toolbar > .toolbar-flex-container', { timeout: 30000 }).should('have.length', 2)
+
+    // Check for 3D view's content card detail
+    cy.get('.context-card > .card-left > .context-image', { timeout: 30000 }).should('exist')
+    cy.get('.context-card > .card-right', { timeout: 30000 }).within(() => {
+      cy.get('.title').contains(/3D human whole-body/i).should('exist')
+      cy.get(':nth-child(2) > p').contains(/Visualization/i).should('exist')
+      cy.get('.subtitle').contains(/Scaffold Views/i).should('exist')
+      cy.get('.view-image').should('exist')
+      cy.get('.view-description').contains(/Human whole-body/i).should('exist')
+    })
+
+    // Close the pathway sidebar
+    cy.get('[style="height: 100%;"] > [style="height: 100%; width: 100%; position: relative;"] > .pathway-location > .drawer-button > .el-icon-arrow-left').click()
+
+    // Search keyword in displayed viewers
+    cy.get('.el-autocomplete > .el-input > .el-input__inner').type(searchInput)
+    cy.get('.search-container > .map-icon > use').click()
+
+    // Check for keyword(highlighted part) in displayed viewers
+    cy.get('.maplibregl-popup-content').contains(new RegExp(searchInput, 'i')).should('exist')
+
+    cy.visit('/maps?type=ac')
+  })
+
+  datasetIds.forEach((datasetId) => {
+
+    it(`Context card in sidebar for scaffold dataset ${datasetId}`, function () {
+      cy.intercept('**/query?**').as('query')
+      cy.intercept('**/dataset_info/**').as('dataset_info')
+      cy.intercept('**/datasets/**').as('datasets')
+
+      // Open the sidebar
+      cy.get('.open-tab > .el-icon-arrow-left').click()
+
+      // Search dataset id
+      cy.get('.search-input > .el-input__inner').clear()
+      cy.get('.search-input > .el-input__inner').type(datasetId)
+      cy.get('.header > .el-button > span').click()
+
+      cy.wait('@query', { timeout: 20000 })
+
+      cy.get('.dataset-results-feedback').then(($result) => {
+        const noResult = $result.text() === '0 results | Showing'
+        if (noResult) {
+          // Error message should exist if no result
+          cy.get('.error-feedback').should('exist')
+          cy.get('.error-feedback').contains(/No results found/i).should('exist')
+        } else {
+          cy.wait(['@dataset_info', '@datasets'], { timeout: 20000 })
+
+          // Check for search result and the tag 'Scaffold'
+          cy.get('.dataset-card-container > .dataset-card', { timeout: 30000 }).contains(datasetId).should('exist')
+          cy.get('.dataset-card-container > .dataset-card').filter(`:contains(${datasetId})`).within(() => {
+            cy.get('.badges-container > .container', { timeout: 30000 }).contains(/Scaffold/i).should('exist')
+            cy.get('.badges-container > .container').contains(/Scaffold/i).click()
+          })
+
+          // Check for button text
+          cy.get('.dataset-card-container > .dataset-card', { timeout: 30000 }).contains(/View Scaffold/i).should('exist').click()
+
+          // Loading mask should not exist after the scaffold is loaded
+          cy.get('.multi-container > .el-loading-parent--relative > .el-loading-mask', { timeout: 30000 }).should('not.exist')
+
+          // Check for context card
+          cy.get('.context-card').should('be.visible')
+          cy.get('.context-image:visible').should('have.attr', 'src').and('contain', `https://assets.discover.pennsieve.io/dataset-assets/${datasetId}`)
+          cy.get('[style="margin-right: 8px;"] > .title:visible').should('have.class', 'title')
+        }
+      })
+    })
+  })
+})
\ No newline at end of file
diff --git a/test/cypress/e2e/userstories.cy.js b/test/cypress/e2e/userstories.cy.js
new file mode 100644
index 00000000..4b1e2f4b
--- /dev/null
+++ b/test/cypress/e2e/userstories.cy.js
@@ -0,0 +1,166 @@
+// To check the segmentation card
+// should use datasets which have segmentation data
+const segmentationDatasetIds = [226, 77]
+const scaffoldDatasetCategories = ['heart', 'stomach']
+const scaffoldUseFlowSearchInput = 'scaffold'
+const categories = ['stomach', 'lung']
+
+describe('User stories', function () {
+  describe('Should find segmentation in the gallery', { testIsolation: false }, function () {
+    before('Loading Datasets', function () {
+      cy.intercept('**/query?**').as('query');
+      cy.visit('');
+      cy.wait('@query', { timeout: 20000 });
+
+      // Navigate to 'Data&Models' page
+      cy.get('.mobile-navigation > :nth-child(1) > :nth-child(1) > a').click();
+    })
+
+    segmentationDatasetIds.forEach((id) => {
+      it(`Access dataset ${id}`, function () {
+        // Search for segmentation related dataset
+        cy.get('.el-input__inner').clear();
+        cy.get('.search-text').click();
+        cy.get('.el-table__row', { timeout: 30000 }).should('have.length', 10)
+
+        cy.get('.el-input__inner').type(id);
+        cy.get('.search-text').click();
+
+        cy.get('.el-table__row', { timeout: 30000 }).should('have.length', 1).first().as('dataset');
+
+        // Enter the dataset
+        cy.get('@dataset').find('.cell > :nth-child(1) > a').last().click();
+
+        // Enter the 'Gallery' tab
+        cy.get(':nth-child(5) > .style1', { timeout: 30000 }).click();
+        cy.get('.gallery-container > .description-info > p > strong', { timeout: 30000 }).should('have.text', 'Data collection:');
+
+        // Check for segmentation
+        cy.findGalleryCard('Segmentation', 'prev');
+        cy.get('.el-card > .el-card__body > :nth-child(1) > .details > :nth-child(1) > b').should('contain', 'Segmentation');
+        cy.get('.el-card > .el-card__body > :nth-child(1) > .details > .el-button > span').should('contain', ' View Segmentation');
+
+        cy.goBackToBrowser('dataset');
+      })
+    })
+  })
+  describe('Should open scaffold through the gallery', { testIsolation: false }, function () {
+    before('Loading Anatomical Models', function () {
+      cy.intercept('**/query?**').as('query');
+      cy.visit('');
+      cy.wait('@query', { timeout: 20000 });
+
+      // Navigate to 'Data&Models' page
+      cy.get('.mobile-navigation > :nth-child(1) > :nth-child(1) > a').click();
+
+      // Go to 'Anatomical Models'
+      cy.get(':nth-child(2) > .search-tabs__button').click();
+      cy.get(':nth-child(2) > .search-tabs__button').should('have.class', 'active');
+    })
+
+    scaffoldDatasetCategories.forEach((category) => {
+      it(`Access scaffold ${category}`, function () {
+        // Search for scaffold related dataset
+        cy.get('.el-input__inner').clear();
+        cy.get('.search-text').click();
+        cy.get('.el-table__row', { timeout: 30000 }).should('have.length', 10)
+
+        cy.get('.el-input__inner').type(category);
+        cy.get('.search-text').click();
+
+        cy.get('.el-table__row', { timeout: 30000 }).first().as('dataset');
+
+        // Enter the dataset
+        cy.get('@dataset').find('.cell > :nth-child(1) > a', { timeout: 30000 }).last().click();
+
+        // Enter the 'Gallery' tab
+        cy.get(':nth-child(5) > .style1', { timeout: 30000 }).click();
+        cy.get('.gallery-container > .description-info > p > strong', { timeout: 30000 }).should('have.text', 'Data collection:');
+
+        // Check for scaffold
+        cy.findGalleryCard('Scaffold', 'prev');
+        cy.get('.el-card > .el-card__body > :nth-child(1) > .details > :nth-child(1) > b').contains('Scaffold').should('exist');
+        cy.get('.el-card > .el-card__body > :nth-child(1) > .details > .el-button > span').contains('View Scaffold').should('exist').as('scaffold');
+
+        // cy.get('@scaffold').first().click()
+        // Alternative solution
+        cy.url().then(($url) => {
+          const datasetId = $url.substring($url.lastIndexOf("/") + 1, $url.indexOf("?"));
+          cy.get('.dataset-information-box > :nth-child(1)').then(($version) => {
+            cy.intercept('**/query?**').as('query');
+            cy.intercept('**/dataset_info/**').as('dataset_info');
+            cy.intercept('**/datasets/**').as('datasets');
+
+            const version = $version.text().match(/[0-9]+/);
+            cy.visit(`/maps?type=scaffold&dataset_id=${datasetId}&dataset_version=${version}`);
+
+            cy.wait('@query', { timeout: 20000 });
+
+            // Search dataset id
+            cy.get('.search-input > .el-input__inner').clear();
+            cy.get('.search-input > .el-input__inner').type(datasetId);
+            cy.get('.header > .el-button').click();
+
+            cy.wait(['@dataset_info', '@datasets'], { timeout: 20000 });
+
+            // Check for search result and the tag 'Scaffold'
+            cy.get('.dataset-card-container > .dataset-card:visible', { timeout: 30000 }).as('datasetCards');
+
+            cy.get('@datasetCards').filter(`:contains(${datasetId})`).within(() => {
+              cy.get('.badges-container > .container', { timeout: 30000 }).contains(/Scaffold/i).click();
+            });
+
+            cy.get('@datasetCards').contains(/View Scaffold/i).click();
+
+            // Loading mask should not exist after the scaffold is loaded
+            cy.get('.multi-container > .el-loading-parent--relative > .el-loading-mask', { timeout: 30000 }).should('not.exist');
+
+            // Check for context card
+            cy.get('.context-card').should('be.visible');
+            cy.get('.context-image').should('have.attr', 'src').and('contain', datasetId);
+            cy.get('[style="margin-right: 8px;"] > .title').should('have.class', 'title');
+
+            cy.get('.open-tab > .el-icon-arrow-left').click();
+
+            cy.get('@datasetCards').contains(/All/i).click();
+
+            // cy.get('@datasetCards').contains(/View Dataset/i).click();
+            // Alternative solution
+            cy.visit(`/datasets/${datasetId}?type=dataset`);
+          })
+        })
+        cy.goBackToBrowser('model');
+      })
+    })
+  })
+  describe('Should find data by category', { testIsolation: false }, function () {
+    before('Visit homepage', function () {
+      cy.visit('');
+    })
+    categories.forEach((category) => {
+      it(`Filter datasets by ${category}`, function () {
+        cy.intercept('**/query?**').as('query');
+
+        // Expand all cateories
+        cy.get('.featured-data > .el-button > span').click();
+        cy.get('.data-wrap').should('be.visible');
+
+        // Check for category exist
+        const regex = new RegExp(category, 'i')
+        cy.get('.data-wrap > a > p').contains(regex).as('facetsCategory');
+        cy.get('@facetsCategory').should('be.visible');
+        cy.get('@facetsCategory').click();
+
+        cy.wait('@query', { timeout: 20000 });
+        cy.get('.cell > :nth-child(1) > .property-table > :nth-child(1) > :nth-child(2)', { timeout: 30000 }).first().contains(regex).should('exist');
+
+        // Check for detail page
+        cy.get('.el-table__row', { timeout: 30000 }).first().as('dataset');
+        cy.get('@dataset').find('.cell > :nth-child(1) > a').last().click();
+        cy.contains(regex).should('have.length.above', 0);
+        cy.goBackToBrowser('dataset');
+        cy.go('back');
+      })
+    })
+  })
+})
\ No newline at end of file
diff --git a/test/cypress/fixtures/example.json b/test/cypress/fixtures/example.json
new file mode 100644
index 00000000..02e42543
--- /dev/null
+++ b/test/cypress/fixtures/example.json
@@ -0,0 +1,5 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "hello@cypress.io",
+  "body": "Fixtures are a great way to mock data for responses to routes"
+}
diff --git a/test/cypress/support/commands.js b/test/cypress/support/commands.js
new file mode 100644
index 00000000..284fbaa8
--- /dev/null
+++ b/test/cypress/support/commands.js
@@ -0,0 +1,88 @@
+/// <reference types="cypress" />
+// ***********************************************
+// This example commands.ts shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add('login', (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This will overwrite an existing command --
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+//
+// declare global {
+//   namespace Cypress {
+//     interface Chainable {
+//       login(email: string, password: string): Chainable<void>
+//       drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
+//       dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
+//       visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
+//     }
+//   }
+// }
+Cypress.on('uncaught:exception', (err, runnable) => {
+  // returning false here prevents Cypress from
+  // failing the test
+  if (err.message.includes('Avoided redundant navigation to current location'))
+    return false
+  if (err.message.includes('Maximum iterations reached.'))
+    return false
+  if (err.message.includes('ResizeObserver loop limit exceeded'))
+    return false
+  if (err.message.includes('config is not defined'))
+    return false
+  // // For legacy dataset
+  // if (err.message.includes('ObjectID does not exist'))
+  //   return false
+  return true
+})
+
+Cypress.Commands.add('findGalleryCard', (text, dir) => {
+  let direction = '.btn-next'
+  const clickNextPageButton = () => {
+    cy.get('.el-card > .el-card__body').then(($card) => {
+      if (!$card.text().includes(text)) {
+        cy.get(direction).then(($button) => {
+          if ($button.is(":disabled")) {
+            return
+          } else {
+            cy.wrap($button).click()
+            clickNextPageButton()
+          }
+        })
+      }
+    })
+  }
+  if (dir === 'prev') {
+    cy.get('.el-pager > .number').last().click()
+    direction = '.btn-prev'
+  }
+  clickNextPageButton()
+})
+
+Cypress.Commands.add('goBackToBrowser', (category) => {
+  const goBack = () => {
+    cy.url().then(($url) => {
+      if (!$url.includes(`data?type=${category}`)) {
+        cy.go('back')
+        goBack()
+      }
+    })
+  }
+  goBack()
+})
\ No newline at end of file
diff --git a/test/cypress/support/e2e.js b/test/cypress/support/e2e.js
new file mode 100644
index 00000000..f80f74f8
--- /dev/null
+++ b/test/cypress/support/e2e.js
@@ -0,0 +1,20 @@
+// ***********************************************************
+// This example support/e2e.ts is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands'
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')
\ No newline at end of file
diff --git a/utils/awsExports.js b/utils/awsExports.js
index 261b1ba9..966f55bb 100644
--- a/utils/awsExports.js
+++ b/utils/awsExports.js
@@ -6,7 +6,7 @@ const awsConfig = {
     authenticationFlowType: process.env.AWS_USER_AUTHENTICATION_FLOW_TYPE,
     oauth: {
       domain: process.env.AWS_OAUTH_DOMAIN,
-      scope: process.env.AWS_OAUTH_SCOPE,
+      scope: [`${process.env.AWS_OAUTH_SCOPE}`],
       redirectSignIn: process.env.AWS_OAUTH_REDIRECT_SIGN_IN_URL,
       redirectSignOut: process.env.AWS_OAUTH_REDIRECT_SIGN_OUT_URL,
       responseType: process.env.AWS_OAUTH_RESPONSE_TYPE
diff --git a/utils/common.js b/utils/common.js
index 6e7f7ecf..b2f75872 100644
--- a/utils/common.js
+++ b/utils/common.js
@@ -60,3 +60,25 @@ export const extractSection = (section_regex, html_in) => {
   })
   return html_section
 }
+
+export const extractS3BucketName = uri => {
+  if (uri) {
+    const substring = uri.split("//")[1]
+    if (substring) {
+      return substring.split("/")[0]
+    }
+  }
+  return undefined
+}
+
+export const getPreviousMonth = () => {
+  const currentDate = new Date()
+  const currentMonth = currentDate.getMonth() + 1
+  const previousMonth = (currentMonth === 1) ? 12 : currentMonth - 1
+  const previousYear = (currentMonth === 1) ? currentDate.getFullYear() - 1 : currentDate.getFullYear()
+
+  return {
+    year: previousYear,
+    month: previousMonth
+  }
+}
diff --git a/utils/homepageFields.js b/utils/homepageFields.js
index d83de30d..9ecc4fee 100644
--- a/utils/homepageFields.js
+++ b/utils/homepageFields.js
@@ -9,9 +9,12 @@ export default (fields = {}) => {
     heroCopy: fields.heroCopy || '',
     heroImage: fields.heroImage || {},
     featuredData: fields.featuredData || [],
+    newsAndEvents: fields.newsAndEvents || [],
     portalFeatures: fields.portalFeatures || [],
     featuredProject: fields.featuredProject || {},
-    featuredDatasetId: fields.featuredDatasetId || '',
-    title: fields.title || ''
+    datasetSectionTitle: fields.datasetSectionTitle || 'Here is a dataset you might be interested in: ',
+    title: fields.title || '',
+    heroButtonLink: fields.heroButtonLink,
+    heroButtonLabel: fields.heroButtonLabel
   }
 }
diff --git a/yarn.lock b/yarn.lock
index 7caace93..9474180c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11,28 +11,37 @@
     orbit-camera-controller "^4.0.0"
     turntable-camera-controller "^3.0.0"
 
-"@abi-software/flatmap-viewer@^2.2.9":
-  version "2.2.9"
-  resolved "https://registry.yarnpkg.com/@abi-software/flatmap-viewer/-/flatmap-viewer-2.2.9.tgz#b3f50f4e23944d19b4babf8a56030b12c5f2470b"
-  integrity sha512-UN7R84Xn2TeK9Fo/IEFSEKuauRroO5KMYKDUu4wfZQw0qzSC79OdJmHBOeIH4pkS+J4FRZfq+prS7cxiCNCyRw==
+"@aashutoshrathi/word-wrap@^1.2.3":
+  version "1.2.6"
+  resolved "https://registry.yarnpkg.com/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz#bd9154aec9983f77b3a034ecaa015c2e4201f6cf"
+  integrity sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==
+
+"@abi-software/flatmap-viewer@^2.4.3":
+  version "2.4.4"
+  resolved "https://registry.yarnpkg.com/@abi-software/flatmap-viewer/-/flatmap-viewer-2.4.4.tgz#32097b1a14d8f2419e448f8c29f2a764bc979f0f"
+  integrity sha512-ASvkfrxMU3LPohdwIkGZsQaBNYY9/B62WOQJ/rvKNEthnMI2sTTfRbsR3w0FEG6/eMmyke1WaIYh8lUgyQImTA==
   dependencies:
     "@babel/runtime" "^7.10.4"
-    "@turf/area" "^6.0.1"
-    "@turf/bbox" "^6.0.1"
-    "@turf/helpers" "^6.1.4"
+    "@fortawesome/fontawesome-free" "^6.4.0"
+    "@turf/area" "^6.5.0"
+    "@turf/bbox" "^6.5.0"
+    "@turf/helpers" "^6.5.0"
     "@turf/projection" "^6.5.0"
     bezier-js "^6.1.0"
-    maplibre-gl ">=1.15.3"
+    html-es6cape "^2.0.2"
+    maplibre-gl ">=3.6.0"
+    mathjax-full "^3.2.2"
     minisearch "^2.2.1"
     polylabel "^1.1.0"
 
-"@abi-software/flatmapvuer@0.3.10", "@abi-software/flatmapvuer@^0.3.10":
-  version "0.3.10"
-  resolved "https://registry.yarnpkg.com/@abi-software/flatmapvuer/-/flatmapvuer-0.3.10.tgz#c9e88ebb7cc83bcc4c8aec6cf47888e752a5a552"
-  integrity sha512-sFXYvFFW7H8Wx+TGIKBoyIaT62ad7Ps6G9tewDgb5YTnfOY0F+ZklHEAcLYouWMswt+67zOzg/4LLqZqbyloMg==
+"@abi-software/flatmapvuer@^0.5.10":
+  version "0.5.10"
+  resolved "https://registry.yarnpkg.com/@abi-software/flatmapvuer/-/flatmapvuer-0.5.10.tgz#e55628163227afd7fbe816b1f412901ce4425381"
+  integrity sha512-yZP0YFQgk+pxDkhk68fklomymI9lJCpJTUGuZr2SqUKliihUt0dXBM1jnjXKHt5qnCcml7NqXHAHJMSny5KqAQ==
   dependencies:
-    "@abi-software/flatmap-viewer" "^2.2.9"
-    "@abi-software/svg-sprite" "^0.1.14"
+    "@abi-software/flatmap-viewer" "^2.4.3"
+    "@abi-software/sparc-annotation" "0.0.5"
+    "@abi-software/svg-sprite" "^0.3.0"
     core-js "^3.3.2"
     css-element-queries "^1.2.2"
     current-script-polyfill "^1.0.0"
@@ -41,10 +50,26 @@
     lodash "^4.17.21"
     vue "^2.6.10"
 
-"@abi-software/gallery@0.3.1", "@abi-software/gallery@^0.3.1":
-  version "0.3.1"
-  resolved "https://registry.yarnpkg.com/@abi-software/gallery/-/gallery-0.3.1.tgz#cb8317e4271e95254c6e3242be824fd3ec4b9ad4"
-  integrity sha512-ED5ppMiXfHbobM073SnDiUhomviLH+dSQ6jgk6b9ULBkdTmF6r0cE6WbPHYJHdNgZVJDbYokBieO/URrff8QhQ==
+"@abi-software/flatmapvuer@^0.5.9":
+  version "0.5.9"
+  resolved "https://registry.yarnpkg.com/@abi-software/flatmapvuer/-/flatmapvuer-0.5.9.tgz#df64037c9f5b7a3d99bf44aabcf40654b7bbf703"
+  integrity sha512-0T2B2n3rg/BRyNBP7xmjPeq55XxoUGRTyc7nxpsOCR47SLK0QnGKykY7THbYIJIr9Rv6RBc8Abg6feNxnbfDfA==
+  dependencies:
+    "@abi-software/flatmap-viewer" "^2.4.3"
+    "@abi-software/sparc-annotation" "0.0.5"
+    "@abi-software/svg-sprite" "^0.3.0"
+    core-js "^3.3.2"
+    css-element-queries "^1.2.2"
+    current-script-polyfill "^1.0.0"
+    element-ui "^2.13.0"
+    file-loader "^5.0.2"
+    lodash "^4.17.21"
+    vue "^2.6.10"
+
+"@abi-software/gallery@0.3.2":
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/@abi-software/gallery/-/gallery-0.3.2.tgz#538ac360ab89692528d72a02cb5532e67b6f99d6"
+  integrity sha512-YvLlBQVQY7mKyytfsYKX838ulpzlHo8THYEiDwBOT4xSdBVzl+t1cNvFC4Fip+QcXw96LLDJLKCiZXtU+7JDTw==
   dependencies:
     "@babel/code-frame" "^7.12.11"
     axios "^0.26.1"
@@ -54,32 +79,46 @@
     element-ui "^2.15.0"
     vue "^2.6.11"
 
-"@abi-software/map-side-bar@^1.3.32":
-  version "1.3.32"
-  resolved "https://registry.yarnpkg.com/@abi-software/map-side-bar/-/map-side-bar-1.3.32.tgz#480698a2771bac1f21bd4f656b5a8be8632d5f2e"
-  integrity sha512-65xEbUMAEGT9daO9UvGliikWlDAUvRW4HEbXyeTzvOxl1sKqr1OGYIXLXPtpCyG8J1hUP/ebiLeS0IWkp6J7AA==
+"@abi-software/gallery@^0.4.1-beta.1":
+  version "0.4.1-beta.1"
+  resolved "https://registry.yarnpkg.com/@abi-software/gallery/-/gallery-0.4.1-beta.1.tgz#a89cddcaec3b3001495894b36f4aea42a2a5aaf3"
+  integrity sha512-V704g2p8wW0qp48PTJge1xxJ9MSeDBXknP+Eonl7GiyANOxqFEfzWu94EPNRD1A1jAdN8fLuC3W/N5u8KGiwxA==
   dependencies:
-    "@abi-software/gallery" "^0.3.1"
-    "@abi-software/svg-sprite" "^0.1.14"
+    "@babel/code-frame" "^7.12.11"
+    axios "^0.26.1"
+    babel-plugin-component "^1.1.1"
+    base64-inline-loader "^2.0.1"
+    core-js "^3.8.3"
+    element-ui "^2.15.0"
+    vue "^2.6.11"
+
+"@abi-software/map-side-bar@^1.6.0":
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/@abi-software/map-side-bar/-/map-side-bar-1.6.0.tgz#e3ea3be4bde3b89d219370807466fd2077c541a2"
+  integrity sha512-+QBtFy1b3gDfHsKmdBziS8RbcspPE+JKguRCTpV2+KHt8D5JQmiT8tD671ts9kRjSmdBgH67CN7uLvAxrAullg==
+  dependencies:
+    "@abi-software/gallery" "^0.4.1-beta.1"
+    "@abi-software/svg-sprite" "^0.2.0"
     algoliasearch "^4.10.5"
     element-ui "^2.13.0"
     marked "^4.1.1"
     vue "^2.6.10"
     xss "^1.0.14"
 
-"@abi-software/mapintegratedvuer@0.3.9-fixes-2":
-  version "0.3.9-fixes-2"
-  resolved "https://registry.yarnpkg.com/@abi-software/mapintegratedvuer/-/mapintegratedvuer-0.3.9-fixes-2.tgz#33b612b0f7dd8418c0d3a519a781ab8125842d35"
-  integrity sha512-btWX8vsshmJXea79kdvecBFY3To6BqmjIHTVJYAAfH57tSHQEe9Tn/kdbyAwMTStY4cqliaMP+1SsoaPxxEcjw==
+"@abi-software/mapintegratedvuer@0.6.7":
+  version "0.6.7"
+  resolved "https://registry.yarnpkg.com/@abi-software/mapintegratedvuer/-/mapintegratedvuer-0.6.7.tgz#62264e55b626c48b2cb4f531b687d73202a5b323"
+  integrity sha512-iVc+UMf6pFyz5pVfShBg90MRe/e6xwFR3QAYJzshGFVDCF0Rhz1rK+XLsc59KprAE8RGvJvj1Mx/1xCGRC+9tA==
   dependencies:
-    "@abi-software/flatmapvuer" "^0.3.10"
-    "@abi-software/map-side-bar" "^1.3.32"
+    "@abi-software/flatmapvuer" "^0.5.10"
+    "@abi-software/map-side-bar" "^1.6.0"
     "@abi-software/plotvuer" "^0.3.9"
-    "@abi-software/scaffoldvuer" "^0.1.56"
-    "@abi-software/simulationvuer" "^0.5.9"
-    "@abi-software/svg-sprite" "^0.1.15"
+    "@abi-software/scaffoldvuer" "^0.3.2"
+    "@abi-software/simulationvuer" "^0.6.5"
+    "@abi-software/svg-sprite" "^0.3.2"
     "@soda/get-current-script" "^1.0.2"
     core-js "^3.3.2"
+    css-element-queries "^1.2.3"
     d3-time-format "^3.0.0"
     element-ui "^2.13.0"
     es6-promise "^4.2.8"
@@ -96,10 +135,10 @@
     vuex "^3.5.1"
     webpack-node-externals "^2.5.2"
 
-"@abi-software/plotvuer@^0.2.45":
-  version "0.2.45"
-  resolved "https://registry.yarnpkg.com/@abi-software/plotvuer/-/plotvuer-0.2.45.tgz#a1489815ffaf50432d67ce0d12767ce668b1e8be"
-  integrity sha512-cOTrJZpkiNmY2z5jNFebd1Euaq67t/nYv3pK1PWZMz/fG4eQyo/H8fM6nEPNBJTrEqN/Ans+VQeD21o+2YnsZA==
+"@abi-software/plotvuer@^0.2.46":
+  version "0.2.46"
+  resolved "https://registry.yarnpkg.com/@abi-software/plotvuer/-/plotvuer-0.2.46.tgz#396822823b34dbc7de4e058535224cb15b13f8cd"
+  integrity sha512-Xqlb9lHwDw4YdiotlvBQmYSNd1LLK7ZwkcZZcqSa0ft+z8j4fomrUSIVPpmjWCbxxWT2GLhSWgMtDvcLhE3tvw==
   dependencies:
     "@abi-software/svg-sprite" "^0.1.14"
     core-js "^3.7.0"
@@ -146,54 +185,46 @@
     vue-draggable-resizable "^2.2.0"
     vue-router "^3.2.0"
 
-"@abi-software/scaffoldvuer@0.1.55":
-  version "0.1.55"
-  resolved "https://registry.yarnpkg.com/@abi-software/scaffoldvuer/-/scaffoldvuer-0.1.55.tgz#9799abb2b6640815c709b9322ca9c5d5ebc8e46f"
-  integrity sha512-Dr+LLR5KCM0h9eq0E6dXOoYGfLf4f8pBefpR5MD71VHJdBA6xsXdsh3g8qy71efgAuSehryW9x+shDdriZAlFw==
-  dependencies:
-    "@abi-software/svg-sprite" "^0.1.15"
-    axios "^0.21.2"
-    core-js "^3.22.5"
-    current-script-polyfill "^1.0.0"
-    element-ui "^2.13.0"
-    google-spreadsheet "^3.1.15"
-    lodash "^4.17.21"
-    query-string "^6.11.1"
-    vue "^2.6.10"
-    vue-custom-element "^3.3.0"
-    vue-drag-resize "^1.3.2"
-    vue-router "^3.5.1"
-    zincjs "^1.0.9"
-
-"@abi-software/scaffoldvuer@^0.1.56":
-  version "0.1.56"
-  resolved "https://registry.yarnpkg.com/@abi-software/scaffoldvuer/-/scaffoldvuer-0.1.56.tgz#69a34d03e790f7b6e3674623b5a809344f4a3c95"
-  integrity sha512-OGcYJ2mhq/lxy6bKU8JuU58yThSDVwpi2PR34KOBNCc8kTVWOyJ/XsvfKgfpy/1kTMmDF1L80i7SJE3ryEFd9g==
+"@abi-software/scaffoldvuer@^0.3.2":
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/@abi-software/scaffoldvuer/-/scaffoldvuer-0.3.2.tgz#986bdf71307c91900067e1c39f7aef2e69d0287a"
+  integrity sha512-/R3Aipn77s91ZpctXL5Z6JjyWezH/UG2C7BdBK8/KdRr/I50Ur0SfRoS/FdcJEWfjT4mSa6eyL8DB0vEV94PuQ==
   dependencies:
-    "@abi-software/svg-sprite" "^0.1.15"
+    "@abi-software/flatmapvuer" "^0.5.9"
+    "@abi-software/svg-sprite" "^0.3.0"
     axios "^0.21.2"
     core-js "^3.22.5"
     current-script-polyfill "^1.0.0"
     element-ui "^2.13.0"
     google-spreadsheet "^3.1.15"
     lodash "^4.17.21"
+    minisearch "^6.0.1"
     query-string "^6.11.1"
     vue "^2.6.10"
     vue-custom-element "^3.3.0"
     vue-drag-resize "^1.3.2"
     vue-router "^3.5.1"
-    zincjs "^1.0.9"
+    zincjs "^1.3.0"
 
-"@abi-software/simulationvuer@0.5.9", "@abi-software/simulationvuer@^0.5.9":
-  version "0.5.9"
-  resolved "https://registry.yarnpkg.com/@abi-software/simulationvuer/-/simulationvuer-0.5.9.tgz#73c8a85c8a3f5dadfa3aa40c6ef1a58203554b06"
-  integrity sha512-2xWBj0BVBbPP1C2q4DKgSLMhmyBwLLhExgQ66zsWq1QPqYIVQjCHhYQ8FM1OnoBgT3hUl8hVjboS0N/Jcq6OkA==
+"@abi-software/simulationvuer@0.6.5", "@abi-software/simulationvuer@^0.6.5":
+  version "0.6.5"
+  resolved "https://registry.yarnpkg.com/@abi-software/simulationvuer/-/simulationvuer-0.6.5.tgz#333cb3e0229004353617643978010978a5c796a2"
+  integrity sha512-290WgxPCK+uh81uTAr2vRd20yT3tY0j5aozRno01ZoKddDD/XRPdIHoooxdDJz99jR+P8G4nAZPkIiBzfZc1Yg==
   dependencies:
-    "@abi-software/plotvuer" "^0.2.45"
+    "@abi-software/plotvuer" "^0.2.46"
     element-ui "^2.14.1"
     jsonschema "^1.4.0"
     vue "^2.6.11"
 
+"@abi-software/sparc-annotation@0.0.5":
+  version "0.0.5"
+  resolved "https://registry.yarnpkg.com/@abi-software/sparc-annotation/-/sparc-annotation-0.0.5.tgz#8138f01b260dfb2fc91e4f25adbcbe8ae5256f8d"
+  integrity sha512-VSaH4LvTqkg+rTuP0nyIQoNAvLL3235zhNepMsNV61dE+1tl+6/iYU4j5Nqft40Q82JY/WUIEs1jaxFep0gB8Q==
+  dependencies:
+    "@types/js-cookie" "^3.0.6"
+    js-cookie "^3.0.5"
+    rdflib "^2.2.32"
+
 "@abi-software/svg-sprite@^0.1.11":
   version "0.1.13"
   resolved "https://registry.yarnpkg.com/@abi-software/svg-sprite/-/svg-sprite-0.1.13.tgz#ab2f76b70f8a6f9d01535dab383662986762eb54"
@@ -221,6 +252,33 @@
     svg-inline-loader "^0.8.2"
     vue "^2.6.11"
 
+"@abi-software/svg-sprite@^0.2.0":
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/@abi-software/svg-sprite/-/svg-sprite-0.2.0.tgz#c7437405709bf67a0c766c97317a0672037bc750"
+  integrity sha512-vK/D4Wd9ntg/b7B5o2FPK2CtFrqNuuNHBOCWbZlvtrVvk90WH9JgJWx1+UPPzzTmrKRCvwE24osF/nQef206vg==
+  dependencies:
+    core-js "^3.6.5"
+    svg-inline-loader "^0.8.2"
+    vue "^2.6.11"
+
+"@abi-software/svg-sprite@^0.3.0":
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/@abi-software/svg-sprite/-/svg-sprite-0.3.0.tgz#75b452c3722aabaf6d9c7f2b71a063815ea6946d"
+  integrity sha512-BU04RCF9iP2ncRQTHeXGX/bO41eDeybaiUcadIeuU2I0npSkun5rQdLroocH4FgMaygi2jOl+YObmg5tNdU8SA==
+  dependencies:
+    core-js "^3.6.5"
+    svg-inline-loader "^0.8.2"
+    vue "^2.6.11"
+
+"@abi-software/svg-sprite@^0.3.2":
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/@abi-software/svg-sprite/-/svg-sprite-0.3.2.tgz#1e51d59512b377881d09fc6eef65cd5a6ab28597"
+  integrity sha512-vNkMiwk2wzo0jXQ5nMyoQ1tIolMw7yNNAbmcBRnCOvIBKmmdJOC3V4TdcOd+qRMWnMW0jJlSfp3wIh9WGXHmvg==
+  dependencies:
+    core-js "^3.6.5"
+    svg-inline-loader "^0.8.2"
+    vue "^2.6.11"
+
 "@algolia/cache-browser-local-storage@4.12.1":
   version "4.12.1"
   resolved "https://registry.yarnpkg.com/@algolia/cache-browser-local-storage/-/cache-browser-local-storage-4.12.1.tgz#23f4f219963b96918d0524acd09d4d646541d888"
@@ -1976,6 +2034,13 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
+"@babel/runtime@^7.21.0":
+  version "7.23.5"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.5.tgz#11edb98f8aeec529b82b211028177679144242db"
+  integrity sha512-NdUTHcPe4C99WxPub+K9l9tK5/lV4UXIoaHSYgzco9BCyjKAAwzdBI+wWtYqHt7LJdbo74ZjRPJgzVweq1sz0w==
+  dependencies:
+    regenerator-runtime "^0.14.0"
+
 "@babel/template@^7.10.4", "@babel/template@^7.14.5":
   version "7.14.5"
   resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.14.5.tgz#a9bc9d8b33354ff6e55a9c60d1109200a68974f4"
@@ -2083,11 +2148,123 @@
     exec-sh "^0.3.2"
     minimist "^1.2.0"
 
+"@colors/colors@1.5.0":
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/@colors/colors/-/colors-1.5.0.tgz#bb504579c1cae923e6576a4f5da43d25f97bdbd9"
+  integrity sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==
+
 "@csstools/convert-colors@^1.4.0":
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/@csstools/convert-colors/-/convert-colors-1.4.0.tgz#ad495dc41b12e75d588c6db8b9834f08fa131eb7"
   integrity sha512-5a6wqoJV/xEdbRNKVo6I4hO3VjyDq//8q2f9I6PBAvMesJHFauXDorcNCsr9RzvsZnaWi5NYCcfyqP1QeFHFbw==
 
+"@cypress/request@2.88.12":
+  version "2.88.12"
+  resolved "https://registry.yarnpkg.com/@cypress/request/-/request-2.88.12.tgz#ba4911431738494a85e93fb04498cb38bc55d590"
+  integrity sha512-tOn+0mDZxASFM+cuAP9szGUGPI1HwWVSvdzm7V4cCsPdFTx6qMj29CwaQmRAMIEhORIUBFBsYROYJcveK4uOjA==
+  dependencies:
+    aws-sign2 "~0.7.0"
+    aws4 "^1.8.0"
+    caseless "~0.12.0"
+    combined-stream "~1.0.6"
+    extend "~3.0.2"
+    forever-agent "~0.6.1"
+    form-data "~2.3.2"
+    http-signature "~1.3.6"
+    is-typedarray "~1.0.0"
+    isstream "~0.1.2"
+    json-stringify-safe "~5.0.1"
+    mime-types "~2.1.19"
+    performance-now "^2.1.0"
+    qs "~6.10.3"
+    safe-buffer "^5.1.2"
+    tough-cookie "^4.1.3"
+    tunnel-agent "^0.6.0"
+    uuid "^8.3.2"
+
+"@cypress/xvfb@^1.2.4":
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/@cypress/xvfb/-/xvfb-1.2.4.tgz#2daf42e8275b39f4aa53c14214e557bd14e7748a"
+  integrity sha512-skbBzPggOVYCbnGgV+0dmBdW/s77ZkAOXIC1knS8NagwDjBrNC1LuXtQJeiN6l+m7lzmHtaoUw/ctJKdqkG57Q==
+  dependencies:
+    debug "^3.1.0"
+    lodash.once "^4.1.1"
+
+"@digitalbazaar/http-client@^3.4.1":
+  version "3.4.1"
+  resolved "https://registry.yarnpkg.com/@digitalbazaar/http-client/-/http-client-3.4.1.tgz#5116fc44290d647cfe4b615d1f3fad9d6005e44d"
+  integrity sha512-Ahk1N+s7urkgj7WvvUND5f8GiWEPfUw0D41hdElaqLgu8wZScI8gdI0q+qWw5N1d35x7GCRH2uk9mi+Uzo9M3g==
+  dependencies:
+    ky "^0.33.3"
+    ky-universal "^0.11.0"
+    undici "^5.21.2"
+
+"@eslint-community/eslint-utils@^4.2.0":
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/@eslint-community/eslint-utils/-/eslint-utils-4.4.0.tgz#a23514e8fb9af1269d5f7788aa556798d61c6b59"
+  integrity sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==
+  dependencies:
+    eslint-visitor-keys "^3.3.0"
+
+"@eslint-community/regexpp@^4.6.1":
+  version "4.10.0"
+  resolved "https://registry.yarnpkg.com/@eslint-community/regexpp/-/regexpp-4.10.0.tgz#548f6de556857c8bb73bbee70c35dc82a2e74d63"
+  integrity sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA==
+
+"@eslint/eslintrc@^2.1.4":
+  version "2.1.4"
+  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-2.1.4.tgz#388a269f0f25c1b6adc317b5a2c55714894c70ad"
+  integrity sha512-269Z39MS6wVJtsoUl10L60WdkhJVdPG24Q4eZTH3nnF6lpvSShEK3wQjDX9JRWAUPvPh7COouPpU9IrqaZFvtQ==
+  dependencies:
+    ajv "^6.12.4"
+    debug "^4.3.2"
+    espree "^9.6.0"
+    globals "^13.19.0"
+    ignore "^5.2.0"
+    import-fresh "^3.2.1"
+    js-yaml "^4.1.0"
+    minimatch "^3.1.2"
+    strip-json-comments "^3.1.1"
+
+"@eslint/js@8.55.0":
+  version "8.55.0"
+  resolved "https://registry.yarnpkg.com/@eslint/js/-/js-8.55.0.tgz#b721d52060f369aa259cf97392403cb9ce892ec6"
+  integrity sha512-qQfo2mxH5yVom1kacMtZZJFVdW+E70mqHMJvVg6WTLo+VBuQJ4TojZlfWBjK0ve5BdEeNAVxOsl/nvNMpJOaJA==
+
+"@fastify/busboy@^2.0.0":
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/@fastify/busboy/-/busboy-2.1.0.tgz#0709e9f4cb252351c609c6e6d8d6779a8d25edff"
+  integrity sha512-+KpH+QxZU7O4675t3mnkQKcZZg56u+K/Ct2K+N2AZYNVK8kyeo/bI18tI8aPm3tvNNRyTWfj6s5tnGNlcbQRsA==
+
+"@fortawesome/fontawesome-free@^6.4.0":
+  version "6.4.0"
+  resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-free/-/fontawesome-free-6.4.0.tgz#1ee0c174e472c84b23cb46c995154dc383e3b4fe"
+  integrity sha512-0NyytTlPJwB/BF5LtRV8rrABDbe3TdTXqNB3PdZ+UUUZAEIrdOJdmABqKjt4AXwIoJNaRVVZEXxpNrqvE1GAYQ==
+
+"@frogcat/ttl2jsonld@^0.0.9":
+  version "0.0.9"
+  resolved "https://registry.yarnpkg.com/@frogcat/ttl2jsonld/-/ttl2jsonld-0.0.9.tgz#9e94140825d4e41066c35d0ccb6ea83b34d16b40"
+  integrity sha512-oT3Abc9sEnwcCx9cTgRCTbz+Y/9fvbqfW22A5V4ChoQ8/P++2eAvlWgUghFoNm2V9U3/CCDSP9HTGJ51D+n1Uw==
+
+"@humanwhocodes/config-array@^0.11.13":
+  version "0.11.13"
+  resolved "https://registry.yarnpkg.com/@humanwhocodes/config-array/-/config-array-0.11.13.tgz#075dc9684f40a531d9b26b0822153c1e832ee297"
+  integrity sha512-JSBDMiDKSzQVngfRjOdFXgFfklaXI4K9nLF49Auh21lmBWRLIK3+xTErTWD4KU54pb6coM6ESE7Awz/FNU3zgQ==
+  dependencies:
+    "@humanwhocodes/object-schema" "^2.0.1"
+    debug "^4.1.1"
+    minimatch "^3.0.5"
+
+"@humanwhocodes/module-importer@^1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz#af5b2691a22b44be847b0ca81641c5fb6ad0172c"
+  integrity sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==
+
+"@humanwhocodes/object-schema@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-2.0.1.tgz#e5211452df060fa8522b55c7b3c0c4d1981cb044"
+  integrity sha512-dvuCeX5fC9dXgJn9t+X5atfmgQAzUOWqS1254Gh0m6i8wKd10ebXkfNKiRK+1GWi/yTvvLDHpoxLr0xxxeslWw==
+
 "@jest/console@^24.7.1", "@jest/console@^24.9.0":
   version "24.9.0"
   resolved "https://registry.yarnpkg.com/@jest/console/-/console-24.9.0.tgz#79b1bc06fb74a8cfb01cbdedf945584b1b9707f0"
@@ -2244,13 +2421,13 @@
     concat-stream "~2.0.0"
     minimist "^1.2.5"
 
-"@mapbox/geojson-rewind@^0.5.1":
-  version "0.5.1"
-  resolved "https://registry.yarnpkg.com/@mapbox/geojson-rewind/-/geojson-rewind-0.5.1.tgz#adbe16dc683eb40e90934c51a5e28c7bbf44f4e1"
-  integrity sha512-eL7fMmfTBKjrb+VFHXCGv9Ot0zc3C0U+CwXo1IrP+EPwDczLoXv34Tgq3y+2mPSFNVUXgU42ILWJTC7145KPTA==
+"@mapbox/geojson-rewind@^0.5.2":
+  version "0.5.2"
+  resolved "https://registry.yarnpkg.com/@mapbox/geojson-rewind/-/geojson-rewind-0.5.2.tgz#591a5d71a9cd1da1a0bf3420b3bea31b0fc7946a"
+  integrity sha512-tJaT+RbYGJYStt7wI3cq4Nl4SXxG8W7JDG5DMJu97V25RnbNg3QtQtf+KD+VLjNpWKYsRvXDNmNrBgEETr1ifA==
   dependencies:
     get-stream "^6.0.1"
-    minimist "^1.2.5"
+    minimist "^1.2.6"
 
 "@mapbox/geojson-types@^1.0.2":
   version "1.0.2"
@@ -2282,10 +2459,10 @@
   resolved "https://registry.yarnpkg.com/@mapbox/tiny-sdf/-/tiny-sdf-1.2.5.tgz#424c620a96442b20402552be70a7f62a8407cc59"
   integrity sha512-cD8A/zJlm6fdJOk6DqPUV8mcpyJkRz2x2R+/fYcWDYG3oWbG7/L7Yl/WqQ1VZCjnL9OTIMAn6c+BC5Eru4sQEw==
 
-"@mapbox/tiny-sdf@^2.0.4":
-  version "2.0.5"
-  resolved "https://registry.yarnpkg.com/@mapbox/tiny-sdf/-/tiny-sdf-2.0.5.tgz#cdba698d3d65087643130f9af43a2b622ce0b372"
-  integrity sha512-OhXt2lS//WpLdkqrzo/KwB7SRD8AiNTFFzuo9n14IBupzIMa67yGItcK7I2W9D8Ghpa4T04Sw9FWsKCJG50Bxw==
+"@mapbox/tiny-sdf@^2.0.5":
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/@mapbox/tiny-sdf/-/tiny-sdf-2.0.6.tgz#9a1d33e5018093e88f6a4df2343e886056287282"
+  integrity sha512-qMqa27TLw+ZQz5Jk+RcwZGH7BQf5G/TrutJhspsca/3SHwmgKQ1iq+d3Jxz5oysPVYTGP6aXxCo5Lk9Er6YBAA==
 
 "@mapbox/unitbezier@^0.0.0":
   version "0.0.0"
@@ -2314,10 +2491,10 @@
   resolved "https://registry.yarnpkg.com/@miyaoka/nuxt-twitter-widgets-module/-/nuxt-twitter-widgets-module-0.0.1.tgz#fdca759252e7496c783e69b926623551bf8a4a01"
   integrity sha512-vYJkz9EemNS4Ur4uXI8R/tKFyXWrGypQwpFF/PSA/JZaGx19gpAfzTxHg0e7EQ1VIS+GTN2U6AUXz9MD05P+Nw==
 
-"@nih-sparc/sparc-design-system-components@^0.26.26":
-  version "0.26.26"
-  resolved "https://registry.yarnpkg.com/@nih-sparc/sparc-design-system-components/-/sparc-design-system-components-0.26.26.tgz#7702a0405d7a058b451f06903f7431a2e3ecb85e"
-  integrity sha512-cU3jyBvv0K/l9jA+zhUkNU4lJTW7mmfsMo2ULlMzFLwHcln13oCOxdeje7Y5xkazM/e5W0diHh+04gf6xzjBKA==
+"@nih-sparc/sparc-design-system-components@^0.27.4":
+  version "0.27.4"
+  resolved "https://registry.yarnpkg.com/@nih-sparc/sparc-design-system-components/-/sparc-design-system-components-0.27.4.tgz#63685c736d2b23cd67edd9eefcd9e94a7b31dbab"
+  integrity sha512-h10Nt7sB3zSaWoXsrCz5/TDJiDKHAIqQB+BPIXJaME9fFUO13F2AYzpk6niSC0zNudXiCfYv+oT8rHmz+VIBPA==
   dependencies:
     "@carbon/grid" "10.17.0"
     core-js "^3.6.5"
@@ -2338,11 +2515,24 @@
     "@nodelib/fs.stat" "2.0.4"
     run-parallel "^1.1.9"
 
+"@nodelib/fs.scandir@2.1.5":
+  version "2.1.5"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5"
+  integrity sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==
+  dependencies:
+    "@nodelib/fs.stat" "2.0.5"
+    run-parallel "^1.1.9"
+
 "@nodelib/fs.stat@2.0.4", "@nodelib/fs.stat@^2.0.2":
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-2.0.4.tgz#a3f2dd61bab43b8db8fa108a121cfffe4c676655"
   integrity sha512-IYlHJA0clt2+Vg7bccq+TzRdJvv19c2INqBSsoOLp1je7xjtr7J26+WXR72MCdvU9q1qTzIWDfhMf+DRvQJK4Q==
 
+"@nodelib/fs.stat@2.0.5":
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz#5bd262af94e9d25bd1e71b05deed44876a222e8b"
+  integrity sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==
+
 "@nodelib/fs.walk@^1.2.3":
   version "1.2.6"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.walk/-/fs.walk-1.2.6.tgz#cce9396b30aa5afe9e3756608f5831adcb53d063"
@@ -2351,6 +2541,14 @@
     "@nodelib/fs.scandir" "2.1.4"
     fastq "^1.6.0"
 
+"@nodelib/fs.walk@^1.2.8":
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz#e95737e8bb6746ddedf69c556953494f196fe69a"
+  integrity sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==
+  dependencies:
+    "@nodelib/fs.scandir" "2.1.5"
+    fastq "^1.6.0"
+
 "@npmcli/move-file@^1.0.1":
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/@npmcli/move-file/-/move-file-1.1.2.tgz#1a82c3e372f7cae9253eb66d72543d6b8685c674"
@@ -2727,6 +2925,14 @@
   dependencies:
     vue-analytics "^5.22.1"
 
+"@nuxtjs/gtm@^2.4.0":
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/@nuxtjs/gtm/-/gtm-2.4.0.tgz#d7f5bb05b0306c564674831eab17b4e25cfdc1f6"
+  integrity sha512-Of5KuBBFwRjyJ6AuRrIQsh8J6ksIN2UegJDE8nBiTAanbwQBsAJ0hZibV9SjhKdGvGvWpbShQ4yR2bmQgY6XKA==
+  dependencies:
+    chalk "^4.1.0"
+    semver "^7.3.2"
+
 "@nuxtjs/proxy@^2.1.0":
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/@nuxtjs/proxy/-/proxy-2.1.0.tgz#fa7715a11d237fa1273503c4e9e137dd1bf5575b"
@@ -2734,6 +2940,11 @@
   dependencies:
     http-proxy-middleware "^1.0.6"
 
+"@nuxtjs/recaptcha@^1.1.1":
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/@nuxtjs/recaptcha/-/recaptcha-1.1.1.tgz#21f9dcd53d7b869b570ab4829404df1200ed26de"
+  integrity sha512-maHqf6x6EgfRm7lvjK7nTwle/17cRzMkeFDWPGdcdKjDnAjuli7Mei5qPG0CFZX1zG9ohIEv+0QEs7fgudyLrg==
+
 "@nuxtjs/robots@^2.4.2":
   version "2.4.2"
   resolved "https://registry.yarnpkg.com/@nuxtjs/robots/-/robots-2.4.2.tgz#9a96c91abb70e39b414eec502ef1cf7d5ef0235e"
@@ -2851,6 +3062,11 @@
   resolved "https://registry.yarnpkg.com/@soda/get-current-script/-/get-current-script-1.0.2.tgz#a53515db25d8038374381b73af20bb4f2e508d87"
   integrity sha512-T7VNNlYVM1SgQ+VsMYhnDkcGmWhQdL0bDyGm5TlQ3GBXnJscEClUUOKduWTmm2zCnvNLC1hc3JpuXjs/nFOc5w==
 
+"@tootallnate/once@2":
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/@tootallnate/once/-/once-2.0.0.tgz#f544a148d3ab35801c1f633a7441fd87c2e484bf"
+  integrity sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==
+
 "@turf/area@^6.0.1":
   version "6.3.0"
   resolved "https://registry.yarnpkg.com/@turf/area/-/area-6.3.0.tgz#cdd02f8ca51da2889dfc90a3c9e8fef5d1e04dca"
@@ -2859,6 +3075,14 @@
     "@turf/helpers" "^6.3.0"
     "@turf/meta" "^6.3.0"
 
+"@turf/area@^6.5.0":
+  version "6.5.0"
+  resolved "https://registry.yarnpkg.com/@turf/area/-/area-6.5.0.tgz#1d0d7aee01d8a4a3d4c91663ed35cc615f36ad56"
+  integrity sha512-xCZdiuojokLbQ+29qR6qoMD89hv+JAgWjLrwSEWL+3JV8IXKeNFl6XkEJz9HGkVpnXvQKJoRz4/liT+8ZZ5Jyg==
+  dependencies:
+    "@turf/helpers" "^6.5.0"
+    "@turf/meta" "^6.5.0"
+
 "@turf/bbox@^6.0.1":
   version "6.3.0"
   resolved "https://registry.yarnpkg.com/@turf/bbox/-/bbox-6.3.0.tgz#0e1a9b59f32d6a2a40c806f54cbaa73575bead25"
@@ -2867,6 +3091,14 @@
     "@turf/helpers" "^6.3.0"
     "@turf/meta" "^6.3.0"
 
+"@turf/bbox@^6.5.0":
+  version "6.5.0"
+  resolved "https://registry.yarnpkg.com/@turf/bbox/-/bbox-6.5.0.tgz#bec30a744019eae420dac9ea46fb75caa44d8dc5"
+  integrity sha512-RBbLaao5hXTYyyg577iuMtDB8ehxMlUqHEJiMs8jT1GHkFhr6sYre3lmLsPeYEi/ZKj5TP5tt7fkzNdJ4GIVyw==
+  dependencies:
+    "@turf/helpers" "^6.5.0"
+    "@turf/meta" "^6.5.0"
+
 "@turf/centroid@^6.0.2":
   version "6.3.0"
   resolved "https://registry.yarnpkg.com/@turf/centroid/-/centroid-6.3.0.tgz#e86611e1e171fb0a38ade30453351a00e04956a3"
@@ -2882,7 +3114,7 @@
   dependencies:
     "@turf/helpers" "^6.5.0"
 
-"@turf/helpers@^6.1.4", "@turf/helpers@^6.3.0":
+"@turf/helpers@^6.3.0":
   version "6.3.0"
   resolved "https://registry.yarnpkg.com/@turf/helpers/-/helpers-6.3.0.tgz#87f90f806c3f8ad6385ef8d2041d3662bf3c9fb1"
   integrity sha512-kr6KuD4Z0GZ30tblTEvi90rvvVNlKieXuMC8CTzE/rVQb0/f/Cb29zCXxTD7giQTEQY/P2nRW23wEqqyNHulCg==
@@ -2976,6 +3208,13 @@
   dependencies:
     browserslist "*"
 
+"@types/chart.js@^2.7.55":
+  version "2.9.37"
+  resolved "https://registry.yarnpkg.com/@types/chart.js/-/chart.js-2.9.37.tgz#8af70862b154fedf938b5b87debdb3a70f6e3208"
+  integrity sha512-9bosRfHhkXxKYfrw94EmyDQcdjMaQPkU1fH2tDxu8DWXxf1mjzWQAV4laJF51ZbC2ycYwNDvIm1rGez8Bug0vg==
+  dependencies:
+    moment "^2.10.2"
+
 "@types/clean-css@*":
   version "4.2.3"
   resolved "https://registry.yarnpkg.com/@types/clean-css/-/clean-css-4.2.3.tgz#12c13cc815f5e793014ee002c6324455907d851c"
@@ -3003,6 +3242,13 @@
   resolved "https://registry.yarnpkg.com/@types/cookie/-/cookie-0.3.3.tgz#85bc74ba782fb7aa3a514d11767832b0e3bc6803"
   integrity sha512-LKVP3cgXBT9RYj+t+9FDKwS5tdI+rPBXaNSkma7hvqy35lc7mAokC2zsqWJH0LaqIt3B962nuYI77hsJoT1gow==
 
+"@types/dompurify@^2.3.3":
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/@types/dompurify/-/dompurify-2.4.0.tgz#fd9706392a88e0e0e6d367f3588482d817df0ab9"
+  integrity sha512-IDBwO5IZhrKvHFUl+clZxgf3hn2b/lU6H1KaBShPkQyGJUQ0xwebezIPSuiyGwfz1UzJWQl4M7BDxtHtCCPlTg==
+  dependencies:
+    "@types/trusted-types" "*"
+
 "@types/etag@^1.8.0":
   version "1.8.0"
   resolved "https://registry.yarnpkg.com/@types/etag/-/etag-1.8.0.tgz#37f0b1f3ea46da7ae319bbedb607e375b4c99f7e"
@@ -3036,7 +3282,7 @@
   dependencies:
     "@types/webpack" "*"
 
-"@types/geojson@*", "@types/geojson@^7946.0.8":
+"@types/geojson@*", "@types/geojson@^7946.0.10":
   version "7946.0.10"
   resolved "https://registry.yarnpkg.com/@types/geojson/-/geojson-7946.0.10.tgz#6dfbf5ea17142f7f9a043809f1cd4c448cb68249"
   integrity sha512-Nmh0K3iWQJzniTuPRcJn5hxXkfB1T1pgB89SBig5PlJQU5yocazeu4jATJlaA0GYFKWMqDdvYemoSnF2pXgLVA==
@@ -3082,6 +3328,11 @@
     "@types/istanbul-lib-coverage" "*"
     "@types/istanbul-lib-report" "*"
 
+"@types/js-cookie@^3.0.6":
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/@types/js-cookie/-/js-cookie-3.0.6.tgz#a04ca19e877687bd449f5ad37d33b104b71fdf95"
+  integrity sha512-wkw9yd1kEXOPnvEeEV1Go1MmxtBJL0RR79aOTAApecWFVu7w0NNXNqhcWgvw2YgZDYadliXkl14pa3WXw5jlCQ==
+
 "@types/json-schema@^7.0.5":
   version "7.0.9"
   resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.9.tgz#97edc9037ea0c38585320b28964dde3b39e4660d"
@@ -3092,6 +3343,11 @@
   resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.7.tgz#98a993516c859eb0d5c4c8f098317a9ea68db9ad"
   integrity sha512-cxWFQVseBm6O9Gbw1IWb8r6OS4OhSt3hPZLkFApLjM8TEXROBuQGLAH2i2gZpcXdLBIrpXuTDhH7Vbm1iXmNGA==
 
+"@types/json5@^0.0.29":
+  version "0.0.29"
+  resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
+  integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==
+
 "@types/less@^3.0.1":
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/@types/less/-/less-3.0.2.tgz#2761d477678c8374cb9897666871662eb1d1115e"
@@ -3155,6 +3411,11 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-13.13.46.tgz#5471e176f3fa15e018dea7992072bf8ca208a3a6"
   integrity sha512-dqpbzK/KDsOlEt+oyB3rv+u1IxlLFziZu/Z0adfRKoelkr+sTd6QcgiQC+HWq/vkYkHwG5ot2LxgV05aAjnhcg==
 
+"@types/node@^16.18.39":
+  version "16.18.55"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-16.18.55.tgz#3d9ac633ed401238c13ccaeed54297bd653412a3"
+  integrity sha512-Y1zz/LIuJek01+hlPNzzXQhmq/Z2BCP96j18MSXC0S0jSu/IG4FFxmBs7W4/lI2vPJ7foVfEB0hUVtnOjnCiTg==
+
 "@types/optimize-css-assets-webpack-plugin@^5.0.1":
   version "5.0.2"
   resolved "https://registry.yarnpkg.com/@types/optimize-css-assets-webpack-plugin/-/optimize-css-assets-webpack-plugin-5.0.2.tgz#37afc6ca5eecae865551e86d1fd3012aedc40798"
@@ -3200,6 +3461,16 @@
     "@types/mime" "^1"
     "@types/node" "*"
 
+"@types/sinonjs__fake-timers@8.1.1":
+  version "8.1.1"
+  resolved "https://registry.yarnpkg.com/@types/sinonjs__fake-timers/-/sinonjs__fake-timers-8.1.1.tgz#b49c2c70150141a15e0fa7e79cf1f92a72934ce3"
+  integrity sha512-0kSuKjAS0TrGLJ0M/+8MaFkGsQhZpB6pxOmvS3K8FYI72K//YmdfoW9X2qPsAKh1mkwxGD5zib9s1FIFed6E8g==
+
+"@types/sizzle@^2.3.2":
+  version "2.3.4"
+  resolved "https://registry.yarnpkg.com/@types/sizzle/-/sizzle-2.3.4.tgz#cd6531924f60834fa4a1b8081f9eecf9bb1117f0"
+  integrity sha512-jA2llq2zNkg8HrALI7DtWzhALcVH0l7i89yhY3iBdOz6cBPeACoFq+fkQrjHA39t1hnSFOboZ7A/AY5MMZSlag==
+
 "@types/source-list-map@*":
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/@types/source-list-map/-/source-list-map-0.1.2.tgz#0078836063ffaf17412349bba364087e0ac02ec9"
@@ -3223,6 +3494,11 @@
     "@types/webpack" "*"
     terser "^4.3.9"
 
+"@types/trusted-types@*":
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/@types/trusted-types/-/trusted-types-2.0.2.tgz#fc25ad9943bcac11cceb8168db4f275e0e72e756"
+  integrity sha512-F5DIZ36YVLE+PN+Zwws4kJogq47hNgX3Nx6WyDJ3kcplxyke3XIzB8uK5n/Lpm1HBsbGzd6nmGehL8cPekP+Tg==
+
 "@types/uglify-js@*":
   version "3.13.0"
   resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.13.0.tgz#1cad8df1fb0b143c5aba08de5712ea9d1ff71124"
@@ -3288,6 +3564,18 @@
   dependencies:
     "@types/yargs-parser" "*"
 
+"@types/yauzl@^2.9.1":
+  version "2.10.1"
+  resolved "https://registry.yarnpkg.com/@types/yauzl/-/yauzl-2.10.1.tgz#4e8f299f0934d60f36c74f59cb5a8483fd786691"
+  integrity sha512-CHzgNU3qYBnp/O4S3yv2tXPlvMTq0YWSTVg2/JYLqWZGHwwgJGAwd00poay/11asPq8wLFwHzubyInqHIFmmiw==
+  dependencies:
+    "@types/node" "*"
+
+"@ungap/structured-clone@^1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@ungap/structured-clone/-/structured-clone-1.2.0.tgz#756641adb587851b5ccb3e095daf27ae581c8406"
+  integrity sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==
+
 "@vue/babel-helper-vue-jsx-merge-props@^1.2.1":
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-1.2.1.tgz#31624a7a505fb14da1d58023725a4c5f270e6a81"
@@ -3543,6 +3831,11 @@
     "@webassemblyjs/wast-parser" "1.9.0"
     "@xtuc/long" "4.2.2"
 
+"@xmldom/xmldom@^0.8.7":
+  version "0.8.10"
+  resolved "https://registry.yarnpkg.com/@xmldom/xmldom/-/xmldom-0.8.10.tgz#a1337ca426aa61cef9fe15b5b28e340a72f6fa99"
+  integrity sha512-2WALfTl4xo2SkGCYRt6rDTFfk9R1czmBvUQy12gK2KuRKIpWEhcbbzy8EZXtz/jkRqHX8bFEc6FC1HjX4TUWYw==
+
 "@xtuc/ieee754@^1.2.0":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@xtuc/ieee754/-/ieee754-1.2.0.tgz#eef014a3145ae477a1cbc00cd1e552336dceb790"
@@ -3567,6 +3860,11 @@ abab@^2.0.0:
   resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.5.tgz#c0b678fb32d60fc1219c784d6a826fe385aeb79a"
   integrity sha512-9IK9EadsbHo6jLWIpxpR6pL0sazTXV6+SQv25ZB+F7Bj9mJNaOc4nCRabwd5M/JwmUa8idz6Eci6eKfJryPs6Q==
 
+abab@^2.0.5, abab@^2.0.6:
+  version "2.0.6"
+  resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.6.tgz#41b80f2c871d19686216b82309231cfd3cb3d291"
+  integrity sha512-j2afSsaIENvHZN2B8GOpF566vZ5WVk5opAiMTvWgaQT8DkbOqsTfvNAvHoRGU2zzP8cPoqys+xHTRDWW8L+/BA==
+
 abbrev@1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.1.1.tgz#f8f2c887ad10bf67f634f005b6987fed3179aac8"
@@ -3600,11 +3898,24 @@ acorn-globals@^4.1.0:
     acorn "^6.0.1"
     acorn-walk "^6.0.1"
 
+acorn-globals@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/acorn-globals/-/acorn-globals-6.0.0.tgz#46cdd39f0f8ff08a876619b55f5ac8a6dc770b45"
+  integrity sha512-ZQl7LOWaF5ePqqcX4hLuv/bLXYQNfNWw2c0/yX/TsPRKamzHcTGQnlCjHT3TsmkOUVEPS3crCxiPfdzE/Trlhg==
+  dependencies:
+    acorn "^7.1.1"
+    acorn-walk "^7.1.1"
+
 acorn-jsx@^5.2.0:
   version "5.3.1"
   resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.1.tgz#fc8661e11b7ac1539c47dbfea2e72b3af34d267b"
   integrity sha512-K0Ptm/47OKfQRpNQ2J/oIN/3QYiK6FwW+eJbILhsdxh2WTLdl+30o8aGdTbm5JbffpFFAg/g+zi1E+jvJha5ng==
 
+acorn-jsx@^5.3.2:
+  version "5.3.2"
+  resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937"
+  integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
+
 acorn-walk@^6.0.1:
   version "6.2.0"
   resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-6.2.0.tgz#123cb8f3b84c2171f1f7fb252615b1c78a6b1a8c"
@@ -3640,6 +3951,16 @@ acorn@^8.0.4:
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.1.0.tgz#52311fd7037ae119cbb134309e901aa46295b3fe"
   integrity sha512-LWCF/Wn0nfHOmJ9rzQApGnxnvgfROzGilS8936rqN/lfcYkY9MYZzdMqN+2NJ4SlTc+m5HiSa+kNfDtI64dwUA==
 
+acorn@^8.5.0:
+  version "8.8.2"
+  resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.8.2.tgz#1b2f25db02af965399b9776b0c2c391276d37c4a"
+  integrity sha512-xjIYgE8HBrkpd/sJqOGNspf8uHG+NOHGOw6a/Urj8taM2EXfdNAH2oFcPeIFfsv3+kz/mJrS5VuMqbNLjCa2vw==
+
+acorn@^8.9.0:
+  version "8.11.2"
+  resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.11.2.tgz#ca0d78b51895be5390a5903c5b3bdcdaf78ae40b"
+  integrity sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==
+
 add-line-numbers@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/add-line-numbers/-/add-line-numbers-1.0.1.tgz#48dbbdea47dbd234deafeac6c93cea6f70b4b7e3"
@@ -3773,6 +4094,11 @@ ansi-align@^3.0.0:
   dependencies:
     string-width "^3.0.0"
 
+ansi-colors@^4.1.1:
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-4.1.3.tgz#37611340eb2243e70cc604cad35d63270d48781b"
+  integrity sha512-/6w/C21Pm1A7aZitlI5Ni/2J6FFQN8i1Cvz3kHABAAbw93v/NlvKdVOqz7CCWz/3iv/JplRSEEZ83XION15ovw==
+
 ansi-escapes@^3.0.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-3.2.0.tgz#8780b98ff9dbf5638152d1f1fe5c1d7b4442976b"
@@ -3785,6 +4111,13 @@ ansi-escapes@^4.2.1:
   dependencies:
     type-fest "^0.11.0"
 
+ansi-escapes@^4.3.0:
+  version "4.3.2"
+  resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-4.3.2.tgz#6b2291d1db7d98b6521d5f1efa42d0f3a9feb65e"
+  integrity sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==
+  dependencies:
+    type-fest "^0.21.3"
+
 ansi-html@0.0.7:
   version "0.0.7"
   resolved "https://registry.yarnpkg.com/ansi-html/-/ansi-html-0.0.7.tgz#813584021962a9e9e6fd039f940d12f56ca7859e"
@@ -3810,6 +4143,11 @@ ansi-regex@^5.0.0:
   resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-5.0.0.tgz#388539f55179bf39339c81af30a654d69f87cb75"
   integrity sha512-bY6fj56OUQ0hU1KjFNDQuJFezqKdrAyFdIevADiqrWHwSlbmBNMHp5ak2f40Pm8JTFyM2mqxkG6ngkHO11f/lg==
 
+ansi-regex@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-5.0.1.tgz#082cb2c89c9fe8659a311a53bd6a4dc5301db304"
+  integrity sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==
+
 ansi-styles@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-2.2.1.tgz#b432dd3358b634cf75e1e4664368240533c1ddbe"
@@ -3858,6 +4196,11 @@ aproba@^1.1.1:
   resolved "https://registry.yarnpkg.com/aproba/-/aproba-1.2.0.tgz#6802e6264efd18c790a1b0d517f0f2627bf2c94a"
   integrity sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw==
 
+arch@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/arch/-/arch-2.2.0.tgz#1bc47818f305764f23ab3306b0bfc086c5a29d11"
+  integrity sha512-Of/R0wqp83cgHozfIYLbBMnej79U/SVGOOyuB3VVFv1NRM/PSFMK12x9KVtiYzJqmnU5WR2qp0Z5rHb7sWGnFQ==
+
 arg@^5.0.0:
   version "5.0.0"
   resolved "https://registry.yarnpkg.com/arg/-/arg-5.0.0.tgz#a20e2bb5710e82950a516b3f933fee5ed478be90"
@@ -3870,6 +4213,11 @@ argparse@^1.0.7:
   dependencies:
     sprintf-js "~1.0.2"
 
+argparse@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38"
+  integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
+
 arr-diff@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-4.0.0.tgz#d6461074febfec71e7e15235761a329a5dc7c520"
@@ -3890,6 +4238,14 @@ array-bounds@^1.0.0, array-bounds@^1.0.1:
   resolved "https://registry.yarnpkg.com/array-bounds/-/array-bounds-1.0.1.tgz#da11356b4e18e075a4f0c86e1f179a67b7d7ea31"
   integrity sha512-8wdW3ZGk6UjMPJx/glyEt0sLzzwAE1bhToPsO1W2pbpR2gULyxe3BjSiuJFheP50T/GgODVPz2fuMUmIywt8cQ==
 
+array-buffer-byte-length@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/array-buffer-byte-length/-/array-buffer-byte-length-1.0.0.tgz#fabe8bc193fea865f317fe7807085ee0dee5aead"
+  integrity sha512-LPuwb2P+NrQw3XhxGc36+XSvuBPopovXYTR9Ew++Du9Yb/bx5AzBfrIsBoj0EZUifjQU+sHL21sseZ3jerWO/A==
+  dependencies:
+    call-bind "^1.0.2"
+    is-array-buffer "^3.0.1"
+
 array-equal@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/array-equal/-/array-equal-1.0.0.tgz#8c2a5ef2472fd9ea742b04c77a75093ba2757c93"
@@ -3905,6 +4261,17 @@ array-flatten@1.1.1:
   resolved "https://registry.yarnpkg.com/array-flatten/-/array-flatten-1.1.1.tgz#9a5f699051b1e7073328f2a008968b64ea2955d2"
   integrity sha1-ml9pkFGx5wczKPKgCJaLZOopVdI=
 
+array-includes@^3.1.6, array-includes@^3.1.7:
+  version "3.1.7"
+  resolved "https://registry.yarnpkg.com/array-includes/-/array-includes-3.1.7.tgz#8cd2e01b26f7a3086cbc87271593fe921c62abda"
+  integrity sha512-dlcsNBIiWhPkHdOEEKnehA+RNUWDc4UqFtnIXU4uuYDPtA4LDkr7qip2p0VvFAEXNDr0yWZ9PJyIRiGjRLQzwQ==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+    get-intrinsic "^1.2.1"
+    is-string "^1.0.7"
+
 array-normalize@^1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/array-normalize/-/array-normalize-1.1.4.tgz#d75cec57383358af38efdf6a78071aa36ae4174c"
@@ -3932,6 +4299,61 @@ array-unique@^0.3.2:
   resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.3.2.tgz#a894b75d4bc4f6cd679ef3244a9fd8f46ae2d428"
   integrity sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=
 
+array.prototype.findlastindex@^1.2.3:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.3.tgz#b37598438f97b579166940814e2c0493a4f50207"
+  integrity sha512-LzLoiOMAxvy+Gd3BAq3B7VeIgPdo+Q8hthvKtXybMvRV0jrXfJM/t8mw7nNlpEcVlVUnCnM2KSX4XU5HmpodOA==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+    es-shim-unscopables "^1.0.0"
+    get-intrinsic "^1.2.1"
+
+array.prototype.flat@^1.3.1, array.prototype.flat@^1.3.2:
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/array.prototype.flat/-/array.prototype.flat-1.3.2.tgz#1476217df8cff17d72ee8f3ba06738db5b387d18"
+  integrity sha512-djYB+Zx2vLewY8RWlNCUdHjDXs2XOgm602S9E7P/UpHgfeHL00cRiIF+IN/G/aUJ7kGPb6yO/ErDI5V2s8iycA==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+    es-shim-unscopables "^1.0.0"
+
+array.prototype.flatmap@^1.3.1, array.prototype.flatmap@^1.3.2:
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/array.prototype.flatmap/-/array.prototype.flatmap-1.3.2.tgz#c9a7c6831db8e719d6ce639190146c24bbd3e527"
+  integrity sha512-Ewyx0c9PmpcsByhSW4r+9zDU7sGjFc86qf/kKtuSCRdhfbk0SNLLkaT5qvcHnRGgc5NP/ly/y+qkXkqONX54CQ==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+    es-shim-unscopables "^1.0.0"
+
+array.prototype.tosorted@^1.1.1:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/array.prototype.tosorted/-/array.prototype.tosorted-1.1.2.tgz#620eff7442503d66c799d95503f82b475745cefd"
+  integrity sha512-HuQCHOlk1Weat5jzStICBCd83NxiIMwqDg/dHEsoefabn/hJRj5pVdWcPUSpRrwhwxZOsQassMpgN/xRYFBMIg==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+    es-shim-unscopables "^1.0.0"
+    get-intrinsic "^1.2.1"
+
+arraybuffer.prototype.slice@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.2.tgz#98bd561953e3e74bb34938e77647179dfe6e9f12"
+  integrity sha512-yMBKppFur/fbHu9/6USUe03bZ4knMYiwFBcyiaXB8Go0qNehwX6inYPzK9U0NeQvGxKthcmHcaR8P5MStSRBAw==
+  dependencies:
+    array-buffer-byte-length "^1.0.0"
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+    get-intrinsic "^1.2.1"
+    is-array-buffer "^3.0.2"
+    is-shared-array-buffer "^1.0.2"
+
 arrify@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/arrify/-/arrify-2.0.1.tgz#c9655e9331e0abcd588d2a7cad7e9956f66701fa"
@@ -3977,6 +4399,11 @@ astral-regex@^1.0.0:
   resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-1.0.0.tgz#6c8c3fb827dd43ee3918f27b82782ab7658a6fd9"
   integrity sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg==
 
+astral-regex@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/astral-regex/-/astral-regex-2.0.0.tgz#483143c567aeed4785759c0865786dc77d7d2e31"
+  integrity sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==
+
 async-each@^1.0.1:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/async-each/-/async-each-1.0.3.tgz#b727dbf87d7651602f06f4d4ac387f47d91b0cbf"
@@ -3999,6 +4426,18 @@ async@^1.5.2:
   resolved "https://registry.yarnpkg.com/async/-/async-1.5.2.tgz#ec6a61ae56480c0c3cb241c95618e20892f9672a"
   integrity sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo=
 
+async@^3.2.0:
+  version "3.2.4"
+  resolved "https://registry.yarnpkg.com/async/-/async-3.2.4.tgz#2d22e00f8cddeb5fde5dd33522b56d1cf569a81c"
+  integrity sha512-iAB+JbDEGXhyIUavoDl9WP/Jj106Kz9DEn1DPgYw5ruDn0e3Wgi3sKFm55sASdGBNOQB8F59d9qQ7deqrHA8wQ==
+
+asynciterator.prototype@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/asynciterator.prototype/-/asynciterator.prototype-1.0.0.tgz#8c5df0514936cdd133604dfcc9d3fb93f09b2b62"
+  integrity sha512-wwHYEIS0Q80f5mosx3L/dfG5t5rjEa9Ft51GTaNt862EnpyGHpgz2RkZvLPp1oF5TnAiTohkEKVEu8pQPJI7Vg==
+  dependencies:
+    has-symbols "^1.0.3"
+
 asynckit@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79"
@@ -4037,6 +4476,11 @@ autoprefixer@^9.6.1:
     postcss "^7.0.32"
     postcss-value-parser "^4.1.0"
 
+available-typed-arrays@^1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz#92f95616501069d07d10edb2fc37d3e1c65123b7"
+  integrity sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==
+
 aws-sign2@~0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/aws-sign2/-/aws-sign2-0.7.0.tgz#b46e890934a9591f2d2f6f86d7e6a9f1b3fe76a8"
@@ -4333,7 +4777,12 @@ bl@^2.2.1:
     readable-stream "^2.3.5"
     safe-buffer "^5.1.1"
 
-bluebird@^3.0.6, bluebird@^3.1.1, bluebird@^3.5.5:
+blob-util@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/blob-util/-/blob-util-2.0.2.tgz#3b4e3c281111bb7f11128518006cdc60b403a1eb"
+  integrity sha512-T7JQa+zsXXEa6/8ZhHcQEW1UFfVM49Ts65uBkFL6fz2QmrElqmbajIDJvuA0tEhRe5eIjpV9ZF+0RfZR9voJFQ==
+
+bluebird@^3.0.6, bluebird@^3.1.1, bluebird@^3.5.5, bluebird@^3.7.2:
   version "3.7.2"
   resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.7.2.tgz#9f229c15be272454ffa973ace0dbee79a1b0c36f"
   integrity sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==
@@ -4528,6 +4977,11 @@ bser@2.1.1:
   dependencies:
     node-int64 "^0.4.0"
 
+buffer-crc32@~0.2.3:
+  version "0.2.13"
+  resolved "https://registry.yarnpkg.com/buffer-crc32/-/buffer-crc32-0.2.13.tgz#0d333e3f00eac50aa1454abd30ef8c2a5d9a7242"
+  integrity sha512-VO9Ht/+p3SN7SKWqcrgEzjGbRSJYTx+Q1pTQC0wrWqHx0vpJraQ6GtHx8tvcg1rlK1byhU5gccxgOgj7B0TDkQ==
+
 buffer-equal-constant-time@1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/buffer-equal-constant-time/-/buffer-equal-constant-time-1.0.1.tgz#f8e71132f7ffe6e01a5c9697a4c6f3e48d5cc819"
@@ -4557,7 +5011,7 @@ buffer@4.9.2, buffer@^4.3.0:
     ieee754 "^1.1.4"
     isarray "^1.0.0"
 
-buffer@^5.1.0:
+buffer@^5.1.0, buffer@^5.6.0:
   version "5.7.1"
   resolved "https://registry.yarnpkg.com/buffer/-/buffer-5.7.1.tgz#ba62e7c13133053582197160851a8f648e99eed0"
   integrity sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==
@@ -4565,11 +5019,26 @@ buffer@^5.1.0:
     base64-js "^1.3.1"
     ieee754 "^1.1.13"
 
+buffer@^6.0.3:
+  version "6.0.3"
+  resolved "https://registry.yarnpkg.com/buffer/-/buffer-6.0.3.tgz#2ace578459cc8fbe2a70aaa8f52ee63b6a74c6c6"
+  integrity sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==
+  dependencies:
+    base64-js "^1.3.1"
+    ieee754 "^1.2.1"
+
 builtin-status-codes@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz#85982878e21b98e1c66425e03d0174788f569ee8"
   integrity sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug=
 
+builtins@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/builtins/-/builtins-5.0.1.tgz#87f6db9ab0458be728564fa81d876d8d74552fa9"
+  integrity sha512-qwVpFEHNfhYJIzNRBvd2C1kyo6jz3ZSMPyyuR47OPdiKWlbYnZNyDWuyR175qDnAJLiCo5fBBqPb3RiXgWlkOQ==
+  dependencies:
+    semver "^7.0.0"
+
 bytes@3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048"
@@ -4651,6 +5120,11 @@ cache-loader@^4.1.0:
     neo-async "^2.6.1"
     schema-utils "^2.0.0"
 
+cachedir@^2.3.0:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/cachedir/-/cachedir-2.4.0.tgz#7fef9cf7367233d7c88068fe6e34ed0d355a610d"
+  integrity sha512-9EtFOZR8g22CL7BWjJ9BUx1+A/djkofnyW3aOXZORNW2kxoUpx2h+uN2cOqwPmFhnpVmxg+KW2OjOSgChTEvsQ==
+
 call-bind@^1.0.0, call-bind@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.2.tgz#b1d4e89e688119c3c9a903ad30abb2f6a919be3c"
@@ -4659,6 +5133,15 @@ call-bind@^1.0.0, call-bind@^1.0.2:
     function-bind "^1.1.1"
     get-intrinsic "^1.0.2"
 
+call-bind@^1.0.4, call-bind@^1.0.5:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.5.tgz#6fa2b7845ce0ea49bf4d8b9ef64727a2c2e2e513"
+  integrity sha512-C3nQxfFZxFRVoJoGKKI8y3MOEo129NQ+FgQ08iye+Mk4zNZZGdjfs06bVTr+DBSlA66Q2VEcMki/cUCP4SercQ==
+  dependencies:
+    function-bind "^1.1.2"
+    get-intrinsic "^1.2.1"
+    set-function-length "^1.1.1"
+
 caller-callsite@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/caller-callsite/-/caller-callsite-2.0.0.tgz#847e0fce0a223750a9a027c54b33731ad3154134"
@@ -4720,9 +5203,14 @@ caniuse-api@^3.0.0:
     lodash.uniq "^4.5.0"
 
 caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000981, caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001191, caniuse-lite@^1.0.30001251:
-  version "1.0.30001320"
-  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001320.tgz"
-  integrity sha512-MWPzG54AGdo3nWx7zHZTefseM5Y1ccM7hlQKHRqJkPozUaw3hNbBTMmLn16GG2FUzjR13Cr3NPfhIieX5PzXDA==
+  version "1.0.30001462"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001462.tgz"
+  integrity sha512-PDd20WuOBPiasZ7KbFnmQRyuLE7cFXW2PVd7dmALzbkUXEP46upAuCDm9eY9vho8fgNMGmbAX92QBZHzcnWIqw==
+
+canonicalize@^1.0.1:
+  version "1.0.8"
+  resolved "https://registry.yarnpkg.com/canonicalize/-/canonicalize-1.0.8.tgz#24d1f1a00ed202faafd9bf8e63352cd4450c6df1"
+  integrity sha512-0CNTVCLZggSh7bc5VkX5WWPWO+cyZbNd07IHIsSXLia/eAq+r836hgk+8BKoEh7949Mda87VUOitx5OddVj64A==
 
 canvas-fit@^1.5.0:
   version "1.5.0"
@@ -4777,6 +5265,14 @@ chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.2, chalk@^2.4
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
+chalk@^4.0.0:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.2.tgz#aac4e2b7734a740867aeb16bf02aad556a1e7a01"
+  integrity sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==
+  dependencies:
+    ansi-styles "^4.1.0"
+    supports-color "^7.1.0"
+
 chalk@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.0.tgz#4e14870a618d9e2edd97dd8345fd9d9dc315646a"
@@ -4790,15 +5286,48 @@ chardet@^0.7.0:
   resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.7.0.tgz#90094849f0937f2eedc2425d0d28a9e5f0cbad9e"
   integrity sha512-mT8iDcrh03qDGRRmoA2hmBJnxpllMR+0/0qlzjqZES6NdiWDcZkCNAk4rPFZ9Q85r27unkiNNg8ZOiwZXBHwcA==
 
-check-types@^8.0.3:
-  version "8.0.3"
-  resolved "https://registry.yarnpkg.com/check-types/-/check-types-8.0.3.tgz#3356cca19c889544f2d7a95ed49ce508a0ecf552"
-  integrity sha512-YpeKZngUmG65rLudJ4taU7VLkOCTMhNl/u4ctNC56LQS/zJTyNH0Lrtwm1tfTsbLlwvlfsA2d1c8vCf/Kh2KwQ==
-
-"chokidar@>=2.0.0 <4.0.0", chokidar@^3.3.0, chokidar@^3.4.1, chokidar@^3.5.1:
-  version "3.5.1"
-  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.1.tgz#ee9ce7bbebd2b79f49f304799d5468e31e14e68a"
-  integrity sha512-9+s+Od+W0VJJzawDma/gvBNQqkTiqYTWLuZoyAsivsI4AaWTCzHG06/TMjsf1cYe9Cb97UCEhjz7HvnPk2p/tw==
+chart.js@^2.9.4:
+  version "2.9.4"
+  resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-2.9.4.tgz#0827f9563faffb2dc5c06562f8eb10337d5b9684"
+  integrity sha512-B07aAzxcrikjAPyV+01j7BmOpxtQETxTSlQ26BEYJ+3iUkbNKaOJ/nDbT6JjyqYxseM0ON12COHYdU2cTIjC7A==
+  dependencies:
+    chartjs-color "^2.1.0"
+    moment "^2.10.2"
+
+chartjs-color-string@^0.6.0:
+  version "0.6.0"
+  resolved "https://registry.yarnpkg.com/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz#1df096621c0e70720a64f4135ea171d051402f71"
+  integrity sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==
+  dependencies:
+    color-name "^1.0.0"
+
+chartjs-color@^2.1.0:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.4.1.tgz#6118bba202fe1ea79dd7f7c0f9da93467296c3b0"
+  integrity sha512-haqOg1+Yebys/Ts/9bLo/BqUcONQOdr/hoEr2LLTRl6C5LXctUdHxsCYfvQVg5JIxITrfCNUDr4ntqmQk9+/0w==
+  dependencies:
+    chartjs-color-string "^0.6.0"
+    color-convert "^1.9.3"
+
+chartjs-plugin-datalabels@1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/chartjs-plugin-datalabels/-/chartjs-plugin-datalabels-1.0.0.tgz#5a3d21dde1ed12602dd48c634985a39f431165f1"
+  integrity sha512-rqaAFrZT++7OoCJgRCPjugTR4kYpdmrTeX7qHTAZoNQaOaMdx4g6o0Eo9J7n3qLRQrhWjh9l731JsrbkJxL7Vg==
+
+check-more-types@^2.24.0:
+  version "2.24.0"
+  resolved "https://registry.yarnpkg.com/check-more-types/-/check-more-types-2.24.0.tgz#1420ffb10fd444dcfc79b43891bbfffd32a84600"
+  integrity sha512-Pj779qHxV2tuapviy1bSZNEL1maXr13bPYpsvSDB68HlYcYuhlDrmGd63i0JHMCLKzc7rUSNIrpdJlhVlNwrxA==
+
+check-types@^8.0.3:
+  version "8.0.3"
+  resolved "https://registry.yarnpkg.com/check-types/-/check-types-8.0.3.tgz#3356cca19c889544f2d7a95ed49ce508a0ecf552"
+  integrity sha512-YpeKZngUmG65rLudJ4taU7VLkOCTMhNl/u4ctNC56LQS/zJTyNH0Lrtwm1tfTsbLlwvlfsA2d1c8vCf/Kh2KwQ==
+
+"chokidar@>=2.0.0 <4.0.0", chokidar@^3.3.0, chokidar@^3.4.1, chokidar@^3.5.1:
+  version "3.5.1"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.1.tgz#ee9ce7bbebd2b79f49f304799d5468e31e14e68a"
+  integrity sha512-9+s+Od+W0VJJzawDma/gvBNQqkTiqYTWLuZoyAsivsI4AaWTCzHG06/TMjsf1cYe9Cb97UCEhjz7HvnPk2p/tw==
   dependencies:
     anymatch "~3.1.1"
     braces "~3.0.2"
@@ -4871,6 +5400,11 @@ ci-info@^3.0.0:
   resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-3.1.1.tgz#9a32fcefdf7bcdb6f0a7e1c0f8098ec57897b80a"
   integrity sha512-kdRWLBIJwdsYJWYJFtAFFYxybguqeF91qpZaggjG5Nf8QKdizFG2hjqvaTXbxFIcYbSaD74KpAXv6BSm17DHEQ==
 
+ci-info@^3.2.0:
+  version "3.8.0"
+  resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-3.8.0.tgz#81408265a5380c929f0bc665d62256628ce9ef91"
+  integrity sha512-eXTggHWSooYhq49F2opQhuHWgzucfF2YgODK4e1566GQs5BIfP30B0oenwBJHfWxAs2fyPB1s7Mg949zLf61Yw==
+
 cipher-base@^1.0.0, cipher-base@^1.0.1, cipher-base@^1.0.3:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/cipher-base/-/cipher-base-1.0.4.tgz#8760e4ecc272f4c363532f926d874aae2c1397de"
@@ -4946,6 +5480,23 @@ cli-cursor@^3.1.0:
   dependencies:
     restore-cursor "^3.1.0"
 
+cli-table3@~0.6.1:
+  version "0.6.3"
+  resolved "https://registry.yarnpkg.com/cli-table3/-/cli-table3-0.6.3.tgz#61ab765aac156b52f222954ffc607a6f01dbeeb2"
+  integrity sha512-w5Jac5SykAeZJKntOxJCrm63Eg5/4dhMWIcuTbo9rpE+brgaSZo0RuNJZeOyMgsUdhDeojvgyQLmjI+K50ZGyg==
+  dependencies:
+    string-width "^4.2.0"
+  optionalDependencies:
+    "@colors/colors" "1.5.0"
+
+cli-truncate@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/cli-truncate/-/cli-truncate-2.1.0.tgz#c39e28bf05edcde5be3b98992a22deed5a2b93c7"
+  integrity sha512-n8fOixwDD6b/ObinzTrp1ZKFzbgvKZvuz/TvejnLn1aQfC6r52XEx85FmuC+3HI+JM7coBRXUvNqEU2PHVrHpg==
+  dependencies:
+    slice-ansi "^3.0.0"
+    string-width "^4.2.0"
+
 cli-width@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/cli-width/-/cli-width-3.0.0.tgz#a2f48437a2caa9a22436e794bf071ec9e61cedf6"
@@ -5028,7 +5579,7 @@ color-alpha@^1.0.4:
   dependencies:
     color-parse "^1.4.1"
 
-color-convert@^1.9.0, color-convert@^1.9.1:
+color-convert@^1.9.0, color-convert@^1.9.1, color-convert@^1.9.3:
   version "1.9.3"
   resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
   integrity sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==
@@ -5138,6 +5689,11 @@ colorette@^1.2.1, colorette@^1.3.0:
   resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.3.0.tgz#ff45d2f0edb244069d3b772adeb04fed38d0a0af"
   integrity sha512-ecORCqbSFP7Wm8Y6lyqMJjexBQqXSF7SSeaTyGGphogUjBlFP9m9o08wy86HL2uB7fMTxtOUzLMk7ogKcxMg1w==
 
+colorette@^2.0.16:
+  version "2.0.20"
+  resolved "https://registry.yarnpkg.com/colorette/-/colorette-2.0.20.tgz#9eb793e6833067f7235902fcd3b09917a000a95a"
+  integrity sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==
+
 colormap@^2.3.1:
   version "2.3.2"
   resolved "https://registry.yarnpkg.com/colormap/-/colormap-2.3.2.tgz#4422c1178ce563806e265b96782737be85815abf"
@@ -5150,7 +5706,7 @@ colors@^1.3.0:
   resolved "https://registry.yarnpkg.com/colors/-/colors-1.4.0.tgz#c50491479d4c1bdaed2c9ced32cf7c7dc2360f78"
   integrity sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA==
 
-combined-stream@^1.0.6, combined-stream@~1.0.6:
+combined-stream@^1.0.6, combined-stream@^1.0.8, combined-stream@~1.0.6:
   version "1.0.8"
   resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f"
   integrity sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==
@@ -5162,16 +5718,26 @@ commander@2, commander@^2.15.1, commander@^2.18.0, commander@^2.19.0, commander@
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
   integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
 
+commander@9.2.0:
+  version "9.2.0"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-9.2.0.tgz#6e21014b2ed90d8b7c9647230d8b7a94a4a419a9"
+  integrity sha512-e2i4wANQiSXgnrBlIatyHtP1odfUp0BbV5Y5nEGbxtIrStkEOAAzCUirvLBNXHLr7kwLvJl6V+4V3XV9x7Wd9w==
+
 commander@^4.1.1:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/commander/-/commander-4.1.1.tgz#9fd602bd936294e9e9ef46a3f4d6964044b18068"
   integrity sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==
 
-commander@^6.2.0:
+commander@^6.2.0, commander@^6.2.1:
   version "6.2.1"
   resolved "https://registry.yarnpkg.com/commander/-/commander-6.2.1.tgz#0792eb682dfbc325999bb2b84fddddba110ac73c"
   integrity sha512-U7VdrJFnJgo4xjrHpTzu0yrHPGImdsmD95ZlgYSEajAn2JKzDhDTPG9kBTefmObL2w/ngeZnilk+OV9CG3d7UA==
 
+common-tags@^1.8.0:
+  version "1.8.2"
+  resolved "https://registry.yarnpkg.com/common-tags/-/common-tags-1.8.2.tgz#94ebb3c076d26032745fd54face7f688ef5ac9c6"
+  integrity sha512-gk/Z852D2Wtb//0I+kRFNKKE9dIIVirjoqPoA1wJU+XePVXZfGeBpk45+A1rKO4Q43prqWBNY/MiIeRLbPWUaA==
+
 commondir@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b"
@@ -5529,6 +6095,13 @@ create-require@^1.1.1:
   resolved "https://registry.yarnpkg.com/create-require/-/create-require-1.1.1.tgz#c1d7e8f1e5f6cfc9ff65f9cd352d37348756c333"
   integrity sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==
 
+cross-fetch@^3.1.5:
+  version "3.1.8"
+  resolved "https://registry.yarnpkg.com/cross-fetch/-/cross-fetch-3.1.8.tgz#0327eba65fd68a7d119f8fb2bf9334a1a7956f82"
+  integrity sha512-cvA+JwZoU0Xq+h6WkMvAUqPEYy92Obet6UdKLfW60qn99ftItKjB5T+BkyWOFWe2pUyfQ+IJHmpOTznqk1M6Kg==
+  dependencies:
+    node-fetch "^2.6.12"
+
 cross-spawn@^6.0.0, cross-spawn@^6.0.5:
   version "6.0.5"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-6.0.5.tgz#4a5ec7c64dfae22c3a14124dbacdee846d80cbc4"
@@ -5540,7 +6113,7 @@ cross-spawn@^6.0.0, cross-spawn@^6.0.5:
     shebang-command "^1.2.0"
     which "^1.2.9"
 
-cross-spawn@^7.0.3:
+cross-spawn@^7.0.0, cross-spawn@^7.0.2, cross-spawn@^7.0.3:
   version "7.0.3"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
   integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
@@ -5820,11 +6393,16 @@ csso@^4.0.2:
   dependencies:
     css-tree "^1.1.2"
 
-cssom@0.3.x, "cssom@>= 0.3.2 < 0.4.0":
+cssom@0.3.x, "cssom@>= 0.3.2 < 0.4.0", cssom@~0.3.6:
   version "0.3.8"
   resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.3.8.tgz#9f1276f5b2b463f2114d3f2c75250af8c1a36f4a"
   integrity sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==
 
+cssom@^0.5.0:
+  version "0.5.0"
+  resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.5.0.tgz#d254fa92cd8b6fbd83811b9fbaed34663cc17c36"
+  integrity sha512-iKuQcq+NdHqlAcwUY0o/HL69XQrUaQdMjmStJ8JFmUaiiQErlhrmuigkg/CU4E2J0IyUKUrMAgl36TvN67MqTw==
+
 cssstyle@^1.0.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/cssstyle/-/cssstyle-1.4.0.tgz#9d31328229d3c565c61e586b02041a28fccdccf1"
@@ -5832,6 +6410,13 @@ cssstyle@^1.0.0:
   dependencies:
     cssom "0.3.x"
 
+cssstyle@^2.3.0:
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/cssstyle/-/cssstyle-2.3.0.tgz#ff665a0ddbdc31864b09647f34163443d90b0852"
+  integrity sha512-AZL67abkUzIuvcHqk7c09cezpGNcxUxU4Ioi/05xHk4DQeTkWmGYftIE6ctU6AEt+Gn4n1lDStOtj7FKycP71A==
+  dependencies:
+    cssom "~0.3.6"
+
 cubic-hermite@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/cubic-hermite/-/cubic-hermite-1.0.0.tgz#84e3b2f272b31454e8393b99bb6aed45168c14e5"
@@ -5864,6 +6449,55 @@ cyclist@^1.0.1:
   resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-1.0.1.tgz#596e9698fd0c80e12038c2b82d6eb1b35b6224d9"
   integrity sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk=
 
+cypress@12.17.4:
+  version "12.17.4"
+  resolved "https://registry.yarnpkg.com/cypress/-/cypress-12.17.4.tgz#b4dadf41673058493fa0d2362faa3da1f6ae2e6c"
+  integrity sha512-gAN8Pmns9MA5eCDFSDJXWKUpaL3IDd89N9TtIupjYnzLSmlpVr+ZR+vb4U/qaMp+lB6tBvAmt7504c3Z4RU5KQ==
+  dependencies:
+    "@cypress/request" "2.88.12"
+    "@cypress/xvfb" "^1.2.4"
+    "@types/node" "^16.18.39"
+    "@types/sinonjs__fake-timers" "8.1.1"
+    "@types/sizzle" "^2.3.2"
+    arch "^2.2.0"
+    blob-util "^2.0.2"
+    bluebird "^3.7.2"
+    buffer "^5.6.0"
+    cachedir "^2.3.0"
+    chalk "^4.1.0"
+    check-more-types "^2.24.0"
+    cli-cursor "^3.1.0"
+    cli-table3 "~0.6.1"
+    commander "^6.2.1"
+    common-tags "^1.8.0"
+    dayjs "^1.10.4"
+    debug "^4.3.4"
+    enquirer "^2.3.6"
+    eventemitter2 "6.4.7"
+    execa "4.1.0"
+    executable "^4.1.1"
+    extract-zip "2.0.1"
+    figures "^3.2.0"
+    fs-extra "^9.1.0"
+    getos "^3.2.1"
+    is-ci "^3.0.0"
+    is-installed-globally "~0.4.0"
+    lazy-ass "^1.6.0"
+    listr2 "^3.8.3"
+    lodash "^4.17.21"
+    log-symbols "^4.0.0"
+    minimist "^1.2.8"
+    ospath "^1.2.2"
+    pretty-bytes "^5.6.0"
+    process "^0.11.10"
+    proxy-from-env "1.0.0"
+    request-progress "^3.0.0"
+    semver "^7.5.3"
+    supports-color "^8.1.1"
+    tmp "~0.2.1"
+    untildify "^4.0.0"
+    yauzl "^2.10.0"
+
 d3-array@1, d3-array@^1.2.1:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/d3-array/-/d3-array-1.2.4.tgz#635ce4d5eea759f6f605863dbcfc30edc737f71f"
@@ -5972,6 +6606,11 @@ dashdash@^1.12.0:
   dependencies:
     assert-plus "^1.0.0"
 
+data-uri-to-buffer@^4.0.0:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/data-uri-to-buffer/-/data-uri-to-buffer-4.0.1.tgz#d8feb2b2881e6a4f58c2e08acfd0e2834e26222e"
+  integrity sha512-0R9ikRb668HB7QDxT1vkpuUBtqc53YyAwMwGeUFKRojY/NWKvdZ+9UYtRfGmhqNbRkTSVpMbmyhXipFFv2cb/A==
+
 data-urls@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/data-urls/-/data-urls-1.1.0.tgz#15ee0582baa5e22bb59c77140da8f9c76963bbfe"
@@ -5981,6 +6620,15 @@ data-urls@^1.0.0:
     whatwg-mimetype "^2.2.0"
     whatwg-url "^7.0.0"
 
+data-urls@^3.0.1:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/data-urls/-/data-urls-3.0.2.tgz#9cf24a477ae22bcef5cd5f6f0bfbc1d2d3be9143"
+  integrity sha512-Jy/tj3ldjZJo63sVAvg6LHt2mHvl4V6AgRAmNDtLdm7faqtsx+aJG42rsyCo9JCoRVKwPFzKlIPx3DIibwSIaQ==
+  dependencies:
+    abab "^2.0.6"
+    whatwg-mimetype "^3.0.0"
+    whatwg-url "^11.0.0"
+
 date-fns@^2.25.0:
   version "2.27.0"
   resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.27.0.tgz#e1ff3c3ddbbab8a2eaadbb6106be2929a5a2d92b"
@@ -5991,6 +6639,11 @@ date-fns@^2.8.1:
   resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.19.0.tgz#65193348635a28d5d916c43ec7ce6fbd145059e1"
   integrity sha512-X3bf2iTPgCAQp9wvjOQytnf5vO5rESYRXlPIVcgSbtT5OTScPcsf9eZU+B/YIkKAtYr5WeCii58BgATrNitlWg==
 
+dayjs@^1.10.4:
+  version "1.11.10"
+  resolved "https://registry.yarnpkg.com/dayjs/-/dayjs-1.11.10.tgz#68acea85317a6e164457d6d6947564029a6a16a0"
+  integrity sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ==
+
 de-indent@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"
@@ -6010,16 +6663,40 @@ debug@4, debug@^4.0.1, debug@^4.1.0, debug@^4.1.1:
   dependencies:
     ms "2.1.2"
 
+debug@^3.1.0, debug@^3.2.7:
+  version "3.2.7"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.7.tgz#72580b7e9145fb39b6676f9c5e5fb100b934179a"
+  integrity sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==
+  dependencies:
+    ms "^2.1.1"
+
+debug@^4.3.2, debug@^4.3.4:
+  version "4.3.4"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
+  integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
+  dependencies:
+    ms "2.1.2"
+
 decamelize@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
   integrity sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=
 
+decimal.js@^10.3.1:
+  version "10.4.3"
+  resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.4.3.tgz#1044092884d245d1b7f65725fa4ad4c6f781cc23"
+  integrity sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==
+
 decode-uri-component@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.0.tgz#eb3913333458775cb84cd1a1fae062106bb87545"
   integrity sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=
 
+deep-is@^0.1.3:
+  version "0.1.4"
+  resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.4.tgz#a6f2dce612fadd2ef1f519b73551f17e85199831"
+  integrity sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==
+
 deep-is@~0.1.3:
   version "0.1.3"
   resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34"
@@ -6035,6 +6712,15 @@ deepmerge@^4.2.2:
   resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-4.2.2.tgz#44d2ea3679b8f4d4ffba33f03d865fc1e7bf4955"
   integrity sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==
 
+define-data-property@^1.0.1, define-data-property@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/define-data-property/-/define-data-property-1.1.1.tgz#c35f7cd0ab09883480d12ac5cb213715587800b3"
+  integrity sha512-E7uGkTzkk1d0ByLeSc6ZsFS79Axg+m1P/VsgYsxHgiuc3tFSj+MjMIwe90FC4lOAZzNBdY7kkO2P2wKdsQ1vgQ==
+  dependencies:
+    get-intrinsic "^1.2.1"
+    gopd "^1.0.1"
+    has-property-descriptors "^1.0.0"
+
 define-properties@^1.1.2, define-properties@^1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.3.tgz#cf88da6cbee26fe6db7094f61d870cbd84cee9f1"
@@ -6042,6 +6728,15 @@ define-properties@^1.1.2, define-properties@^1.1.3:
   dependencies:
     object-keys "^1.0.12"
 
+define-properties@^1.2.0, define-properties@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.2.1.tgz#10781cc616eb951a80a034bafcaa7377f6af2b6c"
+  integrity sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==
+  dependencies:
+    define-data-property "^1.0.1"
+    has-property-descriptors "^1.0.0"
+    object-keys "^1.1.1"
+
 define-property@^0.2.5:
   version "0.2.5"
   resolved "https://registry.yarnpkg.com/define-property/-/define-property-0.2.5.tgz#c35b1ef918ec3c990f9a5bc57be04aacec5c8116"
@@ -6161,6 +6856,13 @@ dir-glob@^3.0.1:
   dependencies:
     path-type "^4.0.0"
 
+doctrine@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-2.1.0.tgz#5cd01fc101621b42c4cd7f5d1a66243716d3f39d"
+  integrity sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==
+  dependencies:
+    esutils "^2.0.2"
+
 doctrine@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-3.0.0.tgz#addebead72a6574db783639dc87a121773973961"
@@ -6210,6 +6912,13 @@ domexception@^1.0.1:
   dependencies:
     webidl-conversions "^4.0.2"
 
+domexception@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/domexception/-/domexception-4.0.0.tgz#4ad1be56ccadc86fc76d033353999a8037d03673"
+  integrity sha512-A2is4PLG+eeSfoTMA95/s4pvAoSo2mKtiM5jlHkAVewmiO8ISFTFKZjH7UAM1Atli/OT/7JHOrJRJiMKUZKYBw==
+  dependencies:
+    webidl-conversions "^7.0.0"
+
 domhandler@^2.3.0:
   version "2.4.2"
   resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-2.4.2.tgz#8805097e933d65e85546f726d60f5eb88b44f803"
@@ -6217,6 +6926,11 @@ domhandler@^2.3.0:
   dependencies:
     domelementtype "1"
 
+dompurify@^2.3.8:
+  version "2.4.4"
+  resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-2.4.4.tgz#c17803931dd524e1b68e0e940a84567f9498f4bd"
+  integrity sha512-1e2SpqHiRx4DPvmRuXU5J0di3iQACwJM+mFGE2HAkkK7Tbnfk9WcghcAmyWc9CRrjyRRUpmuhPUH6LphQQR3EQ==
+
 domutils@^1.5.1, domutils@^1.7.0:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.7.0.tgz#56ea341e834e06e6748af7a1cb25da67ea9f8c2a"
@@ -6288,10 +7002,10 @@ earcut@^2.1.5, earcut@^2.2.2:
   resolved "https://registry.yarnpkg.com/earcut/-/earcut-2.2.2.tgz#41b0bc35f63e0fe80da7cddff28511e7e2e80d11"
   integrity sha512-eZoZPPJcUHnfRZ0PjLvx2qBordSiO8ofC3vt+qACLM95u+4DovnbYNpQtJh0DNsWj8RnxrQytD4WA8gj5cRIaQ==
 
-earcut@^2.2.3:
-  version "2.2.3"
-  resolved "https://registry.yarnpkg.com/earcut/-/earcut-2.2.3.tgz#d44ced2ff5a18859568e327dd9c7d46b16f55cf4"
-  integrity sha512-iRDI1QeCQIhMCZk48DRDMVgQSSBDmbzzNhnxIo+pwx3swkfjMh6vh0nWLq1NdvGHLKH6wIrAM3vQWeTj6qeoug==
+earcut@^2.2.4:
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/earcut/-/earcut-2.2.4.tgz#6d02fd4d68160c114825d06890a92ecaae60343a"
+  integrity sha512-/pjZsA1b4RPHbeWZQn66SWS8nZZWLQQ23oE3Eam7aroEFGEvwKAsJfZ9ytiEMycfzXWpca4FA9QIOehf7PocBQ==
 
 ecc-jsbn@~0.1.1:
   version "0.1.2"
@@ -6437,6 +7151,14 @@ enhanced-resolve@^4.0.0, enhanced-resolve@^4.1.1, enhanced-resolve@^4.5.0:
     memory-fs "^0.5.0"
     tapable "^1.0.0"
 
+enquirer@^2.3.6:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/enquirer/-/enquirer-2.4.1.tgz#93334b3fbd74fc7097b224ab4a8fb7e40bf4ae56"
+  integrity sha512-rRqJg/6gd538VHvR3PSrdRBb/1Vy2YfzHqzvbhGIQpDRKIa4FgV/54b5Q1xYSxOOwKvjXweS26E0Q+nAMwp2pQ==
+  dependencies:
+    ansi-colors "^4.1.1"
+    strip-ansi "^6.0.1"
+
 entities@^1.1.1:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/entities/-/entities-1.1.2.tgz#bdfa735299664dfafd34529ed4f8522a275fea56"
@@ -6494,6 +7216,87 @@ es-abstract@^1.17.2, es-abstract@^1.18.0-next.2, es-abstract@^1.19.1:
     string.prototype.trimstart "^1.0.4"
     unbox-primitive "^1.0.1"
 
+es-abstract@^1.22.1:
+  version "1.22.3"
+  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.22.3.tgz#48e79f5573198de6dee3589195727f4f74bc4f32"
+  integrity sha512-eiiY8HQeYfYH2Con2berK+To6GrK2RxbPawDkGq4UiCQQfZHb6wX9qQqkbpPqaxQFcl8d9QzZqo0tGE0VcrdwA==
+  dependencies:
+    array-buffer-byte-length "^1.0.0"
+    arraybuffer.prototype.slice "^1.0.2"
+    available-typed-arrays "^1.0.5"
+    call-bind "^1.0.5"
+    es-set-tostringtag "^2.0.1"
+    es-to-primitive "^1.2.1"
+    function.prototype.name "^1.1.6"
+    get-intrinsic "^1.2.2"
+    get-symbol-description "^1.0.0"
+    globalthis "^1.0.3"
+    gopd "^1.0.1"
+    has-property-descriptors "^1.0.0"
+    has-proto "^1.0.1"
+    has-symbols "^1.0.3"
+    hasown "^2.0.0"
+    internal-slot "^1.0.5"
+    is-array-buffer "^3.0.2"
+    is-callable "^1.2.7"
+    is-negative-zero "^2.0.2"
+    is-regex "^1.1.4"
+    is-shared-array-buffer "^1.0.2"
+    is-string "^1.0.7"
+    is-typed-array "^1.1.12"
+    is-weakref "^1.0.2"
+    object-inspect "^1.13.1"
+    object-keys "^1.1.1"
+    object.assign "^4.1.4"
+    regexp.prototype.flags "^1.5.1"
+    safe-array-concat "^1.0.1"
+    safe-regex-test "^1.0.0"
+    string.prototype.trim "^1.2.8"
+    string.prototype.trimend "^1.0.7"
+    string.prototype.trimstart "^1.0.7"
+    typed-array-buffer "^1.0.0"
+    typed-array-byte-length "^1.0.0"
+    typed-array-byte-offset "^1.0.0"
+    typed-array-length "^1.0.4"
+    unbox-primitive "^1.0.2"
+    which-typed-array "^1.1.13"
+
+es-iterator-helpers@^1.0.12:
+  version "1.0.15"
+  resolved "https://registry.yarnpkg.com/es-iterator-helpers/-/es-iterator-helpers-1.0.15.tgz#bd81d275ac766431d19305923707c3efd9f1ae40"
+  integrity sha512-GhoY8uYqd6iwUl2kgjTm4CZAf6oo5mHK7BPqx3rKgx893YSsy0LGHV6gfqqQvZt/8xM8xeOnfXBCfqclMKkJ5g==
+  dependencies:
+    asynciterator.prototype "^1.0.0"
+    call-bind "^1.0.2"
+    define-properties "^1.2.1"
+    es-abstract "^1.22.1"
+    es-set-tostringtag "^2.0.1"
+    function-bind "^1.1.1"
+    get-intrinsic "^1.2.1"
+    globalthis "^1.0.3"
+    has-property-descriptors "^1.0.0"
+    has-proto "^1.0.1"
+    has-symbols "^1.0.3"
+    internal-slot "^1.0.5"
+    iterator.prototype "^1.1.2"
+    safe-array-concat "^1.0.1"
+
+es-set-tostringtag@^2.0.1:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/es-set-tostringtag/-/es-set-tostringtag-2.0.2.tgz#11f7cc9f63376930a5f20be4915834f4bc74f9c9"
+  integrity sha512-BuDyupZt65P9D2D2vA/zqcI3G5xRsklm5N3xCwuiy+/vKy8i0ifdsQP1sLgO4tZDSCaQUSnmC48khknGMV3D2Q==
+  dependencies:
+    get-intrinsic "^1.2.2"
+    has-tostringtag "^1.0.0"
+    hasown "^2.0.0"
+
+es-shim-unscopables@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/es-shim-unscopables/-/es-shim-unscopables-1.0.2.tgz#1f6942e71ecc7835ed1c8a83006d8771a63a3763"
+  integrity sha512-J3yBRXCzDu4ULnQwxyToo/OjdMx6akgVC7K6few0a7F/0wLtmKKN7I73AH5T2836UuXRqN7Qg+IIUw/+YJksRw==
+  dependencies:
+    hasown "^2.0.0"
+
 es-to-primitive@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.1.tgz#e55cd4c9cdc188bcefb03b366c736323fc5c898a"
@@ -6564,6 +7367,11 @@ escape-string-regexp@^2.0.0:
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz#a30304e99daa32e23b2fd20f51babd07cffca344"
   integrity sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==
 
+escape-string-regexp@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34"
+  integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
+
 escodegen@^1.11.1, escodegen@^1.9.1:
   version "1.14.3"
   resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-1.14.3.tgz#4e7b81fba61581dc97582ed78cab7f0e8d63f503"
@@ -6576,6 +7384,18 @@ escodegen@^1.11.1, escodegen@^1.9.1:
   optionalDependencies:
     source-map "~0.6.1"
 
+escodegen@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-2.0.0.tgz#5e32b12833e8aa8fa35e1bf0befa89380484c7dd"
+  integrity sha512-mmHKys/C8BFUGI+MAWNcSYoORYLMdPzjrknd2Vc+bUsjN5bXcr8EhrNB+UTqfL1y3I9c4fw2ihgtMPQLBRiQxw==
+  dependencies:
+    esprima "^4.0.1"
+    estraverse "^5.2.0"
+    esutils "^2.0.2"
+    optionator "^0.8.1"
+  optionalDependencies:
+    source-map "~0.6.1"
+
 eslint-config-prettier@^6.9.0:
   version "6.15.0"
   resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-6.15.0.tgz#7f93f6cb7d45a92f1537a70ecc06366e1ac6fed9"
@@ -6583,6 +7403,25 @@ eslint-config-prettier@^6.9.0:
   dependencies:
     get-stdin "^6.0.0"
 
+eslint-config-standard-jsx@^11.0.0:
+  version "11.0.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-standard-jsx/-/eslint-config-standard-jsx-11.0.0.tgz#70852d395731a96704a592be5b0bfaccfeded239"
+  integrity sha512-+1EV/R0JxEK1L0NGolAr8Iktm3Rgotx3BKwgaX+eAuSX8D952LULKtjgZD3F+e6SvibONnhLwoTi9DPxN5LvvQ==
+
+eslint-config-standard@17.1.0:
+  version "17.1.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-standard/-/eslint-config-standard-17.1.0.tgz#40ffb8595d47a6b242e07cbfd49dc211ed128975"
+  integrity sha512-IwHwmaBNtDK4zDHQukFDW5u/aTb8+meQWZvNFWkiGmbWjD6bqyuSSBxxXKkCftCUzc1zwCH2m/baCNDLGmuO5Q==
+
+eslint-import-resolver-node@^0.3.9:
+  version "0.3.9"
+  resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.9.tgz#d4eaac52b8a2e7c3cd1903eb00f7e053356118ac"
+  integrity sha512-WFj2isz22JahUv+B788TlO3N6zL3nNJGU8CcZbPZvVEkBPaJdCV4vy5wyghty5ROFbCRnm132v8BScu5/1BQ8g==
+  dependencies:
+    debug "^3.2.7"
+    is-core-module "^2.13.0"
+    resolve "^1.22.4"
+
 eslint-loader@^3.0.3:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/eslint-loader/-/eslint-loader-3.0.4.tgz#4329482877e381c91460a055bcd08d3855b9922d"
@@ -6594,6 +7433,58 @@ eslint-loader@^3.0.3:
     object-hash "^2.0.3"
     schema-utils "^2.6.5"
 
+eslint-module-utils@^2.8.0:
+  version "2.8.0"
+  resolved "https://registry.yarnpkg.com/eslint-module-utils/-/eslint-module-utils-2.8.0.tgz#e439fee65fc33f6bba630ff621efc38ec0375c49"
+  integrity sha512-aWajIYfsqCKRDgUfjEXNN/JlrzauMuSEy5sbd7WXbtW3EH6A6MpwEh42c7qD+MqQo9QMJ6fWLAeIJynx0g6OAw==
+  dependencies:
+    debug "^3.2.7"
+
+eslint-plugin-es@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-es/-/eslint-plugin-es-4.1.0.tgz#f0822f0c18a535a97c3e714e89f88586a7641ec9"
+  integrity sha512-GILhQTnjYE2WorX5Jyi5i4dz5ALWxBIdQECVQavL6s7cI76IZTDWleTHkxz/QT3kvcs2QlGHvKLYsSlPOlPXnQ==
+  dependencies:
+    eslint-utils "^2.0.0"
+    regexpp "^3.0.0"
+
+eslint-plugin-import@^2.27.5:
+  version "2.29.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.29.0.tgz#8133232e4329ee344f2f612885ac3073b0b7e155"
+  integrity sha512-QPOO5NO6Odv5lpoTkddtutccQjysJuFxoPS7fAHO+9m9udNHvTCPSAMW9zGAYj8lAIdr40I8yPCdUYrncXtrwg==
+  dependencies:
+    array-includes "^3.1.7"
+    array.prototype.findlastindex "^1.2.3"
+    array.prototype.flat "^1.3.2"
+    array.prototype.flatmap "^1.3.2"
+    debug "^3.2.7"
+    doctrine "^2.1.0"
+    eslint-import-resolver-node "^0.3.9"
+    eslint-module-utils "^2.8.0"
+    hasown "^2.0.0"
+    is-core-module "^2.13.1"
+    is-glob "^4.0.3"
+    minimatch "^3.1.2"
+    object.fromentries "^2.0.7"
+    object.groupby "^1.0.1"
+    object.values "^1.1.7"
+    semver "^6.3.1"
+    tsconfig-paths "^3.14.2"
+
+eslint-plugin-n@^15.7.0:
+  version "15.7.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-n/-/eslint-plugin-n-15.7.0.tgz#e29221d8f5174f84d18f2eb94765f2eeea033b90"
+  integrity sha512-jDex9s7D/Qial8AGVIHq4W7NswpUD5DPDL2RH8Lzd9EloWUuvUkHfv4FRLMipH5q2UtyurorBkPeNi1wVWNh3Q==
+  dependencies:
+    builtins "^5.0.1"
+    eslint-plugin-es "^4.1.0"
+    eslint-utils "^3.0.0"
+    ignore "^5.1.1"
+    is-core-module "^2.11.0"
+    minimatch "^3.1.2"
+    resolve "^1.22.1"
+    semver "^7.3.8"
+
 eslint-plugin-prettier@^3.1.2:
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-3.3.1.tgz#7079cfa2497078905011e6f82e8dd8453d1371b7"
@@ -6601,6 +7492,33 @@ eslint-plugin-prettier@^3.1.2:
   dependencies:
     prettier-linter-helpers "^1.0.0"
 
+eslint-plugin-promise@^6.1.1:
+  version "6.1.1"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-promise/-/eslint-plugin-promise-6.1.1.tgz#269a3e2772f62875661220631bd4dafcb4083816"
+  integrity sha512-tjqWDwVZQo7UIPMeDReOpUgHCmCiH+ePnVT+5zVapL0uuHnegBUs2smM13CzOs2Xb5+MHMRFTs9v24yjba4Oig==
+
+eslint-plugin-react@^7.32.2:
+  version "7.33.2"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-react/-/eslint-plugin-react-7.33.2.tgz#69ee09443ffc583927eafe86ffebb470ee737608"
+  integrity sha512-73QQMKALArI8/7xGLNI/3LylrEYrlKZSb5C9+q3OtOewTnMQi5cT+aE9E41sLCmli3I9PGGmD1yiZydyo4FEPw==
+  dependencies:
+    array-includes "^3.1.6"
+    array.prototype.flatmap "^1.3.1"
+    array.prototype.tosorted "^1.1.1"
+    doctrine "^2.1.0"
+    es-iterator-helpers "^1.0.12"
+    estraverse "^5.3.0"
+    jsx-ast-utils "^2.4.1 || ^3.0.0"
+    minimatch "^3.1.2"
+    object.entries "^1.1.6"
+    object.fromentries "^2.0.6"
+    object.hasown "^1.1.2"
+    object.values "^1.1.6"
+    prop-types "^15.8.1"
+    resolve "^2.0.0-next.4"
+    semver "^6.3.1"
+    string.prototype.matchall "^4.0.8"
+
 eslint-plugin-vue@^6.1.2:
   version "6.2.2"
   resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-6.2.2.tgz#27fecd9a3a24789b0f111ecdd540a9e56198e0fe"
@@ -6626,6 +7544,14 @@ eslint-scope@^5.0.0:
     esrecurse "^4.3.0"
     estraverse "^4.1.1"
 
+eslint-scope@^7.2.2:
+  version "7.2.2"
+  resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-7.2.2.tgz#deb4f92563390f32006894af62a22dba1c46423f"
+  integrity sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==
+  dependencies:
+    esrecurse "^4.3.0"
+    estraverse "^5.2.0"
+
 eslint-utils@^1.4.3:
   version "1.4.3"
   resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-1.4.3.tgz#74fec7c54d0776b6f67e0251040b5806564e981f"
@@ -6633,11 +7559,35 @@ eslint-utils@^1.4.3:
   dependencies:
     eslint-visitor-keys "^1.1.0"
 
+eslint-utils@^2.0.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-2.1.0.tgz#d2de5e03424e707dc10c74068ddedae708741b27"
+  integrity sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg==
+  dependencies:
+    eslint-visitor-keys "^1.1.0"
+
+eslint-utils@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-3.0.0.tgz#8aebaface7345bb33559db0a1f13a1d2d48c3672"
+  integrity sha512-uuQC43IGctw68pJA1RgbQS8/NP7rch6Cwd4j3ZBtgo4/8Flj4eGE7ZYSZRN3iq5pVUv6GPdW5Z1RFleo84uLDA==
+  dependencies:
+    eslint-visitor-keys "^2.0.0"
+
 eslint-visitor-keys@^1.0.0, eslint-visitor-keys@^1.1.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz#30ebd1ef7c2fdff01c3a4f151044af25fab0523e"
   integrity sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==
 
+eslint-visitor-keys@^2.0.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303"
+  integrity sha512-0rSmRBzXgDzIsD6mGdJgevzgezI534Cer5L/vyMX0kHzT/jiB43jRhd9YUlMGYLQy2zprNmoT8qasCGtY+QaKw==
+
+eslint-visitor-keys@^3.3.0, eslint-visitor-keys@^3.4.1, eslint-visitor-keys@^3.4.3:
+  version "3.4.3"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz#0cd72fe8550e3c2eae156a96a4dddcd1c8ac5800"
+  integrity sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==
+
 eslint@^6.8.0:
   version "6.8.0"
   resolved "https://registry.yarnpkg.com/eslint/-/eslint-6.8.0.tgz#62262d6729739f9275723824302fb227c8c93ffb"
@@ -6681,6 +7631,55 @@ eslint@^6.8.0:
     text-table "^0.2.0"
     v8-compile-cache "^2.0.3"
 
+eslint@^8.41.0:
+  version "8.55.0"
+  resolved "https://registry.yarnpkg.com/eslint/-/eslint-8.55.0.tgz#078cb7b847d66f2c254ea1794fa395bf8e7e03f8"
+  integrity sha512-iyUUAM0PCKj5QpwGfmCAG9XXbZCWsqP/eWAWrG/W0umvjuLRBECwSFdt+rCntju0xEH7teIABPwXpahftIaTdA==
+  dependencies:
+    "@eslint-community/eslint-utils" "^4.2.0"
+    "@eslint-community/regexpp" "^4.6.1"
+    "@eslint/eslintrc" "^2.1.4"
+    "@eslint/js" "8.55.0"
+    "@humanwhocodes/config-array" "^0.11.13"
+    "@humanwhocodes/module-importer" "^1.0.1"
+    "@nodelib/fs.walk" "^1.2.8"
+    "@ungap/structured-clone" "^1.2.0"
+    ajv "^6.12.4"
+    chalk "^4.0.0"
+    cross-spawn "^7.0.2"
+    debug "^4.3.2"
+    doctrine "^3.0.0"
+    escape-string-regexp "^4.0.0"
+    eslint-scope "^7.2.2"
+    eslint-visitor-keys "^3.4.3"
+    espree "^9.6.1"
+    esquery "^1.4.2"
+    esutils "^2.0.2"
+    fast-deep-equal "^3.1.3"
+    file-entry-cache "^6.0.1"
+    find-up "^5.0.0"
+    glob-parent "^6.0.2"
+    globals "^13.19.0"
+    graphemer "^1.4.0"
+    ignore "^5.2.0"
+    imurmurhash "^0.1.4"
+    is-glob "^4.0.0"
+    is-path-inside "^3.0.3"
+    js-yaml "^4.1.0"
+    json-stable-stringify-without-jsonify "^1.0.1"
+    levn "^0.4.1"
+    lodash.merge "^4.6.2"
+    minimatch "^3.1.2"
+    natural-compare "^1.4.0"
+    optionator "^0.9.3"
+    strip-ansi "^6.0.1"
+    text-table "^0.2.0"
+
+esm@^3.2.25:
+  version "3.2.25"
+  resolved "https://registry.yarnpkg.com/esm/-/esm-3.2.25.tgz#342c18c29d56157688ba5ce31f8431fbb795cc10"
+  integrity sha512-U1suiZ2oDVWv4zPO56S0NcR5QriEahGtdN2OR6FiOG4WJvcjBVFB0qI4+eKoWFH483PKGuLuu6V8Z4T5g63UVA==
+
 espree@^6.1.2, espree@^6.2.1:
   version "6.2.1"
   resolved "https://registry.yarnpkg.com/espree/-/espree-6.2.1.tgz#77fc72e1fd744a2052c20f38a5b575832e82734a"
@@ -6690,6 +7689,15 @@ espree@^6.1.2, espree@^6.2.1:
     acorn-jsx "^5.2.0"
     eslint-visitor-keys "^1.1.0"
 
+espree@^9.6.0, espree@^9.6.1:
+  version "9.6.1"
+  resolved "https://registry.yarnpkg.com/espree/-/espree-9.6.1.tgz#a2a17b8e434690a5432f2f8018ce71d331a48c6f"
+  integrity sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==
+  dependencies:
+    acorn "^8.9.0"
+    acorn-jsx "^5.3.2"
+    eslint-visitor-keys "^3.4.1"
+
 esprima@^4.0.0, esprima@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71"
@@ -6702,6 +7710,13 @@ esquery@^1.0.1, esquery@^1.4.0:
   dependencies:
     estraverse "^5.1.0"
 
+esquery@^1.4.2:
+  version "1.5.0"
+  resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.5.0.tgz#6ce17738de8577694edd7361c57182ac8cb0db0b"
+  integrity sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==
+  dependencies:
+    estraverse "^5.1.0"
+
 esrecurse@^4.1.0, esrecurse@^4.3.0:
   version "4.3.0"
   resolved "https://registry.yarnpkg.com/esrecurse/-/esrecurse-4.3.0.tgz#7ad7964d679abb28bee72cec63758b1c5d2c9921"
@@ -6719,6 +7734,11 @@ estraverse@^5.1.0, estraverse@^5.2.0:
   resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-5.2.0.tgz#307df42547e6cc7324d3cf03c155d5cdb8c53880"
   integrity sha512-BxbNGGNm0RyRYvUdHpIwv9IWzeM9XClbOxwoATuFdOE7ZE6wHL+HQ5T8hoPM+zHvmKzzsEqhgy0GrQ5X13afiQ==
 
+estraverse@^5.3.0:
+  version "5.3.0"
+  resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-5.3.0.tgz#2eea5290702f26ab8fe5370370ff86c965d21123"
+  integrity sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==
+
 esutils@^2.0.2:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64"
@@ -6734,12 +7754,17 @@ event-target-shim@^5.0.0:
   resolved "https://registry.yarnpkg.com/event-target-shim/-/event-target-shim-5.0.1.tgz#5d4d3ebdf9583d63a5333ce2deb7480ab2b05789"
   integrity sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ==
 
+eventemitter2@6.4.7:
+  version "6.4.7"
+  resolved "https://registry.yarnpkg.com/eventemitter2/-/eventemitter2-6.4.7.tgz#a7f6c4d7abf28a14c1ef3442f21cb306a054271d"
+  integrity sha512-tYUSVOGeQPKt/eC1ABfhHy5Xd96N3oIijJvN3O9+TsC28T5V9yX9oEfEK5faP0EFSNVOG97qtAS68GBrQB2hDg==
+
 eventemitter3@^4.0.0:
   version "4.0.7"
   resolved "https://registry.yarnpkg.com/eventemitter3/-/eventemitter3-4.0.7.tgz#2de9b68f6528d5644ef5c59526a1b4a07306169f"
   integrity sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==
 
-events@^3.0.0, events@^3.2.0:
+events@^3.0.0, events@^3.2.0, events@^3.3.0:
   version "3.3.0"
   resolved "https://registry.yarnpkg.com/events/-/events-3.3.0.tgz#31a95ad0a924e2d2c419a813aeb2c4e878ea7400"
   integrity sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==
@@ -6762,6 +7787,21 @@ exec-sh@^0.3.2:
   resolved "https://registry.yarnpkg.com/exec-sh/-/exec-sh-0.3.4.tgz#3a018ceb526cc6f6df2bb504b2bfe8e3a4934ec5"
   integrity sha512-sEFIkc61v75sWeOe72qyrqg2Qg0OuLESziUDk/O/z2qgS15y2gWVFrI6f2Qn/qw/0/NCfCEsmNA4zOjkwEZT1A==
 
+execa@4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/execa/-/execa-4.1.0.tgz#4e5491ad1572f2f17a77d388c6c857135b22847a"
+  integrity sha512-j5W0//W7f8UxAn8hXVnwG8tLwdiUy4FJLcSupCg6maBYZDpyBvTApK7KyuI4bKj8KOh1r2YH+6ucuYtJv1bTZA==
+  dependencies:
+    cross-spawn "^7.0.0"
+    get-stream "^5.0.0"
+    human-signals "^1.1.1"
+    is-stream "^2.0.0"
+    merge-stream "^2.0.0"
+    npm-run-path "^4.0.0"
+    onetime "^5.1.0"
+    signal-exit "^3.0.2"
+    strip-final-newline "^2.0.0"
+
 execa@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/execa/-/execa-1.0.0.tgz#c6236a5bb4df6d6f15e88e7f017798216749ddd8"
@@ -6790,6 +7830,13 @@ execa@^5.0.0:
     signal-exit "^3.0.3"
     strip-final-newline "^2.0.0"
 
+executable@^4.1.1:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/executable/-/executable-4.1.1.tgz#41532bff361d3e57af4d763b70582db18f5d133c"
+  integrity sha512-8iA79xD3uAch729dUG8xaaBBFGaEa0wdD2VkYLFHwlqosEj/jT66AzcreRDSgV7ehnNLBW2WR5jIXwGKjVdTLg==
+  dependencies:
+    pify "^2.2.0"
+
 exit@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/exit/-/exit-0.1.2.tgz#0632638f8d877cc82107d30a0fff1a17cba1cd0c"
@@ -6928,6 +7975,17 @@ extract-frustum-planes@^1.0.0:
   resolved "https://registry.yarnpkg.com/extract-frustum-planes/-/extract-frustum-planes-1.0.0.tgz#97d5703ff0564c8c3c6838cac45f9e7bc52c9ef5"
   integrity sha1-l9VwP/BWTIw8aDjKxF+ee8UsnvU=
 
+extract-zip@2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/extract-zip/-/extract-zip-2.0.1.tgz#663dca56fe46df890d5f131ef4a06d22bb8ba13a"
+  integrity sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg==
+  dependencies:
+    debug "^4.1.1"
+    get-stream "^5.1.0"
+    yauzl "^2.10.0"
+  optionalDependencies:
+    "@types/yauzl" "^2.9.1"
+
 extsprintf@1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.3.0.tgz#96918440e3041a7a414f8c52e3c574eb3c3e1e05"
@@ -6958,7 +8016,7 @@ fast-copy@^2.1.0:
   resolved "https://registry.yarnpkg.com/fast-copy/-/fast-copy-2.1.1.tgz#f5cbcf2df64215e59b8e43f0b2caabc19848083a"
   integrity sha512-Qod3DdRgFZ8GUIM6ygeoZYpQ0QLW9cf/FS9KhhjlYggcSZXWAemAw8BOCO5LuYCrR3Uj3qXDVTUzOUwG8C7beQ==
 
-fast-deep-equal@^3.1.1:
+fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
   version "3.1.3"
   resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525"
   integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
@@ -6992,7 +8050,7 @@ fast-json-stable-stringify@^2.0.0:
   resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
   integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==
 
-fast-levenshtein@~2.0.6:
+fast-levenshtein@^2.0.6, fast-levenshtein@~2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
   integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=
@@ -7016,12 +8074,27 @@ fb-watchman@^2.0.0:
   dependencies:
     bser "2.1.1"
 
+fd-slicer@~1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/fd-slicer/-/fd-slicer-1.1.0.tgz#25c7c89cb1f9077f8891bbe61d8f390eae256f1e"
+  integrity sha512-cE1qsB/VwyQozZ+q1dGxR8LBYNZeofhEdUNGSMbQD3Gw2lAzX9Zb3uIU6Ebc/Fmyjo9AWWfnn0AUCHqtevs/8g==
+  dependencies:
+    pend "~1.2.0"
+
+fetch-blob@^3.1.2, fetch-blob@^3.1.4:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/fetch-blob/-/fetch-blob-3.2.0.tgz#f09b8d4bbd45adc6f0c20b7e787e793e309dcce9"
+  integrity sha512-7yAQpD2UMJzLi1Dqv7qFYnPbaPx7ZfFK6PiIxQ4PfkGPyNyl2Ugx+a/umUonmKqjhM4DnfbMvdX6otXq83soQQ==
+  dependencies:
+    node-domexception "^1.0.0"
+    web-streams-polyfill "^3.0.3"
+
 figgy-pudding@^3.5.1:
   version "3.5.2"
   resolved "https://registry.yarnpkg.com/figgy-pudding/-/figgy-pudding-3.5.2.tgz#b4eee8148abb01dcf1d1ac34367d59e12fa61d6e"
   integrity sha512-0btnI/H8f2pavGMN8w40mlSKOfTK2SVJmBfBeVIj3kNw0swwgzyRq0d5TJVOwodFmtvpPeWPN/MCcfuWF0Ezbw==
 
-figures@^3.0.0:
+figures@^3.0.0, figures@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/figures/-/figures-3.2.0.tgz#625c18bd293c604dc4a8ddb2febf0c88341746af"
   integrity sha512-yaduQFRKLXYOGgEn6AZau90j3ggSOyiqXU0F9JZfeXYhNa+Jk4X+s45A2zg5jns87GAFa34BBm2kXw4XpNcbdg==
@@ -7035,6 +8108,13 @@ file-entry-cache@^5.0.1:
   dependencies:
     flat-cache "^2.0.1"
 
+file-entry-cache@^6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-6.0.1.tgz#211b2dd9659cb0394b073e7323ac3c933d522027"
+  integrity sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==
+  dependencies:
+    flat-cache "^3.0.4"
+
 file-loader@^5.0.2:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/file-loader/-/file-loader-5.1.0.tgz#cb56c070efc0e40666424309bd0d9e45ac6f2bb8"
@@ -7154,6 +8234,14 @@ find-up@^4.0.0:
     locate-path "^5.0.0"
     path-exists "^4.0.0"
 
+find-up@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/find-up/-/find-up-5.0.0.tgz#4c92819ecb7083561e4f4a240a86be5198f536fc"
+  integrity sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==
+  dependencies:
+    locate-path "^6.0.0"
+    path-exists "^4.0.0"
+
 flat-cache@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-2.0.1.tgz#5d296d6f04bda44a4630a301413bdbc2ec085ec0"
@@ -7163,6 +8251,15 @@ flat-cache@^2.0.1:
     rimraf "2.6.3"
     write "1.0.3"
 
+flat-cache@^3.0.4:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-3.2.0.tgz#2c0c2d5040c99b1632771a9d105725c0115363ee"
+  integrity sha512-CYcENa+FtcUKLmhhqyctpclsq7QF38pKjZHsGNiSQF5r4FtoKDWabFDl3hzaEQMvT1LHEysw5twgLvpYYb4vbw==
+  dependencies:
+    flatted "^3.2.9"
+    keyv "^4.5.3"
+    rimraf "^3.0.2"
+
 flat@^5.0.0:
   version "5.0.2"
   resolved "https://registry.yarnpkg.com/flat/-/flat-5.0.2.tgz#8ca6fe332069ffa9d324c327198c598259ceb241"
@@ -7173,6 +8270,11 @@ flatted@^2.0.0:
   resolved "https://registry.yarnpkg.com/flatted/-/flatted-2.0.2.tgz#4575b21e2bcee7434aa9be662f4b7b5f9c2b5138"
   integrity sha512-r5wGx7YeOwNWNlCA0wQ86zKyDLMQr+/RB8xy74M4hTphfmjlijTSSXGuH8rnvKZnfT9i+75zmd8jcKdMR4O6jA==
 
+flatted@^3.2.9:
+  version "3.2.9"
+  resolved "https://registry.yarnpkg.com/flatted/-/flatted-3.2.9.tgz#7eb4c67ca1ba34232ca9d2d93e9886e611ad7daf"
+  integrity sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==
+
 flatten-vertex-data@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/flatten-vertex-data/-/flatten-vertex-data-1.0.2.tgz#889fd60bea506006ca33955ee1105175fb620219"
@@ -7263,6 +8365,15 @@ fork-ts-checker-webpack-plugin@^3.1.1:
     tapable "^1.0.0"
     worker-rpc "^0.1.0"
 
+form-data@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/form-data/-/form-data-4.0.0.tgz#93919daeaf361ee529584b9b31664dc12c9fa452"
+  integrity sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==
+  dependencies:
+    asynckit "^0.4.0"
+    combined-stream "^1.0.8"
+    mime-types "^2.1.12"
+
 form-data@~2.3.2:
   version "2.3.3"
   resolved "https://registry.yarnpkg.com/form-data/-/form-data-2.3.3.tgz#dcce52c05f644f298c6a7ab936bd724ceffbf3a6"
@@ -7272,6 +8383,13 @@ form-data@~2.3.2:
     combined-stream "^1.0.6"
     mime-types "^2.1.12"
 
+formdata-polyfill@^4.0.10:
+  version "4.0.10"
+  resolved "https://registry.yarnpkg.com/formdata-polyfill/-/formdata-polyfill-4.0.10.tgz#24807c31c9d402e002ab3d8c720144ceb8848423"
+  integrity sha512-buewHzMvYL29jdeQTVILecSaZKnt/RJWjoZCF5OW60Z67/GmSLBkOFM7qh1PI3zFNtJbaZL5eQu1vLfazOwj4g==
+  dependencies:
+    fetch-blob "^3.1.2"
+
 forwarded@~0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/forwarded/-/forwarded-0.1.2.tgz#98c23dab1175657b8c0573e8ceccd91b0ff18c84"
@@ -7376,11 +8494,31 @@ function-bind@^1.1.1:
   resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
   integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==
 
+function-bind@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.2.tgz#2c02d864d97f3ea6c8830c464cbd11ab6eab7a1c"
+  integrity sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==
+
+function.prototype.name@^1.1.5, function.prototype.name@^1.1.6:
+  version "1.1.6"
+  resolved "https://registry.yarnpkg.com/function.prototype.name/-/function.prototype.name-1.1.6.tgz#cdf315b7d90ee77a4c6ee216c3c3362da07533fd"
+  integrity sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+    functions-have-names "^1.2.3"
+
 functional-red-black-tree@^1.0.0, functional-red-black-tree@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz#1b0ab3bd553b2a0d6399d29c0e3ea0b252078327"
   integrity sha1-GwqzvVU7Kg1jmdKcDj6gslIHgyc=
 
+functions-have-names@^1.2.3:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/functions-have-names/-/functions-have-names-1.2.3.tgz#0404fe4ee2ba2f607f0e0ec3c80bae994133b834"
+  integrity sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==
+
 gamma@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/gamma/-/gamma-0.1.0.tgz#3315643403bf27906ca80ab37c36ece9440ef330"
@@ -7448,6 +8586,16 @@ get-intrinsic@^1.0.2, get-intrinsic@^1.1.0, get-intrinsic@^1.1.1:
     has "^1.0.3"
     has-symbols "^1.0.1"
 
+get-intrinsic@^1.1.3, get-intrinsic@^1.2.0, get-intrinsic@^1.2.1, get-intrinsic@^1.2.2:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.2.2.tgz#281b7622971123e1ef4b3c90fd7539306da93f3b"
+  integrity sha512-0gSo4ml/0j98Y3lngkFEot/zhiCeWsbYIlZ+uZOVgzLyLaUw7wxUL+nCTP0XJvJg1AXulJRI3UJi8GsbDuxdGA==
+  dependencies:
+    function-bind "^1.1.2"
+    has-proto "^1.0.1"
+    has-symbols "^1.0.3"
+    hasown "^2.0.0"
+
 get-port-please@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/get-port-please/-/get-port-please-1.1.0.tgz#7a60007578df6c4570c233803b48854c44db41f7"
@@ -7460,6 +8608,11 @@ get-stdin@^6.0.0:
   resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-6.0.0.tgz#9e09bf712b360ab9225e812048f71fde9c89657b"
   integrity sha512-jp4tHawyV7+fkkSKyvjuLZswblUtz+SQKzSWnBbii16BuZksJlU1wuBYXY75r+duh/llF1ur6oNwi+2ZzjKZ7g==
 
+get-stdin@^8.0.0:
+  version "8.0.0"
+  resolved "https://registry.yarnpkg.com/get-stdin/-/get-stdin-8.0.0.tgz#cbad6a73feb75f6eeb22ba9e01f89aa28aa97a53"
+  integrity sha512-sY22aA6xchAzprjyqmSEQv4UbAAzRN0L2dQB0NlN5acTTK9Don6nhoc3eAbUnpZiCANAMfd/+40kVdKfFygohg==
+
 get-stream@^4.0.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-4.1.0.tgz#c1b255575f3dc21d59bfc79cd3d2b46b1c3a54b5"
@@ -7467,6 +8620,13 @@ get-stream@^4.0.0:
   dependencies:
     pump "^3.0.0"
 
+get-stream@^5.0.0, get-stream@^5.1.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-5.2.0.tgz#4966a1795ee5ace65e706c4b7beb71257d6e22d3"
+  integrity sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==
+  dependencies:
+    pump "^3.0.0"
+
 get-stream@^6.0.0:
   version "6.0.0"
   resolved "https://registry.yarnpkg.com/get-stream/-/get-stream-6.0.0.tgz#3e0012cb6827319da2706e601a1583e8629a6718"
@@ -7490,6 +8650,13 @@ get-value@^2.0.3, get-value@^2.0.6:
   resolved "https://registry.yarnpkg.com/get-value/-/get-value-2.0.6.tgz#dc15ca1c672387ca76bd37ac0a395ba2042a2c28"
   integrity sha1-3BXKHGcjh8p2vTesCjlbogQqLCg=
 
+getos@^3.2.1:
+  version "3.2.1"
+  resolved "https://registry.yarnpkg.com/getos/-/getos-3.2.1.tgz#0134d1f4e00eb46144c5a9c0ac4dc087cbb27dc5"
+  integrity sha512-U56CfOK17OKgTVqozZjUKNdkfEv6jk5WISBJ8SHoagjE6L69zOwl3Z+O8myjY9MEW3i2HPWQBt/LTbCgcC973Q==
+  dependencies:
+    async "^3.2.0"
+
 getpass@^0.1.1:
   version "0.1.7"
   resolved "https://registry.yarnpkg.com/getpass/-/getpass-0.1.7.tgz#5eff8e3e684d569ae4cb2b1282604e8ba62149fa"
@@ -7914,6 +9081,13 @@ glob-parent@^5.0.0, glob-parent@^5.1.0, glob-parent@~5.1.0, glob-parent@~5.1.2:
   dependencies:
     is-glob "^4.0.1"
 
+glob-parent@^6.0.2:
+  version "6.0.2"
+  resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-6.0.2.tgz#6d237d99083950c79290f24c7642a3de9a28f9e3"
+  integrity sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==
+  dependencies:
+    is-glob "^4.0.3"
+
 glob@^7.1.1, glob@^7.1.4, glob@^7.1.6:
   version "7.1.6"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.6.tgz#141f33b81a7c2492e125594307480c46679278a6"
@@ -7938,6 +9112,22 @@ glob@^7.1.2, glob@^7.1.3:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
+global-dirs@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/global-dirs/-/global-dirs-3.0.1.tgz#0c488971f066baceda21447aecb1a8b911d22485"
+  integrity sha512-NBcGGFbBA9s1VzD41QXDG+3++t9Mn5t1FpLdhESY6oKY4gYTFpX4wO3sqGUa0Srjtbfj3szX0RnemmrVRUdULA==
+  dependencies:
+    ini "2.0.0"
+
+global-prefix@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/global-prefix/-/global-prefix-3.0.0.tgz#fc85f73064df69f50421f47f883fe5b913ba9b97"
+  integrity sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==
+  dependencies:
+    ini "^1.3.5"
+    kind-of "^6.0.2"
+    which "^1.3.1"
+
 globals@^11.1.0:
   version "11.12.0"
   resolved "https://registry.yarnpkg.com/globals/-/globals-11.12.0.tgz#ab8795338868a0babd8525758018c2a7eb95c42e"
@@ -7950,6 +9140,20 @@ globals@^12.1.0:
   dependencies:
     type-fest "^0.8.1"
 
+globals@^13.19.0:
+  version "13.24.0"
+  resolved "https://registry.yarnpkg.com/globals/-/globals-13.24.0.tgz#8432a19d78ce0c1e833949c36adb345400bb1171"
+  integrity sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==
+  dependencies:
+    type-fest "^0.20.2"
+
+globalthis@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/globalthis/-/globalthis-1.0.3.tgz#5852882a52b80dc301b0660273e1ed082f0b6ccf"
+  integrity sha512-sFdI5LyBiNTHjRd7cGPWapiHWMOXKyuBNX/cWJ3NfzrZQVa8GI/8cofCl74AOVqq9W5kNmguTIzJ/1s2gyI9wA==
+  dependencies:
+    define-properties "^1.1.3"
+
 globby@^11.0.2:
   version "11.0.2"
   resolved "https://registry.yarnpkg.com/globby/-/globby-11.0.2.tgz#1af538b766a3b540ebfb58a32b2e2d5897321d83"
@@ -8157,11 +9361,23 @@ google-spreadsheet@^3.1.15:
     google-auth-library "^6.1.3"
     lodash "^4.17.20"
 
+gopd@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/gopd/-/gopd-1.0.1.tgz#29ff76de69dac7489b7c0918a5788e56477c332c"
+  integrity sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==
+  dependencies:
+    get-intrinsic "^1.1.3"
+
 graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.4:
   version "4.2.6"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.6.tgz#ff040b2b0853b23c3d31027523706f1885d76bee"
   integrity sha512-nTnJ528pbqxYanhpDYsi4Rd8MAeaBA67+RZ10CM1m3bTAVFEDcd5AuA4a6W5YkGZ1iNXHzZz8T6TBKLeBuNriQ==
 
+graphemer@^1.4.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/graphemer/-/graphemer-1.4.0.tgz#fb2f1d55e0e3a1849aeffc90c4fa0dd53a0e66c6"
+  integrity sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==
+
 grid-index@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/grid-index/-/grid-index-1.1.0.tgz#97f8221edec1026c8377b86446a7c71e79522ea7"
@@ -8245,6 +9461,11 @@ has-bigints@^1.0.1:
   resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113"
   integrity sha512-LSBS2LjbNBTf6287JEbEzvJgftkF5qFkmCo9hDRpAzKhUOlJ+hx8dd4USs00SgsUNwc4617J9ki5YtEClM2ffA==
 
+has-bigints@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.2.tgz#0871bd3e3d51626f6ca0966668ba35d5602d6eaa"
+  integrity sha512-tSvCKtBr9lkF0Ex0aQiP9N+OpV4zi2r/Nee5VkRDbaqv35RLYMzbwQfFSZZH0kR+Rd6302UJZ2p/bJCEoR3VoQ==
+
 has-flag@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
@@ -8269,11 +9490,28 @@ has-passive-events@^1.0.0:
   dependencies:
     is-browser "^2.0.1"
 
+has-property-descriptors@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/has-property-descriptors/-/has-property-descriptors-1.0.1.tgz#52ba30b6c5ec87fd89fa574bc1c39125c6f65340"
+  integrity sha512-VsX8eaIewvas0xnvinAe9bw4WfIeODpGYikiWYLH+dma0Jw6KHYqWiWfhQlgOVK8D6PvjubK5Uc4P0iIhIcNVg==
+  dependencies:
+    get-intrinsic "^1.2.2"
+
+has-proto@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/has-proto/-/has-proto-1.0.1.tgz#1885c1305538958aff469fef37937c22795408e0"
+  integrity sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg==
+
 has-symbols@^1.0.1, has-symbols@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.2.tgz#165d3070c00309752a1236a479331e3ac56f1423"
   integrity sha512-chXa79rL/UC2KlX17jo3vRGz0azaWEx5tGqZg5pO3NUyEJVB17dMruQlzCCOfUvElghKcm5194+BCRvi2Rv/Gw==
 
+has-symbols@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.3.tgz#bb7b2c4349251dce87b125f7bdf874aa7c8b39f8"
+  integrity sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==
+
 has-tostringtag@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/has-tostringtag/-/has-tostringtag-1.0.0.tgz#7e133818a7d394734f941e73c3d3f9291e658b25"
@@ -8346,6 +9584,13 @@ hash.js@^1.0.0, hash.js@^1.0.3:
     inherits "^2.0.3"
     minimalistic-assert "^1.0.1"
 
+hasown@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/hasown/-/hasown-2.0.0.tgz#f4c513d454a57b7c7e1650778de226b11700546c"
+  integrity sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==
+  dependencies:
+    function-bind "^1.1.2"
+
 he@1.2.0, he@^1.1.0, he@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
@@ -8402,11 +9647,23 @@ html-encoding-sniffer@^1.0.2:
   dependencies:
     whatwg-encoding "^1.0.1"
 
+html-encoding-sniffer@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/html-encoding-sniffer/-/html-encoding-sniffer-3.0.0.tgz#2cb1a8cf0db52414776e5b2a7a04d5dd98158de9"
+  integrity sha512-oWv4T4yJ52iKrufjnyZPkrN0CH3QnrUqdB6In1g5Fe1mia8GmF36gnfNySxoZtxD5+NmYw1EElVXiBk93UeskA==
+  dependencies:
+    whatwg-encoding "^2.0.0"
+
 html-entities@^1.2.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/html-entities/-/html-entities-1.4.0.tgz#cfbd1b01d2afaf9adca1b10ae7dffab98c71d2dc"
   integrity sha512-8nxjcBcd8wovbeKx7h3wTji4e6+rhaVuPNpMqwWgnHh+N9ToqsCs6XztWRBPQ+UtzsoMAdKZtUENoVzU/EMtZA==
 
+html-es6cape@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/html-es6cape/-/html-es6cape-2.0.2.tgz#2dca93193e1517dc72595ca954df92975a7214c2"
+  integrity sha512-utzhH8rq2VABdW1LsPdv5tmxeMNOtP83If0jKCa79xPBgLWfcMvdf9K+EZoxJ5P7KioCxTs6WBnSDWLQHJ2lWA==
+
 html-escaper@^2.0.0:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/html-escaper/-/html-escaper-2.0.2.tgz#dfd60027da36a36dfcbe236262c00a5822681453"
@@ -8492,6 +9749,15 @@ http-errors@~1.7.2:
     statuses ">= 1.5.0 < 2"
     toidentifier "1.0.0"
 
+http-proxy-agent@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/http-proxy-agent/-/http-proxy-agent-5.0.0.tgz#5129800203520d434f142bc78ff3c170800f2b43"
+  integrity sha512-n2hY8YdoRE1i7r6M0w9DIw5GgZN0G25P8zLCRQ8rjXtTU3vsNFBI/vWK/UIeE6g5MUUz6avwAPXmL6Fy9D/90w==
+  dependencies:
+    "@tootallnate/once" "2"
+    agent-base "6"
+    debug "4"
+
 http-proxy-middleware@^1.0.6:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/http-proxy-middleware/-/http-proxy-middleware-1.0.6.tgz#0618557722f450375d3796d701a8ac5407b3b94e"
@@ -8521,6 +9787,15 @@ http-signature@~1.2.0:
     jsprim "^1.2.2"
     sshpk "^1.7.0"
 
+http-signature@~1.3.6:
+  version "1.3.6"
+  resolved "https://registry.yarnpkg.com/http-signature/-/http-signature-1.3.6.tgz#cb6fbfdf86d1c974f343be94e87f7fc128662cf9"
+  integrity sha512-3adrsD6zqo4GsTqtO7FyrejHNv+NgiIfAfv68+jVlFmSr9OGy7zrxONceFRLKvnnZA5jbxQBX1u9PpB6Wi32Gw==
+  dependencies:
+    assert-plus "^1.0.0"
+    jsprim "^2.0.2"
+    sshpk "^1.14.1"
+
 https-browserify@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-1.0.0.tgz#ec06c10e0a34c0f2faf199f7fd7fc78fffd03c73"
@@ -8534,6 +9809,11 @@ https-proxy-agent@^5.0.0:
     agent-base "6"
     debug "4"
 
+human-signals@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-1.1.1.tgz#c5b1cd14f50aeae09ab6c59fe63ba3395fe4dfa3"
+  integrity sha512-SEQu7vl8KjNL2eoGBLF3+wAjpsNfA9XMlXAYj/3EdaNfAlxKthD1xjEQfGOUhllCGGJVNY34bRr6lPINhNjyZw==
+
 human-signals@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-2.1.0.tgz#dc91fcba42e4d06e4abaed33b3e7a3c02f514ea0"
@@ -8546,6 +9826,13 @@ iconv-lite@0.4.24, iconv-lite@^0.4.24:
   dependencies:
     safer-buffer ">= 2.1.2 < 3"
 
+iconv-lite@0.6.3:
+  version "0.6.3"
+  resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.6.3.tgz#a52f80bf38da1952eb5c681790719871a1a72501"
+  integrity sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==
+  dependencies:
+    safer-buffer ">= 2.1.2 < 3.0.0"
+
 icss-utils@^4.0.0, icss-utils@^4.1.1:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/icss-utils/-/icss-utils-4.1.1.tgz#21170b53789ee27447c2f47dd683081403f9a467"
@@ -8553,7 +9840,7 @@ icss-utils@^4.0.0, icss-utils@^4.1.1:
   dependencies:
     postcss "^7.0.14"
 
-ieee754@^1.1.12, ieee754@^1.1.13, ieee754@^1.1.4:
+ieee754@^1.1.12, ieee754@^1.1.13, ieee754@^1.1.4, ieee754@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.2.1.tgz#8eb7a10a63fff25d15a57b001586d177d1b0d352"
   integrity sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==
@@ -8568,6 +9855,11 @@ ignore@^4.0.6:
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc"
   integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg==
 
+ignore@^5.1.1, ignore@^5.2.0:
+  version "5.3.0"
+  resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.3.0.tgz#67418ae40d34d6999c95ff56016759c718c82f78"
+  integrity sha512-g7dmpshy+gD7mh88OC9NwSGTKoc3kyLAZQRU1mt53Aw/vnvfXnbC+F/7F7QoYVKbV+KNvJx8wArewKy1vXMtlg==
+
 ignore@^5.1.4, ignore@^5.1.8:
   version "5.1.8"
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.8.tgz#f150a8b50a34289b33e22f5889abd4d8016f0e57"
@@ -8607,7 +9899,7 @@ import-fresh@^2.0.0:
     caller-path "^2.0.0"
     resolve-from "^3.0.0"
 
-import-fresh@^3.0.0:
+import-fresh@^3.0.0, import-fresh@^3.2.1:
   version "3.3.0"
   resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b"
   integrity sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==
@@ -8681,6 +9973,11 @@ inherits@2.0.3:
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.3.tgz#633c2c83e3da42a502f52466022480f4208261de"
   integrity sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=
 
+ini@2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/ini/-/ini-2.0.0.tgz#e5fd556ecdd5726be978fa1001862eacb0a94bc5"
+  integrity sha512-7PnF4oN3CvZF23ADhA5wRaYEQpJ8qygSkbtTXWBeXWXmEVRXK+1ITciHWwHhsjv1TmW0MgacIv6hEi5pX5NQdA==
+
 ini@^1.3.4, ini@^1.3.5:
   version "1.3.8"
   resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.8.tgz#a29da425b48806f34767a4efce397269af28432c"
@@ -8714,6 +10011,15 @@ internal-slot@^1.0.3:
     has "^1.0.3"
     side-channel "^1.0.4"
 
+internal-slot@^1.0.5:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/internal-slot/-/internal-slot-1.0.6.tgz#37e756098c4911c5e912b8edbf71ed3aa116f930"
+  integrity sha512-Xj6dv+PsbtwyPpEflsejS+oIZxmMlV44zAhG479uYu89MsjcYOhCFnNyKrkJrihbsiasQyY0afoCl/9BLR65bg==
+  dependencies:
+    get-intrinsic "^1.2.2"
+    hasown "^2.0.0"
+    side-channel "^1.0.4"
+
 interval-tree-1d@^1.0.1:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/interval-tree-1d/-/interval-tree-1d-1.0.3.tgz#8fdbde02b6b2c7dbdead636bcbed8e08710d85c1"
@@ -8772,6 +10078,15 @@ is-accessor-descriptor@^1.0.0:
   dependencies:
     kind-of "^6.0.0"
 
+is-array-buffer@^3.0.1, is-array-buffer@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/is-array-buffer/-/is-array-buffer-3.0.2.tgz#f2653ced8412081638ecb0ebbd0c41c6e0aecbbe"
+  integrity sha512-y+FyyR/w8vfIRq4eQcM1EYgSTnmHXPqaF+IgzgraytCFq5Xh8lllDVmAZolPJiZttZLeFSINPYMaEJ7/vWUa1w==
+  dependencies:
+    call-bind "^1.0.2"
+    get-intrinsic "^1.2.0"
+    is-typed-array "^1.1.10"
+
 is-arrayish@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d"
@@ -8782,6 +10097,13 @@ is-arrayish@^0.3.1:
   resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.3.2.tgz#4574a2ae56f7ab206896fb431eaeed066fdf8f03"
   integrity sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==
 
+is-async-function@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/is-async-function/-/is-async-function-2.0.0.tgz#8e4418efd3e5d3a6ebb0164c05ef5afb69aa9646"
+  integrity sha512-Y1JXKrfykRJGdlDwdKlLpLyMIiWqWvuSd17TvZk68PLAOGOoF4Xyav1z0Xhoi+gCYjZVeC5SI+hYFOfvXmGRCA==
+  dependencies:
+    has-tostringtag "^1.0.0"
+
 is-base64@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/is-base64/-/is-base64-0.1.0.tgz#a6f20610c6ef4863a51cba32bc0222544b932622"
@@ -8846,6 +10168,11 @@ is-callable@^1.1.4, is-callable@^1.2.4:
   resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.4.tgz#47301d58dd0259407865547853df6d61fe471945"
   integrity sha512-nsuwtxZfMX67Oryl9LCQ+upnC0Z0BgpwntpS89m1H/TLF0zNfzfLMV/9Wa/6MZsj0acpEjAO0KF1xT6ZdLl95w==
 
+is-callable@^1.2.7:
+  version "1.2.7"
+  resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.2.7.tgz#3bc2a85ea742d9e36205dcacdd72ca1fdc51b055"
+  integrity sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==
+
 is-ci@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/is-ci/-/is-ci-2.0.0.tgz#6bc6334181810e04b5c22b3d589fdca55026404c"
@@ -8853,6 +10180,13 @@ is-ci@^2.0.0:
   dependencies:
     ci-info "^2.0.0"
 
+is-ci@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/is-ci/-/is-ci-3.0.1.tgz#db6ecbed1bd659c43dac0f45661e7674103d1867"
+  integrity sha512-ZYvCgrefwqoQ6yTyYUbQu64HsITZ3NfKX1lzaEYdkTDcfKzzCI/wthRRYKkdjHKFVgNiXKAKm65Zo1pk2as/QQ==
+  dependencies:
+    ci-info "^3.2.0"
+
 is-color-stop@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/is-color-stop/-/is-color-stop-1.1.0.tgz#cfff471aee4dd5c9e158598fbe12967b5cdad345"
@@ -8865,6 +10199,13 @@ is-color-stop@^1.0.0:
     rgb-regex "^1.0.1"
     rgba-regex "^1.0.0"
 
+is-core-module@^2.11.0, is-core-module@^2.13.0, is-core-module@^2.13.1:
+  version "2.13.1"
+  resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.13.1.tgz#ad0d7532c6fea9da1ebdc82742d74525c6273384"
+  integrity sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==
+  dependencies:
+    hasown "^2.0.0"
+
 is-core-module@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.2.0.tgz#97037ef3d52224d85163f5597b2b63d9afed981a"
@@ -8886,7 +10227,7 @@ is-data-descriptor@^1.0.0:
   dependencies:
     kind-of "^6.0.0"
 
-is-date-object@^1.0.1:
+is-date-object@^1.0.1, is-date-object@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/is-date-object/-/is-date-object-1.0.5.tgz#0841d5536e724c25597bf6ea62e1bd38298df31f"
   integrity sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==
@@ -8938,6 +10279,13 @@ is-extglob@^2.1.0, is-extglob@^2.1.1:
   resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2"
   integrity sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=
 
+is-finalizationregistry@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/is-finalizationregistry/-/is-finalizationregistry-1.0.2.tgz#c8749b65f17c133313e661b1289b95ad3dbd62e6"
+  integrity sha512-0by5vtUJs8iFQb5TYUHHPudOR+qXYIMKtiUzvLIZITZUjknFmziyBJuLhVRc+Ds0dREFlskDNJKYIdIzu/9pfw==
+  dependencies:
+    call-bind "^1.0.2"
+
 is-finite@^1.0.1:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/is-finite/-/is-finite-1.1.0.tgz#904135c77fb42c0641d6aa1bcdbc4daa8da082f3"
@@ -8975,6 +10323,13 @@ is-generator-fn@^2.0.0:
   resolved "https://registry.yarnpkg.com/is-generator-fn/-/is-generator-fn-2.1.0.tgz#7d140adc389aaf3011a8f2a2a4cfa6faadffb118"
   integrity sha512-cTIB4yPYL/Grw0EaSzASzg6bBy9gqCofvWN8okThAYIxKJZC+udlRAmGbM0XLeniEJSs8uEgHPGuHSe1XsOLSQ==
 
+is-generator-function@^1.0.10:
+  version "1.0.10"
+  resolved "https://registry.yarnpkg.com/is-generator-function/-/is-generator-function-1.0.10.tgz#f1558baf1ac17e0deea7c0415c438351ff2b3c72"
+  integrity sha512-jsEjy9l3yiXEQ+PsXdmBwEPcOxaXWLspKdplFUVI9vq1iZgIekeC0L167qeu86czQaxed3q/Uzuw0swL0irL8A==
+  dependencies:
+    has-tostringtag "^1.0.0"
+
 is-glob@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-3.1.0.tgz#7ba5ae24217804ac70707b96922567486cc3e84a"
@@ -8989,7 +10344,7 @@ is-glob@^4.0.0:
   dependencies:
     is-extglob "^2.1.1"
 
-is-glob@^4.0.1, is-glob@~4.0.1:
+is-glob@^4.0.1, is-glob@^4.0.3, is-glob@~4.0.1:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-4.0.3.tgz#64f61e42cbbb2eec2071a9dac0b28ba1e65d5084"
   integrity sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==
@@ -9006,12 +10361,25 @@ is-iexplorer@^1.0.0:
   resolved "https://registry.yarnpkg.com/is-iexplorer/-/is-iexplorer-1.0.0.tgz#1d72bc66d3fe22eaf6170dda8cf10943248cfc76"
   integrity sha1-HXK8ZtP+Iur2Fw3ajPEJQySM/HY=
 
+is-installed-globally@~0.4.0:
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/is-installed-globally/-/is-installed-globally-0.4.0.tgz#9a0fd407949c30f86eb6959ef1b7994ed0b7b520"
+  integrity sha512-iwGqO3J21aaSkC7jWnHP/difazwS7SFeIqxv6wEtLU8Y5KlzFTjyqcSIT0d8s4+dDhKytsk9PJZ2BkS5eZwQRQ==
+  dependencies:
+    global-dirs "^3.0.0"
+    is-path-inside "^3.0.2"
+
+is-map@^2.0.1:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/is-map/-/is-map-2.0.2.tgz#00922db8c9bf73e81b7a335827bc2a43f2b91127"
+  integrity sha512-cOZFQQozTha1f4MxLFzlgKYPTyj26picdZTx82hbc/Xf4K/tZOOXSCkMvU4pKioRXGDLJRn0GM7Upe7kR721yg==
+
 is-mobile@^2.2.1, is-mobile@^2.2.2:
   version "2.2.2"
   resolved "https://registry.yarnpkg.com/is-mobile/-/is-mobile-2.2.2.tgz#f6c9c5d50ee01254ce05e739bdd835f1ed4e9954"
   integrity sha512-wW/SXnYJkTjs++tVK5b6kVITZpAZPtUrt9SF80vvxGiF/Oywal+COk1jlRkiVq15RFNEQKQY31TkV24/1T5cVg==
 
-is-negative-zero@^2.0.1:
+is-negative-zero@^2.0.1, is-negative-zero@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.2.tgz#7bf6f03a28003b8b3965de3ac26f664d765f3150"
   integrity sha512-dqJvarLawXsFbNDeJW7zAz8ItJ9cd28YufuuFzh0G8pNHjJMnY08Dv7sYX2uF5UpQOwieAeOExEYAWWfu7ZZUA==
@@ -9045,6 +10413,11 @@ is-obj@^2.0.0:
   resolved "https://registry.yarnpkg.com/is-obj/-/is-obj-2.0.0.tgz#473fb05d973705e3fd9620545018ca8e22ef4982"
   integrity sha512-drqDG3cbczxxEJRoOXcOjtdp1J/lyp1mNn0xaznRs8+muBhgQcrnbspox5X5fOw0HnMnbfDzvnEMEtqDEJEo8w==
 
+is-path-inside@^3.0.2, is-path-inside@^3.0.3:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/is-path-inside/-/is-path-inside-3.0.3.tgz#d231362e53a07ff2b0e0ea7fed049161ffd16283"
+  integrity sha512-Fd4gABb+ycGAmKou8eMftCupSir5lRxqf4aD/vd0cD2qc4HL07OjCeuHMr8Ro4CoMaeCKDB0/ECBOVWjTwUvPQ==
+
 is-plain-obj@^1.0.0, is-plain-obj@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-1.1.0.tgz#71a50c8429dfca773c92a390a4a03b39fcd51d3e"
@@ -9057,6 +10430,11 @@ is-plain-object@^2.0.3, is-plain-object@^2.0.4:
   dependencies:
     isobject "^3.0.1"
 
+is-potential-custom-element-name@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz#171ed6f19e3ac554394edf78caa05784a45bebb5"
+  integrity sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==
+
 is-regex@^1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.4.tgz#eef5663cd59fa4c0ae339505323df6854bb15958"
@@ -9075,11 +10453,23 @@ is-retry-allowed@^1.1.0:
   resolved "https://registry.yarnpkg.com/is-retry-allowed/-/is-retry-allowed-1.2.0.tgz#d778488bd0a4666a3be8a1482b9f2baafedea8b4"
   integrity sha512-RUbUeKwvm3XG2VYamhJL1xFktgjvPzL0Hq8C+6yrWIswDy3BIXGqCxhxkc30N9jqK311gVU137K8Ei55/zVJRg==
 
+is-set@^2.0.1:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/is-set/-/is-set-2.0.2.tgz#90755fa4c2562dc1c5d4024760d6119b94ca18ec"
+  integrity sha512-+2cnTEZeY5z/iXGbLhPrOAaK/Mau5k5eXq9j14CpRTftq0pAJu2MwVRSZhyZWBzx3o6X795Lz6Bpb6R0GKf37g==
+
 is-shared-array-buffer@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/is-shared-array-buffer/-/is-shared-array-buffer-1.0.1.tgz#97b0c85fbdacb59c9c446fe653b82cf2b5b7cfe6"
   integrity sha512-IU0NmyknYZN0rChcKhRO1X8LYz5Isj/Fsqh8NJOSf+N/hCOTwy29F32Ik7a+QszE63IdvmwdTPDd6cZ5pg4cwA==
 
+is-shared-array-buffer@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/is-shared-array-buffer/-/is-shared-array-buffer-1.0.2.tgz#8f259c573b60b6a32d4058a1a07430c0a7344c79"
+  integrity sha512-sqN2UDu1/0y6uvXyStCOzyhAjCSlHceFoMKJW8W9EU9cvic/QdsZ0kEU93HEy3IUEFZIiH/3w+AH/UQbPHNdhA==
+  dependencies:
+    call-bind "^1.0.2"
+
 is-ssh@^1.3.0:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/is-ssh/-/is-ssh-1.3.2.tgz#a4b82ab63d73976fd8263cceee27f99a88bdae2b"
@@ -9128,18 +10518,43 @@ is-symbol@^1.0.2, is-symbol@^1.0.3:
   dependencies:
     has-symbols "^1.0.2"
 
+is-typed-array@^1.1.10, is-typed-array@^1.1.12, is-typed-array@^1.1.9:
+  version "1.1.12"
+  resolved "https://registry.yarnpkg.com/is-typed-array/-/is-typed-array-1.1.12.tgz#d0bab5686ef4a76f7a73097b95470ab199c57d4a"
+  integrity sha512-Z14TF2JNG8Lss5/HMqt0//T9JeHXttXy5pH/DBU4vi98ozO2btxzq9MwYDZYnKwU8nRsz/+GVFVRDq3DkVuSPg==
+  dependencies:
+    which-typed-array "^1.1.11"
+
 is-typedarray@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a"
   integrity sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=
 
-is-weakref@^1.0.1:
+is-unicode-supported@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/is-unicode-supported/-/is-unicode-supported-0.1.0.tgz#3f26c76a809593b52bfa2ecb5710ed2779b522a7"
+  integrity sha512-knxG2q4UC3u8stRGyAVJCOdxFmv5DZiRcdlIaAQXAbSfJya+OhopNotLQrstBhququ4ZpuKbDc/8S6mgXgPFPw==
+
+is-weakmap@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/is-weakmap/-/is-weakmap-2.0.1.tgz#5008b59bdc43b698201d18f62b37b2ca243e8cf2"
+  integrity sha512-NSBR4kH5oVj1Uwvv970ruUkCV7O1mzgVFO4/rev2cLRda9Tm9HrL70ZPut4rOHgY0FNrUu9BCbXA2sdQ+x0chA==
+
+is-weakref@^1.0.1, is-weakref@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/is-weakref/-/is-weakref-1.0.2.tgz#9529f383a9338205e89765e0392efc2f100f06f2"
   integrity sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==
   dependencies:
     call-bind "^1.0.2"
 
+is-weakset@^2.0.1:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/is-weakset/-/is-weakset-2.0.2.tgz#4569d67a747a1ce5a994dfd4ef6dcea76e7c0a1d"
+  integrity sha512-t2yVvttHkQktwnNNmBQ98AhENLdPUTDTE21uPqAQ0ARwQfGeQKRVS0NNurH7bTf7RrvcVn1OOge45CnBeHCSmg==
+  dependencies:
+    call-bind "^1.0.2"
+    get-intrinsic "^1.1.1"
+
 is-whitespace@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/is-whitespace/-/is-whitespace-0.3.0.tgz#1639ecb1be036aec69a54cbb401cfbed7114ab7f"
@@ -9165,7 +10580,7 @@ isarray@1.0.0, isarray@^1.0.0, isarray@~1.0.0:
   resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11"
   integrity sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=
 
-isarray@^2.0.1:
+isarray@^2.0.1, isarray@^2.0.5:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/isarray/-/isarray-2.0.5.tgz#8af1e4c1221244cc62459faf38940d4e644a5723"
   integrity sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==
@@ -9187,6 +10602,15 @@ isobject@^3.0.0, isobject@^3.0.1:
   resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
   integrity sha1-TkMekrEalzFjaqH5yNHMvP2reN8=
 
+isomorphic-dompurify@0.19.0:
+  version "0.19.0"
+  resolved "https://registry.yarnpkg.com/isomorphic-dompurify/-/isomorphic-dompurify-0.19.0.tgz#bb0d1dbf86e9d83cb8b34c4abb5257c3cf34c3a1"
+  integrity sha512-2kn8JO6twdp2LcJ54Ys2EhhAg2nqi+UjSk+TvLUhcBltqV96PxGiVc9dcDpOtgqfxwmKRmXx9n2CqrFyflonKQ==
+  dependencies:
+    "@types/dompurify" "^2.3.3"
+    dompurify "^2.3.8"
+    jsdom "^19.0.0"
+
 isomorphic-unfetch@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/isomorphic-unfetch/-/isomorphic-unfetch-3.1.0.tgz#87341d5f4f7b63843d468438128cb087b7c3e98f"
@@ -9245,6 +10669,17 @@ istanbul-reports@^2.2.6:
   dependencies:
     html-escaper "^2.0.0"
 
+iterator.prototype@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/iterator.prototype/-/iterator.prototype-1.1.2.tgz#5e29c8924f01916cb9335f1ff80619dcff22b0c0"
+  integrity sha512-DR33HMMr8EzwuRL8Y9D3u2BMj8+RqSE850jfGu59kS7tbmPLzGkZmVSfyCFSDxuZiEY6Rzt3T2NA/qU+NwVj1w==
+  dependencies:
+    define-properties "^1.2.1"
+    get-intrinsic "^1.2.1"
+    has-symbols "^1.0.3"
+    reflect.getprototypeof "^1.0.4"
+    set-function-name "^2.0.1"
+
 jest-changed-files@^24.9.0:
   version "24.9.0"
   resolved "https://registry.yarnpkg.com/jest-changed-files/-/jest-changed-files-24.9.0.tgz#08d8c15eb79a7fa3fc98269bc14b451ee82f8039"
@@ -9629,6 +11064,11 @@ js-cookie@^2.2.1:
   resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-2.2.1.tgz#69e106dc5d5806894562902aa5baec3744e9b2b8"
   integrity sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ==
 
+js-cookie@^3.0.5:
+  version "3.0.5"
+  resolved "https://registry.yarnpkg.com/js-cookie/-/js-cookie-3.0.5.tgz#0b7e2fd0c01552c58ba86e0841f94dc2557dcdbc"
+  integrity sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==
+
 js-file-download@^0.4.12:
   version "0.4.12"
   resolved "https://registry.yarnpkg.com/js-file-download/-/js-file-download-0.4.12.tgz#10c70ef362559a5b23cdbdc3bd6f399c3d91d821"
@@ -9652,6 +11092,13 @@ js-yaml@^3.13.1:
     argparse "^1.0.7"
     esprima "^4.0.0"
 
+js-yaml@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-4.1.0.tgz#c1fb65f8f5017901cdd2c951864ba18458a10602"
+  integrity sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==
+  dependencies:
+    argparse "^2.0.1"
+
 jsbn@~0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513"
@@ -9689,6 +11136,39 @@ jsdom@^11.5.1:
     ws "^5.2.0"
     xml-name-validator "^3.0.0"
 
+jsdom@^19.0.0:
+  version "19.0.0"
+  resolved "https://registry.yarnpkg.com/jsdom/-/jsdom-19.0.0.tgz#93e67c149fe26816d38a849ea30ac93677e16b6a"
+  integrity sha512-RYAyjCbxy/vri/CfnjUWJQQtZ3LKlLnDqj+9XLNnJPgEGeirZs3hllKR20re8LUZ6o1b1X4Jat+Qd26zmP41+A==
+  dependencies:
+    abab "^2.0.5"
+    acorn "^8.5.0"
+    acorn-globals "^6.0.0"
+    cssom "^0.5.0"
+    cssstyle "^2.3.0"
+    data-urls "^3.0.1"
+    decimal.js "^10.3.1"
+    domexception "^4.0.0"
+    escodegen "^2.0.0"
+    form-data "^4.0.0"
+    html-encoding-sniffer "^3.0.0"
+    http-proxy-agent "^5.0.0"
+    https-proxy-agent "^5.0.0"
+    is-potential-custom-element-name "^1.0.1"
+    nwsapi "^2.2.0"
+    parse5 "6.0.1"
+    saxes "^5.0.1"
+    symbol-tree "^3.2.4"
+    tough-cookie "^4.0.0"
+    w3c-hr-time "^1.0.2"
+    w3c-xmlserializer "^3.0.0"
+    webidl-conversions "^7.0.0"
+    whatwg-encoding "^2.0.0"
+    whatwg-mimetype "^3.0.0"
+    whatwg-url "^10.0.0"
+    ws "^8.2.3"
+    xml-name-validator "^4.0.0"
+
 jsesc@^2.5.1:
   version "2.5.2"
   resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.2.tgz#80564d2e483dacf6e8ef209650a67df3f0c283a4"
@@ -9706,6 +11186,11 @@ json-bigint@^1.0.0:
   dependencies:
     bignumber.js "^9.0.0"
 
+json-buffer@3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/json-buffer/-/json-buffer-3.0.1.tgz#9338802a30d3b6605fbe0613e094008ca8c05a13"
+  integrity sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==
+
 json-parse-better-errors@^1.0.1, json-parse-better-errors@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9"
@@ -9721,6 +11206,11 @@ json-schema@0.2.3:
   resolved "https://registry.yarnpkg.com/json-schema/-/json-schema-0.2.3.tgz#b480c892e59a2f05954ce727bd3f2a4e882f9e13"
   integrity sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=
 
+json-schema@0.4.0:
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/json-schema/-/json-schema-0.4.0.tgz#f7de4cf6efab838ebaeb3236474cbba5a1930ab5"
+  integrity sha512-es94M3nTIfsEPisRafak+HDLfHXnKBhV3vU5eqPcS3flIWqcxJWgXHXiey3YrpaNsanY5ei1VoYEbOzijuq9BA==
+
 json-stable-stringify-without-jsonify@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz#9db7b59496ad3f3cfef30a75142d2d930ad72651"
@@ -9738,6 +11228,13 @@ json5@^1.0.1:
   dependencies:
     minimist "^1.2.0"
 
+json5@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.2.tgz#63d98d60f21b313b77c4d6da18bfa69d80e1d593"
+  integrity sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==
+  dependencies:
+    minimist "^1.2.0"
+
 json5@^2.1.2:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.0.tgz#2dfefe720c6ba525d9ebd909950f0515316c89a3"
@@ -9761,6 +11258,16 @@ jsonfile@^6.0.1:
   optionalDependencies:
     graceful-fs "^4.1.6"
 
+jsonld@^8.1.1:
+  version "8.3.2"
+  resolved "https://registry.yarnpkg.com/jsonld/-/jsonld-8.3.2.tgz#7033f8994aed346b536e9046025f7f1fe9669934"
+  integrity sha512-MwBbq95szLwt8eVQ1Bcfwmgju/Y5P2GdtlHE2ncyfuYjIdEhluUVyj1eudacf1mOkWIoS9GpDBTECqhmq7EOaA==
+  dependencies:
+    "@digitalbazaar/http-client" "^3.4.1"
+    canonicalize "^1.0.1"
+    lru-cache "^6.0.0"
+    rdf-canonize "^3.4.0"
+
 jsonschema@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/jsonschema/-/jsonschema-1.4.0.tgz#1afa34c4bc22190d8e42271ec17ac8b3404f87b2"
@@ -9776,6 +11283,26 @@ jsprim@^1.2.2:
     json-schema "0.2.3"
     verror "1.10.0"
 
+jsprim@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/jsprim/-/jsprim-2.0.2.tgz#77ca23dbcd4135cd364800d22ff82c2185803d4d"
+  integrity sha512-gqXddjPqQ6G40VdnI6T6yObEC+pDNvyP95wdQhkWkg7crHH3km5qP1FsOXEkzEQwnz6gz5qGTn1c2Y52wP3OyQ==
+  dependencies:
+    assert-plus "1.0.0"
+    extsprintf "1.3.0"
+    json-schema "0.4.0"
+    verror "1.10.0"
+
+"jsx-ast-utils@^2.4.1 || ^3.0.0":
+  version "3.3.5"
+  resolved "https://registry.yarnpkg.com/jsx-ast-utils/-/jsx-ast-utils-3.3.5.tgz#4766bd05a8e2a11af222becd19e15575e52a853a"
+  integrity sha512-ZZow9HBI5O6EPgSJLUb8n2NKgmVWTwCvHGwFuJlMjvLFqlGG6pjirPhtdsseaLZjSibD8eegzmYpUZwoIlj2cQ==
+  dependencies:
+    array-includes "^3.1.6"
+    array.prototype.flat "^1.3.1"
+    object.assign "^4.1.4"
+    object.values "^1.1.6"
+
 jwa@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/jwa/-/jwa-2.0.0.tgz#a7e9c3f29dae94027ebcaf49975c9345593410fc"
@@ -9798,6 +11325,13 @@ kdbush@^3.0.0:
   resolved "https://registry.yarnpkg.com/kdbush/-/kdbush-3.0.0.tgz#f8484794d47004cc2d85ed3a79353dbe0abc2bf0"
   integrity sha512-hRkd6/XW4HTsA9vjVpY9tuXJYLSlelnkTmVFu4M9/7MIYQtFcHpbugAU7UbOfjOiVSVYl2fqgBuJ32JUmRo5Ew==
 
+keyv@^4.5.3:
+  version "4.5.4"
+  resolved "https://registry.yarnpkg.com/keyv/-/keyv-4.5.4.tgz#a879a99e29452f942439f2a405e3af8b31d4de93"
+  integrity sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==
+  dependencies:
+    json-buffer "3.0.1"
+
 kind-of@^3.0.2, kind-of@^3.0.3, kind-of@^3.2.0:
   version "3.2.2"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-3.2.2.tgz#31ea21a734bab9bbb0f32466d893aea51e4a3c64"
@@ -9827,6 +11361,19 @@ kleur@^3.0.3:
   resolved "https://registry.yarnpkg.com/kleur/-/kleur-3.0.3.tgz#a79c9ecc86ee1ce3fa6206d1216c501f147fc07e"
   integrity sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==
 
+ky-universal@^0.11.0:
+  version "0.11.0"
+  resolved "https://registry.yarnpkg.com/ky-universal/-/ky-universal-0.11.0.tgz#f5edf857865aaaea416a1968222148ad7d9e4017"
+  integrity sha512-65KyweaWvk+uKKkCrfAf+xqN2/epw1IJDtlyCPxYffFCMR8u1sp2U65NtWpnozYfZxQ6IUzIlvUcw+hQ82U2Xw==
+  dependencies:
+    abort-controller "^3.0.0"
+    node-fetch "^3.2.10"
+
+ky@^0.33.3:
+  version "0.33.3"
+  resolved "https://registry.yarnpkg.com/ky/-/ky-0.33.3.tgz#bf1ad322a3f2c3428c13cfa4b3af95e6c4a2f543"
+  integrity sha512-CasD9OCEQSFIam2U8efFK81Yeg8vNMTBUqtMOHlrcWQHqUX3HeCl9Dr31u4toV7emlH8Mymk5+9p0lL6mKb/Xw==
+
 last-call-webpack-plugin@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/last-call-webpack-plugin/-/last-call-webpack-plugin-3.0.0.tgz#9742df0e10e3cf46e5c0381c2de90d3a7a2d7555"
@@ -9850,6 +11397,11 @@ launch-editor@^2.2.1:
     chalk "^2.3.0"
     shell-quote "^1.6.1"
 
+lazy-ass@^1.6.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/lazy-ass/-/lazy-ass-1.6.0.tgz#7999655e8646c17f089fdd187d150d3324d54513"
+  integrity sha512-cc8oEVoctTvsFZ/Oje/kGnHbpWHYBe8IAJe4C0QNc3t8uM/0Y8+erSz/7Y1ALuXTEZTMvxXwO6YbX1ey3ujiZw==
+
 lcid@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/lcid/-/lcid-2.0.0.tgz#6ef5d2df60e52f82eb228a4c373e8d1f397253cf"
@@ -9880,6 +11432,28 @@ levn@^0.3.0, levn@~0.3.0:
     prelude-ls "~1.1.2"
     type-check "~0.3.2"
 
+levn@^0.4.1:
+  version "0.4.1"
+  resolved "https://registry.yarnpkg.com/levn/-/levn-0.4.1.tgz#ae4562c007473b932a6200d403268dd2fffc6ade"
+  integrity sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==
+  dependencies:
+    prelude-ls "^1.2.1"
+    type-check "~0.4.0"
+
+listr2@^3.8.3:
+  version "3.14.0"
+  resolved "https://registry.yarnpkg.com/listr2/-/listr2-3.14.0.tgz#23101cc62e1375fd5836b248276d1d2b51fdbe9e"
+  integrity sha512-TyWI8G99GX9GjE54cJ+RrNMcIFBfwMPxc3XTFiAYGN4s10hWROGtOg7+O6u6LE3mNkyld7RSLE6nrKBvTfcs3g==
+  dependencies:
+    cli-truncate "^2.1.0"
+    colorette "^2.0.16"
+    log-update "^4.0.0"
+    p-map "^4.0.0"
+    rfdc "^1.3.0"
+    rxjs "^7.5.1"
+    through "^2.3.8"
+    wrap-ansi "^7.0.0"
+
 load-json-file@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-4.0.0.tgz#2f5f45ab91e33216234fd53adab668eb4ec0993b"
@@ -9890,6 +11464,17 @@ load-json-file@^4.0.0:
     pify "^3.0.0"
     strip-bom "^3.0.0"
 
+load-json-file@^5.2.0:
+  version "5.3.0"
+  resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-5.3.0.tgz#4d3c1e01fa1c03ea78a60ac7af932c9ce53403f3"
+  integrity sha512-cJGP40Jc/VXUsp8/OrnyKyTZ1y6v/dphm3bioS+RrKXjK2BB6wHUd6JptZEFDGgGahMT+InnZO5i1Ei9mpC8Bw==
+  dependencies:
+    graceful-fs "^4.1.15"
+    parse-json "^4.0.0"
+    pify "^4.0.1"
+    strip-bom "^3.0.0"
+    type-fest "^0.3.0"
+
 loader-fs-cache@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/loader-fs-cache/-/loader-fs-cache-1.0.3.tgz#f08657646d607078be2f0a032f8bd69dd6f277d9"
@@ -9946,6 +11531,13 @@ locate-path@^5.0.0:
   dependencies:
     p-locate "^4.1.0"
 
+locate-path@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-6.0.0.tgz#55321eb309febbc59c4801d931a72452a681d286"
+  integrity sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==
+  dependencies:
+    p-locate "^5.0.0"
+
 lodash._reinterpolate@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d"
@@ -9966,6 +11558,16 @@ lodash.memoize@^4.1.2:
   resolved "https://registry.yarnpkg.com/lodash.memoize/-/lodash.memoize-4.1.2.tgz#bcc6c49a42a2840ed997f323eada5ecd182e0bfe"
   integrity sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=
 
+lodash.merge@^4.6.2:
+  version "4.6.2"
+  resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
+  integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
+
+lodash.once@^4.1.1:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/lodash.once/-/lodash.once-4.1.1.tgz#0dd3971213c7c56df880977d504c88fb471a97ac"
+  integrity sha512-Sb487aTOCr9drQVL8pIxOzVhafOjZN9UU54hiN8PU3uAiSV7lx1yYNpbNmex2PK6dSJoNTSJUUswT651yww3Mg==
+
 lodash.sortby@^4.7.0:
   version "4.7.0"
   resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438"
@@ -9996,6 +11598,24 @@ lodash@^4.15.0, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
   integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
 
+log-symbols@^4.0.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-4.1.0.tgz#3fbdbb95b4683ac9fc785111e792e558d4abd503"
+  integrity sha512-8XPvpAA8uyhfteu8pIvQxpJZ7SYYdpUivZpGy6sFsBuKRY/7rQGavedeB8aK+Zkyq6upMFVL/9AW6vOYzfRyLg==
+  dependencies:
+    chalk "^4.1.0"
+    is-unicode-supported "^0.1.0"
+
+log-update@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/log-update/-/log-update-4.0.0.tgz#589ecd352471f2a1c0c570287543a64dfd20e0a1"
+  integrity sha512-9fkkDevMefjg0mmzWFBW8YkFP91OrizzkW3diF7CpG+S2EYdy4+TVfGwz1zeF8x7hCx1ovSPTOE9Ngib74qqUg==
+  dependencies:
+    ansi-escapes "^4.3.0"
+    cli-cursor "^3.1.0"
+    slice-ansi "^4.0.0"
+    wrap-ansi "^6.2.0"
+
 loglevel@^1.6.2:
   version "1.7.1"
   resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.7.1.tgz#005fde2f5e6e47068f935ff28573e125ef72f197"
@@ -10006,7 +11626,7 @@ long@^4.0.0:
   resolved "https://registry.yarnpkg.com/long/-/long-4.0.0.tgz#9a7b71cfb7d361a194ea555241c92f7468d5bf28"
   integrity sha512-XsP+KhQif4bjX1kbuSiySJFNAehNxgLb6hPRGJ9QsUr8ajHkuXGdrHmFUTUUXhDwVX2R5bY4JNZEwbUiMhV+MA==
 
-loose-envify@^1.0.0:
+loose-envify@^1.0.0, loose-envify@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
   integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@@ -10131,32 +11751,33 @@ mapbox-gl@1.10.1:
     tinyqueue "^2.0.3"
     vt-pbf "^3.1.1"
 
-maplibre-gl@>=1.15.3:
-  version "2.1.9"
-  resolved "https://registry.yarnpkg.com/maplibre-gl/-/maplibre-gl-2.1.9.tgz#042f3ef4224fa890ecf7a410145243f1fc943dcd"
-  integrity sha512-pnWJmILeZpgA5QSI7K7xFK3yrkyYTd9srw3fCi2Ca52Phm78hsznPwUErEQcZLfxXKn/1h9t8IPdj0TH0NBNbg==
+maplibre-gl@2.4.0, maplibre-gl@>=3.6.0:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/maplibre-gl/-/maplibre-gl-2.4.0.tgz#2b53dbf526626bf4ee92ad4f33f13ef09e5af182"
+  integrity sha512-csNFylzntPmHWidczfgCZpvbTSmhaWvLRj9e1ezUDBEPizGgshgm3ea1T5TCNEEBq0roauu7BPuRZjA3wO4KqA==
   dependencies:
-    "@mapbox/geojson-rewind" "^0.5.1"
+    "@mapbox/geojson-rewind" "^0.5.2"
     "@mapbox/jsonlint-lines-primitives" "^2.0.2"
     "@mapbox/mapbox-gl-supported" "^2.0.1"
     "@mapbox/point-geometry" "^0.1.0"
-    "@mapbox/tiny-sdf" "^2.0.4"
+    "@mapbox/tiny-sdf" "^2.0.5"
     "@mapbox/unitbezier" "^0.0.1"
     "@mapbox/vector-tile" "^1.3.1"
     "@mapbox/whoots-js" "^3.1.0"
-    "@types/geojson" "^7946.0.8"
+    "@types/geojson" "^7946.0.10"
     "@types/mapbox__point-geometry" "^0.1.2"
     "@types/mapbox__vector-tile" "^1.3.0"
     "@types/pbf" "^3.0.2"
     csscolorparser "~1.0.3"
-    earcut "^2.2.3"
+    earcut "^2.2.4"
     geojson-vt "^3.2.1"
     gl-matrix "^3.4.3"
+    global-prefix "^3.0.0"
     murmurhash-js "^1.0.0"
     pbf "^3.2.1"
     potpack "^1.0.2"
     quickselect "^2.0.0"
-    supercluster "^7.1.4"
+    supercluster "^7.1.5"
     tinyqueue "^2.0.3"
     vt-pbf "^3.1.3"
 
@@ -10208,6 +11829,16 @@ math-log2@^1.0.1:
   resolved "https://registry.yarnpkg.com/math-log2/-/math-log2-1.0.1.tgz#fb8941be5f5ebe8979e718e6273b178e58694565"
   integrity sha1-+4lBvl9evol55xjmJzsXjlhpRWU=
 
+mathjax-full@^3.2.2:
+  version "3.2.2"
+  resolved "https://registry.yarnpkg.com/mathjax-full/-/mathjax-full-3.2.2.tgz#43f02e55219db393030985d2b6537ceae82f1fa7"
+  integrity sha512-+LfG9Fik+OuI8SLwsiR02IVdjcnRCy5MufYLi0C3TdMT56L/pjB0alMVGgoWJF8pN9Rc7FESycZB9BMNWIid5w==
+  dependencies:
+    esm "^3.2.25"
+    mhchemparser "^4.1.0"
+    mj-context-menu "^0.6.1"
+    speech-rule-engine "^4.0.6"
+
 matrix-camera-controller@^2.1.1, matrix-camera-controller@^2.1.3:
   version "2.1.3"
   resolved "https://registry.yarnpkg.com/matrix-camera-controller/-/matrix-camera-controller-2.1.3.tgz#35e5260cc1cd550962ba799f2d8d4e94b1a39370"
@@ -10309,6 +11940,11 @@ methods@~1.1.2:
   resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee"
   integrity sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4=
 
+mhchemparser@^4.1.0:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/mhchemparser/-/mhchemparser-4.2.1.tgz#d73982e66bc06170a85b1985600ee9dabe157cb0"
+  integrity sha512-kYmyrCirqJf3zZ9t/0wGgRZ4/ZJw//VwaRVGA75C4nhE60vtnIzhl9J9ndkX/h6hxSN7pjg/cE0VxbnNM+bnDQ==
+
 microevent.ts@~0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/microevent.ts/-/microevent.ts-0.1.1.tgz#70b09b83f43df5172d0205a63025bce0f7357fa0"
@@ -10410,11 +12046,23 @@ minimatch@^3.0.4:
   dependencies:
     brace-expansion "^1.1.7"
 
+minimatch@^3.0.5, minimatch@^3.1.2:
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.1.2.tgz#19cd194bfd3e428f049a70817c038d89ab4be35b"
+  integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==
+  dependencies:
+    brace-expansion "^1.1.7"
+
 minimist@^1.1.1, minimist@^1.2.0, minimist@^1.2.5:
   version "1.2.5"
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602"
   integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==
 
+minimist@^1.2.6, minimist@^1.2.8:
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
+  integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
+
 minipass-collect@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/minipass-collect/-/minipass-collect-1.0.2.tgz#22b813bf745dc6edba2576b940022ad6edc8c617"
@@ -10448,6 +12096,11 @@ minisearch@^2.2.1:
   resolved "https://registry.yarnpkg.com/minisearch/-/minisearch-2.6.2.tgz#ec4e830fac858f38f336dde9b38947b2ff9e2c07"
   integrity sha512-9I8qFrgPUPbFKuRaly5M8h72TtwpSprgP/eIVtrqQGjuJa/vsSoByRrbiUh76D62DNZVRwhhzt8c9v+4VycXgg==
 
+minisearch@^6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/minisearch/-/minisearch-6.0.1.tgz#55e40135e7e6be60f1c1c2f5ee890c334e179a86"
+  integrity sha512-Ly1w0nHKnlhAAh6/BF/+9NgzXfoJxaJ8nhopFhQ3NcvFJrFIL+iCg9gw9e9UMBD+XIsp/RyznJ/o5UIe5Kw+kg==
+
 minizlib@^2.1.1:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/minizlib/-/minizlib-2.1.2.tgz#e90d3466ba209b932451508a11ce3d3632145931"
@@ -10480,6 +12133,11 @@ mixin-deep@^1.2.0:
     for-in "^1.0.2"
     is-extendable "^1.0.1"
 
+mj-context-menu@^0.6.1:
+  version "0.6.1"
+  resolved "https://registry.yarnpkg.com/mj-context-menu/-/mj-context-menu-0.6.1.tgz#a043c5282bf7e1cf3821de07b13525ca6f85aa69"
+  integrity sha512-7NO5s6n10TIV96d4g2uDpG7ZDpIhMh0QNfGdJw/W47JswFcosz457wqz/b5sAKvl12sxINGFCn80NZHKwxQEXA==
+
 mkdirp@^0.5.0, mkdirp@^0.5.1, mkdirp@^0.5.3, mkdirp@~0.5.1:
   version "0.5.5"
   resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.5.tgz#d91cefd62d1436ca0f41620e251288d420099def"
@@ -10492,6 +12150,11 @@ mkdirp@^1.0.3, mkdirp@^1.0.4:
   resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-1.0.4.tgz#3eb5ed62622756d79a5f0e2a221dfebad75c2f7e"
   integrity sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==
 
+moment@^2.10.2:
+  version "2.29.4"
+  resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.4.tgz#3dbe052889fe7c1b2ed966fcb3a77328964ef108"
+  integrity sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==
+
 monotone-convex-hull-2d@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/monotone-convex-hull-2d/-/monotone-convex-hull-2d-1.0.1.tgz#47f5daeadf3c4afd37764baa1aa8787a40eee08c"
@@ -10552,6 +12215,11 @@ ms@2.1.2:
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009"
   integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
 
+ms@^2.1.1:
+  version "2.1.3"
+  resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2"
+  integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==
+
 mumath@^3.3.4:
   version "3.3.4"
   resolved "https://registry.yarnpkg.com/mumath/-/mumath-3.3.4.tgz#48d4a0f0fd8cad4e7b32096ee89b161a63d30bbf"
@@ -10574,6 +12242,14 @@ mute-stream@0.0.8:
   resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.8.tgz#1630c42b2251ff81e2a283de96a5497ea92e5e0d"
   integrity sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==
 
+n3@^1.16.4:
+  version "1.17.2"
+  resolved "https://registry.yarnpkg.com/n3/-/n3-1.17.2.tgz#3370b2d07da98a5b2865fa43c2d4e5c563cc65df"
+  integrity sha512-BxSM52wYFqXrbQQT5WUEzKUn6qpYV+2L4XZLfn3Gblz2kwZ09S+QxC33WNdVEQy2djenFL8SNkrjejEKlvI6+Q==
+  dependencies:
+    queue-microtask "^1.1.2"
+    readable-stream "^4.0.0"
+
 nan@^2.12.1:
   version "2.14.2"
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.2.tgz#f5376400695168f4cc694ac9393d0c9585eeea19"
@@ -10707,11 +12383,32 @@ no-case@^3.0.4:
     lower-case "^2.0.2"
     tslib "^2.0.3"
 
+node-domexception@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/node-domexception/-/node-domexception-1.0.0.tgz#6888db46a1f71c0b76b3f7555016b63fe64766e5"
+  integrity sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ==
+
 node-fetch@^2.3.0, node-fetch@^2.6.1:
   version "2.6.1"
   resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.1.tgz#045bd323631f76ed2e2b55573394416b639a0052"
   integrity sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw==
 
+node-fetch@^2.6.12:
+  version "2.7.0"
+  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.7.0.tgz#d0f0fa6e3e2dc1d27efcd8ad99d550bda94d187d"
+  integrity sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==
+  dependencies:
+    whatwg-url "^5.0.0"
+
+node-fetch@^3.2.10:
+  version "3.3.2"
+  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-3.3.2.tgz#d1e889bacdf733b4ff3b2b243eb7a12866a0b78b"
+  integrity sha512-dRB78srN/l6gqWulah9SrxeYnxeddIG30+GOqK/9OlLVyLg3HPnr6SqOWTWOXKRwC2eGYCkZ59NNuSgvSrpgOA==
+  dependencies:
+    data-uri-to-buffer "^4.0.0"
+    fetch-blob "^3.1.4"
+    formdata-polyfill "^4.0.10"
+
 node-forge@^0.10.0:
   version "0.10.0"
   resolved "https://registry.yarnpkg.com/node-forge/-/node-forge-0.10.0.tgz#32dea2afb3e9926f02ee5ce8794902691a676bf3"
@@ -10873,7 +12570,7 @@ npm-run-path@^2.0.0:
   dependencies:
     path-key "^2.0.0"
 
-npm-run-path@^4.0.1:
+npm-run-path@^4.0.0, npm-run-path@^4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-4.0.1.tgz#b7ecd1e5ed53da8e37a55e1c2269e0b97ed748ea"
   integrity sha512-S48WzZW777zhNIrn7gxOlISNAqi9ZC/uQFnRdbeIHhZhCA6UqpkOT8T1G7BvfdgP4Er8gF4sUbaS0i7QvIfCWw==
@@ -10935,6 +12632,11 @@ nwsapi@^2.0.7:
   resolved "https://registry.yarnpkg.com/nwsapi/-/nwsapi-2.2.0.tgz#204879a9e3d068ff2a55139c2c772780681a38b7"
   integrity sha512-h2AatdwYH+JHiZpv7pt/gSX1XoRGb7L/qSIeuqA6GwYoF9w1vP1cw42TO0aI2pNyshRK5893hNSl+1//vHK7hQ==
 
+nwsapi@^2.2.0:
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/nwsapi/-/nwsapi-2.2.2.tgz#e5418863e7905df67d51ec95938d67bf801f0bb0"
+  integrity sha512-90yv+6538zuvUMnN+zCr8LuV6bPFdq50304114vJYJ8RDyK8D5O9Phpbd6SZWgI7PwzmmfN1upeOJlvybDSgCw==
+
 oauth-sign@~0.9.0:
   version "0.9.0"
   resolved "https://registry.yarnpkg.com/oauth-sign/-/oauth-sign-0.9.0.tgz#47a7b016baa68b5fa0ecf3dee08a85c679ac6455"
@@ -10964,6 +12666,11 @@ object-inspect@^1.11.0, object-inspect@^1.9.0:
   resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.12.0.tgz#6e2c120e868fd1fd18cb4f18c31741d0d6e776f0"
   integrity sha512-Ho2z80bVIvJloH+YzRmpZVQe87+qASmBUKZDWgx9cu+KDrX2ZDH/3tMy+gXbZETVGs2M8YdxObOh7XAtim9Y0g==
 
+object-inspect@^1.13.1:
+  version "1.13.1"
+  resolved "https://registry.yarnpkg.com/object-inspect/-/object-inspect-1.13.1.tgz#b96c6109324ccfef6b12216a956ca4dc2ff94bc2"
+  integrity sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==
+
 object-keys@^1.0.12, object-keys@^1.0.6, object-keys@^1.0.9, object-keys@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.1.1.tgz#1c47f272df277f3b1daf061677d9c82e2322c60e"
@@ -10986,6 +12693,34 @@ object.assign@^4.1.0, object.assign@^4.1.2:
     has-symbols "^1.0.1"
     object-keys "^1.1.1"
 
+object.assign@^4.1.4:
+  version "4.1.5"
+  resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.5.tgz#3a833f9ab7fdb80fc9e8d2300c803d216d8fdbb0"
+  integrity sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ==
+  dependencies:
+    call-bind "^1.0.5"
+    define-properties "^1.2.1"
+    has-symbols "^1.0.3"
+    object-keys "^1.1.1"
+
+object.entries@^1.1.6:
+  version "1.1.7"
+  resolved "https://registry.yarnpkg.com/object.entries/-/object.entries-1.1.7.tgz#2b47760e2a2e3a752f39dd874655c61a7f03c131"
+  integrity sha512-jCBs/0plmPsOnrKAfFQXRG2NFjlhZgjjcBLSmTnEhU8U6vVTsVe8ANeQJCHTl3gSsI4J+0emOoCgoKlmQPMgmA==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+
+object.fromentries@^2.0.6, object.fromentries@^2.0.7:
+  version "2.0.7"
+  resolved "https://registry.yarnpkg.com/object.fromentries/-/object.fromentries-2.0.7.tgz#71e95f441e9a0ea6baf682ecaaf37fa2a8d7e616"
+  integrity sha512-UPbPHML6sL8PI/mOqPwsH4G6iyXcCGzLin8KvEPenOZN5lpCNBZZQ+V62vdjB1mQHrmqGQt5/OJzemUA+KJmEA==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+
 object.getownpropertydescriptors@^2.0.3, object.getownpropertydescriptors@^2.1.1:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/object.getownpropertydescriptors/-/object.getownpropertydescriptors-2.1.2.tgz#1bd63aeacf0d5d2d2f31b5e393b03a7c601a23f7"
@@ -11004,6 +12739,24 @@ object.getownpropertydescriptors@^2.1.0:
     define-properties "^1.1.3"
     es-abstract "^1.19.1"
 
+object.groupby@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/object.groupby/-/object.groupby-1.0.1.tgz#d41d9f3c8d6c778d9cbac86b4ee9f5af103152ee"
+  integrity sha512-HqaQtqLnp/8Bn4GL16cj+CUYbnpe1bh0TtEaWvybszDG4tgxCJuRpV8VGuvNaI1fAnI4lUJzDG55MXcOH4JZcQ==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+    get-intrinsic "^1.2.1"
+
+object.hasown@^1.1.2:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/object.hasown/-/object.hasown-1.1.3.tgz#6a5f2897bb4d3668b8e79364f98ccf971bda55ae"
+  integrity sha512-fFI4VcYpRHvSLXxP7yiZOMAd331cPfd2p7PFDVbgUsYOfCT3tICVqXWngbjr4m49OvsBwUBQ6O2uQoJvy3RexA==
+  dependencies:
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+
 object.pick@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/object.pick/-/object.pick-1.3.0.tgz#87a10ac4c1694bd2e1cbf53591a66141fb5dd747"
@@ -11020,6 +12773,15 @@ object.values@^1.1.0:
     define-properties "^1.1.3"
     es-abstract "^1.19.1"
 
+object.values@^1.1.6, object.values@^1.1.7:
+  version "1.1.7"
+  resolved "https://registry.yarnpkg.com/object.values/-/object.values-1.1.7.tgz#617ed13272e7e1071b43973aa1655d9291b8442a"
+  integrity sha512-aU6xnDFYT3x17e/f0IiiwlGPTy2jzMySGfUB4fq6z7CV8l85CWHDk5ErhyhpfDHhrOMwGFhSQkhMGHaIotA6Ng==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+
 on-finished@^2.3.0, on-finished@~2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/on-finished/-/on-finished-2.3.0.tgz#20f1336481b083cd75337992a16971aa2d906947"
@@ -11078,6 +12840,18 @@ optionator@^0.8.1, optionator@^0.8.3:
     type-check "~0.3.2"
     word-wrap "~1.2.3"
 
+optionator@^0.9.3:
+  version "0.9.3"
+  resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.9.3.tgz#007397d44ed1872fdc6ed31360190f81814e2c64"
+  integrity sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==
+  dependencies:
+    "@aashutoshrathi/word-wrap" "^1.2.3"
+    deep-is "^0.1.3"
+    fast-levenshtein "^2.0.6"
+    levn "^0.4.1"
+    prelude-ls "^1.2.1"
+    type-check "^0.4.0"
+
 orbit-camera-controller@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/orbit-camera-controller/-/orbit-camera-controller-4.0.0.tgz#6e2b36f0e7878663c330f50da9b7ce686c277005"
@@ -11105,6 +12879,11 @@ os-tmpdir@~1.0.2:
   resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274"
   integrity sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=
 
+ospath@^1.2.2:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/ospath/-/ospath-1.2.2.tgz#1276639774a3f8ef2572f7fe4280e0ea4550c07b"
+  integrity sha512-o6E5qJV5zkAbIDNhGSIlyOhScKXgQrSRMilfph0clDfM0nEnBOlKlH4sWDmG95BW/CvwNz0vmm7dJVtU2KlMiA==
+
 p-defer@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/p-defer/-/p-defer-1.0.0.tgz#9f6eb182f6c9aa8cd743004a7d4f96b196b0fb0c"
@@ -11155,6 +12934,13 @@ p-locate@^4.1.0:
   dependencies:
     p-limit "^2.2.0"
 
+p-locate@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-5.0.0.tgz#83c8315c6785005e3bd021839411c9e110e6d834"
+  integrity sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==
+  dependencies:
+    p-limit "^3.0.2"
+
 p-map@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/p-map/-/p-map-4.0.0.tgz#bb2f95a5eda2ec168ec9274e06a747c3e2904d2b"
@@ -11294,6 +13080,11 @@ parse5@4.0.0:
   resolved "https://registry.yarnpkg.com/parse5/-/parse5-4.0.0.tgz#6d78656e3da8d78b4ec0b906f7c08ef1dfe3f608"
   integrity sha512-VrZ7eOd3T1Fk4XWNXMgiGBK/z0MG48BWG2uQNU4I72fkQuKUTZpl+u9k+CxEG0twMVzSmXEEz12z5Fnw1jIQFA==
 
+parse5@6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/parse5/-/parse5-6.0.1.tgz#e1a1c085c569b3dc08321184f19a39cc27f7c30b"
+  integrity sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==
+
 parseurl@~1.3.3:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.3.tgz#9da19e7bee8d12dff0513ed5b76957793bc2e8d4"
@@ -11354,7 +13145,7 @@ path-key@^3.0.0, path-key@^3.1.0:
   resolved "https://registry.yarnpkg.com/path-key/-/path-key-3.1.1.tgz#581f6ade658cbba65a0d3380de7753295054f375"
   integrity sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==
 
-path-parse@^1.0.6:
+path-parse@^1.0.6, path-parse@^1.0.7:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735"
   integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==
@@ -11395,6 +13186,11 @@ pbkdf2@^3.0.3:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
+pend@~1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/pend/-/pend-1.2.0.tgz#7a57eb550a6783f9115331fcf4663d5c8e007a50"
+  integrity sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==
+
 performance-now@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b"
@@ -11430,7 +13226,7 @@ picomatch@^2.0.5:
   resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad"
   integrity sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==
 
-pify@^2.3.0:
+pify@^2.2.0, pify@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c"
   integrity sha1-7RQaasBDqEnqWISY59yosVMw6Qw=
@@ -11469,6 +13265,14 @@ pirates@^4.0.1:
   dependencies:
     node-modules-regexp "^1.0.0"
 
+pkg-conf@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/pkg-conf/-/pkg-conf-3.1.0.tgz#d9f9c75ea1bae0e77938cde045b276dac7cc69ae"
+  integrity sha512-m0OTbR/5VPNPqO1ph6Fqbj7Hv6QU7gR/tQW40ZqrL1rjgCU85W6C1bJn0BItuJqnR98PWzw7Z8hHeChD1WrgdQ==
+  dependencies:
+    find-up "^3.0.0"
+    load-json-file "^5.2.0"
+
 pkg-dir@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-1.0.0.tgz#7a4b508a8d5bb2d629d447056ff4e9c9314cf3d4"
@@ -12315,6 +14119,11 @@ potpack@^1.0.2:
   resolved "https://registry.yarnpkg.com/potpack/-/potpack-1.0.2.tgz#23b99e64eb74f5741ffe7656b5b5c4ddce8dfc14"
   integrity sha512-choctRBIV9EMT9WGAZHn3V7t0Z2pMQyl0EZE6pFc/6ml3ssw7Dlf/oAOvFwjm1HVsqfQN8GfeFyJ+d8tRzqueQ==
 
+prelude-ls@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
+  integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==
+
 prelude-ls@~1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54"
@@ -12412,6 +14221,15 @@ prompts@^2.0.1:
     kleur "^3.0.3"
     sisteransi "^1.0.5"
 
+prop-types@^15.8.1:
+  version "15.8.1"
+  resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
+  integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
+  dependencies:
+    loose-envify "^1.4.0"
+    object-assign "^4.1.1"
+    react-is "^16.13.1"
+
 proper-lockfile@^4.1.2:
   version "4.1.2"
   resolved "https://registry.yarnpkg.com/proper-lockfile/-/proper-lockfile-4.1.2.tgz#c8b9de2af6b2f1601067f98e01ac66baa223141f"
@@ -12463,6 +14281,11 @@ proxy-addr@~2.0.5:
     forwarded "~0.1.2"
     ipaddr.js "1.9.1"
 
+proxy-from-env@1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.0.0.tgz#33c50398f70ea7eb96d21f7b817630a55791c7ee"
+  integrity sha512-F2JHgJQ1iqwnHDcQjVBsq3n/uoaFL+iPW/eAeL7kVxy/2RrWaN4WroKjjvbsoRtv0ftelNyC01bjRhn/bhcf4A==
+
 prr@~1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/prr/-/prr-1.0.1.tgz#d3fc114ba06995a45ec6893f484ceb1d78f5f476"
@@ -12478,6 +14301,11 @@ psl@^1.1.28:
   resolved "https://registry.yarnpkg.com/psl/-/psl-1.8.0.tgz#9326f8bcfb013adcc005fdff056acce020e51c24"
   integrity sha512-RIdOzyoavK+hA18OGGWDqUTsCLhtA7IcZ/6NCs4fFJaHBDab+pDDmDIByWFRQJq2Cd7r1OoQxBGKOaztq+hjIQ==
 
+psl@^1.1.33:
+  version "1.9.0"
+  resolved "https://registry.yarnpkg.com/psl/-/psl-1.9.0.tgz#d0df2a137f00794565fcaf3b2c00cd09f8d5a5a7"
+  integrity sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==
+
 public-encrypt@^4.0.0:
   version "4.0.3"
   resolved "https://registry.yarnpkg.com/public-encrypt/-/public-encrypt-4.0.3.tgz#4fcc9d77a07e48ba7527e7cbe0de33d0701331e0"
@@ -12557,6 +14385,13 @@ qs@^6.9.4:
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.9.6.tgz#26ed3c8243a431b2924aca84cc90471f35d5a0ee"
   integrity sha512-TIRk4aqYLNoJUbd+g2lEdz5kLWIuTMRagAXxl78Q0RiVjAOugHmeKNGdd3cwo/ktpf9aL9epCfFqWDEKysUlLQ==
 
+qs@~6.10.3:
+  version "6.10.5"
+  resolved "https://registry.yarnpkg.com/qs/-/qs-6.10.5.tgz#974715920a80ff6a262264acd2c7e6c2a53282b4"
+  integrity sha512-O5RlPh0VFtR78y79rgcgKK4wbAI0C5zGVLztOIdpWX6ep368q5Hv6XRxDvXuZ9q3C6v+e3n8UfZZJw7IIG27eQ==
+  dependencies:
+    side-channel "^1.0.4"
+
 qs@~6.5.2:
   version "6.5.2"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36"
@@ -12607,6 +14442,16 @@ querystring@^0.2.0:
   resolved "https://registry.yarnpkg.com/querystring/-/querystring-0.2.1.tgz#40d77615bb09d16902a85c3e38aa8b5ed761c2dd"
   integrity sha512-wkvS7mL/JMugcup3/rMitHmd9ecIGd2lhFhK9N3UUQ450h66d1r3Y9nvXzQAW1Lq+wyx61k/1pfKS5KuKiyEbg==
 
+querystringify@^2.1.1:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/querystringify/-/querystringify-2.2.0.tgz#3345941b4153cb9d082d8eee4cda2016a9aef7f6"
+  integrity sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==
+
+queue-microtask@^1.1.2:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/queue-microtask/-/queue-microtask-1.2.3.tgz#4929228bbc724dfac43e0efb058caf7b6cfb6243"
+  integrity sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==
+
 queue-microtask@^1.2.2:
   version "1.2.2"
   resolved "https://registry.yarnpkg.com/queue-microtask/-/queue-microtask-1.2.2.tgz#abf64491e6ecf0f38a6502403d4cda04f372dfd3"
@@ -12685,7 +14530,27 @@ rc9@^1.2.0:
     destr "^1.0.0"
     flat "^5.0.0"
 
-react-is@^16.8.4:
+rdf-canonize@^3.4.0:
+  version "3.4.0"
+  resolved "https://registry.yarnpkg.com/rdf-canonize/-/rdf-canonize-3.4.0.tgz#87f88342b173cc371d812a07de350f0c1aa9f058"
+  integrity sha512-fUeWjrkOO0t1rg7B2fdyDTvngj+9RlUyL92vOdiB7c0FPguWVsniIMjEtHH+meLBO9rzkUlUzBVXgWrjI8P9LA==
+  dependencies:
+    setimmediate "^1.0.5"
+
+rdflib@^2.2.32:
+  version "2.2.33"
+  resolved "https://registry.yarnpkg.com/rdflib/-/rdflib-2.2.33.tgz#bf303a2218ddf94399b48d4396e16899d0539fa0"
+  integrity sha512-5OwoVbjY8CutaSJ7FLx2PhaMTpYX6y2bhDPijLkMESXncDi/eZ+53NH2+FrOWTltSMo3e27VYpiGPh3qhofWrA==
+  dependencies:
+    "@babel/runtime" "^7.21.0"
+    "@frogcat/ttl2jsonld" "^0.0.9"
+    "@xmldom/xmldom" "^0.8.7"
+    cross-fetch "^3.1.5"
+    jsonld "^8.1.1"
+    n3 "^1.16.4"
+    solid-namespace "^0.5.3"
+
+react-is@^16.13.1, react-is@^16.8.4:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
   integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
@@ -12753,6 +14618,17 @@ readable-stream@^3.0.2, readable-stream@^3.1.1, readable-stream@^3.6.0:
     string_decoder "^1.1.1"
     util-deprecate "^1.0.1"
 
+readable-stream@^4.0.0:
+  version "4.4.2"
+  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-4.4.2.tgz#e6aced27ad3b9d726d8308515b9a1b98dc1b9d13"
+  integrity sha512-Lk/fICSyIhodxy1IDK2HazkeGjSmezAWX2egdtJnYhtzKEsBPJowlI6F6LPb5tqIQILrMbx22S5o3GuJavPusA==
+  dependencies:
+    abort-controller "^3.0.0"
+    buffer "^6.0.3"
+    events "^3.3.0"
+    process "^0.11.10"
+    string_decoder "^1.3.0"
+
 readdirp@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-2.2.1.tgz#0e87622a3325aa33e892285caf8b4e846529a525"
@@ -12799,6 +14675,18 @@ reduce-simplicial-complex@^1.0.0:
     compare-cell "^1.0.0"
     compare-oriented-cell "^1.0.1"
 
+reflect.getprototypeof@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/reflect.getprototypeof/-/reflect.getprototypeof-1.0.4.tgz#aaccbf41aca3821b87bb71d9dcbc7ad0ba50a3f3"
+  integrity sha512-ECkTw8TmJwW60lOTR+ZkODISW6RQ8+2CL3COqtiJKLd6MmB45hN51HprHFziKLGkAuTGQhBb91V8cy+KHlaCjw==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+    get-intrinsic "^1.2.1"
+    globalthis "^1.0.3"
+    which-builtin-type "^1.1.3"
+
 regenerate-unicode-properties@^8.2.0:
   version "8.2.0"
   resolved "https://registry.yarnpkg.com/regenerate-unicode-properties/-/regenerate-unicode-properties-8.2.0.tgz#e5de7111d655e7ba60c057dbe9ff37c87e65cdec"
@@ -12821,6 +14709,11 @@ regenerator-runtime@^0.13.4, regenerator-runtime@^0.13.7:
   resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz#cac2dacc8a1ea675feaabaeb8ae833898ae46f55"
   integrity sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew==
 
+regenerator-runtime@^0.14.0:
+  version "0.14.0"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz#5e19d68eb12d486f797e15a3c6a918f7cec5eb45"
+  integrity sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==
+
 regenerator-transform@^0.14.2:
   version "0.14.5"
   resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.14.5.tgz#c98da154683671c9c4dcb16ece736517e1b7feb4"
@@ -12841,11 +14734,25 @@ regex-regex@^1.0.0:
   resolved "https://registry.yarnpkg.com/regex-regex/-/regex-regex-1.0.0.tgz#9048a1eaeb870f4d480dabc76fc42cdcc0bc3a72"
   integrity sha1-kEih6uuHD01IDavHb8Qs3MC8OnI=
 
+regexp.prototype.flags@^1.5.0, regexp.prototype.flags@^1.5.1:
+  version "1.5.1"
+  resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz#90ce989138db209f81492edd734183ce99f9677e"
+  integrity sha512-sy6TXMN+hnP/wMy+ISxg3krXx7BAtWVO4UouuCN/ziM9UEne0euamVNafDfvC83bRNr95y0V5iijeDQFUNpvrg==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    set-function-name "^2.0.0"
+
 regexpp@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-2.0.1.tgz#8d19d31cf632482b589049f8281f93dbcba4d07f"
   integrity sha512-lv0M6+TkDVniA3aD1Eg0DVpfU/booSu7Eev3TDO/mZKHBfVjgCGTV4t4buppESEYDtkArYFOxTJWv6S5C+iaNw==
 
+regexpp@^3.0.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/regexpp/-/regexpp-3.2.0.tgz#0425a2768d8f23bad70ca4b90461fa2f1213e1b2"
+  integrity sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg==
+
 regexpu-core@^4.7.1:
   version "4.7.1"
   resolved "https://registry.yarnpkg.com/regexpu-core/-/regexpu-core-4.7.1.tgz#2dea5a9a07233298fbf0db91fa9abc4c6e0f8ad6"
@@ -12973,6 +14880,13 @@ repeat-string@^1.3.0, repeat-string@^1.6.1:
   resolved "https://registry.yarnpkg.com/repeat-string/-/repeat-string-1.6.1.tgz#8dcae470e1c88abc2d600fff4a776286da75e637"
   integrity sha1-jcrkcOHIirwtYA//Sndihtp15jc=
 
+request-progress@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/request-progress/-/request-progress-3.0.0.tgz#4ca754081c7fec63f505e4faa825aa06cd669dbe"
+  integrity sha512-MnWzEHHaxHO2iWiQuHrUPBi/1WeBf5PkxQqNyNvLl9VAYSdXkP8tQ3pBSeCPD+yw0v0Aq1zosWLz0BdeXpWwZg==
+  dependencies:
+    throttleit "^1.0.0"
+
 request-promise-core@1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/request-promise-core/-/request-promise-core-1.1.4.tgz#3eedd4223208d419867b78ce815167d10593a22f"
@@ -13087,6 +15001,24 @@ resolve@^1.0.0, resolve@^1.1.5, resolve@^1.1.7, resolve@^1.10.0, resolve@^1.12.0
     is-core-module "^2.2.0"
     path-parse "^1.0.6"
 
+resolve@^1.22.1, resolve@^1.22.4:
+  version "1.22.8"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.8.tgz#b6c87a9f2aa06dfab52e3d70ac8cde321fa5a48d"
+  integrity sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==
+  dependencies:
+    is-core-module "^2.13.0"
+    path-parse "^1.0.7"
+    supports-preserve-symlinks-flag "^1.0.0"
+
+resolve@^2.0.0-next.4:
+  version "2.0.0-next.5"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-2.0.0-next.5.tgz#6b0ec3107e671e52b68cd068ef327173b90dc03c"
+  integrity sha512-U7WjGVG9sH8tvjW5SmGbQuui75FiyjAX72HX15DwBBwF9dNiQZRQAg9nnPhYy+TUnE0+VcrttuvNI8oSxZcocA==
+  dependencies:
+    is-core-module "^2.13.0"
+    path-parse "^1.0.7"
+    supports-preserve-symlinks-flag "^1.0.0"
+
 restore-cursor@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/restore-cursor/-/restore-cursor-3.1.0.tgz#39f67c54b3a7a58cea5236d95cf0034239631f7e"
@@ -13110,6 +15042,11 @@ reusify@^1.0.4:
   resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
   integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
 
+rfdc@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/rfdc/-/rfdc-1.3.0.tgz#d0b7c441ab2720d05dc4cf26e01c89631d9da08b"
+  integrity sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA==
+
 rgb-regex@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/rgb-regex/-/rgb-regex-1.0.1.tgz#c0e0d6882df0e23be254a475e8edd41915feaeb1"
@@ -13139,7 +15076,7 @@ rimraf@^2.5.2, rimraf@^2.5.4, rimraf@^2.6.2, rimraf@^2.6.3:
   dependencies:
     glob "^7.1.3"
 
-rimraf@^3.0.2:
+rimraf@^3.0.0, rimraf@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-3.0.2.tgz#f1a5402ba6220ad52cc1282bac1ae3aa49fd061a"
   integrity sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==
@@ -13273,6 +15210,23 @@ rxjs@^6.6.0:
   dependencies:
     tslib "^1.9.0"
 
+rxjs@^7.5.1:
+  version "7.8.1"
+  resolved "https://registry.yarnpkg.com/rxjs/-/rxjs-7.8.1.tgz#6f6f3d99ea8044291efd92e7c7fcf562c4057543"
+  integrity sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==
+  dependencies:
+    tslib "^2.1.0"
+
+safe-array-concat@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/safe-array-concat/-/safe-array-concat-1.0.1.tgz#91686a63ce3adbea14d61b14c99572a8ff84754c"
+  integrity sha512-6XbUAseYE2KtOuGueyeobCySj9L4+66Tn6KQMOPQJrAJEowYKW/YR/MGJZl7FdydUdaFu4LYyDZjxf4/Nmo23Q==
+  dependencies:
+    call-bind "^1.0.2"
+    get-intrinsic "^1.2.1"
+    has-symbols "^1.0.3"
+    isarray "^2.0.5"
+
 safe-buffer@5.1.2, safe-buffer@~5.1.0, safe-buffer@~5.1.1:
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
@@ -13283,6 +15237,15 @@ safe-buffer@^5.0.1, safe-buffer@^5.1.0, safe-buffer@^5.1.1, safe-buffer@^5.1.2,
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.2.1.tgz#1eaf9fa9bdb1fdd4ec75f58f9cdb4e6b7827eec6"
   integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==
 
+safe-regex-test@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/safe-regex-test/-/safe-regex-test-1.0.0.tgz#793b874d524eb3640d1873aad03596db2d4f2295"
+  integrity sha512-JBUUzyOgEwXQY1NuPtvcj/qcBDbDmEvWufhlnXZIm75DEHp+afM1r1ujJpJsV/gSM4t59tpDyPi1sd6ZaPFfsA==
+  dependencies:
+    call-bind "^1.0.2"
+    get-intrinsic "^1.1.3"
+    is-regex "^1.1.4"
+
 safe-regex@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/safe-regex/-/safe-regex-1.1.0.tgz#40a3669f3b077d1e943d44629e157dd48023bf2e"
@@ -13290,7 +15253,7 @@ safe-regex@^1.1.0:
   dependencies:
     ret "~0.1.10"
 
-"safer-buffer@>= 2.1.2 < 3", safer-buffer@^2.0.2, safer-buffer@^2.1.0, safer-buffer@~2.1.0:
+"safer-buffer@>= 2.1.2 < 3", "safer-buffer@>= 2.1.2 < 3.0.0", safer-buffer@^2.0.2, safer-buffer@^2.1.0, safer-buffer@~2.1.0:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a"
   integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==
@@ -13358,6 +15321,13 @@ sax@^1.2.4, sax@~1.2.4:
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
   integrity sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==
 
+saxes@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/saxes/-/saxes-5.0.1.tgz#eebab953fa3b7608dbe94e5dadb15c888fa6696d"
+  integrity sha512-5LBh1Tls8c9xgGjw3QrMwETmTMVk0oFgvrFSvWx62llR2hcEInrKNZ2GZCCuuy2lvWrdl5jhbpeqc5hRYKFOcw==
+  dependencies:
+    xmlchars "^2.2.0"
+
 schema-utils@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-1.0.0.tgz#0b79a93204d7b600d4b2850d1f66c2a34951c770"
@@ -13410,6 +15380,18 @@ semver@^6.0.0, semver@^6.1.1, semver@^6.1.2, semver@^6.2.0, semver@^6.3.0:
   resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
   integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==
 
+semver@^6.3.1:
+  version "6.3.1"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.1.tgz#556d2ef8689146e46dcea4bfdd095f3434dffcb4"
+  integrity sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==
+
+semver@^7.0.0, semver@^7.3.8, semver@^7.5.3:
+  version "7.5.4"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.4.tgz#483986ec4ed38e1c6c48c34894a9182dbff68a6e"
+  integrity sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==
+  dependencies:
+    lru-cache "^6.0.0"
+
 semver@^7.3.2, semver@^7.3.4:
   version "7.3.4"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.4.tgz#27aaa7d2e4ca76452f98d3add093a72c943edc97"
@@ -13484,6 +15466,25 @@ set-blocking@^2.0.0:
   resolved "https://registry.yarnpkg.com/set-blocking/-/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7"
   integrity sha1-BF+XgtARrppoA93TgrJDkrPYkPc=
 
+set-function-length@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/set-function-length/-/set-function-length-1.1.1.tgz#4bc39fafb0307224a33e106a7d35ca1218d659ed"
+  integrity sha512-VoaqjbBJKiWtg4yRcKBQ7g7wnGnLV3M8oLvVWwOk2PdYY6PEFegR1vezXR0tw6fZGF9csVakIRjrJiy2veSBFQ==
+  dependencies:
+    define-data-property "^1.1.1"
+    get-intrinsic "^1.2.1"
+    gopd "^1.0.1"
+    has-property-descriptors "^1.0.0"
+
+set-function-name@^2.0.0, set-function-name@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/set-function-name/-/set-function-name-2.0.1.tgz#12ce38b7954310b9f61faa12701620a0c882793a"
+  integrity sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==
+  dependencies:
+    define-data-property "^1.0.1"
+    functions-have-names "^1.2.3"
+    has-property-descriptors "^1.0.0"
+
 set-value@^2.0.0, set-value@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/set-value/-/set-value-2.0.1.tgz#a18d40530e6f07de4228c7defe4227af8cad005b"
@@ -13494,7 +15495,7 @@ set-value@^2.0.0, set-value@^2.0.1:
     is-plain-object "^2.0.3"
     split-string "^3.0.1"
 
-setimmediate@^1.0.4:
+setimmediate@^1.0.4, setimmediate@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/setimmediate/-/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285"
   integrity sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=
@@ -13567,11 +15568,6 @@ shepherd.js@^7.1.5:
     deepmerge "^4.2.2"
     smoothscroll-polyfill "^0.4.4"
 
-shvl@^2.0.3:
-  version "2.0.3"
-  resolved "https://registry.yarnpkg.com/shvl/-/shvl-2.0.3.tgz#eb4bd37644f5684bba1fc52c3010c96fb5e6afd1"
-  integrity sha512-V7C6S9Hlol6SzOJPnQ7qzOVEWUQImt3BNmmzh40wObhla3XOYMe4gGiYzLrJd5TFa+cI2f9LKIRJTTKZSTbWgw==
-
 side-channel@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/side-channel/-/side-channel-1.0.4.tgz#efce5c8fdc104ee751b25c58d4290011fa5ea2cf"
@@ -13702,6 +15698,24 @@ slice-ansi@^2.1.0:
     astral-regex "^1.0.0"
     is-fullwidth-code-point "^2.0.0"
 
+slice-ansi@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-3.0.0.tgz#31ddc10930a1b7e0b67b08c96c2f49b77a789787"
+  integrity sha512-pSyv7bSTC7ig9Dcgbw9AuRNUb5k5V6oDudjZoMBSr13qpLBG7tB+zgCkARjq7xIUgdz5P1Qe8u+rSGdouOOIyQ==
+  dependencies:
+    ansi-styles "^4.0.0"
+    astral-regex "^2.0.0"
+    is-fullwidth-code-point "^3.0.0"
+
+slice-ansi@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/slice-ansi/-/slice-ansi-4.0.0.tgz#500e8dd0fd55b05815086255b3195adf2a45fe6b"
+  integrity sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==
+  dependencies:
+    ansi-styles "^4.0.0"
+    astral-regex "^2.0.0"
+    is-fullwidth-code-point "^3.0.0"
+
 smoothscroll-polyfill@^0.4.4:
   version "0.4.4"
   resolved "https://registry.yarnpkg.com/smoothscroll-polyfill/-/smoothscroll-polyfill-0.4.4.tgz#3a259131dc6930e6ca80003e1cb03b603b69abf8"
@@ -13737,6 +15751,13 @@ snapdragon@^0.8.1:
     source-map-resolve "^0.5.0"
     use "^3.1.0"
 
+solid-namespace@^0.5.3:
+  version "0.5.3"
+  resolved "https://registry.yarnpkg.com/solid-namespace/-/solid-namespace-0.5.3.tgz#9656c16dcb7849306b484cf2e1f0e7e9c7c3f8ce"
+  integrity sha512-b2u2qkrRa0yrcc/jh6Nv0/mkwMyL4fMSNZtKG4dv3IxQtZOEUB8O6Xe7GrkoQaRoGrbUxRzbve9GHJD0w7p+KA==
+  dependencies:
+    standard "^17.0.0"
+
 sort-keys@^1.0.0:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/sort-keys/-/sort-keys-1.1.2.tgz#441b6d4d346798f1b4e49e8920adfba0e543f9ad"
@@ -13831,6 +15852,15 @@ spdx-license-ids@^3.0.0:
   resolved "https://registry.yarnpkg.com/spdx-license-ids/-/spdx-license-ids-3.0.7.tgz#e9c18a410e5ed7e12442a549fbd8afa767038d65"
   integrity sha512-U+MTEOO0AiDzxwFvoa4JVnMV6mZlJKk2sBLt90s7G0Gd0Mlknc7kxEn3nuDPNZRta7O2uy8oLcZLVT+4sqNZHQ==
 
+speech-rule-engine@^4.0.6:
+  version "4.0.7"
+  resolved "https://registry.yarnpkg.com/speech-rule-engine/-/speech-rule-engine-4.0.7.tgz#b655dacbad3dae04acc0f7665e26ef258397dd09"
+  integrity sha512-sJrL3/wHzNwJRLBdf6CjJWIlxC04iYKkyXvYSVsWVOiC2DSkHmxsqOhEeMsBA9XK+CHuNcsdkbFDnoUfAsmp9g==
+  dependencies:
+    commander "9.2.0"
+    wicked-good-xpath "1.3.0"
+    xmldom-sre "0.1.31"
+
 split-on-first@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/split-on-first/-/split-on-first-1.1.0.tgz#f610afeee3b12bce1d0c30425e76398b78249a5f"
@@ -13866,6 +15896,21 @@ sprintf-js@~1.0.2:
   resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c"
   integrity sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=
 
+sshpk@^1.14.1:
+  version "1.17.0"
+  resolved "https://registry.yarnpkg.com/sshpk/-/sshpk-1.17.0.tgz#578082d92d4fe612b13007496e543fa0fbcbe4c5"
+  integrity sha512-/9HIEs1ZXGhSPE8X6Ccm7Nam1z8KcoCqPdI7ecm1N33EzAetWahvQWVqLZtaZQ+IDKX4IyA2o0gBzqIMkAagHQ==
+  dependencies:
+    asn1 "~0.2.3"
+    assert-plus "^1.0.0"
+    bcrypt-pbkdf "^1.0.0"
+    dashdash "^1.12.0"
+    ecc-jsbn "~0.1.1"
+    getpass "^0.1.1"
+    jsbn "~0.1.0"
+    safer-buffer "^2.0.2"
+    tweetnacl "~0.14.0"
+
 sshpk@^1.7.0:
   version "1.16.1"
   resolved "https://registry.yarnpkg.com/sshpk/-/sshpk-1.16.1.tgz#fb661c0bef29b39db40769ee39fa70093d6f6877"
@@ -13922,6 +15967,31 @@ stackframe@^1.1.1:
   resolved "https://registry.yarnpkg.com/stackframe/-/stackframe-1.2.0.tgz#52429492d63c62eb989804c11552e3d22e779303"
   integrity sha512-GrdeshiRmS1YLMYgzF16olf2jJ/IzxXY9lhKOskuVziubpTYcYqyOwYeJKzQkwy7uN0fYSsbsC4RQaXf9LCrYA==
 
+standard-engine@^15.0.0:
+  version "15.1.0"
+  resolved "https://registry.yarnpkg.com/standard-engine/-/standard-engine-15.1.0.tgz#717409a002edd13cd57f6554fdd3464d9a22a774"
+  integrity sha512-VHysfoyxFu/ukT+9v49d4BRXIokFRZuH3z1VRxzFArZdjSCFpro6rEIU3ji7e4AoAtuSfKBkiOmsrDqKW5ZSRw==
+  dependencies:
+    get-stdin "^8.0.0"
+    minimist "^1.2.6"
+    pkg-conf "^3.1.0"
+    xdg-basedir "^4.0.0"
+
+standard@^17.0.0:
+  version "17.1.0"
+  resolved "https://registry.yarnpkg.com/standard/-/standard-17.1.0.tgz#829eeeb3139ad50714294d3531592d60ad1286af"
+  integrity sha512-jaDqlNSzLtWYW4lvQmU0EnxWMUGQiwHasZl5ZEIwx3S/ijZDjZOzs1y1QqKwKs5vqnFpGtizo4NOYX2s0Voq/g==
+  dependencies:
+    eslint "^8.41.0"
+    eslint-config-standard "17.1.0"
+    eslint-config-standard-jsx "^11.0.0"
+    eslint-plugin-import "^2.27.5"
+    eslint-plugin-n "^15.7.0"
+    eslint-plugin-promise "^6.1.1"
+    eslint-plugin-react "^7.32.2"
+    standard-engine "^15.0.0"
+    version-guard "^1.1.1"
+
 static-eval@^2.0.5:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/static-eval/-/static-eval-2.1.0.tgz#a16dbe54522d7fa5ef1389129d813fd47b148014"
@@ -14059,6 +16129,30 @@ string-width@^4.0.0, string-width@^4.1.0, string-width@^4.2.0:
     is-fullwidth-code-point "^3.0.0"
     strip-ansi "^6.0.0"
 
+string.prototype.matchall@^4.0.8:
+  version "4.0.10"
+  resolved "https://registry.yarnpkg.com/string.prototype.matchall/-/string.prototype.matchall-4.0.10.tgz#a1553eb532221d4180c51581d6072cd65d1ee100"
+  integrity sha512-rGXbGmOEosIQi6Qva94HUjgPs9vKW+dkG7Y8Q5O2OYkWL6wFaTRZO8zM4mhP94uX55wgyrXzfS2aGtGzUL7EJQ==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+    get-intrinsic "^1.2.1"
+    has-symbols "^1.0.3"
+    internal-slot "^1.0.5"
+    regexp.prototype.flags "^1.5.0"
+    set-function-name "^2.0.0"
+    side-channel "^1.0.4"
+
+string.prototype.trim@^1.2.8:
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/string.prototype.trim/-/string.prototype.trim-1.2.8.tgz#f9ac6f8af4bd55ddfa8895e6aea92a96395393bd"
+  integrity sha512-lfjY4HcixfQXOfaqCvcBuOIapyaroTXhbkfJN3gcB1OtyupngWK4sEET9Knd0cXd28kTUqu/kHoV4HKSJdnjiQ==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+
 string.prototype.trimend@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.4.tgz#e75ae90c2942c63504686c18b287b4a0b1a45f80"
@@ -14067,6 +16161,15 @@ string.prototype.trimend@^1.0.4:
     call-bind "^1.0.2"
     define-properties "^1.1.3"
 
+string.prototype.trimend@^1.0.7:
+  version "1.0.7"
+  resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.7.tgz#1bb3afc5008661d73e2dc015cd4853732d6c471e"
+  integrity sha512-Ni79DqeB72ZFq1uH/L6zJ+DKZTkOtPIHovb3YZHQViE+HDouuU4mBrLOLDn5Dde3RF8qw5qVETEjhu9locMLvA==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+
 string.prototype.trimstart@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.4.tgz#b36399af4ab2999b4c9c648bd7a3fb2bb26feeed"
@@ -14075,7 +16178,16 @@ string.prototype.trimstart@^1.0.4:
     call-bind "^1.0.2"
     define-properties "^1.1.3"
 
-string_decoder@^1.0.0, string_decoder@^1.1.1:
+string.prototype.trimstart@^1.0.7:
+  version "1.0.7"
+  resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.7.tgz#d4cdb44b83a4737ffbac2d406e405d43d0184298"
+  integrity sha512-NGhtDFu3jCEm7B4Fy0DpLewdJQOZcQ0rGbwQ/+stjnrp2i+rlKeCvos9hOIeCmqwratM47OBxY7uFZzjxHXmrg==
+  dependencies:
+    call-bind "^1.0.2"
+    define-properties "^1.2.0"
+    es-abstract "^1.22.1"
+
+string_decoder@^1.0.0, string_decoder@^1.1.1, string_decoder@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.3.0.tgz#42f114594a46cf1a8e30b0a84f56c78c3edac21e"
   integrity sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==
@@ -14122,6 +16234,13 @@ strip-ansi@^6.0.0:
   dependencies:
     ansi-regex "^5.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-bom@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3"
@@ -14137,7 +16256,7 @@ strip-final-newline@^2.0.0:
   resolved "https://registry.yarnpkg.com/strip-final-newline/-/strip-final-newline-2.0.0.tgz#89b852fb2fcbe936f6f4b3187afb0a12c1ab58ad"
   integrity sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==
 
-strip-json-comments@^3.0.1:
+strip-json-comments@^3.0.1, strip-json-comments@^3.1.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006"
   integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==
@@ -14177,10 +16296,10 @@ supercluster@^7.0.0:
   dependencies:
     kdbush "^3.0.0"
 
-supercluster@^7.1.4:
-  version "7.1.4"
-  resolved "https://registry.yarnpkg.com/supercluster/-/supercluster-7.1.4.tgz#6762aabfd985d3390b49f13b815567d5116a828a"
-  integrity sha512-GhKkRM1jMR6WUwGPw05fs66pOFWhf59lXq+Q3J3SxPvhNcmgOtLRV6aVQPMRsmXdpaeFJGivt+t7QXUPL3ff4g==
+supercluster@^7.1.5:
+  version "7.1.5"
+  resolved "https://registry.yarnpkg.com/supercluster/-/supercluster-7.1.5.tgz#65a6ce4a037a972767740614c19051b64b8be5a3"
+  integrity sha512-EulshI3pGUM66o6ZdH3ReiFcvHpM3vAigyK+vcxdjpJyEbIIrtbmBdY23mGgnI24uXiGFvrGq9Gkum/8U7vJWg==
   dependencies:
     kdbush "^3.0.0"
 
@@ -14215,6 +16334,18 @@ supports-color@^7.0.0, supports-color@^7.1.0:
   dependencies:
     has-flag "^4.0.0"
 
+supports-color@^8.1.1:
+  version "8.1.1"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-8.1.1.tgz#cd6fc17e28500cff56c1b86c0a7fd4a54a73005c"
+  integrity sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==
+  dependencies:
+    has-flag "^4.0.0"
+
+supports-preserve-symlinks-flag@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"
+  integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==
+
 surface-nets@^1.0.0, surface-nets@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/surface-nets/-/surface-nets-1.0.2.tgz#e433c8cbba94a7274c6f4c99552b461bf1fc7a4b"
@@ -14283,7 +16414,7 @@ svgo@^1.0.0, svgo@^1.0.5:
     unquote "~1.1.1"
     util.promisify "~1.0.0"
 
-symbol-tree@^3.2.2:
+symbol-tree@^3.2.2, symbol-tree@^3.2.4:
   version "3.2.4"
   resolved "https://registry.yarnpkg.com/symbol-tree/-/symbol-tree-3.2.4.tgz#430637d248ba77e078883951fb9aa0eed7c63fa2"
   integrity sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==
@@ -14414,6 +16545,11 @@ throttle-debounce@^1.0.1:
   resolved "https://registry.yarnpkg.com/throttle-debounce/-/throttle-debounce-1.1.0.tgz#51853da37be68a155cb6e827b3514a3c422e89cd"
   integrity sha512-XH8UiPCQcWNuk2LYePibW/4qL97+ZQ1AN3FNXwZRBNPPowo/NRU5fAlDCSNBJIYCKbioZfuYtMhG4quqoJhVzg==
 
+throttleit@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/throttleit/-/throttleit-1.0.0.tgz#9e785836daf46743145a5984b6268d828528ac6c"
+  integrity sha512-rkTVqu6IjfQ/6+uNuuc3sZek4CEYxTJom3IktzgdSxcZqdARuebbA/f4QmAxMQIxqq9ZLEUkSYqvuk1I6VKq4g==
+
 through2@^0.6.3:
   version "0.6.5"
   resolved "https://registry.yarnpkg.com/through2/-/through2-0.6.5.tgz#41ab9c67b29d57209071410e1d7a7a968cd3ad48"
@@ -14430,7 +16566,7 @@ through2@^2.0.0, through2@^2.0.1:
     readable-stream "~2.3.6"
     xtend "~4.0.1"
 
-through@^2.3.6:
+through@^2.3.6, through@^2.3.8:
   version "2.3.8"
   resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5"
   integrity sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=
@@ -14474,6 +16610,13 @@ tmp@^0.0.33:
   dependencies:
     os-tmpdir "~1.0.2"
 
+tmp@~0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/tmp/-/tmp-0.2.1.tgz#8457fc3037dcf4719c251367a1af6500ee1ccf14"
+  integrity sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ==
+  dependencies:
+    rimraf "^3.0.0"
+
 tmpl@1.0.x:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/tmpl/-/tmpl-1.0.4.tgz#23640dd7b42d00433911140820e5cf440e521dd1"
@@ -14585,6 +16728,26 @@ tough-cookie@^2.3.3, tough-cookie@^2.3.4, tough-cookie@~2.5.0:
     psl "^1.1.28"
     punycode "^2.1.1"
 
+tough-cookie@^4.0.0:
+  version "4.1.2"
+  resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-4.1.2.tgz#e53e84b85f24e0b65dd526f46628db6c85f6b874"
+  integrity sha512-G9fqXWoYFZgTc2z8Q5zaHy/vJMjm+WV0AkAeHxVCQiEB1b+dGvWzFW6QV07cY5jQ5gRkeid2qIkzkxUnmoQZUQ==
+  dependencies:
+    psl "^1.1.33"
+    punycode "^2.1.1"
+    universalify "^0.2.0"
+    url-parse "^1.5.3"
+
+tough-cookie@^4.1.3:
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-4.1.3.tgz#97b9adb0728b42280aa3d814b6b999b2ff0318bf"
+  integrity sha512-aX/y5pVRkfRnfmuX+OdbSdXvPe6ieKX/G2s7e98f4poJHnqH3281gDPm/metm6E/WRamfx7WC4HUqkWHfQHprw==
+  dependencies:
+    psl "^1.1.33"
+    punycode "^2.1.1"
+    universalify "^0.2.0"
+    url-parse "^1.5.3"
+
 tr46@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/tr46/-/tr46-1.0.1.tgz#a8b13fd6bfd2489519674ccde55ba3693b706d09"
@@ -14592,6 +16755,18 @@ tr46@^1.0.1:
   dependencies:
     punycode "^2.1.0"
 
+tr46@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/tr46/-/tr46-3.0.0.tgz#555c4e297a950617e8eeddef633c87d4d9d6cbf9"
+  integrity sha512-l7FvfAHlcmulp8kr+flpQZmVwtu7nfRV7NZujtN0OqES8EL4O4e0qqzL0DC5gAvx/ZC/9lk6rhcUwYvkBnBnYA==
+  dependencies:
+    punycode "^2.1.1"
+
+tr46@~0.0.3:
+  version "0.0.3"
+  resolved "https://registry.yarnpkg.com/tr46/-/tr46-0.0.3.tgz#8184fd347dac9cdc185992f3a6622e14b9d9ab6a"
+  integrity sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==
+
 triangulate-hypercube@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/triangulate-hypercube/-/triangulate-hypercube-1.0.1.tgz#d8071db2ebfcfd51f308d0bcf2a5c48a5b36d137"
@@ -14629,6 +16804,16 @@ ts-pnp@^1.1.6:
   resolved "https://registry.yarnpkg.com/ts-pnp/-/ts-pnp-1.2.0.tgz#a500ad084b0798f1c3071af391e65912c86bca92"
   integrity sha512-csd+vJOb/gkzvcCHgTGSChYpy5f1/XKNsmvBGO4JXS+z1v2HobugDz4s1IeFXM3wZB44uczs+eazB5Q/ccdhQw==
 
+tsconfig-paths@^3.14.2:
+  version "3.14.2"
+  resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.14.2.tgz#6e32f1f79412decd261f92d633a9dc1cfa99f088"
+  integrity sha512-o/9iXgCYc5L/JxCHPe3Hvh8Q/2xm5Z+p18PESBU6Ff33695QnCHBEjcytY2q19ua7Mbl/DavtBOLq+oG0RCL+g==
+  dependencies:
+    "@types/json5" "^0.0.29"
+    json5 "^1.0.2"
+    minimist "^1.2.6"
+    strip-bom "^3.0.0"
+
 tslib@^1.11.1, tslib@^1.8.0, tslib@^1.9.0, tslib@^1.9.3:
   version "1.14.1"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
@@ -14644,6 +16829,11 @@ tslib@^2.0.3:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.1.0.tgz#da60860f1c2ecaa5703ab7d39bc05b6bf988b97a"
   integrity sha512-hcVC3wYEziELGGmEEXue7D75zbwIIVUMWAVbHItGPx0ziyXxrOMQx4rQEVEV45Ut/1IotuEvwqPopzIOkDMf0A==
 
+tslib@^2.1.0:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.6.2.tgz#703ac29425e7b37cd6fd456e92404d46d1f3e4ae"
+  integrity sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==
+
 tsviewer@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/tsviewer/-/tsviewer-0.1.0.tgz#8058011ac374a45ffd7b463321480b69a609e1ce"
@@ -14689,6 +16879,13 @@ two-sum@^1.0.0:
   resolved "https://registry.yarnpkg.com/two-sum/-/two-sum-1.0.0.tgz#31d3f32239e4f731eca9df9155e2b297f008ab64"
   integrity sha1-MdPzIjnk9zHsqd+RVeKyl/AIq2Q=
 
+type-check@^0.4.0, type-check@~0.4.0:
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.4.0.tgz#07b8203bfa7056c0657050e3ccd2c37730bab8f1"
+  integrity sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==
+  dependencies:
+    prelude-ls "^1.2.1"
+
 type-check@~0.3.2:
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.3.2.tgz#5884cab512cf1d355e3fb784f30804b2b520db72"
@@ -14706,6 +16903,16 @@ type-fest@^0.20.2:
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4"
   integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==
 
+type-fest@^0.21.3:
+  version "0.21.3"
+  resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.21.3.tgz#d260a24b0198436e133fa26a524a6d65fa3b2e37"
+  integrity sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==
+
+type-fest@^0.3.0:
+  version "0.3.1"
+  resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.3.1.tgz#63d00d204e059474fe5e1b7c011112bbd1dc29e1"
+  integrity sha512-cUGJnCdr4STbePCgqNFbpVNCepa+kAVohJs1sLhxzdH+gnEoOd8VhbYa7pD3zZYGiURWM2xzEII3fQcRizDkYQ==
+
 type-fest@^0.8.1:
   version "0.8.1"
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.8.1.tgz#09e249ebde851d3b1e48d27c105444667f17b83d"
@@ -14734,6 +16941,45 @@ type@^2.0.0:
   resolved "https://registry.yarnpkg.com/type/-/type-2.5.0.tgz#0a2e78c2e77907b252abe5f298c1b01c63f0db3d"
   integrity sha512-180WMDQaIMm3+7hGXWf12GtdniDEy7nYcyFMKJn/eZz/6tSLXrUN9V0wKSbMjej0I1WHWbpREDEKHtqPQa9NNw==
 
+typed-array-buffer@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/typed-array-buffer/-/typed-array-buffer-1.0.0.tgz#18de3e7ed7974b0a729d3feecb94338d1472cd60"
+  integrity sha512-Y8KTSIglk9OZEr8zywiIHG/kmQ7KWyjseXs1CbSo8vC42w7hg2HgYTxSWwP0+is7bWDc1H+Fo026CpHFwm8tkw==
+  dependencies:
+    call-bind "^1.0.2"
+    get-intrinsic "^1.2.1"
+    is-typed-array "^1.1.10"
+
+typed-array-byte-length@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/typed-array-byte-length/-/typed-array-byte-length-1.0.0.tgz#d787a24a995711611fb2b87a4052799517b230d0"
+  integrity sha512-Or/+kvLxNpeQ9DtSydonMxCx+9ZXOswtwJn17SNLvhptaXYDJvkFFP5zbfU/uLmvnBJlI4yrnXRxpdWH/M5tNA==
+  dependencies:
+    call-bind "^1.0.2"
+    for-each "^0.3.3"
+    has-proto "^1.0.1"
+    is-typed-array "^1.1.10"
+
+typed-array-byte-offset@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/typed-array-byte-offset/-/typed-array-byte-offset-1.0.0.tgz#cbbe89b51fdef9cd6aaf07ad4707340abbc4ea0b"
+  integrity sha512-RD97prjEt9EL8YgAgpOkf3O4IF9lhJFr9g0htQkm0rchFp/Vx7LW5Q8fSXXub7BXAODyUQohRMyOc3faCPd0hg==
+  dependencies:
+    available-typed-arrays "^1.0.5"
+    call-bind "^1.0.2"
+    for-each "^0.3.3"
+    has-proto "^1.0.1"
+    is-typed-array "^1.1.10"
+
+typed-array-length@^1.0.4:
+  version "1.0.4"
+  resolved "https://registry.yarnpkg.com/typed-array-length/-/typed-array-length-1.0.4.tgz#89d83785e5c4098bec72e08b319651f0eac9c1bb"
+  integrity sha512-KjZypGq+I/H7HI5HlOoGHkWUUGq+Q0TPhQurLbyrVrvnKTBgzLhIJ7j6J/XTQOi0d1RjyZ0wdas8bKs2p0x3Ng==
+  dependencies:
+    call-bind "^1.0.2"
+    for-each "^0.3.3"
+    is-typed-array "^1.1.9"
+
 typedarray-pool@^1.0.0, typedarray-pool@^1.0.2, typedarray-pool@^1.1.0, typedarray-pool@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/typedarray-pool/-/typedarray-pool-1.2.0.tgz#e7e90720144ba02b9ed660438af6f3aacfe33ac3"
@@ -14777,6 +17023,16 @@ unbox-primitive@^1.0.1:
     has-symbols "^1.0.2"
     which-boxed-primitive "^1.0.2"
 
+unbox-primitive@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/unbox-primitive/-/unbox-primitive-1.0.2.tgz#29032021057d5e6cdbd08c5129c226dff8ed6f9e"
+  integrity sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==
+  dependencies:
+    call-bind "^1.0.2"
+    has-bigints "^1.0.2"
+    has-symbols "^1.0.3"
+    which-boxed-primitive "^1.0.2"
+
 underscore-plus@1.x:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/underscore-plus/-/underscore-plus-1.7.0.tgz#107f1900c520ac1fefe4edec6580a7ff08a99d0f"
@@ -14789,6 +17045,13 @@ underscore@^1.9.1:
   resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.13.2.tgz#276cea1e8b9722a8dbed0100a407dda572125881"
   integrity sha512-ekY1NhRzq0B08g4bGuX4wd2jZx5GnKz6mKSqFL4nqBlfyMGiG10gDFhDTMEfYmDL6Jy0FUIZp7wiRB+0BP7J2g==
 
+undici@^5.21.2:
+  version "5.28.2"
+  resolved "https://registry.yarnpkg.com/undici/-/undici-5.28.2.tgz#fea200eac65fc7ecaff80a023d1a0543423b4c91"
+  integrity sha512-wh1pHJHnUeQV5Xa8/kyQhO7WFa8M34l026L5P/+2TYiakvGy5Rdc8jWZVyG7ieht/0WgJLEd3kcU5gKx+6GC8w==
+  dependencies:
+    "@fastify/busboy" "^2.0.0"
+
 unfetch@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/unfetch/-/unfetch-4.2.0.tgz#7e21b0ef7d363d8d9af0fb929a5555f6ef97a3be"
@@ -14874,6 +17137,11 @@ universalify@^0.1.0:
   resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.2.tgz#b646f69be3942dabcecc9d6639c80dc105efaa66"
   integrity sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==
 
+universalify@^0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.2.0.tgz#6451760566fa857534745ab1dde952d1b1761be0"
+  integrity sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==
+
 universalify@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/universalify/-/universalify-2.0.0.tgz#75a4984efedc4b08975c5aeb73f530d02df25717"
@@ -14897,6 +17165,11 @@ unset-value@^1.0.0:
     has-value "^0.3.1"
     isobject "^3.0.0"
 
+untildify@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/untildify/-/untildify-4.0.0.tgz#2bc947b953652487e4600949fb091e3ae8cd919b"
+  integrity sha512-KK8xQ1mkzZeg9inewmFVDNkg3l5LUhoq9kN6iWYB/CC9YMG8HA+c1Q8HwDe6dEX7kErrEVNVBO3fWsVq5iDgtw==
+
 upath@^1.1.1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/upath/-/upath-1.2.0.tgz#8f66dbcd55a883acdae4408af8b035a5044c1894"
@@ -14947,6 +17220,14 @@ url-loader@^4.1.1:
     mime-types "^2.1.27"
     schema-utils "^3.0.0"
 
+url-parse@^1.5.3:
+  version "1.5.10"
+  resolved "https://registry.yarnpkg.com/url-parse/-/url-parse-1.5.10.tgz#9d3c2f736c1d75dd3bd2be507dcc111f1e2ea9c1"
+  integrity sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==
+  dependencies:
+    querystringify "^2.1.1"
+    requires-port "^1.0.0"
+
 url-polyfill@^1.1.12, url-polyfill@^1.1.7:
   version "1.1.12"
   resolved "https://registry.yarnpkg.com/url-polyfill/-/url-polyfill-1.1.12.tgz#6cdaa17f6b022841b3aec0bf8dbd87ac0cd33331"
@@ -15067,6 +17348,11 @@ uuid@^3.0.0, uuid@^3.3.2:
   resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.4.0.tgz#b23e4358afa8a202fe7a100af1f5f883f02007ee"
   integrity sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==
 
+uuid@^8.3.2:
+  version "8.3.2"
+  resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2"
+  integrity sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==
+
 v8-compile-cache@^2.0.3:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz#2de19618c66dc247dcfb6f99338035d8245a2cee"
@@ -15183,6 +17469,11 @@ verror@1.10.0:
     core-util-is "1.0.2"
     extsprintf "^1.2.0"
 
+version-guard@^1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/version-guard/-/version-guard-1.1.1.tgz#7a6e87a1babff1b43d6a7b0fd239731e278262fa"
+  integrity sha512-MGQLX89UxmYHgDvcXyjBI0cbmoW+t/dANDppNPrno64rYr8nH4SHSuElQuSYdXGEs0mUzdQe1BY+FhVPNsAmJQ==
+
 vm-browserify@^1.0.1:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
@@ -15211,6 +17502,13 @@ vue-analytics@^5.22.1:
   resolved "https://registry.yarnpkg.com/vue-analytics/-/vue-analytics-5.22.1.tgz#9d6b32da56daee1b9dfb23a267b50349a03f710f"
   integrity sha512-HPKQMN7gfcUqS5SxoO0VxqLRRSPkG1H1FqglsHccz6BatBatNtm/Vyy8brApktZxNCfnAkrSVDpxg3/FNDeOgQ==
 
+vue-chartjs@^3.5.1:
+  version "3.5.1"
+  resolved "https://registry.yarnpkg.com/vue-chartjs/-/vue-chartjs-3.5.1.tgz#d25e845708f7744ae51bed9d23a975f5f8fc6529"
+  integrity sha512-foocQbJ7FtveICxb4EV5QuVpo6d8CmZFmAopBppDIGKY+esJV8IJgwmEW0RexQhxqXaL/E1xNURsgFFYyKzS/g==
+  dependencies:
+    "@types/chart.js" "^2.7.55"
+
 vue-cli-plugin-webpack-bundle-analyzer@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/vue-cli-plugin-webpack-bundle-analyzer/-/vue-cli-plugin-webpack-bundle-analyzer-2.0.0.tgz#160fbd492a673bae1be3a9f714db12218678fa01"
@@ -15389,26 +17687,25 @@ vue@^2.6.11:
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.14.tgz#e51aa5250250d569a3fbad3a8a5a687d6036e235"
   integrity sha512-x2284lgYvjOMj3Za7kqzRcUSxBboHqtgRE2zlos1qWaOye5yUmHn42LB1250NJBLRwEcdrB0JRwyPTEPhfQjiQ==
 
-vuex-persistedstate@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/vuex-persistedstate/-/vuex-persistedstate-4.1.0.tgz#127165f85f5b4534fb3170a5d3a8be9811bd2a53"
-  integrity sha512-3SkEj4NqwM69ikJdFVw6gObeB0NHyspRYMYkR/EbhR0hbvAKyR5gksVhtAfY1UYuWUOCCA0QNGwv9pOwdj+XUQ==
-  dependencies:
-    deepmerge "^4.2.2"
-    shvl "^2.0.3"
-
 vuex@^3.5.1, vuex@^3.6.2:
   version "3.6.2"
   resolved "https://registry.yarnpkg.com/vuex/-/vuex-3.6.2.tgz#236bc086a870c3ae79946f107f16de59d5895e71"
   integrity sha512-ETW44IqCgBpVomy520DT5jf8n0zoCac+sxWnn+hMe/CzaSejb/eVw2YToiXYX+Ex/AuHHia28vWTq4goAexFbw==
 
-w3c-hr-time@^1.0.1:
+w3c-hr-time@^1.0.1, w3c-hr-time@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz#0a89cdf5cc15822df9c360543676963e0cc308cd"
   integrity sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==
   dependencies:
     browser-process-hrtime "^1.0.0"
 
+w3c-xmlserializer@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/w3c-xmlserializer/-/w3c-xmlserializer-3.0.0.tgz#06cdc3eefb7e4d0b20a560a5a3aeb0d2d9a65923"
+  integrity sha512-3WFqGEgSXIyGhOmAFtlicJNMjEps8b1MG31NCA0/vOF9+nKMUW1ckhi9cnNHmf88Rzw5V+dwIwsm2C7X8k9aQg==
+  dependencies:
+    xml-name-validator "^4.0.0"
+
 walker@^1.0.7, walker@~1.0.5:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/walker/-/walker-1.0.7.tgz#2f7f9b8fd10d677262b18a884e28d19618e028fb"
@@ -15444,6 +17741,11 @@ weakmap-shim@^1.1.0:
   resolved "https://registry.yarnpkg.com/weakmap-shim/-/weakmap-shim-1.1.1.tgz#d65afd784109b2166e00ff571c33150ec2a40b49"
   integrity sha1-1lr9eEEJshZuAP9XHDMVDsKkC0k=
 
+web-streams-polyfill@^3.0.3:
+  version "3.2.1"
+  resolved "https://registry.yarnpkg.com/web-streams-polyfill/-/web-streams-polyfill-3.2.1.tgz#71c2718c52b45fd49dbeee88634b3a60ceab42a6"
+  integrity sha512-e0MO3wdXWKrLbL0DgGnUV7WHVuw9OUvL4hjgnPkIeEvESk74gAITi5G606JtZPp39cd8HA9VQzCIvA49LpPN5Q==
+
 webgl-context@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/webgl-context/-/webgl-context-2.2.0.tgz#8f37d7257cf6df1cd0a49e6a7b1b721b94cc86a0"
@@ -15451,11 +17753,21 @@ webgl-context@^2.2.0:
   dependencies:
     get-canvas-context "^1.0.1"
 
+webidl-conversions@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-3.0.1.tgz#24534275e2a7bc6be7bc86611cc16ae0a5654871"
+  integrity sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ==
+
 webidl-conversions@^4.0.2:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-4.0.2.tgz#a855980b1f0b6b359ba1d5d9fb39ae941faa63ad"
   integrity sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==
 
+webidl-conversions@^7.0.0:
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-7.0.0.tgz#256b4e1882be7debbf01d05f0aa2039778ea080a"
+  integrity sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==
+
 webpack-bundle-analyzer@^3.6.0:
   version "3.9.0"
   resolved "https://registry.yarnpkg.com/webpack-bundle-analyzer/-/webpack-bundle-analyzer-3.9.0.tgz#f6f94db108fb574e415ad313de41a2707d33ef3c"
@@ -15580,11 +17892,47 @@ whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3:
   dependencies:
     iconv-lite "0.4.24"
 
+whatwg-encoding@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz#e7635f597fd87020858626805a2729fa7698ac53"
+  integrity sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==
+  dependencies:
+    iconv-lite "0.6.3"
+
 whatwg-mimetype@^2.1.0, whatwg-mimetype@^2.2.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz#3d4b1e0312d2079879f826aff18dbeeca5960fbf"
   integrity sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g==
 
+whatwg-mimetype@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz#5fa1a7623867ff1af6ca3dc72ad6b8a4208beba7"
+  integrity sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==
+
+whatwg-url@^10.0.0:
+  version "10.0.0"
+  resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-10.0.0.tgz#37264f720b575b4a311bd4094ed8c760caaa05da"
+  integrity sha512-CLxxCmdUby142H5FZzn4D8ikO1cmypvXVQktsgosNy4a4BHrDHeciBBGZhb0bNoR5/MltoCatso+vFjjGx8t0w==
+  dependencies:
+    tr46 "^3.0.0"
+    webidl-conversions "^7.0.0"
+
+whatwg-url@^11.0.0:
+  version "11.0.0"
+  resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-11.0.0.tgz#0a849eebb5faf2119b901bb76fd795c2848d4018"
+  integrity sha512-RKT8HExMpoYx4igMiVMY83lN6UeITKJlBQ+vR/8ZJ8OCdSiN3RwCq+9gH0+Xzj0+5IrM6i4j/6LuvzbZIQgEcQ==
+  dependencies:
+    tr46 "^3.0.0"
+    webidl-conversions "^7.0.0"
+
+whatwg-url@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-5.0.0.tgz#966454e8765462e37644d3626f6742ce8b70965d"
+  integrity sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==
+  dependencies:
+    tr46 "~0.0.3"
+    webidl-conversions "^3.0.0"
+
 whatwg-url@^6.4.1:
   version "6.5.0"
   resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-6.5.0.tgz#f2df02bff176fd65070df74ad5ccbb5a199965a8"
@@ -15614,12 +17962,51 @@ which-boxed-primitive@^1.0.2:
     is-string "^1.0.5"
     is-symbol "^1.0.3"
 
+which-builtin-type@^1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/which-builtin-type/-/which-builtin-type-1.1.3.tgz#b1b8443707cc58b6e9bf98d32110ff0c2cbd029b"
+  integrity sha512-YmjsSMDBYsM1CaFiayOVT06+KJeXf0o5M/CAd4o1lTadFAtacTUM49zoYxr/oroopFDfhvN6iEcBxUyc3gvKmw==
+  dependencies:
+    function.prototype.name "^1.1.5"
+    has-tostringtag "^1.0.0"
+    is-async-function "^2.0.0"
+    is-date-object "^1.0.5"
+    is-finalizationregistry "^1.0.2"
+    is-generator-function "^1.0.10"
+    is-regex "^1.1.4"
+    is-weakref "^1.0.2"
+    isarray "^2.0.5"
+    which-boxed-primitive "^1.0.2"
+    which-collection "^1.0.1"
+    which-typed-array "^1.1.9"
+
+which-collection@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/which-collection/-/which-collection-1.0.1.tgz#70eab71ebbbd2aefaf32f917082fc62cdcb70906"
+  integrity sha512-W8xeTUwaln8i3K/cY1nGXzdnVZlidBcagyNFtBdD5kxnb4TvGKR7FfSIS3mYpwWS1QUCutfKz8IY8RjftB0+1A==
+  dependencies:
+    is-map "^2.0.1"
+    is-set "^2.0.1"
+    is-weakmap "^2.0.1"
+    is-weakset "^2.0.1"
+
 which-module@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-2.0.0.tgz#d9ef07dce77b9902b8a3a8fa4b31c3e3f7e6e87a"
   integrity sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=
 
-which@^1.2.9, which@^1.3.0:
+which-typed-array@^1.1.11, which-typed-array@^1.1.13, which-typed-array@^1.1.9:
+  version "1.1.13"
+  resolved "https://registry.yarnpkg.com/which-typed-array/-/which-typed-array-1.1.13.tgz#870cd5be06ddb616f504e7b039c4c24898184d36"
+  integrity sha512-P5Nra0qjSncduVPEAr7xhoF5guty49ArDTwzJ/yNuPIbZppyRxFQsRCWrocxIY+CnMVG+qfbU2FmDKyvSGClow==
+  dependencies:
+    available-typed-arrays "^1.0.5"
+    call-bind "^1.0.4"
+    for-each "^0.3.3"
+    gopd "^1.0.1"
+    has-tostringtag "^1.0.0"
+
+which@^1.2.9, which@^1.3.0, which@^1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"
   integrity sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==
@@ -15633,6 +18020,11 @@ which@^2.0.1:
   dependencies:
     isexe "^2.0.0"
 
+wicked-good-xpath@1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/wicked-good-xpath/-/wicked-good-xpath-1.3.0.tgz#81b0e95e8650e49c94b22298fff8686b5553cf6c"
+  integrity sha512-Gd9+TUn5nXdwj/hFsPVx5cuHHiF5Bwuc30jZ4+ronF1qHK5O7HD0sgmXWSEgwKquT3ClLoKPVbO6qGwVwLzvAw==
+
 widest-line@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/widest-line/-/widest-line-3.1.0.tgz#8292333bbf66cb45ff0de1603b136b7ae1496eca"
@@ -15683,7 +18075,7 @@ wrap-ansi@^5.1.0:
     string-width "^3.0.0"
     strip-ansi "^5.0.0"
 
-wrap-ansi@^6.0.0:
+wrap-ansi@^6.0.0, wrap-ansi@^6.2.0:
   version "6.2.0"
   resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-6.2.0.tgz#e9393ba07102e6c91a3b221478f0257cd2856e53"
   integrity sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==
@@ -15762,11 +18154,36 @@ ws@^7.3.1:
   resolved "https://registry.yarnpkg.com/ws/-/ws-7.4.4.tgz#383bc9742cb202292c9077ceab6f6047b17f2d59"
   integrity sha512-Qm8k8ojNQIMx7S+Zp8u/uHOx7Qazv3Yv4q68MiWWWOJhiwG5W3x7iqmRtJo8xxrciZUY4vRxUTJCKuRnF28ZZw==
 
+ws@^8.2.3:
+  version "8.12.1"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-8.12.1.tgz#c51e583d79140b5e42e39be48c934131942d4a8f"
+  integrity sha512-1qo+M9Ba+xNhPB+YTWUlK6M17brTut5EXbcBaMRN5pH5dFrXz7lzz1ChFSUq3bOUl8yEvSenhHmYUNJxFzdJew==
+
+xdg-basedir@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/xdg-basedir/-/xdg-basedir-4.0.0.tgz#4bc8d9984403696225ef83a1573cbbcb4e79db13"
+  integrity sha512-PSNhEJDejZYV7h50BohL09Er9VaIefr2LMAf3OEmpCkjOi34eYyQYAXUTjEQtZJTKcF0E2UKTh+osDLsgNim9Q==
+
 xml-name-validator@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/xml-name-validator/-/xml-name-validator-3.0.0.tgz#6ae73e06de4d8c6e47f9fb181f78d648ad457c6a"
   integrity sha512-A5CUptxDsvxKJEU3yO6DuWBSJz/qizqzJKOMIfUJHETbBw/sFaDxgd6fxm1ewUaM0jZ444Fc5vC5ROYurg/4Pw==
 
+xml-name-validator@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/xml-name-validator/-/xml-name-validator-4.0.0.tgz#79a006e2e63149a8600f15430f0a4725d1524835"
+  integrity sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==
+
+xmlchars@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/xmlchars/-/xmlchars-2.2.0.tgz#060fe1bcb7f9c76fe2a17db86a9bc3ab894210cb"
+  integrity sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==
+
+xmldom-sre@0.1.31:
+  version "0.1.31"
+  resolved "https://registry.yarnpkg.com/xmldom-sre/-/xmldom-sre-0.1.31.tgz#10860d5bab2c603144597d04bf2c4980e98067f4"
+  integrity sha512-f9s+fUkX04BxQf+7mMWAp5zk61pciie+fFLC9hX9UVvCeJQfNHRHXpeo5MPcR0EUf57PYLdt+ZO4f3Ipk2oZUw==
+
 xss@^1.0.14:
   version "1.0.14"
   resolved "https://registry.yarnpkg.com/xss/-/xss-1.0.14.tgz#4f3efbde75ad0d82e9921cc3c95e6590dd336694"
@@ -15867,6 +18284,14 @@ yargs@^13.3.0:
     y18n "^4.0.0"
     yargs-parser "^13.1.2"
 
+yauzl@^2.10.0:
+  version "2.10.0"
+  resolved "https://registry.yarnpkg.com/yauzl/-/yauzl-2.10.0.tgz#c7eb17c93e112cb1086fa6d8e51fb0667b79a5f9"
+  integrity sha512-p4a9I6X6nu6IhoGmBqAcbJy1mlC4j27vEPZX9F4L4/vZT3Lyq1VkFHw/V/PUcB9Buo+DG3iHkT0x3Qya58zc3g==
+  dependencies:
+    buffer-crc32 "~0.2.3"
+    fd-slicer "~1.1.0"
+
 yocto-queue@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"
@@ -15892,10 +18317,10 @@ zero-crossings@^1.0.0:
   dependencies:
     cwise-compiler "^1.0.0"
 
-zincjs@^1.0.9:
-  version "1.0.9"
-  resolved "https://registry.yarnpkg.com/zincjs/-/zincjs-1.0.9.tgz#c9affa3f4909e2162ed3bb87472a29648bb58fee"
-  integrity sha512-N8Jexto6vmLVu4X8UX1Xes+BbPOxYmrutI4vNXsKspoGNY2Rq2Ffys5GnVV9ZBYWq/Jfm/cvznPlaBBWk3jXdw==
+zincjs@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/zincjs/-/zincjs-1.3.0.tgz#2e292097961802c018760c93a99992820959521a"
+  integrity sha512-zS7Fg/zhdIKUhyF56ZzzfiboHcOkgPE9D3mRdspmR2Iv6FpUPUrUDsk8VAikliJx9rvY4PNkCLjsor3Vx/eXeQ==
   dependencies:
     css-element-queries "^1.2.2"
     lodash "^4.17.19"