feat(wallet): Refactor wallet service for enhanced modularity and clarity

- Abstracted RPC interface to allow dynamic input for connection flexibility.
- Added `signSession` function to retrieve `authSig` efficiently.
- Improved logging and error handling to provide clearer feedback.
- Centralized `authSig` retrieval for better code maintainability.

This refactor ensures the wallet service is more adaptable to varying use cases and improves overall code readability.
This commit is contained in:
Samuel Andert 2023-07-24 12:54:59 +02:00
parent cf1a83006e
commit 5b7c49fd58
4 changed files with 129 additions and 18 deletions

View File

@ -1,21 +1,22 @@
<script>
import AuthSig from '$lib/components/AuthSig.svelte';
import Wallet from '$lib/Wallet.svelte';
import Send from '$lib/Send.svelte';
import WalletConnect from '$lib/WalletConnect.svelte';
import Balance from '$lib/components/Balance.svelte';
import { onMount } from 'svelte';
import { connectWallet } from '$lib/services/wallet/wallet';
let pkpWallet;
let authSig;
let pkpPubKey =
let pkpWallet = null;
const pkpPubKey =
'046da3ba67065fd1e2726242ca01cd4601524893f4aa4b0042578fa6cbec28fa8c9a28eb9f7893932fc09717edc9e1db57e157a21eed346247c1db5a722a01f571';
// Specify your RPC URL here
const rpcURL = 'https://rpc.gnosischain.com/';
onMount(async () => {
pkpWallet = await connectWallet(pkpPubKey, rpcURL);
});
</script>
<AuthSig />
<div class="flex flex-col items-center justify-center p-4 bg-gray-200">
<Wallet bind:pkpWallet bind:authSig />
<Send bind:pkpWallet />
<Balance />
<WalletConnect bind:pkpWallet bind:authSig bind:pkpPubKey />
</div>
{#if pkpWallet}
<div class="mb-4 text-lg font-medium">
PKP Wallet: <span class="text-blue-600">{pkpWallet.address}</span>
</div>
{/if}

View File

@ -0,0 +1,36 @@
# `wallet.ts` Service Documentation
The `wallet.ts` service provides utilities for working with the PKPEthersWallet, including connecting and retrieving the authentication signature.
## Dependencies
- `getStoredAuthSig` from `'$lib/services/authWithMetamask/authWithMetamask'`
- `PKPEthersWallet` from `'@lit-protocol/pkp-ethers'`
- `createMessage` from `'$lib/services/messages'`
## Variables
- **isWalletConnected**: A boolean flag that keeps track of whether the wallet is currently connected or not.
## Functions
### `connectWallet(pkpPubKey: string, rpcURL: string = 'https://rpc.gnosischain.com/')`
#### Parameters:
- **pkpPubKey**: The public key used to connect to the wallet.
- **rpcURL** (Optional): The RPC URL for the connection. Defaults to `'https://rpc.gnosischain.com/'`.
#### Returns:
- A promise which resolves to an instance of `PKPEthersWallet` if the wallet is successfully connected. If the wallet is already connected or there's an error in getting the `authSig`, it returns `null`.
#### Description:
This function first checks if the wallet is already connected. If it's not, it attempts to retrieve the `authSig` from local storage. If successful, it connects to the wallet using the provided `pkpPubKey` and `rpcURL`. Once the wallet is successfully connected, it sends a success message and sets the `isWalletConnected` flag to `true`.
### `signSession()`
#### Returns:
- The `authSig` from local storage if it exists, or `null` otherwise.
#### Description:
This function retrieves the `authSig` from local storage and returns it. If the `authSig` does not exist in local storage, an error message is sent, and the function returns `null`.

View File

@ -0,0 +1,68 @@
import { getStoredAuthSig } from '$lib/services/authWithMetamask/authWithMetamask';
import { PKPEthersWallet } from '@lit-protocol/pkp-ethers';
import { createMessage } from '$lib/services/messages';
// Use a variable to keep track of whether the wallet has been connected or not
let isWalletConnected = false;
export async function connectWallet(pkpPubKey: string, rpcURL: string = 'https://rpc.gnosischain.com/'): Promise<PKPEthersWallet | null> {
if (isWalletConnected) {
createMessage({
text: 'Attempted to connect PKPEthersWallet, but it is already connected.',
sender: '$lib/services/wallet/wallet.ts',
type: 'INFO'
});
return null;
}
const authSig = getStoredAuthSig();
if (!authSig) {
createMessage({
text: 'No authSig parsed from local storage.',
sender: '$lib/services/wallet/wallet.ts',
type: 'ERROR'
});
alert('No authSig parsed from local storage');
return null;
}
createMessage({
text: `Connecting PKPEthersWallet with provided pkpPubKey using RPC: ${rpcURL}`,
sender: '$lib/services/wallet/wallet.ts',
type: 'SYSTEM'
});
const pkpWallet = new PKPEthersWallet({
controllerAuthSig: authSig,
pkpPubKey,
rpc: rpcURL
});
await pkpWallet.init();
createMessage({
text: 'PKPEthersWallet connected successfully.',
sender: '$lib/services/wallet/wallet.ts',
type: 'SUCCESS'
});
isWalletConnected = true;
return pkpWallet;
}
// Function to return the authSig
export function signSession(): string | null {
const authSig = getStoredAuthSig();
if (!authSig) {
createMessage({
text: 'No authSig found in local storage.',
sender: '$lib/services/wallet/wallet.ts',
type: 'ERROR'
});
return null;
}
return authSig;
}

View File

@ -7,14 +7,20 @@
"login",
"main"
"footer";
grid-template-rows: 150px 1fr auto;
grid-template-rows: 1fr 1fr auto;
`,
children: [
{
id: 1,
componentName: 'Login',
props: {},
slot: 'login'
slot: 'login',
children: [
{
id: 5,
componentName: 'Wallet'
}
]
},
{
id: 2,