fix(tables): clear row selection when the visible rows change

src/lib/components/multiSelectTable.svelte

@@ -12,6 +12,7 @@
 
 <script lang="ts">
     import type { Snippet } from 'svelte';
+    import { page } from '$app/state';
     import {
         Table,
         Badge,
@@ -64,6 +65,19 @@
     let onDeleteError: string | null = $state(null);
     let showConfirmDeletion: boolean = $state(false);
 
+    // paginating, searching or switching resource swaps the rows out from under the
+    // selection, and deleting what is no longer on screen is silent data loss
+    const selectionKey = $derived(`${page.url.href}|${computeKey}`);
+
+    let renderedUrl: string | undefined;
+
+    $effect.pre(() => {
+        if (renderedUrl === page.url.href) return;
+
+        renderedUrl = page.url.href;
+        selectedRows = [];
+    });
+
     function notifySuccess(count: number) {
         if (!showSuccessNotification) return;
         if (count === 0) return;
@@ -155,7 +169,7 @@
     }
 </script>
 
-{#key computeKey}
+{#key selectionKey}
     <Table.Root let:root {columns} {allowSelection} bind:selectedRows>
         <svelte:fragment slot="header" let:root>
             {@render header?.(root)}

src/routes/(console)/project-[region]-[project]/auth/+page.svelte

@@ -106,7 +106,7 @@
             {/snippet}
 
             {#snippet children(root)}
-                {#each data.users.users as user}
+                {#each data.users.users as user (user.$id)}
                     <Table.Row.Link
                         href={`${base}/project-${page.params.region}-${page.params.project}/auth/user-${user.$id}`}
                         {root}

src/routes/(console)/project-[region]-[project]/auth/user-[user]/memberships/+page.svelte

@@ -71,7 +71,7 @@
             {/snippet}
 
             {#snippet children(root)}
-                {#each data.memberships.memberships as membership}
+                {#each data.memberships.memberships as membership (membership.$id)}
                     <Table.Row.Link
                         {root}
                         href={`${base}/project-${page.params.region}-${page.params.project}/auth/teams/team-${membership.teamId}`}

src/routes/(console)/project-[region]-[project]/databases/database-[database]/backups/table.svelte

@@ -221,7 +221,7 @@
     {/snippet}
 
     {#snippet children(root)}
-        {#each data.backups.archives as backup, index}
+        {#each data.backups.archives as backup, index (backup.$id)}
             {@const policy = getPolicyDetails(backup.policyId)}
             {@const retainedUntil = new Date(
                 new Date(policy?.$createdAt).getTime() + policy?.retention * 24 * 60 * 60 * 1000

src/routes/(console)/project-[region]-[project]/overview/platforms/+page.svelte

@@ -176,7 +176,7 @@
         {/snippet}
 
         {#snippet children(root)}
-            {#each data.platforms.platforms as platform}
+            {#each data.platforms.platforms as platform (platform.$id)}
                 <Table.Row.Link href={getPlatformPath(platform)} {root} id={platform.$id}>
                     <Table.Cell {root}>
                         {platform.name}

src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/+page.svelte

@@ -238,7 +238,7 @@
                 {/snippet}
 
                 {#snippet children(root)}
-                    {#each data.files.files as file}
+                    {#each data.files.files as file (file.$id)}
                         {#if file.chunksTotal / file.chunksUploaded !== 1}
                             <Table.Row.Base {root} id={file.$id}>
                                 <Table.Cell column="filename" {root}>