Add leaflet and wrap Treenome in own component

theosanderson · Apr 18, 2023 · d7df0f1 · d7df0f1
1 parent ba4c4bf
commit d7df0f1
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 8 deletions.
diff --git a/taxonium_web_client/package.json b/taxonium_web_client/package.json
@@ -22,6 +22,7 @@
     "craco": "^0.0.3",
     "deck.gl": "^8.6.6",
     "jsonl": "^1.1.2",
+    "leaflet": "^1.9.3",
     "lodash": "^4.17.21",
     "lzma-native": "^8.0.6",
     "node-polyfill-webpack-plugin": "^1.1.4",

diff --git a/taxonium_web_client/src/Deck.jsx b/taxonium_web_client/src/Deck.jsx
@@ -3,7 +3,6 @@ import React, { useState, useCallback, useRef } from "react";
 import DeckGL from "@deck.gl/react";
 import { View } from "@deck.gl/core";
 import useLayers from "./hooks/useLayers";
-import JBrowsePanel from "./components/JBrowsePanel";
 import { ClipLoader } from "react-spinners";
 import {
   CircularProgressbarWithChildren,
@@ -19,8 +18,8 @@ import DeckSettingsModal from "./components/DeckSettingsModal";
 import { TreenomeButtons } from "./components/TreenomeButtons";
 import TreenomeModal from "./components/TreenomeModal";
 import FirefoxWarning from "./components/FirefoxWarning";
-import { JBrowseErrorBoundary } from "./components/JBrowseErrorBoundary";
 import Key from "./components/Key";
+import TreenomeBrowser from "./components/TreenomeBrowser";
 
 const MemoizedKey = React.memo(Key);
 
@@ -289,12 +288,7 @@ function Deck({
             }}
           >
             <span ref={jbrowseRef}>
-              <JBrowseErrorBoundary>
-                <JBrowsePanel
-                  treenomeState={treenomeState}
-                  settings={settings}
-                />
-              </JBrowseErrorBoundary>
+              <TreenomeBrowser state={treenomeState} settings={settings} />
               <TreenomeModal
                 treenomeSettingsOpen={treenomeSettingsOpen}
                 setTreenomeSettingsOpen={setTreenomeSettingsOpen}

diff --git a/taxonium_web_client/src/components/TreenomeBrowser.jsx b/taxonium_web_client/src/components/TreenomeBrowser.jsx
@@ -0,0 +1,10 @@
+import JBrowsePanel from "./JBrowsePanel";
+import { JBrowseErrorBoundary } from "./JBrowseErrorBoundary";
+
+export default function TreenomeBrowser({ state, settings }) {
+  return (
+    <JBrowseErrorBoundary>
+      <JBrowsePanel treenomeState={state} settings={settings} />
+    </JBrowseErrorBoundary>
+  );
+}
diff --git a/taxonium_web_client/yarn.lock b/taxonium_web_client/yarn.lock
@@ -9355,6 +9355,11 @@ language-tags@^1.0.5:
   dependencies:
     language-subtag-registry "~0.3.2"
 
+leaflet@^1.9.3:
+  version "1.9.3"
+  resolved "https://registry.yarnpkg.com/leaflet/-/leaflet-1.9.3.tgz#52ec436954964e2d3d39e0d433da4b2500d74414"
+  integrity sha512-iB2cR9vAkDOu5l3HAay2obcUHZ7xwUBBjph8+PGtmW/2lYhbLizWtG7nTeYht36WfOslixQF9D/uSIzhZgGMfQ==
+
 leven@^3.1.0:
   version "3.1.0"
   resolved "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz"