Merge pull request #1834 from nextstrain/hide-date-animation-controls

controls: Hide date/animation sections for `divOnly` trees
nextstrain · Aug 27, 2024 · 331d87e · 331d87e
2 parents 883f55b + d0a1b05
commit 331d87e
Showing 1 changed file with 14 additions and 7 deletions.
diff --git a/src/components/controls/controls.tsx b/src/components/controls/controls.tsx
@@ -35,14 +35,19 @@ function Controls() {
   const panelsToDisplay = useSelector((state: RootState) => state.controls.panelsToDisplay);
   const showTreeToo = useSelector((state: RootState) => state.controls.showTreeToo);
   const canTogglePanelLayout = useSelector((state: RootState) => state.controls.canTogglePanelLayout);
+  const branchLengthsToDisplay = useSelector((state: RootState) => state.controls.branchLengthsToDisplay);
 
   return (
     <ControlsContainer>
       <ChooseDataset />
 
-      <ControlHeader title={t("sidebar:Date Range")} tooltip={DateRangeInfo}/>
-      <DateRangeInputs />
-      <AnimationControls />
+      {branchLengthsToDisplay !== 'divOnly' &&
+        <>
+          <ControlHeader title={t("sidebar:Date Range")} tooltip={DateRangeInfo}/>
+          <DateRangeInputs />
+          <AnimationControls />
+        </>
+      }
 
       <ControlHeader title={t("sidebar:Color By")} tooltip={ColorByInfo}/>
       <ColorBy />
@@ -110,10 +115,12 @@ function Controls() {
         />
       }
 
-      <span style={{ marginTop: "10px" }}>
-        <ControlHeader title={t("sidebar:Animation Options")} tooltip={AnimationOptionsInfo}/>
-        <AnimationOptions />
-      </span>
+      {branchLengthsToDisplay !== "divOnly" &&
+        <span style={{ marginTop: "10px" }}>
+          <ControlHeader title={t("sidebar:Animation Options")} tooltip={AnimationOptionsInfo}/>
+          <AnimationOptions />
+        </span>
+      }
 
       {canTogglePanelLayout &&
         <>