From bf4fc93d5ad014fd122828e769a47f1ada22a851 Mon Sep 17 00:00:00 2001
From: Ilya Kreymer <ikreymer@users.noreply.github.com>
Date: Mon, 29 Apr 2024 20:02:10 +0200
Subject: [PATCH] Fix 'Review Crawl' button disabled state. (#1751)

Disable the 'Review Crawl' button only when there are no finished QA
Runs:
- track last finished qa run 'lastFinishedQARunId'
- track if qa run is running via 'isQAActive'
- only add tooltip / disabled state when there are no finished qa runs

Also, only add href when not disabled, to avoid clickable link with
disabled button

---------

Co-authored-by: emma <hi@emma.cafe>
---
 .../archived-item-detail.ts                   | 42 ++++++++++++-------
 1 file changed, 27 insertions(+), 15 deletions(-)

diff --git a/frontend/src/pages/org/archived-item-detail/archived-item-detail.ts b/frontend/src/pages/org/archived-item-detail/archived-item-detail.ts
index 6e779db4..0d970c21 100644
--- a/frontend/src/pages/org/archived-item-detail/archived-item-detail.ts
+++ b/frontend/src/pages/org/archived-item-detail/archived-item-detail.ts
@@ -92,6 +92,12 @@ export class ArchivedItemDetail extends TailwindElement {
   @state()
   private qaRunId?: string;
 
+  @state()
+  private lastFinishedQARunId?: string;
+
+  @state()
+  private isQAActive = false;
+
   @state()
   qaRuns?: QARun[];
 
@@ -148,11 +154,6 @@ export class ArchivedItemDetail extends TailwindElement {
     return activeCrawlStates.includes(this.crawl.state);
   }
 
-  private get isQAActive(): boolean | null {
-    if (!this.qaRuns?.[0]) return null;
-    return QA_RUNNING_STATES.includes(this.qaRuns[0].state);
-  }
-
   private get hasFiles(): boolean | null {
     if (!this.crawl) return null;
     if (!this.crawl.resources) return false;
@@ -186,7 +187,7 @@ export class ArchivedItemDetail extends TailwindElement {
       this.qaRuns &&
       this.mostRecentNonFailedQARun
     ) {
-      const firstFinishedQARun = this.qaRuns.find(({ state }) =>
+      const lastFinishedQARun = this.qaRuns.find(({ state }) =>
         finishedCrawlStates.includes(state),
       );
       const prevMostRecentNonFailedQARun =
@@ -198,9 +199,11 @@ export class ArchivedItemDetail extends TailwindElement {
 
       // Update currently selected QA run if there is none,
       // or if a QA run that was previously running is now finished:
-      if (firstFinishedQARun && (!this.qaRunId || mostRecentNowFinished)) {
-        this.qaRunId = firstFinishedQARun.id;
+      if (lastFinishedQARun && (!this.qaRunId || mostRecentNowFinished)) {
+        this.qaRunId = lastFinishedQARun.id;
       }
+      // set last finished run
+      this.lastFinishedQARunId = lastFinishedQARun?.id;
     }
   }
 
@@ -1021,8 +1024,16 @@ ${this.crawl?.description}
   }
 
   private readonly renderQAHeader = (qaRuns: QARun[]) => {
-    const qaIsRunning = isActive(qaRuns[0]?.state);
-    const qaIsAvailable = this.mostRecentNonFailedQARun && !qaIsRunning;
+    //const qaIsRunning = isActive(qaRuns[0]?.state);
+    //const qaIsAvailable = this.mostRecentNonFailedQARun && !qaIsRunning;
+    const qaIsRunning = this.isQAActive;
+    const qaIsAvailable = !!this.lastFinishedQARunId;
+
+    const reviewLink =
+      qaIsAvailable && this.qaRunId
+        ? `${this.navigate.orgBasePath}/items/crawl/${this.crawlId}/review/screenshots?qaRunId=${this.qaRunId}`
+        : undefined;
+
     return html`
       ${qaIsRunning
         ? html`
@@ -1065,15 +1076,12 @@ ${this.crawl?.description}
         ? html`
             <sl-tooltip
               ?disabled=${qaIsAvailable}
-              content=${qaIsRunning
-                ? msg("Reviews are disabled during analysis runs.")
-                : msg("No completed analysis runs are available.")}
+              content=${msg("No completed analysis runs are available.")}
             >
               <sl-button
                 variant="primary"
                 size="small"
-                href="${this.navigate.orgBasePath}/items/crawl/${this
-                  .crawlId}/review/screenshots?qaRunId=${this.qaRunId || ""}"
+                href="${ifDefined(reviewLink)}"
                 @click=${this.navigate.link}
                 ?disabled=${!qaIsAvailable}
               >
@@ -1446,6 +1454,10 @@ ${this.crawl?.description}
       });
     }
 
+    this.isQAActive = Boolean(
+      this.qaRuns?.[0] && QA_RUNNING_STATES.includes(this.qaRuns[0].state),
+    );
+
     if (this.isQAActive) {
       // Restart timer for next poll
       this.timerId = window.setTimeout(() => {