feat: keyboard navigation to timeline (#17798)

* feat: improve focus * feat: keyboard nav * feat: improve focus * typo * test * fix test * lint * bad merge * lint * inadvertent * lint * fix: flappy e2e test * bad merge and fix tests * use modulus in loop * tests * react to modal dialog refactor * regression due to deferLayout * Review comments * Re-use change-date instead of new component * bad merge * Review comments * rework moveFocus * lint * Fix outline * use Date * Finish up removing/reducing date parsing * lint * title * strings * Rework dates, rework earlier/later algorithm * bad merge * fix tests * Fix race in scroll comp * consolidate scroll methods * Review comments * console.log * Edge cases in scroll compensation * edge case, optimizations * review comments * lint * lint * More edge cases * lint --------- Co-authored-by: mertalev <101130780+mertalev@users.noreply.github.com> Co-authored-by: Alex <alex.tran1502@gmail.com>
2025-12-20 01:11:46 +03:00 · 2025-05-28 09:55:14 -04:00
parent b5593823a2
commit f029910dc7
21 changed files with 1077 additions and 598 deletions
--- a/web/src/lib/utils/invocationTracker.ts
+++ b/web/src/lib/utils/invocationTracker.ts
@@ -0,0 +1,53 @@
+/**
+ * Tracks the state of asynchronous invocations to handle race conditions and stale operations.
+ * This class helps manage concurrent operations by tracking which invocations are active
+ * and allowing operations to check if they're still valid.
+ */
+export class InvocationTracker {
+  /** Counter for the number of invocations that have been started */
+  invocationsStarted = 0;
+  /** Counter for the number of invocations that have been completed */
+  invocationsEnded = 0;
+
+  constructor() {}
+
+  /**
+   * Starts a new invocation and returns an object with utilities to manage the invocation lifecycle.
+   * @returns  An object containing methods to manage the invocation:
+   *   - isInvalidInvocationError: Checks if an error is an invalid invocation error
+   *   - checkStillValid: Throws an error if the invocation is no longer valid
+   *   - endInvocation: Marks the invocation as complete
+   */
+  startInvocation() {
+    this.invocationsStarted++;
+    const invocation = this.invocationsStarted;
+
+    return {
+      /**
+       * Throws an error if this invocation is no longer valid
+       * @throws {Error} If the invocation is no longer valid
+       */
+      isStillValid: () => {
+        if (invocation !== this.invocationsStarted) {
+          return false;
+        }
+        return true;
+      },
+
+      /**
+       * Marks this invocation as complete
+       */
+      endInvocation: () => {
+        this.invocationsEnded = invocation;
+      },
+    };
+  }
+
+  /**
+   * Checks if there are any active invocations
+   * @returns True if there are active invocations, false otherwise
+   */
+  isActive() {
+    return this.invocationsStarted !== this.invocationsEnded;
+  }
+}