diff --git a/frontend/src/features/qa/page-list/page-list.ts b/frontend/src/features/qa/page-list/page-list.ts index 9d8c6e9e..0bb67a00 100644 --- a/frontend/src/features/qa/page-list/page-list.ts +++ b/frontend/src/features/qa/page-list/page-list.ts @@ -3,9 +3,11 @@ import type { SlChangeEvent, SlSelect } from "@shoelace-style/shoelace"; import { html, type PropertyValues } from "lit"; import { customElement, property, query } from "lit/decorators.js"; import { repeat } from "lit/directives/repeat.js"; +import { when } from "lit/directives/when.js"; import { TailwindElement } from "@/classes/TailwindElement"; import { type PageChangeEvent } from "@/components/ui/pagination"; +import { renderSpinner } from "@/pages/org/archived-item-qa/ui/spinner"; import type { APIPaginatedList, APISortQuery } from "@/types/api"; import type { ArchivedItemQAPage } from "@/types/qa"; @@ -124,67 +126,74 @@ export class PageList extends TailwindElement {
- ${this.pages?.total - ? html` -
-
- ${this.pages.total === this.totalPages - ? msg( - str`Showing all ${this.totalPages.toLocaleString()} pages`, - ) - : msg( - str`Showing ${this.pages.total.toLocaleString()} of ${this.totalPages.toLocaleString()} pages`, - )} -
-
- ${repeat( - this.pages.items, - ({ id }) => id, - (page: ArchivedItemQAPage) => html` - + total + ? html` +
- - `, - )} -
- { - e.stopPropagation(); - this.dispatchEvent( - new CustomEvent( - "btrix-qa-pagination-change", - { - detail: { page: e.detail.page }, - }, - ), - ); - }} - > - -
+
+ ${total === this.totalPages + ? msg( + str`Showing all ${this.totalPages.toLocaleString()} pages`, + ) + : msg( + str`Showing ${total.toLocaleString()} of ${this.totalPages.toLocaleString()} pages`, + )} +
+
+ ${repeat( + items, + ({ id }) => id, + (page: ArchivedItemQAPage) => html` + + + `, + )} +
+ { + e.stopPropagation(); + this.dispatchEvent( + new CustomEvent( + "btrix-qa-pagination-change", + { + detail: { page: e.detail.page }, + }, + ), + ); + }} + > + +
-
- ` - : html`
- - ${msg("No matching pages found")} -
`} +
+ ` + : html`
+ + ${msg("No matching pages found")} +
`, + renderSpinner, + )}
`; } diff --git a/frontend/src/pages/org/archived-item-detail/ui/qa.ts b/frontend/src/pages/org/archived-item-detail/ui/qa.ts index 39722ee8..aaea163f 100644 --- a/frontend/src/pages/org/archived-item-detail/ui/qa.ts +++ b/frontend/src/pages/org/archived-item-detail/ui/qa.ts @@ -13,6 +13,7 @@ import { type TemplateResult, } from "lit"; import { customElement, property, query, state } from "lit/decorators.js"; +import { ifDefined } from "lit/directives/if-defined.js"; import { when } from "lit/directives/when.js"; import queryString from "query-string"; @@ -681,7 +682,7 @@ export class ArchivedItemDetailQA extends TailwindElement { class="label-same-line" label=${msg("Sort by:")} size="small" - value="approved.-1" + value=${this.qaRunId ? "approved.-1" : "url.1"} pill @sl-change=${(e: SlChangeEvent) => { const { value } = e.target as SlSelect; @@ -697,11 +698,15 @@ export class ArchivedItemDetailQA extends TailwindElement { > ${msg("Title")} ${msg("URL")} - ${msg("Most Comments")} - ${msg("Recently Approved")}${msg("Most Comments")} - ${msg("Not Approved")} + + ${msg("Recently Approved")} + + + ${msg("Not Approved")} + @@ -709,6 +714,13 @@ export class ArchivedItemDetailQA extends TailwindElement { } private renderPageList() { + const pageTitle = (page: ArchivedItemPage) => html` +
+ ${page.title || + html`${msg("No page title")}`} +
+
${page.url}
+ `; return html` html` - ${page.title} -
- ${page.url} -
+ ${this.qaRunId + ? html` + + ${pageTitle(page)} + + ` + : pageTitle(page)}
${this.renderApprovalStatus(page)} - ${this.item?.reviewStatus - ? msg("Update Review") - : msg("Finish Review")} + ${msg("Finish Review")} @@ -1151,8 +1149,12 @@ export class ArchivedItemQA extends TailwindElement { } void this.reviewDialog?.hide(); + + this.navigate.to( + `${this.navigate.orgBasePath}/items/crawl/${this.itemId}#qa`, + ); this.notify.toast({ - message: msg("Submitted QA review."), + message: msg("Saved QA review."), variant: "success", icon: "check2-circle", });