fixed switching to 7-day trend bug

Author: rhansolo

src/components/Legend.svelte

@@ -410,28 +410,28 @@
       </div>
     </div>
   </div>
-  {#if $encoding === 'color'}
-    {#if $signalType === 'direction'}
-      <div class="trend-legend-grouping">
-        <ul class="legend-labels">
-          <li>
-            <div class="color-block" style="background-color: {DIRECTION_THEME.increasing}" />
-            {@html DIRECTION_THEME.increasingIcon}
-            Increasing
-          </li>
-          <li>
-            <div class="color-block" style="background-color: {DIRECTION_THEME.steady}" />
-            {@html DIRECTION_THEME.steadyIcon}
-            Steady
-          </li>
-          <li>
-            <div class="color-block" style="background-color: {DIRECTION_THEME.decreasing}" />
-            {@html DIRECTION_THEME.decreasingIcon}
-            Decreasing
-          </li>
-        </ul>
-      </div>
-    {:else if isCountSignal($currentSensor)}
+  {#if $signalType === 'direction'}
+    <div class="trend-legend-grouping">
+      <ul class="legend-labels">
+        <li>
+          <div class="color-block" style="background-color: {DIRECTION_THEME.increasing}" />
+          {@html DIRECTION_THEME.increasingIcon}
+          Increasing
+        </li>
+        <li>
+          <div class="color-block" style="background-color: {DIRECTION_THEME.steady}" />
+          {@html DIRECTION_THEME.steadyIcon}
+          Steady
+        </li>
+        <li>
+          <div class="color-block" style="background-color: {DIRECTION_THEME.decreasing}" />
+          {@html DIRECTION_THEME.decreasingIcon}
+          Decreasing
+        </li>
+      </ul>
+    </div>
+  {:else if $encoding === 'color'}
+    {#if isCountSignal($currentSensor)}
       <div class="legend-grouping">
         <ul class="legend-labels">
           {#each labels as [label1, label2]}

src/components/MapBox.svelte

@@ -547,7 +547,11 @@
       hideAll([SPIKE_LAYER, outline(SPIKE_LAYER), highlight(SPIKE_LAYER), highlight(outline(SPIKE_LAYER))]);
 
       // show bubble layers
-      showAll([BUBBLE_LAYER, highlight(BUBBLE_LAYER)]);
+      if ($signalType === 'direction') {
+        hideAll([BUBBLE_LAYER, highlight(BUBBLE_LAYER)]);
+      } else {
+        showAll([BUBBLE_LAYER, highlight(BUBBLE_LAYER)]);
+      }
 
       // color scale (color + stroke color)
       let flatStops = stops.flat();
@@ -584,7 +588,11 @@
       map.setPaintProperty($currentLevel, 'fill-color', MAP_THEME.countyFill);
       hideAll([BUBBLE_LAYER, highlight(BUBBLE_LAYER)]);
 
-      showAll([SPIKE_LAYER, outline(SPIKE_LAYER), highlight(SPIKE_LAYER), highlight(outline(SPIKE_LAYER))]);
+      if ($signalType === 'direction') {
+        hideAll([SPIKE_LAYER, outline(SPIKE_LAYER), highlight(SPIKE_LAYER), highlight(outline(SPIKE_LAYER))]);
+      } else {
+        showAll([SPIKE_LAYER, outline(SPIKE_LAYER), highlight(SPIKE_LAYER), highlight(outline(SPIKE_LAYER))]);
+      }
 
       const valueMax = valueMinMax[1],
         maxHeight = ENCODING_SPIKE_THEME.maxHeight[$currentLevel],