WIP MicrobeTrace link

nextstrain · Apr 9, 2024 · 12cdab3 · 12cdab3
1 parent 45791aa
commit 12cdab3
Showing 1 changed file with 23 additions and 3 deletions.
diff --git a/src/components/modal/LinkOutModalContents.jsx b/src/components/modal/LinkOutModalContents.jsx
@@ -42,7 +42,7 @@ const ButtonContainer = styled.div`
   margin-bottom: 10px;
 `
 
-const data = ({distanceMeasure, colorBy}) => {
+const data = ({distanceMeasure, colorBy, mainTreeNumTips}) => {
   const pathname = window.location.pathname;
   const origin = forceNextstrainHost ? 'https://nextstrain.org' : window.location.origin;
   return ([
@@ -88,12 +88,32 @@ const data = ({distanceMeasure, colorBy}) => {
 
         return `${baseUrl}?${Object.entries(queries).map(([k,v]) => `${k}=${encodeURIComponent(v)}`).join("&")}`;
       }
-    }
+    },
+    {
+      name: 'microbetrace.cdc.gov',
+      description() {
+        return (
+          <>
+            View this data in MicrobeTrace (see <a href='https://github.com/CDCgov/MicrobeTrace/wiki'>their help page</a>)
+            {mainTreeNumTips>500 && (
+              <span>
+                {`Note that trees with over 500 tips may have trouble loading (this one has ${mainTreeNumTips})`}
+              </span>
+            )}
+          </>
+        )
+      },
+      url() {
+        const baseUrl = 'https://microbetrace.cdc.gov/MicrobeTrace';
+        return `${baseUrl}?url=${encodeURIComponent(`${origin}${pathname}`)}`
+      }
+    }  
   ])
 }
 
 export const LinkOutModalContents = () => {
   const {distanceMeasure, colorBy} = useSelector((state) => state.controls)
+  const {mainTreeNumTips} = useSelector((state) => state.metadata);
 
   return (
     <>
@@ -115,7 +135,7 @@ export const LinkOutModalContents = () => {
 
       <div style={infoPanelStyles.break}/>
 
-      {data({distanceMeasure, colorBy}).map((d) => (
+      {data({distanceMeasure, colorBy, mainTreeNumTips}).map((d) => (
         <ButtonContainer key={d.name}>
           <ButtonText href={d.url()} target="_blank" rel="noreferrer noopener">{d.name}</ButtonText>
           <ButtonDescription>{d.description()}</ButtonDescription>