tea/browsertrix
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Bug: load correct workflow page on initial render (#2677)

Browse Source
This commit is contained in:
Emma Segal-Grossman 2025-06-23 18:37:18 -04:00 committed by GitHub
parent db4621602e
commit 53a3521917
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 42 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/components/ui/pagination.ts
View File

@ -173,6 +173,7 @@ export class Pagination extends LitElement {
set page(page: number) { set page(page: number) {
if (page !== this._page) { if (page !== this._page) {
this.setPage(page); this.setPage(page);
this._page = page;
} }
} }

68
frontend/src/pages/org/workflows-list.ts
View File

@ -4,6 +4,7 @@ import type {
SlDialog, SlDialog,
SlSelectEvent, SlSelectEvent,
} from "@shoelace-style/shoelace"; } from "@shoelace-style/shoelace";
import clsx from "clsx";
import { html, type PropertyValues } from "lit"; import { html, type PropertyValues } from "lit";
import { customElement, query, state } from "lit/decorators.js"; import { customElement, query, state } from "lit/decorators.js";
import { ifDefined } from "lit/directives/if-defined.js"; import { ifDefined } from "lit/directives/if-defined.js";
@ -141,14 +142,27 @@ export class WorkflowsList extends BtrixElement {
protected async willUpdate( protected async willUpdate(
changedProperties: PropertyValues<this> & Map<string, unknown>, changedProperties: PropertyValues<this> & Map<string, unknown>,
) { ) {
if ( // Props that reset the page to 1 when changed
changedProperties.has("orderBy") || const resetToFirstPageProps = [
changedProperties.has("filterByCurrentUser") || "filterByCurrentUser",
changedProperties.has("filterByScheduled") || "filterByScheduled",
changedProperties.has("filterBy") "filterBy",
) { "orderBy",
];
// Props that require a data refetch
const refetchDataProps = [...resetToFirstPageProps];
if (refetchDataProps.some((k) => changedProperties.has(k))) {
const isInitialRender = resetToFirstPageProps
.map((k) => changedProperties.get(k))
.every((v) => v === undefined);
void this.fetchWorkflows({ void this.fetchWorkflows({
page: 1, page:
// If this is the initial render, use the page from the URL or default to 1; otherwise, reset the page to 1
isInitialRender
? parsePage(new URLSearchParams(location.search).get("page")) || 1
: 1,
}); });
} }
if (changedProperties.has("filterByCurrentUser")) { if (changedProperties.has("filterByCurrentUser")) {
@ -509,27 +523,27 @@ export class WorkflowsList extends BtrixElement {
<btrix-workflow-list> <btrix-workflow-list>
${this.workflows.items.map(this.renderWorkflowItem)} ${this.workflows.items.map(this.renderWorkflowItem)}
</btrix-workflow-list> </btrix-workflow-list>
${when( <footer
total > pageSize, class=${clsx(
() => html` tw`mt-6 flex justify-center`,
<footer class="mt-6 flex justify-center"> total <= pageSize && tw`hidden`,
<btrix-pagination )}
page=${page} >
totalCount=${total} <btrix-pagination
size=${pageSize} page=${page}
@page-change=${async (e: PageChangeEvent) => { totalCount=${total}
await this.fetchWorkflows({ size=${pageSize}
page: e.detail.page, @page-change=${async (e: PageChangeEvent) => {
}); await this.fetchWorkflows({
page: e.detail.page,
});
// Scroll to top of list // Scroll to top of list
// TODO once deep-linking is implemented, scroll to top of pushstate // TODO once deep-linking is implemented, scroll to top of pushstate
this.scrollIntoView({ behavior: "smooth" }); this.scrollIntoView({ behavior: "smooth" });
}} }}
></btrix-pagination> ></btrix-pagination>
</footer> </footer>
`,
)}
`; `;
} }