abstracted subscribe to state in composite

src/routes/+page.svelte

@@ -1,24 +1,22 @@
 <script>
-	import Wallet from '$lib/Wallet.svelte';
-	import HelloEarth from '$lib/components/HelloEarth/HelloEarth.svelte';
 	import Composite from '$lib/core/Composite.svelte';
 
 	let composite = {
 		id: 'composite',
 		layout: {
 			areas: `
-				"top top top"
-				"main main main"
-				"footer footer footer";
+				"top main"
+				"aside main"
+				"footer footer ";
 			`,
-			columns: '1fr 1fr 1fr',
+			columns: '1fr 1fr ',
 			rows: '1fr 1fr auto'
 		},
 		children: [
 			{
-				id: 'wallet',
+				id: 'w',
 				component: 'Wallet',
-				slot: 'top',
+				slot: 'aside',
 				store: {
 					pkpWallet: '',
 					rpcURL: 'https://rpc.gnosischain.com/',
@@ -26,6 +24,15 @@
 						'046da3ba67065fd1e2726242ca01cd4601524893f4aa4b0042578fa6cbec28fa8c9a28eb9f7893932fc09717edc9e1db57e157a21eed346247c1db5a722a01f571'
 				}
 			},
+			{
+				id: 'hello',
+				component: 'HelloEarth',
+				slot: 'top',
+				map: {
+					pkpWallet: 'w.pkpWallet'
+				},
+				services: ['helloEarthAlert']
+			},
 			{
 				id: 'messages',
 				component: 'Messages',