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>
This commit is contained in:
Ilya Kreymer 2024-04-29 20:02:10 +02:00 committed by GitHub
parent a1de72c2ba
commit bf4fc93d5a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

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