Include neighbouring events in paginated query

Since we're rendering according to the local timezone, we'll need to
include events that fall before or after the specific date on the
server, as they might get be inside the current day in the client's
timezone. So let's just grab a window of events either side of today,
and then hide anything that falls outside the client's day.

app/javascript/controllers/timeline_controller.js

@@ -4,6 +4,7 @@ const MAX_ROWS = 25
 
 export default class extends Controller {
   static targets = [ "cell", "item" ]
+  static values = { date: String }
 
   cellTargetConnected(target) {
     const dt = new Date(target.dataset.datetime)
@@ -12,6 +13,14 @@ export default class extends Controller {
 
   itemTargetConnected(target) {
     const dt = new Date(target.dataset.datetime)
+    target.classList.toggle("out-of-range", !this.#dateIsToday(dt))
     target.style.gridRowStart = MAX_ROWS - dt.getHours()
   }
+
+  #dateIsToday(dt) {
+    const date = new Date(this.dateValue)
+    return dt.getYear() == date.getYear() &&
+      dt.getMonth() == date.getMonth() &&
+      dt.getDay() == date.getDay()
+  }
 }