From 0e6a9565116cbe2be896c0e0f739850ca186d90a Mon Sep 17 00:00:00 2001
From: Samuel Andert <samuel@ora.earth>
Date: Mon, 24 Jul 2023 16:41:00 +0200
Subject: [PATCH] Optimize component state mapping and reduce unnecessary
 updates

---
 src/lib/components/Composite.svelte | 18 ++++++------------
 src/routes/+page.svelte             | 17 ++---------------
 2 files changed, 8 insertions(+), 27 deletions(-)

diff --git a/src/lib/components/Composite.svelte b/src/lib/components/Composite.svelte
index 2e6a442..b2a6f03 100644
--- a/src/lib/components/Composite.svelte
+++ b/src/lib/components/Composite.svelte
@@ -27,11 +27,6 @@
 		if (component.map) {
 			const localStore = getComponentStore(component.id);
 
-			// Use the subscribe method to log and work with the store's value
-			localStore.subscribe((localStoreValue) => {
-				console.log('Local store before mapping:', localStoreValue);
-			});
-
 			for (const [localKey, external] of Object.entries(component.map)) {
 				const [externalID, externalKey] = external.split('.').map((item) => item.trim());
 				const externalStore = getComponentStore(externalID);
@@ -41,18 +36,17 @@
 						if (externalState && externalKey in externalState) {
 							localStore.update((storeValue) => {
 								storeValue = storeValue || {};
-								storeValue[localKey] = externalState[externalKey];
-								return storeValue;
+								if (storeValue[localKey] !== externalState[externalKey]) {
+									// Only update if there's a change
+									storeValue[localKey] = externalState[externalKey];
+									return storeValue;
+								}
+								return storeValue; // Return existing state if no change
 							});
 						}
 					});
 				}
 			}
-
-			// Use the subscribe method again if you want to log after mapping
-			localStore.subscribe((localStoreValue) => {
-				console.log('Local store after mapping:', localStoreValue);
-			});
 		}
 
 		if (component.children) {
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 7ccb60f..51bef6e 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -5,14 +5,13 @@
 		layout: `
 			grid-template-areas: 
 				"login",
-				"main"
-				"footer";
-			grid-template-rows: 1fr 1fr auto;
+			grid-template-rows: 1fr;
 		`,
 		children: [
 			{
 				id: 'login1',
 				componentName: 'Login',
+				slot: 'Login',
 				children: [
 					{
 						id: 'wallet1',
@@ -31,18 +30,6 @@
 						]
 					}
 				]
-			},
-			{
-				id: 2,
-				componentName: 'Messages',
-				props: {},
-				slot: 'main'
-			},
-			{
-				id: 3,
-				componentName: 'Terminal',
-				props: {},
-				slot: 'footer'
 			}
 		]
 	};