Bug: load correct workflow page on initial render (#2677)
This commit is contained in:
		
							parent
							
								
									db4621602e
								
							
						
					
					
						commit
						53a3521917
					
				| @ -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; | ||||||
|     } |     } | ||||||
|   } |   } | ||||||
| 
 | 
 | ||||||
|  | |||||||
| @ -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,10 +523,12 @@ 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 |         <btrix-pagination | ||||||
|           page=${page} |           page=${page} | ||||||
|           totalCount=${total} |           totalCount=${total} | ||||||
| @ -528,8 +544,6 @@ export class WorkflowsList extends BtrixElement { | |||||||
|           }} |           }} | ||||||
|         ></btrix-pagination> |         ></btrix-pagination> | ||||||
|       </footer> |       </footer> | ||||||
|         `,
 |  | ||||||
|       )} |  | ||||||
|     `;
 |     `;
 | ||||||
|   } |   } | ||||||
| 
 | 
 | ||||||
|  | |||||||
		Loading…
	
		Reference in New Issue
	
	Block a user