From ab026909e6a6de0c60036d0d4509e34b15229fb4 Mon Sep 17 00:00:00 2001
From: Merul Dhiman <me@merul.org>
Date: Sun, 24 Aug 2025 01:33:03 +0530
Subject: [PATCH] fix: control panel selection

---
 .../src/lib/ui/Table/Table.svelte             | 22 +++++++++++++++++--
 .../control-panel/src/routes/+page.svelte     | 12 ++++++++++
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/infrastructure/control-panel/src/lib/ui/Table/Table.svelte b/infrastructure/control-panel/src/lib/ui/Table/Table.svelte
index 6d2edfb3..c48b92a3 100644
--- a/infrastructure/control-panel/src/lib/ui/Table/Table.svelte
+++ b/infrastructure/control-panel/src/lib/ui/Table/Table.svelte
@@ -100,25 +100,43 @@
 	selectedRow = undefined;
 
 	let checkAll = $state(false);
-	let checkItems = $derived<boolean[]>(tableData.map(() => false));
+	let checkItems = $state<boolean[]>(tableData.map(() => false));
+
+	// Update checkItems when tableData changes
+	$effect(() => {
+		checkItems = tableData.map(() => false);
+	});
 
 	// Sync checkbox states with selectedIndices prop
 	$effect(() => {
+		console.log('🔄 Table sync effect triggered');
+		console.log('selectedIndices:', selectedIndices);
+		console.log('tableData.length:', tableData.length);
+		console.log('Current checkItems:', checkItems);
+
 		if (selectedIndices && selectedIndices.length > 0) {
+			console.log('📝 Updating checkboxes for selected indices');
 			// Update individual checkboxes based on selectedIndices
 			checkItems.forEach((_, index) => {
-				checkItems[index] = selectedIndices.includes(index);
+				const shouldBeChecked = selectedIndices.includes(index);
+				checkItems[index] = shouldBeChecked;
+				console.log(`Checkbox ${index}: ${shouldBeChecked ? '✅' : '❌'}`);
 			});
 
 			// Update header checkbox state
 			checkAll = selectedIndices.length === tableData.length;
+			console.log('Header checkbox (checkAll):', checkAll);
 		} else {
+			console.log('🧹 Clearing all selections');
 			// Clear all selections
 			checkItems.forEach((_, index) => {
 				checkItems[index] = false;
 			});
 			checkAll = false;
 		}
+
+		console.log('Final checkItems:', checkItems);
+		console.log('Final checkAll:', checkAll);
 	});
 
 	function toggleCheckAll(checked: boolean) {
diff --git a/infrastructure/control-panel/src/routes/+page.svelte b/infrastructure/control-panel/src/routes/+page.svelte
index 19fd0cf4..67b56d45 100644
--- a/infrastructure/control-panel/src/routes/+page.svelte
+++ b/infrastructure/control-panel/src/routes/+page.svelte
@@ -90,32 +90,44 @@
 
 	// Handle select all eVaults
 	function handleSelectAllEVaults(checked: boolean) {
+		console.log('🎯 handleSelectAllEVaults called with:', checked);
+		console.log('evaults.length:', evaults.length);
+
 		if (checked) {
 			// Select all eVaults
 			selectedEVaults = Array.from({ length: evaults.length }, (_, i) => i);
+			console.log('✅ Selected all eVaults, selectedEVaults:', selectedEVaults);
 		} else {
 			// Deselect all eVaults
 			selectedEVaults = [];
+			console.log('❌ Deselected all eVaults, selectedEVaults:', selectedEVaults);
 		}
 
 		// Store selections immediately in sessionStorage
 		const selectedEVaultData = selectedEVaults.map((i) => evaults[i]);
 		sessionStorage.setItem('selectedEVaults', JSON.stringify(selectedEVaultData));
+		console.log('💾 Stored in sessionStorage:', selectedEVaultData);
 	}
 
 	// Handle select all platforms
 	function handleSelectAllPlatforms(checked: boolean) {
+		console.log('🎯 handleSelectAllPlatforms called with:', checked);
+		console.log('platforms.length:', platforms.length);
+
 		if (checked) {
 			// Select all platforms
 			selectedPlatforms = Array.from({ length: platforms.length }, (_, i) => i);
+			console.log('✅ Selected all platforms, selectedPlatforms:', selectedPlatforms);
 		} else {
 			// Deselect all platforms
 			selectedPlatforms = [];
+			console.log('❌ Deselected all platforms, selectedPlatforms:', selectedPlatforms);
 		}
 
 		// Store selections immediately in sessionStorage
 		const selectedPlatformData = selectedPlatforms.map((i) => platforms[i]);
 		sessionStorage.setItem('selectedPlatforms', JSON.stringify(selectedPlatformData));
+		console.log('💾 Stored in sessionStorage:', selectedPlatformData);
 	}
 
 	// Clear eVault selection