fixes

Author: HarshMN2345

src/lib/components/archiveProject.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import ArchivedPaginationWithLimit from './archivedPaginationWithLimit.svelte';
+    import PaginationWithLimit from './paginationWithLimit.svelte';
     import { Button, InputText } from '$lib/elements/forms';
     import { DropList, GridItem1, CardContainer, Modal } from '$lib/components';
     import { Submit, trackEvent, trackError } from '$lib/actions/analytics';
@@ -320,13 +320,14 @@
                     {/each}
                 </CardContainer>
 
-                <div class="pagination-container">
-                    <ArchivedPaginationWithLimit
-                        name="Archived Projects"
-                        {limit}
-                        offset={archivedOffset}
-                        total={archivedTotalOverall} />
-                </div>
+                <PaginationWithLimit
+                    name="Archived Projects"
+                    {limit}
+                    offset={archivedOffset}
+                    total={archivedTotalOverall}
+                    pageParam="archivedPage"
+                    removeOnFirstPage
+                    class="pagination-container" />
             </div>
         </Accordion>
     </div>
@@ -400,7 +401,7 @@
         align-items: center;
         gap: 8px;
     }
-    .pagination-container {
+    :global(.pagination-container) {
         margin-top: 16px;
     }
 </style>

src/lib/components/archivedLimit.svelte

@@ -8,6 +8,8 @@
     export let sum: number;
     export let limit: number;
     export let name: string;
+    export let pageParam: string = 'page';
+    export let removeOnFirstPage: boolean = false;
 
     const options = [
         { label: '6', value: 6 },
@@ -23,10 +25,15 @@
         url.searchParams.set('limit', limit.toString());
         await preferences.setLimit(limit);
 
-        if (url.searchParams.has('page')) {
-            const page = Number(url.searchParams.get('page'));
+        if (url.searchParams.has(pageParam)) {
+            const page = Number(url.searchParams.get(pageParam));
             const newPage = Math.floor(((page - 1) * previousLimit) / limit);
-            url.searchParams.set('page', newPage.toString());
+            const safePage = Math.max(1, Number.isFinite(newPage) ? newPage : 1);
+            if (removeOnFirstPage && safePage === 1) {
+                url.searchParams.delete(pageParam);
+            } else {
+                url.searchParams.set(pageParam, safePage.toString());
+            }
         }
 
         await goto(url.toString());

src/lib/components/archivedPagination.svelte

@@ -6,15 +6,21 @@
     export let limit: number;
     export let offset: number;
     export let useCreateLink = true;
+    export let pageParam: string = 'page';
+    export let removeOnFirstPage: boolean = false;
 
     $: currentPage = Math.floor(offset / limit + 1);
 
     function getLink(page: number): string {
         const url = new URL(pageStore.url);
         if (page === 1) {
-            url.searchParams.delete('page');
+            if (removeOnFirstPage) {
+                url.searchParams.delete(pageParam);
+            } else {
+                url.searchParams.set(pageParam, '1');
+            }
         } else {
-            url.searchParams.set('page', page.toString());
+            url.searchParams.set(pageParam, page.toString());
         }
 
         return url.toString();

src/lib/components/archivedPaginationWithLimit.svelte

@@ -8,24 +8,37 @@
         offset,
         total,
         name,
-        useCreateLink = true
+        useCreateLink = true,
+        pageParam = 'page',
+        removeOnFirstPage = false,
+        ...restProps
     }: {
         limit: number;
         offset: number;
         total: number;
         name: string;
         useCreateLink?: boolean;
+        pageParam?: string;
+        removeOnFirstPage?: boolean;
+        [key: string]: any;
     } = $props();
 
     const showLimit = $derived(!!useCreateLink);
     const direction = $derived(showLimit ? 'row' : 'column');
     const alignItems = $derived(showLimit ? 'center' : 'flex-end');
 </script>
 
-<Layout.Stack wrap="wrap" {direction} {alignItems} justifyContent="space-between">
+<Layout.Stack wrap="wrap" {direction} {alignItems} justifyContent="space-between" {...restProps}>
     {#if showLimit}
-        <Limit {limit} sum={total} {name} />
+        <Limit {limit} sum={total} {name} {pageParam} {removeOnFirstPage} />
     {/if}
 
-    <Pagination on:page {limit} {offset} sum={total} {useCreateLink} />
+    <Pagination
+        on:page
+        {limit}
+        {offset}
+        sum={total}
+        {useCreateLink}
+        {pageParam}
+        {removeOnFirstPage} />
 </Layout.Stack>

src/lib/components/limit.svelte

@@ -13,7 +13,8 @@
         name = 'items',
         gap = 's',
         offset = $bindable(0),
-        children
+        children,
+        ...restProps
     }: {
         items: T[];
         limit?: number;
@@ -26,14 +27,15 @@
             | undefined;
         offset?: number;
         children: Snippet<[T[], number]>;
+        [key: string]: any;
     } = $props();
 
     let total = $derived(items.length);
 
     let paginatedItems = $derived(items.slice(offset, offset + limit));
 </script>
 
-<Layout.Stack {gap}>
+<Layout.Stack {gap} {...restProps}>
     {@render children(paginatedItems, limit)}
 
     {#if !hideFooter}

src/lib/components/pagination.svelte

@@ -110,7 +110,7 @@
     }
 
     $: projectsToArchive = (data.archivedProjectsPage ?? data.projects.projects).filter(
-        (project) => (isCloud ? project.status === 'archived' : project.status !== 'active') // fallback for non-cloud
+        (project) => project.status === 'archived'
     );
 
     $: activeProjects = (data.activeProjectsPage ?? data.projects.projects).filter(

src/lib/components/paginationWithLimit.svelte

@@ -21,43 +21,42 @@ export const load: PageLoad = async ({ params, url, route, depends, parent }) =>
     const archivedPage = parseInt(url.searchParams.get('archivedPage') || '1');
     const archivedOffset = pageToOffset(archivedPage, limit);
 
-    // fetch active projects with offset set
-    const activeProjects = await sdk.forConsole.projects.list({
-        queries: [
-            Query.offset(offset),
-            Query.equal('teamId', params.organization),
-            Query.or([Query.equal('status', 'active'), Query.isNull('status')]),
-            Query.limit(limit),
-            Query.orderDesc('')
-        ],
-        search: search || undefined
-    });
-
-    // Fetch archived projects with separate pagination
-    const archivedProjects = await sdk.forConsole.projects.list({
-        queries: [
-            Query.offset(archivedOffset),
-            Query.equal('teamId', params.organization),
-            Query.equal('status', 'archived'),
-            Query.limit(limit),
-            Query.orderDesc('')
-        ],
-        search: search || undefined
-    });
-
-    // get total counts
-    const activeTotal = await sdk.forConsole.projects.list({
-        queries: [
-            Query.equal('teamId', params.organization),
-            Query.or([Query.equal('status', 'active'), Query.isNull('status')])
-        ],
-        search: search || undefined
-    });
-
-    const archivedTotal = await sdk.forConsole.projects.list({
-        queries: [Query.equal('teamId', params.organization), Query.equal('status', 'archived')],
-        search: search || undefined
-    });
+    const [activeProjects, archivedProjects, activeTotal, archivedTotal] = await Promise.all([
+        sdk.forConsole.projects.list({
+            queries: [
+                Query.offset(offset),
+                Query.equal('teamId', params.organization),
+                Query.or([Query.equal('status', 'active'), Query.isNull('status')]),
+                Query.limit(limit),
+                Query.orderDesc('')
+            ],
+            search: search || undefined
+        }),
+        sdk.forConsole.projects.list({
+            queries: [
+                Query.offset(archivedOffset),
+                Query.equal('teamId', params.organization),
+                Query.equal('status', 'archived'),
+                Query.limit(limit),
+                Query.orderDesc('')
+            ],
+            search: search || undefined
+        }),
+        sdk.forConsole.projects.list({
+            queries: [
+                Query.equal('teamId', params.organization),
+                Query.or([Query.equal('status', 'active'), Query.isNull('status')])
+            ],
+            search: search || undefined
+        }),
+        sdk.forConsole.projects.list({
+            queries: [
+                Query.equal('teamId', params.organization),
+                Query.equal('status', 'archived')
+            ],
+            search: search || undefined
+        })
+    ]);
 
     // set `default` if no region!
     for (const project of activeProjects.projects) {