Set default date to the date we have data for all 3 sensors.

cmu-delphi · Feb 26, 2024 · 63d23f2 · 63d23f2
1 parent 866ecda
commit 63d23f2
Show file tree

Hide file tree

Showing 3 changed files with 99 additions and 10 deletions.
diff --git a/src/blocks/NoRecentDataWarning.svelte b/src/blocks/NoRecentDataWarning.svelte
@@ -0,0 +1,45 @@
+<script>
+  import { formatAPITime } from '../data';
+  import { formatDateYearDayOfWeekAbbr } from '../formats';
+  /**
+   * @type {import("../stores/params").DateParam}
+   */
+  export let date;
+  /**
+   * @type {import("../stores/params").DateParam}
+   */
+  export let minMaxDate;
+  /**
+   * @type {import('../stores/params').SensorParam}
+   */
+  export let casesSensor;
+  /**
+   * @type {import('../stores/params').SensorParam}
+   */
+  export let deathSensor;
+  /**
+   * @type {import('../stores/params').SensorParam}
+   */
+  export let hospitalAdmissionSensor;
+
+  let todaysDate = new Date();
+  let casesMaxDate = new Date();
+  let deathSensorMaxDate = new Date();
+  let hospitalAdmissionMaxDate = new Date();
+
+  casesMaxDate = casesSensor.timeFrame.max;
+  deathSensorMaxDate = deathSensor.timeFrame.max;
+  hospitalAdmissionMaxDate = hospitalAdmissionSensor.timeFrame.max;
+</script>
+
+{#if casesMaxDate.toString() != date.value.toString() || deathSensorMaxDate.toString() != date.value.toString() || hospitalAdmissionMaxDate.toString() != date.value.toString()}
+  <div data-uk-alert class="uk-alert-warning">
+    <p>
+      The data for the {formatDateYearDayOfWeekAbbr(todaysDate)} is not available yet. The latest known data for all indicators
+      is available on
+      <a href="?date={formatAPITime(minMaxDate.value)}&{window.location.search.split('&').slice(1).join('&')}"
+        >{formatDateYearDayOfWeekAbbr(minMaxDate)}</a
+      >.
+    </p>
+  </div>
+{/if}
diff --git a/src/modes/summary/Overview.svelte b/src/modes/summary/Overview.svelte
@@ -2,13 +2,14 @@
   import KPIValue from '../../components/KPIValue.svelte';
   import KPIChange from '../../components/KPIChange.svelte';
   import { DateParam, SensorParam } from '../../stores/params';
-  import { formatDateDayOfWeek } from '../../formats';
   import SensorUnit from '../../components/SensorUnit.svelte';
   import IndicatorAnnotations from '../../components/IndicatorAnnotations.svelte';
   import MaxDateHint from '../../blocks/MaxDateHint.svelte';
   import IndicatorWarning from '../../blocks/IndicatorWarning.svelte';
+  import NoRecentDataWarning from '../../blocks/NoRecentDataWarning.svelte';
   import { defaultDeathSensor, defaultCasesSensor, defaultHospitalSensor, metaDataManager } from '../../stores';
   import IndicatorFallbackWarning from '../../blocks/IndicatorFallbackWarning.svelte';
+  import { onMount, afterUpdate, beforeUpdate } from 'svelte';
 
   /**
    * @type {import("../../stores/params").DateParam}
@@ -40,20 +41,60 @@
   $: casesTrend = trends[0];
   $: hospitalTrend = fetchFallback(fetcher, HOSPITAL_ADMISSION, region, trends[1]);
   $: deathTrend = trends[2];
+
+  let minMaxDate = new Date();
+  let showWarning = false;
+
+  onMount(() => {
+    [CASES, DEATHS, HOSPITAL_ADMISSION].map((s) => {
+      if (s.timeFrame.max < minMaxDate) {
+        minMaxDate = s.timeFrame.max;
+      }
+    });
+    let urlSeachParams = new URLSearchParams(window.location.search);
+    if (!urlSeachParams.has('date')) {
+      date.set(minMaxDate);
+    }
+  });
+
+  beforeUpdate(() => {
+    if (minMaxDate.toString() === date.value.toString()) {
+      showWarning = true;
+    }
+  });
+
+  afterUpdate(() => {
+    if (minMaxDate.toString() != date.value.toString()) {
+      showWarning = false;
+    }
+  });
 </script>
 
 <IndicatorWarning sensor={CASES} {date} {region} {fetcher} />
 <IndicatorAnnotations {date} {region} sensor={CASES} range="sparkLine" />
 
-<p>
+{#if showWarning}
+  <NoRecentDataWarning
+    casesSensor={CASES}
+    deathSensor={DEATHS}
+    hospitalAdmissionSensor={HOSPITAL_ADMISSION}
+    {date}
+    {minMaxDate}
+  />
+{/if}
+
+<!-- <p>
   On {formatDateDayOfWeek(date.value)}
   <MaxDateHint sensor={CASES.value} suffix="," {fetcher} />
   the {CASES.valueUnit}s were:
-</p>
+</p> -->
 
 <div class="mobile-three-col">
   <div class="mobile-kpi">
-    <h3>Doctor Visits</h3>
+    <h3>
+      Doctor Visits
+      <MaxDateHint sensor={CASES.value} {fetcher} />
+    </h3>
     <div>
       {#await casesTrend}
         <KPIValue value={null} loading />
@@ -66,7 +107,10 @@
     </div>
   </div>
   <div class="mobile-kpi">
-    <h3>Hospital Admissions</h3>
+    <h3>
+      Hospital Admissions
+      <MaxDateHint sensor={HOSPITAL_ADMISSION.value} {fetcher} />
+    </h3>
     <div>
       {#await hospitalTrend}
         <KPIValue value={null} loading />
@@ -79,7 +123,10 @@
     </div>
   </div>
   <div class="mobile-kpi">
-    <h3>Deaths</h3>
+    <h3>
+      Deaths
+      <MaxDateHint sensor={DEATHS.value} {fetcher} />
+    </h3>
     <div>
       {#await deathTrend}
         <KPIValue value={null} loading />

diff --git a/src/modes/summary/Summary.svelte b/src/modes/summary/Summary.svelte
@@ -1,7 +1,6 @@
 <script>
   import IndicatorTable from './IndicatorTable.svelte';
-  // TEMPORARY DISABLING OF THIS OVERVIEW WIDGET UNTIL SIGNALS ARE FIXED:
-  // import Overview from './Overview.svelte';
+  import Overview from './Overview.svelte';
   import { countyInfo, nationInfo, stateInfo } from '../../data/regions';
   import RegionDatePicker from '../../components/RegionDatePicker.svelte';
   import {
@@ -71,9 +70,7 @@
   <div class="uk-container content-grid">
     <div class="grid-3-11">
       <FancyHeader invert>{region.displayName}</FancyHeader>
-      <!-- TEMPORARY DISABLING OF THIS OVERVIEW WIDGET UNTIL SIGNALS ARE FIXED
       <Overview {date} {region} {fetcher} />
-      -->
       <hr />
       <FancyHeader invert sub="Map" anchor="map">{HOSPITAL_ADMISSION.name}</FancyHeader>
       <p>{@html HOSPITAL_ADMISSION.signalTooltip}</p>