diff --git a/package.json b/package.json
index b8548cdf..70be538a 100644
--- a/package.json
+++ b/package.json
@@ -14,7 +14,7 @@
   "dependencies": {
     "@girder/oauth-client": "^0.7.7",
     "@trrack/core": "^1.0.1",
-    "@trrack/vis-react": "^1.0.0",
+    "@trrack/vis-react": "^1.2.2",
     "@types/d3": "^7.4.0",
     "@types/node": "^17.0.29",
     "@vitejs/plugin-vue2": "^2.2.0",
@@ -22,8 +22,8 @@
     "d3-svg-legend": "^2.25.6",
     "eslint-import-resolver-alias": "^1.1.2",
     "lineupjs": "^4.2.0",
-    "multinet": "^0.21.7",
-    "multinet-components": "^0.0.4",
+    "multinet": "^0.21.10",
+    "multinet-components": "^0.0.6",
     "pinia": "^2.0.28",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
diff --git a/src/App.vue b/src/App.vue
index 56d43524..3d1553e8 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -9,6 +9,9 @@ import { useStore } from '@/store';
 import 'multinet-components/dist/style.css';
 import { storeToRefs } from 'pinia';
 import { undoRedoKeyHandler } from '@/lib/provenanceUtils';
+import { ref, computed } from 'vue';
+import { ToolBar } from 'multinet-components';
+import oauthClient from '@/oauth';
 
 const store = useStore();
 const {
@@ -16,6 +19,9 @@ const {
   loadError,
   showProvenanceVis,
   slicedNetwork,
+  labelVariable,
+  selectedNodes,
+  userInfo,
 } = storeToRefs(store);
 
 const urlVars = getUrlVars();
@@ -27,12 +33,73 @@ store.fetchNetwork(
 // Set up provenance undo and redo, provenance is not a ref here
 const { provenance } = store;
 document.addEventListener('keydown', (event) => undoRedoKeyHandler(event, provenance));
+
+const showControlPanel = ref(false);
+
+const searchItems = computed(() => {
+  if (labelVariable.value !== undefined) {
+    return network.value.nodes.map((node) => (node[labelVariable.value || ''])) as string[];
+  }
+  return [];
+});
+
+function search(searchTerm: string) {
+  const nodeIDsToSelect = network.value.nodes
+    .filter((node) => (labelVariable.value !== undefined && node[labelVariable.value] === searchTerm))
+    .map((node) => node._id);
+
+  if (nodeIDsToSelect.length > 0) {
+    selectedNodes.value.push(...nodeIDsToSelect);
+  }
+}
+
+function exportNetwork() {
+  const networkToExport = {
+    nodes: network.value.nodes.map((node) => {
+      const newNode = { ...node };
+      newNode.id = newNode._key;
+
+      return newNode;
+    }),
+    edges: network.value.edges.map((edge) => {
+      const newEdge = { ...edge };
+      newEdge.source = `${edge._from.split('/')[1]}`;
+      newEdge.target = `${edge._to.split('/')[1]}`;
+      return newEdge;
+    }),
+  };
+
+  const a = document.createElement('a');
+  a.href = URL.createObjectURL(
+    new Blob([JSON.stringify(networkToExport)], {
+      type: 'text/json',
+    }),
+  );
+  a.download = `${store.networkName}.json`;
+  a.click();
+}
 </script>
 
 <template>
   <v-app>
     <v-main>
-      <control-panel />
+      <tool-bar
+        app-name="MultiMatrix"
+        :clear-selection="() => selectedNodes = []"
+        :prov-undo="() => provenance.undo()"
+        :prov-redo="() => provenance.redo()"
+        :search="search"
+        :search-items="searchItems"
+        :export-network="exportNetwork"
+        :show-trrack-vis="() => showProvenanceVis = true"
+        :toggle-side-bar="() => showControlPanel = !showControlPanel"
+        :user-info="userInfo"
+        :oauth-client="oauthClient"
+        :logout="store.logout"
+        :fetch-user-info="store.fetchUserInfo"
+      />
+
+      <control-panel v-show="showControlPanel" />
 
       <edge-slices v-if="slicedNetwork.length > 0" />
 
diff --git a/src/components/AboutDialog.vue b/src/components/AboutDialog.vue
deleted file mode 100644
index 540e851a..00000000
--- a/src/components/AboutDialog.vue
+++ /dev/null
@@ -1,60 +0,0 @@
-<template>
-  <v-dialog
-    v-model="dialog"
-    class="ws-dialog"
-    width="500"
-  >
-    <template #activator="{ on }">
-      <v-btn
-        class="mt-n1 ml-n1"
-        icon
-        small
-        v-on="on"
-      >
-        <v-icon size="18">
-          mdi-help-circle
-        </v-icon>
-      </v-btn>
-    </template>
-
-    <v-card>
-      <v-card-title
-        class="text-h5 pb-0 pt-3"
-        primary-title
-      >
-        About MultiMatrix
-      </v-card-title>
-
-      <v-card-text
-        class="px-4 pt-4 pb-1"
-      >
-        The MultiMatrix application shows network data using an adjacency matrix diagram. Using MultiMatrix, users can visualize variables connections between nodes, and can aggregate nodes to show connections between groups.
-      </v-card-text>
-
-      <v-card-text class="px-4 pt-4 pb-1">
-        Check out the MultiNet project <a href="https://multinet.app">here</a>, the source code <a href="https://github.com/multinet-app/multimatrix">here</a> or our documentation <a href="https://multinet-app.readthedocs.io/en/latest/index.html">here</a>.
-      </v-card-text>
-
-      <v-divider />
-
-      <v-card-actions class="px-4 py-3">
-        <v-spacer />
-
-        <v-btn
-          color="grey darken-3"
-          dark
-          depressed
-          @click="dialog = false"
-        >
-          OK
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </v-dialog>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-
-const dialog = ref(false);
-</script>
diff --git a/src/components/ControlPanel.vue b/src/components/ControlPanel.vue
index 3fc98479..46c0bf6b 100644
--- a/src/components/ControlPanel.vue
+++ b/src/components/ControlPanel.vue
@@ -3,14 +3,11 @@ import { select, format, ScaleLinear } from 'd3';
 import { legendColor } from 'd3-svg-legend';
 import { Node, Edge, ArangoPath } from '@/types';
 import { useStore } from '@/store';
-import AboutDialog from '@/components/AboutDialog.vue';
-import { LoginMenu } from 'multinet-components';
 import ConnectivityQuery from '@/components/ConnectivityQuery.vue';
 import EdgeSlicing from '@/components/EdgeSlicing.vue';
 import {
   computed, ref, watch, watchEffect,
 } from 'vue';
-import oauthClient from '@/oauth';
 import { storeToRefs } from 'pinia';
 
 const store = useStore();
@@ -36,11 +33,7 @@ const {
   maxIntConnections,
   intTableColorScale,
   network,
-  networkName,
   connectivityMatrixPaths,
-  showProvenanceVis,
-  selectedNodes,
-  userInfo,
   degreeRange,
 } = storeToRefs(store);
 
@@ -55,48 +48,6 @@ const aggregationItems = computed(() => {
   return Object.values(nodeColumnTypes).map((colTypes) => Object.entries(colTypes).filter(([_, colType]) => colType === 'category').map(([varName, _]) => varName)).flat();
 });
 
-const searchTerm = ref('');
-const searchErrors = ref<string[]>([]);
-const searchItems = computed(() => {
-  if (network.value !== null && labelVariable.value !== undefined) {
-    return network.value.nodes.map((node) => (node[labelVariable.value || '']));
-  }
-  if (network.value !== null && labelVariable.value === undefined) {
-    return network.value.nodes.map((node) => (node._key));
-  }
-  return [];
-});
-
-function exportNetwork() {
-  if (network.value === null) {
-    return;
-  }
-
-  const networkToExport = {
-    nodes: network.value.nodes.map((node) => {
-      const newNode = { ...node };
-      newNode.id = newNode._key;
-
-      return newNode;
-    }),
-    links: network.value.edges.map((edge) => {
-      const newEdge = { ...edge };
-      newEdge.source = `${edge._from.split('/')[1]}`;
-      newEdge.target = `${edge._to.split('/')[1]}`;
-      return newEdge;
-    }),
-  };
-
-  const a = document.createElement('a');
-  a.href = URL.createObjectURL(
-    new Blob([JSON.stringify(networkToExport)], {
-      type: 'text/json',
-    }),
-  );
-  a.download = `${networkName.value}.json`;
-  a.click();
-}
-
 function updateLegend(colorScale: ScaleLinear<string, number>, legendName: 'parent' | 'unAggr' | 'intTable') {
   let legendSVG;
   if (legendName === 'parent') {
@@ -154,25 +105,6 @@ watchEffect(() => {
   }
 });
 
-function search() {
-  searchErrors.value = [];
-  if (network.value !== null) {
-    const nodeIDsToSelect = network.value.nodes
-      .filter((node) => (labelVariable.value !== undefined ? node[labelVariable.value] === searchTerm.value : node._key === searchTerm.value))
-      .map((node) => node._id);
-
-    if (nodeIDsToSelect.length > 0) {
-      nodeIDsToSelect.forEach((newNodeId) => {
-        if (!selectedNodes.value.includes(newNodeId)) {
-          selectedNodes.value.push(newNodeId);
-        }
-      });
-    } else {
-      searchErrors.value.push('Enter a valid node to search');
-    }
-  }
-}
-
 const degreeRangeLocal = ref<[number, number]>(degreeRange.value);
 watch(degreeRange, () => { degreeRangeLocal.value = degreeRange.value; });
 function removeByDegree() {
@@ -181,265 +113,230 @@ function removeByDegree() {
 </script>
 
 <template>
-  <div>
-    <v-navigation-drawer
-      app
-      class="app-sidebar"
-      fixed
-      permanent
-      stateless
-      value="true"
-    >
-      <v-toolbar color="grey lighten-2">
-        <v-toolbar-title
-          class="d-flex align-center"
-          flat
-        >
-          <div>
-            <v-row class="mx-0 align-center">
-              <v-col class="pb-0 pt-2 px-0">
-                <img
-                  class="app-logo"
-                  src="../assets/logo/app_logo.svg"
-                  alt="Multinet"
-                  width="100%"
-                >
-              </v-col>
-              <v-col class="text-left">
-                MultiMatrix
-              </v-col>
-              <v-col class="pa-0">
-                <about-dialog />
-              </v-col>
-            </v-row>
-          </div>
-        </v-toolbar-title>
-        <v-spacer />
-        <login-menu
-          :user-info="userInfo"
-          :oauth-client="oauthClient"
-          :logout="store.logout"
-          :fetch-user-info="store.fetchUserInfo"
-        />
-      </v-toolbar>
-
-      <v-list class="pa-0">
-        <v-subheader class="grey darken-3 py-0 pr-0 white--text">
-          Visualization Options
-
-          <v-spacer />
+  <v-navigation-drawer
+    id="app-sidebar"
+    permanent
+  >
+    <v-list class="pa-0">
+      <v-subheader class="grey darken-3 py-0 pr-0 white--text">
+        Visualization Options
 
-          <v-btn
-            :min-width="40"
-            :height="48"
-            depressed
-            tile
-            class="grey darken-3 pa-0"
-            @click="showMenu = !showMenu"
-          >
-            <v-icon color="white">
-              {{ showMenu ? 'mdi-chevron-up' : 'mdi-chevron-down' }}
-            </v-icon>
-          </v-btn>
-        </v-subheader>
+        <v-spacer />
 
-        <v-card
-          v-if="showMenu"
-          dark
+        <v-btn
+          :min-width="40"
+          :height="48"
+          depressed
           tile
-          flat
-          color="grey darken-3"
-          class="pb-4 pt-0"
+          class="grey darken-3 pa-0"
+          @click="showMenu = !showMenu"
         >
-          <v-list-item>
-            <v-autocomplete
-              v-model="labelVariable"
-              label="Label Variable"
-              :items="nodeVariableItems"
-              :hide-details="true"
-              class="mt-3"
-              clearable
-              outlined
-              dense
-            />
-          </v-list-item>
-          <v-list-item>
-            <v-autocomplete
-              v-model="aggregatedBy"
-              label="Aggregation Variable"
-              :items="aggregationItems"
-              :hide-details="true"
-              class="mt-3"
-              clearable
-              outlined
-              dense
-              @change="store.aggregateNetwork"
+          <v-icon color="white">
+            {{ showMenu ? 'mdi-chevron-up' : 'mdi-chevron-down' }}
+          </v-icon>
+        </v-btn>
+      </v-subheader>
+
+      <v-card
+        v-if="showMenu"
+        dark
+        tile
+        flat
+        color="grey darken-3"
+        class="pb-4 pt-0"
+      >
+        <v-list-item>
+          <v-autocomplete
+            v-model="labelVariable"
+            label="Label Variable"
+            :items="nodeVariableItems"
+            :hide-details="true"
+            class="mt-3"
+            clearable
+            outlined
+            dense
+          />
+        </v-list-item>
+        <v-list-item>
+          <v-autocomplete
+            v-model="aggregatedBy"
+            label="Aggregation Variable"
+            :items="aggregationItems"
+            :hide-details="true"
+            class="mt-3"
+            clearable
+            outlined
+            dense
+            @change="store.aggregateNetwork"
+          />
+        </v-list-item>
+
+        <!-- Auto-Select Neighbors List Item -->
+        <v-list-item>
+          <v-list-item-content> Autoselect Neighbors </v-list-item-content>
+          <v-list-item-action>
+            <v-switch
+              v-model="selectNeighbors"
+              hide-details
+              color="blue darken-1"
             />
-          </v-list-item>
-
-          <!-- Auto-Select Neighbors List Item -->
-          <v-list-item>
-            <v-list-item-content> Autoselect Neighbors </v-list-item-content>
-            <v-list-item-action>
-              <v-switch
-                v-model="selectNeighbors"
-                hide-details
-                color="blue darken-1"
-              />
-            </v-list-item-action>
-          </v-list-item>
-
-          <!-- Gridline Toggle List Item -->
-          <v-list-item>
-            <v-list-item-content> Show GridLines </v-list-item-content>
-            <v-list-item-action>
-              <v-switch
-                v-model="showGridLines"
-                hide-details
-                color="blue darken-1"
-              />
-            </v-list-item-action>
-          </v-list-item>
-
-          <!-- Directional Edges Toggle Card -->
-          <v-list-item>
-            <v-list-item-content> Directional Edges </v-list-item-content>
-            <v-list-item-action>
-              <v-switch
-                v-model="directionalEdges"
-                hide-details
-                color="blue darken-1"
-              />
-            </v-list-item-action>
-          </v-list-item>
-
-          <v-list-item>
-            Cell Size
-            <v-slider
-              v-model="cellSize"
-              :min="10"
-              :max="100"
-              :label="String(cellSize)"
-              class="px-2"
-              inverse-label
+          </v-list-item-action>
+        </v-list-item>
+
+        <!-- Gridline Toggle List Item -->
+        <v-list-item>
+          <v-list-item-content> Show GridLines </v-list-item-content>
+          <v-list-item-action>
+            <v-switch
+              v-model="showGridLines"
               hide-details
               color="blue darken-1"
             />
-          </v-list-item>
-
-          <v-list-item>
-            <v-list-item-content> Degree </v-list-item-content>
-            <v-range-slider
-              v-model="degreeRangeLocal"
-              :max="maxDegree"
-              min="0"
+          </v-list-item-action>
+        </v-list-item>
+
+        <!-- Directional Edges Toggle Card -->
+        <v-list-item>
+          <v-list-item-content> Directional Edges </v-list-item-content>
+          <v-list-item-action>
+            <v-switch
+              v-model="directionalEdges"
               hide-details
-              class="align-center"
               color="blue darken-1"
-              :disabled="aggregated"
-              @change="removeByDegree"
-            >
-              <template #prepend>
-                <p
-                  class="pa-0 ma-0 text-center"
-                  style="min-width: 25px; color: rgba(255, 255, 255, 0.7);"
-                >
-                  {{ degreeRangeLocal[0] }}
-                </p>
-              </template>
-              <template #append>
-                <p
-                  class="pa-0 ma-0 text-center"
-                  style="min-width: 25px; color: rgba(255, 255, 255, 0.7);"
-                >
-                  {{ degreeRangeLocal[1] }}
-                </p>
-              </template>
-            </v-range-slider>
-          </v-list-item>
-
-          <v-list-item>
-            <v-btn
-              color="primary"
-              block
-              depressed
-              @click="showProvenanceVis = true"
-            >
-              Provenance Vis
-            </v-btn>
-          </v-list-item>
-
-          <v-list-item>
-            <v-btn
-              block
-              color="grey darken-2 white--text"
-              depressed
-              @click="exportNetwork"
-            >
-              Export Network
-            </v-btn>
-          </v-list-item>
-          <!-- Download Network As 1-Hop CSV-->
-          <v-list-item>
-            <v-btn
-              block
-              color="grey darken-2 white--text"
-              depressed
-              @click="displayCSVBuilder()"
-            >
-              Network as 1-hop (CSV)
-            </v-btn>
-          </v-list-item>
-        </v-card>
+            />
+          </v-list-item-action>
+        </v-list-item>
+
+        <v-list-item>
+          Cell Size
+          <v-slider
+            v-model="cellSize"
+            :min="10"
+            :max="100"
+            :label="String(cellSize)"
+            class="px-2"
+            inverse-label
+            hide-details
+            color="blue darken-1"
+          />
+        </v-list-item>
+
+        <v-list-item>
+          <v-list-item-content> Degree </v-list-item-content>
+          <v-range-slider
+            v-model="degreeRangeLocal"
+            :max="maxDegree"
+            min="0"
+            hide-details
+            class="align-center"
+            color="blue darken-1"
+            :disabled="aggregated"
+            @change="removeByDegree"
+          >
+            <template #prepend>
+              <p
+                class="pa-0 ma-0 text-center"
+                style="min-width: 25px; color: rgba(255, 255, 255, 0.7);"
+              >
+                {{ degreeRangeLocal[0] }}
+              </p>
+            </template>
+            <template #append>
+              <p
+                class="pa-0 ma-0 text-center"
+                style="min-width: 25px; color: rgba(255, 255, 255, 0.7);"
+              >
+                {{ degreeRangeLocal[1] }}
+              </p>
+            </template>
+          </v-range-slider>
+        </v-list-item>
+
+        <!-- Download Network As 1-Hop CSV-->
+        <v-list-item>
+          <v-btn
+            block
+            color="grey darken-2 white--text"
+            depressed
+            @click="displayCSVBuilder()"
+          >
+            Network as 1-hop (CSV)
+          </v-btn>
+        </v-list-item>
+      </v-card>
+
+      <v-subheader class="grey darken-3 py-0 white--text">
+        Color Scale Legend
+      </v-subheader>
+
+      <div class="pa-4">
+        <!-- Aggregated Matrix Legend -->
+        <v-list-item
+          v-if="aggregated || degreeFiltered"
+          class="pb-0 px-0"
+          style="display: flex; max-height: 50px"
+        >
+          {{ aggregated ? 'Aggregate Legend' : 'Filtered Legend' }}
+          <svg
+            id="parent-matrix-legend"
+            height="50"
+          >
+            <g
+              class="legendLinear"
+              transform="translate(10, 10)"
+            />
+          </svg>
+        </v-list-item>
 
-        <div class="px-4">
-          <v-list-item class="px-0">
-            <v-autocomplete
-              v-model="searchTerm"
-              label="Search for Node"
-              :items="searchItems"
-              :error-messages="searchErrors"
-              no-data-text="Select a label variable"
-              class="pt-4"
-              auto-select-first
-              outlined
-              dense
-              @input="search"
+        <!-- Matrix Legend -->
+        <v-list-item
+          class="pb-0 px-0"
+          :style="`display: flex; max-height: 50px; opacity: ${maxConnections.unAggr > 0 ? 1 : 0}`"
+        >
+          {{ aggregated ? 'Child Legend' : 'Matrix Legend' }}
+          <svg
+            id="matrix-legend"
+            height="50"
+          >
+            <g
+              class="legendLinear"
+              transform="translate(10, 10)"
             />
-          </v-list-item>
-        </div>
+          </svg>
+        </v-list-item>
+      </div>
 
+      <!-- Int Table Controls + Legend -->
+      <div v-if="showIntNodeVis">
         <v-subheader class="grey darken-3 py-0 white--text">
-          Color Scale Legend
+          Intermediate Node Table
         </v-subheader>
 
         <div class="pa-4">
-          <!-- Aggregated Matrix Legend -->
+          <!-- Aggregation Variable Selection -->
           <v-list-item
-            v-if="aggregated || degreeFiltered"
-            class="pb-0 px-0"
-            style="display: flex; max-height: 50px"
+            class="pa-0 ma-0"
           >
-            {{ aggregated ? 'Aggregate Legend' : 'Filtered Legend' }}
-            <svg
-              id="parent-matrix-legend"
-              height="50"
-            >
-              <g
-                class="legendLinear"
-                transform="translate(10, 10)"
+            <v-list-item-content class="pa-0 ma-0">
+              <v-autocomplete
+                v-model="intAggregatedBy"
+                class="pa-0 ma-0"
+                :items="nodeVariableItems"
+                hint="Variable to aggregate by"
+                persistent-hint
+                clearable
               />
-            </svg>
+            </v-list-item-content>
           </v-list-item>
 
           <!-- Matrix Legend -->
           <v-list-item
             class="pb-0 px-0"
-            :style="`display: flex; max-height: 50px; opacity: ${maxConnections.unAggr > 0 ? 1 : 0}`"
+            :style="`display: flex; max-height: 50px; opacity: ${maxIntConnections > 0 ? 1 : 0}`"
           >
-            {{ aggregated ? 'Child Legend' : 'Matrix Legend' }}
+            {{ 'Legend' }}
             <svg
-              id="matrix-legend"
+              id="int-matrix-legend"
               height="50"
             >
               <g
@@ -449,60 +346,20 @@ function removeByDegree() {
             </svg>
           </v-list-item>
         </div>
-
-        <!-- Int Table Controls + Legend -->
-        <div v-if="showIntNodeVis">
-          <v-subheader class="grey darken-3 py-0 white--text">
-            Intermediate Node Table
-          </v-subheader>
-
-          <div class="pa-4">
-            <!-- Aggregation Variable Selection -->
-            <v-list-item
-              class="pa-0 ma-0"
-            >
-              <v-list-item-content class="pa-0 ma-0">
-                <v-autocomplete
-                  v-model="intAggregatedBy"
-                  class="pa-0 ma-0"
-                  :items="nodeVariableItems"
-                  hint="Variable to aggregate by"
-                  persistent-hint
-                  clearable
-                />
-              </v-list-item-content>
-            </v-list-item>
-
-            <!-- Matrix Legend -->
-            <v-list-item
-              class="pb-0 px-0"
-              :style="`display: flex; max-height: 50px; opacity: ${maxIntConnections > 0 ? 1 : 0}`"
-            >
-              {{ 'Legend' }}
-              <svg
-                id="int-matrix-legend"
-                height="50"
-              >
-                <g
-                  class="legendLinear"
-                  transform="translate(10, 10)"
-                />
-              </svg>
-            </v-list-item>
-          </div>
-        </div>
-        <!-- Edge Slicing -->
-        <EdgeSlicing />
-
-        <!-- Connectivity Query -->
-        <connectivity-query />
-      </v-list>
-    </v-navigation-drawer>
-  </div>
+      </div>
+      <!-- Edge Slicing -->
+      <EdgeSlicing />
+
+      <!-- Connectivity Query -->
+      <connectivity-query />
+    </v-list>
+  </v-navigation-drawer>
 </template>
 
 <style scoped>
-.app-logo {
-  width: 36px;
+#app-sidebar {
+  position: absolute;
+  top: 48px !important;
+  height: calc(100% - 48px) !important;
 }
 </style>
diff --git a/src/components/EdgeSlices.vue b/src/components/EdgeSlices.vue
index 2cf56413..0deafde7 100644
--- a/src/components/EdgeSlices.vue
+++ b/src/components/EdgeSlices.vue
@@ -9,13 +9,12 @@ const store = useStore();
 const {
   slicedNetwork,
   isDate,
-  controlsWidth,
   sliceIndex,
 } = storeToRefs(store);
 
 const isNumeric = computed(() => (slicedNetwork.value[0].category === ''));
 const currentInstance = getCurrentInstance();
-const svgWidth = computed(() => (currentInstance !== null ? currentInstance.proxy.$vuetify.breakpoint.width - controlsWidth.value : 0));
+const svgWidth = computed(() => (currentInstance !== null ? currentInstance.proxy.$vuetify.breakpoint.width : 0));
 const rectHeight = ref(20);
 
 const currentSlice = computed(() => {
@@ -50,7 +49,7 @@ const tooltipStyle = computed(() => `left: ${tooltipPosition.value.x}px; top: ${
 
 function showTooltip(key: number, event: MouseEvent) {
   tooltipPosition.value = {
-    x: event.clientX - controlsWidth.value - 20,
+    x: event.clientX - 20,
     y: event.clientY + 20,
   };
   if (isNumeric.value) {
diff --git a/src/components/LineUp.vue b/src/components/LineUp.vue
index ea5e32fb..fb7965d7 100644
--- a/src/components/LineUp.vue
+++ b/src/components/LineUp.vue
@@ -221,7 +221,6 @@ function removeHighlight() {
 
 <style>
 #lineup {
-  z-index: 1;
   padding-top: 34px;
 }
 
diff --git a/src/components/MultiMatrix.vue b/src/components/MultiMatrix.vue
index 64d9e51f..cd02f8a9 100644
--- a/src/components/MultiMatrix.vue
+++ b/src/components/MultiMatrix.vue
@@ -113,6 +113,7 @@ function unHoverEdge(cell: Cell) {
   unHoverNode(cell.colID);
 }
 
+const toolbarHeight = 48;
 function showToolTip(event: MouseEvent, networkElement: Cell | Node): void {
   let message = '';
 
@@ -136,8 +137,8 @@ function showToolTip(event: MouseEvent, networkElement: Cell | Node): void {
 
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   select(tooltip.value as any)
-    .style('left', `${event.clientX - 256 + 10}px`)
-    .style('top', `${event.clientY + 10}px`)
+    .style('left', `${event.clientX + 10}px`)
+    .style('top', `${event.clientY - toolbarHeight + 10}px`)
     .html(message)
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
     .transition(transition().delay(100).duration(200) as any)
diff --git a/src/components/PathTable.vue b/src/components/PathTable.vue
index 69e4cc6e..1909bca5 100644
--- a/src/components/PathTable.vue
+++ b/src/components/PathTable.vue
@@ -161,10 +161,11 @@ const tableData = computed(() => {
 const top = ref(0);
 const left = ref(cellSize.value * network.value.nodes.length + 200);
 const divStyle = computed(() => `position: absolute; top: ${top.value}px; left: ${left.value}px; z-index: 1;`);
+const toolbarHeight = 48;
 function iconDrag(event: MouseEvent) {
   // 24 to account for icon size and padding
-  top.value = event.clientY - 24;
-  left.value = event.clientX - 256 - 24;
+  top.value = event.clientY - toolbarHeight - 24;
+  left.value = event.clientX - 24;
 }
 function iconMouseUp() {
   document.onmouseup = null;
@@ -172,8 +173,8 @@ function iconMouseUp() {
 }
 function iconMouseDown(event: MouseEvent) {
   // 24 to account for icon size and padding
-  top.value = event.clientY - 24;
-  left.value = event.clientX - 256 - 24;
+  top.value = event.clientY - toolbarHeight - 24;
+  left.value = event.clientX - 24;
   document.onmousemove = iconDrag;
   document.onmouseup = iconMouseUp;
 }
diff --git a/src/components/ProvVis.vue b/src/components/ProvVis.vue
index 6f7260a5..ba1a082f 100644
--- a/src/components/ProvVis.vue
+++ b/src/components/ProvVis.vue
@@ -8,45 +8,64 @@ const store = useStore();
 const { provenance } = storeToRefs(store);
 
 const provDiv = ref();
+const provVisHeight = ref(document.body.clientHeight - 48 - 48);
+const resizeObserver = new ResizeObserver((entries) => { provVisHeight.value = entries[0].target.clientHeight - 48 - 48; });
+resizeObserver.observe(document.body);
 
 onMounted(() => {
-  if (provDiv.value != null) {
-    ProvVisCreator(provDiv.value, provenance.value, {});
+  if (provenance.value !== null && provDiv.value != null) {
+    ProvVisCreator(provDiv.value, provenance.value);
   }
 });
 </script>
 
 <template>
   <v-navigation-drawer
-    absolute
+    id="prov-vis"
     permanent
     right
     :width="145 + 190"
   >
-    <v-btn
-      icon
-      class="ma-2"
-      @click="store.showProvenanceVis = !store.showProvenanceVis"
-    >
-      <v-icon>mdi-close</v-icon>
-    </v-btn>
-
-    <v-row class="ml-2 mt-1">
-      <v-btn @click="provenance.undo()">
-        undo
-      </v-btn>
-      <v-btn @click="provenance.redo()">
-        redo
+    <v-subheader id="header" class="grey darken-3 py-0 pr-0 white--text">
+      History
+
+      <v-spacer />
+
+      <v-btn
+        :min-width="40"
+        :height="48"
+        depressed
+        tile
+        class="grey darken-3 pa-0"
+        dark
+        @click="store.showProvenanceVis = false"
+      >
+        <v-icon>
+          mdi-close
+        </v-icon>
       </v-btn>
-    </v-row>
+    </v-subheader>
 
     <div
       id="provDiv"
       ref="provDiv"
+      :style="`height: ${provVisHeight}px`"
     />
   </v-navigation-drawer>
 </template>
 
 <style scoped>
+#prov-vis {
+  position: absolute;
+  top: 48px !important;
+  height: calc(100% - 48px) !important;
+  z-index: 1;
+}
 
+#header {
+  position: -webkit-sticky; /* Safari */
+  position: sticky;
+  top: 0;
+  z-index: 1;
+}
 </style>
diff --git a/src/environment.ts b/src/environment.ts
index af601e17..2bfc018d 100644
--- a/src/environment.ts
+++ b/src/environment.ts
@@ -1,3 +1,4 @@
 export const host: string = import.meta.env.VITE_MULTINET_HOST || 'http://localhost:8000';
 export const oauthApiRoot: string = import.meta.env.VITE_OAUTH_API_ROOT || `${host}/oauth`;
 export const oauthClientId: string = import.meta.env.VITE_OAUTH_CLIENT_ID || '';
+export const prodBuild: boolean = import.meta.env.PROD;
diff --git a/src/main.ts b/src/main.ts
index e8fe76fc..df0e12ec 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -3,12 +3,23 @@ import App from '@/App.vue';
 import vuetify from '@/plugins/vuetify';
 import api from '@/api';
 import oauthClient from '@/oauth';
+import { oauthClientId, prodBuild } from '@/environment';
 import { createPinia, PiniaVuePlugin } from 'pinia';
+import { readSharedLoginCookie } from 'multinet';
 
 Vue.config.productionTip = false;
 Vue.use(PiniaVuePlugin);
 const pinia = createPinia();
 
+const key = `oauth-token-${oauthClientId}`;
+const sharedLoginCookie = readSharedLoginCookie();
+if (prodBuild) {
+  if (sharedLoginCookie) {
+    localStorage.setItem(key, sharedLoginCookie);
+  } else {
+    localStorage.removeItem(key);
+  }
+}
 oauthClient.maybeRestoreLogin().then(() => {
   Object.assign(api.axios.defaults.headers.common, oauthClient.authHeaders);
 
diff --git a/yarn.lock b/yarn.lock
index 9529d7b2..c9637992 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -48,6 +48,13 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
+"@babel/runtime@^7.13.10":
+  version "7.21.0"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.21.0.tgz#5b55c9d394e5fcf304909a8b00c07dc217b56673"
+  integrity sha512-xwII0//EObnq89Ji5AKYQaRYiW/nZ3llSv29d49IuxPhKbtJoLP+9QUUZ4nVragQVtaVGeZrpB+ZtG/Pdy/POw==
+  dependencies:
+    regenerator-runtime "^0.13.11"
+
 "@babel/runtime@^7.18.9":
   version "7.20.6"
   resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.20.6.tgz#facf4879bfed9b5326326273a64220f099b0fce3"
@@ -187,6 +194,34 @@
     minimatch "^3.1.2"
     strip-json-comments "^3.1.1"
 
+"@floating-ui/core@^1.2.3":
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/@floating-ui/core/-/core-1.2.3.tgz#327a2c11e6570b7d64368ad74a3ac12786c9f751"
+  integrity sha512-upVRtrNZuYNsw+EoxkiBFRPROnU8UTy/u/dZ9U0W14BlemPYODwhhxYXSR2Y9xOnvr1XtptJRWx7gL8Te1qaog==
+
+"@floating-ui/dom@^1.2.1":
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/@floating-ui/dom/-/dom-1.2.4.tgz#e2eb2674f57fc182c425587e48ea43e336f4b8f8"
+  integrity sha512-4+k+BLhtWj+peCU60gp0+rHeR8+Ohqx6kjJf/lHMnJ8JD5Qj6jytcq1+SZzRwD7rvHKRhR7TDiWWddrNrfwQLg==
+  dependencies:
+    "@floating-ui/core" "^1.2.3"
+
+"@floating-ui/react-dom@^1.3.0":
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/@floating-ui/react-dom/-/react-dom-1.3.0.tgz#4d35d416eb19811c2b0e9271100a6aa18c1579b3"
+  integrity sha512-htwHm67Ji5E/pROEAr7f8IKFShuiCKHwUC/UY4vC3I5jiSvGFAYnSYiZO5MlGmads+QqvUkR9ANHEguGrDv72g==
+  dependencies:
+    "@floating-ui/dom" "^1.2.1"
+
+"@floating-ui/react@^0.19.1":
+  version "0.19.2"
+  resolved "https://registry.yarnpkg.com/@floating-ui/react/-/react-0.19.2.tgz#c6e4d2097ed0dca665a7c042ddf9cdecc95e9412"
+  integrity sha512-JyNk4A0Ezirq8FlXECvRtQOX/iBe5Ize0W/pLkrZjfHW9GUV7Xnq6zm6fyZuQzaHHqEnVizmvlA96e1/CkZv+w==
+  dependencies:
+    "@floating-ui/react-dom" "^1.3.0"
+    aria-hidden "^1.1.3"
+    tabbable "^6.0.1"
+
 "@fortawesome/fontawesome-common-types@6.3.0":
   version "6.3.0"
   resolved "https://registry.yarnpkg.com/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.3.0.tgz#51f734e64511dbc3674cd347044d02f4dd26e86b"
@@ -243,6 +278,35 @@
   resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz#add4c98d341472a289190b424efbdb096991bb24"
   integrity sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==
 
+"@mantine/core@^5.10.5":
+  version "5.10.5"
+  resolved "https://registry.yarnpkg.com/@mantine/core/-/core-5.10.5.tgz#071e14dcf8b94a36d0243f1f4b30305ac0074afd"
+  integrity sha512-F4tqHSEVM9D6/iSqHfPda+Xl5XgSEPHAAkT01Zwzj4Jnbd10qGrlqr/SFUop2CIcuKYnmra9XltUahUPXBC2BQ==
+  dependencies:
+    "@floating-ui/react" "^0.19.1"
+    "@mantine/styles" "5.10.5"
+    "@mantine/utils" "5.10.5"
+    "@radix-ui/react-scroll-area" "1.0.2"
+    react-textarea-autosize "8.3.4"
+
+"@mantine/hooks@^5.10.5":
+  version "5.10.5"
+  resolved "https://registry.yarnpkg.com/@mantine/hooks/-/hooks-5.10.5.tgz#568586a0fa649be46f057ddc920bf98761017ffb"
+  integrity sha512-hFQp71QZDfivPzfIUOQZfMKLiOL/Cn2EnzacRlbUr55myteTfzYN8YMt+nzniE/6c4IRopFHEAdbKEtfyQc6kg==
+
+"@mantine/styles@5.10.5":
+  version "5.10.5"
+  resolved "https://registry.yarnpkg.com/@mantine/styles/-/styles-5.10.5.tgz#ace82a71b4fe3d14ee14638f1735d5680d93d36d"
+  integrity sha512-0NXk8c/XGzuTUkZc6KceF2NaTCMEu5mHR4ru0x+ttb9DGnLpHuGWduTHjSfr4hl6eAJgedD0zauO+VAhDzO9zA==
+  dependencies:
+    clsx "1.1.1"
+    csstype "3.0.9"
+
+"@mantine/utils@5.10.5":
+  version "5.10.5"
+  resolved "https://registry.yarnpkg.com/@mantine/utils/-/utils-5.10.5.tgz#ad620d714e545c6efb7f69d94ce46e3fd2fe01fb"
+  integrity sha512-FGMq4dGs5HhDAtI0z46uzxzKKPmZ3h5uKUyKg1ZHoFR1mBtcUMbB6FylFmHqKFRWlJ5IXqX9dwmiVrLYUOfTmA==
+
 "@nodelib/fs.scandir@2.1.4":
   version "2.1.4"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.4.tgz#d4b3549a5db5de2683e0c1071ab4f140904bbf69"
@@ -276,6 +340,96 @@
     form-data "^4.0.0"
     opener "^1.5.2"
 
+"@radix-ui/number@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/number/-/number-1.0.0.tgz#4c536161d0de750b3f5d55860fc3de46264f897b"
+  integrity sha512-Ofwh/1HX69ZfJRiRBMTy7rgjAzHmwe4kW9C9Y99HTRUcYLUuVT0KESFj15rPjRgKJs20GPq8Bm5aEDJ8DuA3vA==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+
+"@radix-ui/primitive@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/primitive/-/primitive-1.0.0.tgz#e1d8ef30b10ea10e69c76e896f608d9276352253"
+  integrity sha512-3e7rn8FDMin4CgeL7Z/49smCA3rFYY3Ha2rUQ7HRWFadS5iCRw08ZgVT1LaNTCNqgvrUiyczLflrVrF0SRQtNA==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+
+"@radix-ui/react-compose-refs@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-compose-refs/-/react-compose-refs-1.0.0.tgz#37595b1f16ec7f228d698590e78eeed18ff218ae"
+  integrity sha512-0KaSv6sx787/hK3eF53iOkiSLwAGlFMx5lotrqD2pTjB18KbybKoEIgkNZTKC60YECDQTKGTRcDBILwZVqVKvA==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+
+"@radix-ui/react-context@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-1.0.0.tgz#f38e30c5859a9fb5e9aa9a9da452ee3ed9e0aee0"
+  integrity sha512-1pVM9RfOQ+n/N5PJK33kRSKsr1glNxomxONs5c49MliinBY6Yw2Q995qfBUUo0/Mbg05B/sGA0gkgPI7kmSHBg==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+
+"@radix-ui/react-direction@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-direction/-/react-direction-1.0.0.tgz#a2e0b552352459ecf96342c79949dd833c1e6e45"
+  integrity sha512-2HV05lGUgYcA6xgLQ4BKPDmtL+QbIZYH5fCOTAOOcJ5O0QbWS3i9lKaurLzliYUDhORI2Qr3pyjhJh44lKA3rQ==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+
+"@radix-ui/react-presence@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-presence/-/react-presence-1.0.0.tgz#814fe46df11f9a468808a6010e3f3ca7e0b2e84a"
+  integrity sha512-A+6XEvN01NfVWiKu38ybawfHsBjWum42MRPnEuqPsBZ4eV7e/7K321B5VgYMPv3Xx5An6o1/l9ZuDBgmcmWK3w==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-use-layout-effect" "1.0.0"
+
+"@radix-ui/react-primitive@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-1.0.1.tgz#c1ebcce283dd2f02e4fbefdaa49d1cb13dbc990a"
+  integrity sha512-fHbmislWVkZaIdeF6GZxF0A/NH/3BjrGIYj+Ae6eTmTCr7EB0RQAAVEiqsXK6p3/JcRqVSBQoceZroj30Jj3XA==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-slot" "1.0.1"
+
+"@radix-ui/react-scroll-area@1.0.2":
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-scroll-area/-/react-scroll-area-1.0.2.tgz#26c906d351b56835c0301126b24574c9e9c7b93b"
+  integrity sha512-k8VseTxI26kcKJaX0HPwkvlNBPTs56JRdYzcZ/vzrNUkDlvXBy8sMc7WvCpYzZkHgb+hd72VW9MqkqecGtuNgg==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/number" "1.0.0"
+    "@radix-ui/primitive" "1.0.0"
+    "@radix-ui/react-compose-refs" "1.0.0"
+    "@radix-ui/react-context" "1.0.0"
+    "@radix-ui/react-direction" "1.0.0"
+    "@radix-ui/react-presence" "1.0.0"
+    "@radix-ui/react-primitive" "1.0.1"
+    "@radix-ui/react-use-callback-ref" "1.0.0"
+    "@radix-ui/react-use-layout-effect" "1.0.0"
+
+"@radix-ui/react-slot@1.0.1":
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-1.0.1.tgz#e7868c669c974d649070e9ecbec0b367ee0b4d81"
+  integrity sha512-avutXAFL1ehGvAXtPquu0YK5oz6ctS474iM3vNGQIkswrVhdrS52e3uoMQBzZhNRAIE0jBnUyXWNmSjGHhCFcw==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-compose-refs" "1.0.0"
+
+"@radix-ui/react-use-callback-ref@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.0.tgz#9e7b8b6b4946fe3cbe8f748c82a2cce54e7b6a90"
+  integrity sha512-GZtyzoHz95Rhs6S63D2t/eqvdFCm7I+yHMLVQheKM7nBD8mbZIt+ct1jz4536MDnaOGKIxynJ8eHTkVGVVkoTg==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+
+"@radix-ui/react-use-layout-effect@1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.0.tgz#2fc19e97223a81de64cd3ba1dc42ceffd82374dc"
+  integrity sha512-6Tpkq+R6LOlmQb1R5NNETLG0B4YP0wc+klfXafpUCj6JGyaUc8il7/kUZ7m59rGbXGczE9Bs+iz2qloqsZBduQ==
+  dependencies:
+    "@babel/runtime" "^7.13.10"
+
 "@react-spring/animated@~9.6.1":
   version "9.6.1"
   resolved "https://registry.yarnpkg.com/@react-spring/animated/-/animated-9.6.1.tgz#ccc626d847cbe346f5f8815d0928183c647eb425"
@@ -404,15 +558,19 @@
     fast-json-patch "^3.1.1"
     uuid "^9.0.0"
 
-"@trrack/vis-react@^1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@trrack/vis-react/-/vis-react-1.0.0.tgz#d3c27ca537d2ac37a304e4268aff09c3e9ffe582"
-  integrity sha512-1shSHgozsrR0BNMrWGfVlXHXkYUkLPj1m3kbTPQWeCcPvo8ct6ypMRLFdsCjsg5XDusxfDwcHfM6cnkgM4CQkQ==
+"@trrack/vis-react@^1.2.2":
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/@trrack/vis-react/-/vis-react-1.2.3.tgz#5179cbba2ea1eaf81c300ae4a632c0ad7919d394"
+  integrity sha512-Yj7w7KOmFpt6qH98nU/pBPfNdjWW8jW9Ze3qWnTNrPdRa+Zy2ehrDfmIvbQjcUe1U+PSHHBysi3t3MZ70WD5Ww==
   dependencies:
     "@fortawesome/free-solid-svg-icons" "^6.2.1"
     "@fortawesome/react-fontawesome" "^0.2.0"
+    "@mantine/core" "^5.10.5"
+    "@mantine/hooks" "^5.10.5"
     "@trrack/core" "^1.0.0"
     d3 "^7.8.0"
+    react "16.8 - 18"
+    react-dom "16.14 - 18"
     react-spring "^9.6.1"
 
 "@types/base64-js@^1.3.0":
@@ -994,6 +1152,13 @@ argparse@^2.0.1:
   resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38"
   integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
 
+aria-hidden@^1.1.3:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/aria-hidden/-/aria-hidden-1.2.3.tgz#14aeb7fb692bbb72d69bebfa47279c1fd725e954"
+  integrity sha512-xcLxITLe2HYa1cnYnwCjkOO1PqUHQpozB8x9AR0OgWN2woOBi5kSDVxKfd0b7sb1hw5qFeJhXm9H1nu3xSfLeQ==
+  dependencies:
+    tslib "^2.0.0"
+
 aria-query@^4.2.2:
   version "4.2.2"
   resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-4.2.2.tgz#0d2ca6c9aceb56b8977e9fed6aed7e15bbd2f83b"
@@ -1249,6 +1414,11 @@ cli-truncate@^2.1.0:
     slice-ansi "^3.0.0"
     string-width "^4.2.0"
 
+clsx@1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/clsx/-/clsx-1.1.1.tgz#98b3134f9abbdf23b2663491ace13c5c03a73188"
+  integrity sha512-6/bPho624p3S2pMyvP5kKBPXnI3ufHLObBFCfgx+LkeR5lg2XYy2hqZqUf45ypD8COn2bhgGJSUE+l5dhNBieA==
+
 color-convert@^1.9.0:
   version "1.9.3"
   resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
@@ -1348,6 +1518,11 @@ cssesc@^3.0.0:
   resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
   integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
 
+csstype@3.0.9:
+  version "3.0.9"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.9.tgz#6410af31b26bd0520933d02cbc64fce9ce3fbf0b"
+  integrity sha512-rpw6JPxK6Rfg1zLOYCSwle2GFOOsnjmDYDaBwEcwoOg4qlsIVCN789VkBZDJAGi4T07gI4YSutR43t9Zz4Lzuw==
+
 csstype@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.0.tgz#4ddcac3718d787cf9df0d1b7d15033925c8f29f2"
@@ -3232,15 +3407,15 @@ ms@^2.1.1:
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2"
   integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==
 
-multinet-components@^0.0.4:
-  version "0.0.4"
-  resolved "https://registry.yarnpkg.com/multinet-components/-/multinet-components-0.0.4.tgz#26c519733ce72145f5ebf81de1333b294903ee4b"
-  integrity sha512-T3r/UsB4r4OLZXFx8uIbgYKls1CQ2q8yerySCWQHEbJ0Jga57g2sIyHEpdecXo4Rf3yH/9ZcvhAqBIrV1hnF6A==
+multinet-components@^0.0.6:
+  version "0.0.6"
+  resolved "https://registry.yarnpkg.com/multinet-components/-/multinet-components-0.0.6.tgz#7b5b62de7a3504c0fe8b5928aea048506b209802"
+  integrity sha512-PkAEWTtk7/7lwZhYlHfMeYFo8zutvVJ/DxMsuN4wZCddyseBAP70vTnKkLcSK3WsS96XsibWjCDl1AHz2pACIg==
 
-multinet@^0.21.7:
-  version "0.21.7"
-  resolved "https://registry.yarnpkg.com/multinet/-/multinet-0.21.7.tgz#657d1f42eff6b628b5472a3845b142644387f1cc"
-  integrity sha512-0wvK9kaYbvQsARQ6uAqmuF1Y+JZchMGyTUGW0nfSSVE2THacD356gEzyz6zr25Rurh49QufrljJHDe7tVP8EAA==
+multinet@^0.21.10:
+  version "0.21.10"
+  resolved "https://registry.yarnpkg.com/multinet/-/multinet-0.21.10.tgz#5e5e215cab2650ab940c1c7d52dae1e89806faa4"
+  integrity sha512-dMr4ijRS/RtdSEhJ6Drmd4maE96kUvEODfr+1XBxby8p11sAee+MPoSelXMzvxREmwBMVo4ZXHDotvc9TMCGHw==
   dependencies:
     axios "^0.21.1"
     django-s3-file-field "^0.1.2"
@@ -3582,7 +3757,7 @@ queue-microtask@^1.2.2:
   resolved "https://registry.yarnpkg.com/queue-microtask/-/queue-microtask-1.2.3.tgz#4929228bbc724dfac43e0efb058caf7b6cfb6243"
   integrity sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==
 
-react-dom@^18.2.0:
+"react-dom@16.14 - 18", react-dom@^18.2.0:
   version "18.2.0"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.2.0.tgz#22aaf38708db2674ed9ada224ca4aa708d821e3d"
   integrity sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==
@@ -3607,7 +3782,16 @@ react-spring@^9.6.1:
     "@react-spring/web" "~9.6.1"
     "@react-spring/zdog" "~9.6.1"
 
-react@^18.2.0:
+react-textarea-autosize@8.3.4:
+  version "8.3.4"
+  resolved "https://registry.yarnpkg.com/react-textarea-autosize/-/react-textarea-autosize-8.3.4.tgz#270a343de7ad350534141b02c9cb78903e553524"
+  integrity sha512-CdtmP8Dc19xL8/R6sWvtknD/eCXkQr30dtvC4VmGInhRsfF8X/ihXCq6+9l9qbxmKRiq407/7z5fxE7cVWQNgQ==
+  dependencies:
+    "@babel/runtime" "^7.10.2"
+    use-composed-ref "^1.3.0"
+    use-latest "^1.2.1"
+
+"react@16.8 - 18", react@^18.2.0:
   version "18.2.0"
   resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5"
   integrity sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==
@@ -4016,6 +4200,11 @@ supports-preserve-symlinks-flag@^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==
 
+tabbable@^6.0.1:
+  version "6.1.1"
+  resolved "https://registry.yarnpkg.com/tabbable/-/tabbable-6.1.1.tgz#40cfead5ed11be49043f04436ef924c8890186a0"
+  integrity sha512-4kl5w+nCB44EVRdO0g/UGoOp3vlwgycUVtkk/7DPyeLZUCuNFFKCFG6/t/DgHLrUPHjrZg6s5tNm+56Q2B0xyg==
+
 text-table@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
@@ -4069,6 +4258,11 @@ tslib@^1.9.0:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
   integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
 
+tslib@^2.0.0:
+  version "2.5.0"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.5.0.tgz#42bfed86f5787aeb41d031866c8f402429e0fddf"
+  integrity sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==
+
 tslib@^2.1.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.2.0.tgz#fb2c475977e35e241311ede2693cee1ec6698f5c"
@@ -4146,6 +4340,23 @@ uri-js@^4.2.2:
   dependencies:
     punycode "^2.1.0"
 
+use-composed-ref@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/use-composed-ref/-/use-composed-ref-1.3.0.tgz#3d8104db34b7b264030a9d916c5e94fbe280dbda"
+  integrity sha512-GLMG0Jc/jiKov/3Ulid1wbv3r54K9HlMW29IWcDFPEqFkSO2nS0MuefWgMJpeHQ9YJeXDL3ZUF+P3jdXlZX/cQ==
+
+use-isomorphic-layout-effect@^1.1.1:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/use-isomorphic-layout-effect/-/use-isomorphic-layout-effect-1.1.2.tgz#497cefb13d863d687b08477d9e5a164ad8c1a6fb"
+  integrity sha512-49L8yCO3iGT/ZF9QttjwLF/ZD9Iwto5LnH5LmEdk/6cFmXddqi2ulF0edxTwjj+7mqvpVVGQWvbXZdn32wRSHA==
+
+use-latest@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/use-latest/-/use-latest-1.2.1.tgz#d13dfb4b08c28e3e33991546a2cee53e14038cf2"
+  integrity sha512-xA+AVm/Wlg3e2P/JiItTziwS7FK92LWrDB0p+hgXloIMuVCeJJ8v6f0eeHyPZaJrM+usM1FkFfbNCrJGs8A/zw==
+  dependencies:
+    use-isomorphic-layout-effect "^1.1.1"
+
 util-deprecate@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"