feat(status): allow showing next active build log

chaotic-cx · Oct 6, 2024 · f71b3ae · f71b3ae
1 parent fdbbde6
commit f71b3ae
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 2 deletions.
diff --git a/frontend/src/app/status/status.component.html b/frontend/src/app/status/status.component.html
@@ -37,6 +37,15 @@ <h1 class="text-center text-4xl font-extrabold text-maroon">Build Status</h1>
             >
                 {{ displayLiveLog ? "Hide" : "Show" }} live log
             </button>
+            @if (activeBuilds > 1) {
+                <button
+                    (click)="toggleLogStream()"
+                    class="hover:chaotic-grow-l md:ml-2.5 ml-0 mt-2.5 md:mt-0 rounded-lg bg-maroon px-5 py-2.5 text-base text-sm font-medium hover:bg-mauve focus:outline-none"
+                    type="button"
+                >
+                    Next build log
+                </button>
+            }
         }
     </div>
 

diff --git a/frontend/src/app/status/status.component.ts b/frontend/src/app/status/status.component.ts
@@ -32,6 +32,8 @@ export class StatusComponent implements AfterViewInit {
     pipelines: GitLabPipeline[] = []
     liveLog: undefined | string = undefined
     displayLiveLog: boolean = true
+    activeBuilds: number = 0
+    currentBuild: number = 0
 
     constructor(private cdr: ChangeDetectorRef, private router: Router) {
         this.displayLiveLog = localStorage.getItem("displayLiveLog") === "true"
@@ -157,10 +159,11 @@ export class StatusComponent implements AfterViewInit {
                 this.nothingGoingOn = returnQueue.findIndex((queue) => queue.status !== "idle" && queue.count > 0) === -1
                 if (!this.nothingGoingOn) {
                     const activeQueue = returnQueue.find((queue) => queue.status === "active")
-                    if (this.liveLog !== activeQueue!.liveLogUrl![0]) {
-                        this.liveLog = undefined
+                    if (this.liveLog !== activeQueue!.liveLogUrl![0] && this.currentBuild === 0) {
                         this.liveLog = activeQueue!.liveLogUrl![0]
+                        this.currentBuild = 0
                     }
+                    this.activeBuilds = activeQueue!.liveLogUrl!.length
                 } else {
                     this.liveLog = undefined
                 }
@@ -204,10 +207,29 @@ export class StatusComponent implements AfterViewInit {
         window.location.href = liveLogUrl ? liveLogUrl : ""
     }
 
+    /**
+     * Toggle the display of the live log. Saves the state in localStorage.
+     */
     toggleLiveLog() {
         this.displayLiveLog = !this.displayLiveLog
         this.cdr.detectChanges()
 
         localStorage.setItem("displayLiveLog", this.displayLiveLog.toString())
     }
+
+    /**
+     * Show the next live log of the active builds.
+     */
+    toggleLogStream(): void {
+        const activeQueue = this.currentQueue.find((queue) => queue.status === "active")
+        if (!activeQueue) return
+
+        if ((this.currentBuild + 1) <= this.activeBuilds) {
+            this.currentBuild++
+            this.liveLog = activeQueue.liveLogUrl![this.currentBuild]
+        } else {
+            this.currentBuild = 0
+            this.liveLog = activeQueue.liveLogUrl![0]
+        }
+    }
 }