feat(wallet.svelte): integrate pkpWallet into state store

- Initialize pkpWallet with null value inside the component store.
- Update store's pkpWallet upon successful wallet connection.
- Reflect pkpWallet value reactively in the UI.

BREAKING CHANGE: The pkpWallet now resides in the component's store and should be accessed as $store.pkpWallet.

src/lib/components/Wallet/Wallet.svelte

@@ -3,20 +3,17 @@
 	import { connectWallet } from '$lib/services/wallet/wallet';
 	import { getComponentStore } from '$lib/stores/componentStores.ts';
 
-	// please abstract this.
 	export let id;
 	const store = getComponentStore(id);
 
-	export let pkpWallet = null;
-
 	onMount(async () => {
-		pkpWallet = await connectWallet($store.pkpPubKey, $store.rpcURL);
+		$store.pkpWallet = await connectWallet($store.pkpPubKey, $store.rpcURL);
 	});
 </script>
 
 PkpWallet
-{#if pkpWallet}
+{#if $store.pkpWallet}
 	<div class="mb-4 text-lg font-medium">
-		PKP Wallet: <span class="text-blue-600">{pkpWallet.address}</span>
+		PKP Wallet: <span class="text-blue-600">{$store.pkpWallet.address}</span>
 	</div>
 {/if}