Auto expand on in-page current/next links

Related to Issue #31
oengusio · Sep 29, 2021 · 964417d · 964417d
1 parent cc2a2b3
commit 964417d
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 14 deletions.
diff --git a/components/marathon/schedule/List.vue b/components/marathon/schedule/List.vue
@@ -118,26 +118,21 @@ export default Vue.extend({
       return (this.$store.state.api.schedule as ScheduleState).tickers[this.marathonId];
     },
   },
+  watch: {
+    runHash(): void {
+      // The `false` makes it so we only expand Current/Next
+      // If we don't do this, the ID hashes self-collapse sometimes
+      this.expandRunHash(false);
+    },
+  },
   mounted(): void {
     // Every 5 minutes, forcibly update data
     // Eventually, this will be minute-by-minute but not forced, relying on cache expiration
     this.interval = setInterval(() => {
       this.getSchedule({ id: this.marathonId, forceFetch: true });
       this.getScheduleTicker({ id: this.marathonId, forceFetch: true });
     }, 300_000);
-    if (this.runHash) {
-      const runHashRegExp = /^#run-(\d+)$/;
-      const runHashResults = runHashRegExp.exec(this.runHash);
-      if (runHashResults) {
-        this.expand(Number.parseInt(runHashResults[1]));
-      } else if (this.tickers) {
-        if (this.runHash === '#current') {
-          this.expand(this.tickers.current);
-        } else if (this.runHash === '#next') {
-          this.expand(this.tickers.next);
-        }
-      }
-    }
+    this.expandRunHash();
   },
   destroyed(): void {
     if (this.interval) {
@@ -159,6 +154,21 @@ export default Vue.extend({
       }
       this.expanded = new Set(this.expanded);
     },
+    expandRunHash(expandRunId = true): void {
+      if (this.runHash) {
+        const runHashRegExp = /^#run-(\d+)$/;
+        const runHashResults = runHashRegExp.exec(this.runHash);
+        if (runHashResults && expandRunId) {
+          this.expand(Number.parseInt(runHashResults[1]));
+        } else if (this.tickers) {
+          if (this.runHash === '#current') {
+            this.expand(this.tickers.current);
+          } else if (this.runHash === '#next') {
+            this.expand(this.tickers.next);
+          }
+        }
+      }
+    },
     getId(run: ScheduleLine): string|undefined {
       switch (run.id) {
         case this.tickers?.current?.id:

diff --git a/pages/marathon/_marathon/schedule/index.vue b/pages/marathon/_marathon/schedule/index.vue
@@ -31,9 +31,13 @@ export default Vue.extend({
   data() {
     return {
       marathonId: this.$route.params.marathon,
-      runHash: this.$route.hash,
     };
   },
+  computed: {
+    runHash(): string {
+      return this.$route.hash;
+    },
+  },
 });
 </script>