updates to timeline and notice (#86)

config.js

@@ -36,10 +36,11 @@ const config = {
         },
         zoomLevels: [
           // { label: "Zoom to 2 weeks", duration: 14 * one_day },
-          { label: "Zoom to 1 month", duration: 31 * one_day },
-          { label: "Zoom to 6 months", duration: 6 * 31 * one_day },
+          // { label: "Zoom to 1 month", duration: 31 * one_day },
+          // { label: "Zoom to 6 months", duration: 6 * 31 * one_day },
           { label: "Zoom to 1 year", duration: 12 * 31 * one_day },
-          { label: "Zoom to 2 years", duration: 24 * 31 * one_day },
+          { label: "Zoom to 2 years", duration: 2 * 12 * 31 * one_day },
+          { label: "Zoom to 5 years", duration: 5 * 12 * 31 * one_day },
         ],
         range: {
           /**
@@ -47,7 +48,7 @@ const config = {
            * Use [start, end] (strings in ISO 8601 format) for a fixed range.
            * Use undefined for a dynamic initial range based on the browser time.
            */
-          initial: undefined,
+          initial: ["2022-02-01T00:00:00.000Z", "2025-08-31T23:59:59.999Z"],
           /** The number of days to show when using a dynamic initial range */
           initialDaysShown: 31*12,
           limits: {
@@ -57,7 +58,7 @@ const config = {
              * The upper bound of the range that can be accessed on the map.
              * Defaults to current browser time if undefined.
              */
-            upper: undefined,
+            upper: "2025-08-14T23:59:59.999Z",
           },
         },
       },

src/components/time/Timeline.jsx

@@ -219,19 +219,14 @@ class Timeline extends Component {
    * @param {object} zoom: zoom level from zoomLevels
    */
   onApplyZoom(zoom) {
-    const extent = this.getTimeScaleExtent();
-    const newCentralTime = timeMinute.offset(
-      this.state.scaleX.domain()[0],
-      extent / 2
-    );
+    const now = new Date();
     const { rangeLimits } = this.props.app.timeline;
 
-    let newDomain0 = timeMinute.offset(newCentralTime, -zoom.duration / 2);
-    let newDomainF = timeMinute.offset(newCentralTime, zoom.duration / 2);
+    // Calculate the start and end of the zoom window, ending at 'now' and going back zoom.duration minutes
+    let newDomainF = now;
+    let newDomain0 = timeMinute.offset(now, -zoom.duration);
 
     if (rangeLimits) {
-      // If the store contains absolute time limits,
-      // make sure the zoom doesn't go over them
       const minDate = rangeLimits[0];
       const maxDate = rangeLimits[1];
 

src/components/time/atoms/Header.jsx

@@ -14,8 +14,11 @@ const TimelineHeader = ({ title, from, to, onClick, hideInfo, resetTest, resetCl
         <p dangerouslySetInnerHTML={{ __html: title }} />
         <p>
           {d0} - {d1}
-          <small className="reset-button" onClick={() => resetClick() }><a className="cell">{ resetTest }</a></small>
+          <small className="reset-button" onClick={() => resetClick()}><a className="cell">{resetTest}</a></small>
         </p>
+        <div style={{ fontWeight: "400", textAlign: "center", marginTop: "5px" }}>
+          <i className="material-icons" style={{ color: "#FFA726", fontSize: "18px", verticalAlign: "middle" }}>warning</i> No verified incidents are being added after Aug 2025.
+        </div>
       </div>
     </div>
   );