chore: control panel visual

Author: coodos

infrastructure/control-panel/src/lib/ui/Table/Table.svelte

@@ -69,6 +69,7 @@
 		sortOrder?: 'asc' | 'desc';
 		onSelectionChange?: (index: number, checked: boolean) => void;
 		onSelectAllChange?: (checked: boolean) => void;
+		selectedIndices?: number[]; // Array of selected row indices
 	}
 
 	let {
@@ -92,6 +93,7 @@
 		sortOrder,
 		onSelectionChange,
 		onSelectAllChange,
+		selectedIndices = [],
 		...restProps
 	}: ITableProps = $props();
 
@@ -100,6 +102,25 @@
 	let checkAll = $state(false);
 	let checkItems = $derived<boolean[]>(tableData.map(() => false));
 
+	// Sync checkbox states with selectedIndices prop
+	$effect(() => {
+		if (selectedIndices && selectedIndices.length > 0) {
+			// Update individual checkboxes based on selectedIndices
+			checkItems.forEach((_, index) => {
+				checkItems[index] = selectedIndices.includes(index);
+			});
+
+			// Update header checkbox state
+			checkAll = selectedIndices.length === tableData.length;
+		} else {
+			// Clear all selections
+			checkItems.forEach((_, index) => {
+				checkItems[index] = false;
+			});
+			checkAll = false;
+		}
+	});
+
 	function toggleCheckAll(checked: boolean) {
 		checkAll = checked;
 

infrastructure/control-panel/src/routes/+page.svelte

@@ -262,6 +262,7 @@
 				handleSelectedRow={handleEVaultRowClick}
 				onSelectionChange={handleEVaultSelectionChange}
 				onSelectAllChange={handleSelectAllEVaults}
+				selectedIndices={selectedEVaults}
 			/>
 		{/if}
 	</TableCard>
@@ -304,6 +305,7 @@
 				{handleNextPage}
 				onSelectionChange={handlePlatformSelectionChange}
 				onSelectAllChange={handleSelectAllPlatforms}
+				selectedIndices={selectedPlatforms}
 			/>
 		{/if}
 	</TableCard>