fix: Show correct button for workflow without crawls (#2590)

Shows "Run Now" button instead of "QA Latest Crawl" in workflow "Watch"
tab when there aren't any crawls.

Author: SuaYoo

frontend/src/pages/org/workflow-detail.ts

@@ -1,6 +1,6 @@
 import { localized, msg, str } from "@lit/localize";
 import type { SlSelect } from "@shoelace-style/shoelace";
-import { html, type PropertyValues, type TemplateResult } from "lit";
+import { html, nothing, type PropertyValues, type TemplateResult } from "lit";
 import { customElement, property, state } from "lit/decorators.js";
 import { choose } from "lit/directives/choose.js";
 import { ifDefined } from "lit/directives/if-defined.js";
@@ -646,25 +646,7 @@ export class WorkflowDetail extends BtrixElement {
             </sl-button>
           </sl-button-group>
         `,
-        () => html`
-          <sl-tooltip
-            content=${msg(
-              "Org Storage Full or Monthly Execution Minutes Reached",
-            )}
-            ?disabled=${!this.org?.storageQuotaReached &&
-            !this.org?.execMinutesQuotaReached}
-          >
-            <sl-button
-              size="small"
-              variant="primary"
-              ?disabled=${archivingDisabled}
-              @click=${() => void this.runNow()}
-            >
-              <sl-icon name="play" slot="prefix"></sl-icon>
-              <span>${msg("Run Crawl")}</span>
-            </sl-button>
-          </sl-tooltip>
-        `,
+        this.renderRunNowButton,
       )}
 
       <sl-dropdown placement="bottom-end" distance="4" hoist>
@@ -1097,23 +1079,25 @@ export class WorkflowDetail extends BtrixElement {
                 ></sl-icon>
                 ${msg("Replay Latest Crawl")}</sl-button
               >
+
+              ${when(
+                this.isCrawler,
+                () =>
+                  html` <sl-button
+                    href=${`${this.navigate.orgBasePath}/workflows/${workflow.id}/crawls/${workflow.lastCrawlId}#qa`}
+                    size="small"
+                    @click=${this.navigate.link}
+                  >
+                    <sl-icon
+                      slot="prefix"
+                      name="clipboard2-data-fill"
+                      library="default"
+                    ></sl-icon>
+                    ${msg("QA Latest Crawl")}
+                  </sl-button>`,
+              )}
             `,
-          )}
-          ${when(
-            this.isCrawler && this.workflow,
-            (workflow) =>
-              html` <sl-button
-                href=${`${this.navigate.orgBasePath}/workflows/${workflow.id}/crawls/${workflow.lastCrawlId}#qa`}
-                size="small"
-                @click=${this.navigate.link}
-              >
-                <sl-icon
-                  slot="prefix"
-                  name="clipboard2-data-fill"
-                  library="default"
-                ></sl-icon>
-                ${msg("QA Latest Crawl")}
-              </sl-button>`,
+            () => (this.isCrawler ? this.renderRunNowButton() : nothing),
           )}
         </div>
       </section>
@@ -1161,6 +1145,27 @@ export class WorkflowDetail extends BtrixElement {
     `;
   }
 
+  private readonly renderRunNowButton = () => {
+    return html`
+      <sl-tooltip
+        content=${msg("Org Storage Full or Monthly Execution Minutes Reached")}
+        ?disabled=${!this.org?.storageQuotaReached &&
+        !this.org?.execMinutesQuotaReached}
+      >
+        <sl-button
+          size="small"
+          variant="primary"
+          ?disabled=${this.org?.storageQuotaReached ||
+          this.org?.execMinutesQuotaReached}
+          @click=${() => void this.runNow()}
+        >
+          <sl-icon name="play" slot="prefix"></sl-icon>
+          ${msg("Run Crawl")}
+        </sl-button>
+      </sl-tooltip>
+    `;
+  };
+
   private renderNoCrawlLogs() {
     return html`
       <section
@@ -1169,26 +1174,10 @@ export class WorkflowDetail extends BtrixElement {
         <p class="text-base font-medium">
           ${msg("Logs will show here after you run a crawl.")}
         </p>
-        <div class="mt-4">
-          <sl-tooltip
-            content=${msg(
-              "Org Storage Full or Monthly Execution Minutes Reached",
-            )}
-            ?disabled=${!this.org?.storageQuotaReached &&
-            !this.org?.execMinutesQuotaReached}
-          >
-            <sl-button
-              size="small"
-              variant="primary"
-              ?disabled=${this.org?.storageQuotaReached ||
-              this.org?.execMinutesQuotaReached}
-              @click=${() => void this.runNow()}
-            >
-              <sl-icon name="play" slot="prefix"></sl-icon>
-              ${msg("Run Crawl")}
-            </sl-button>
-          </sl-tooltip>
-        </div>
+        ${when(
+          this.isCrawler,
+          () => html` <div class="mt-4">${this.renderRunNowButton()}</div> `,
+        )}
       </section>
     `;
   }