- {#if !jwt}
+ {#if acc}
+
+ Address: {utils.shortAddress(acc.address)}
+
+
+
+
+ Passkeys and Google connected:
+
+ {#snippet success(data)}
+ {data}
+ {/snippet}
+
+
+
+ Balance:
+ {#snippet success(data)}
+ {ethers.formatEther(data)} ETH
+ {/snippet}
+
+
+ {#if $balanceQuery.data === 0n}
+ {
+ const tx = await relayer.sendTransaction({
+ to: acc.address,
+ value: ethers.parseEther("0.001"),
+ });
+ await tx.wait();
+ }}
+ >
+ Top up
+
+ {/if}
+
+ Network: {chain.name}
+
+ {#if !jwt}
+ {
+ const cred = await lib.webAuthn.getOrCreateCredential({
+ name: "me",
+ });
+ await lib.eip7702.requestJwt({
+ webAuthnPublicKey: cred.publicKey,
+ });
+ }}
+ >
+ Create passkeys and sign in with Google
+
+ {:else if $codeConnectedQuery.data === false}
+
+ Connect Passkeys and Google
+ {#if $balanceQuery.data === 0n}
+
+ Top up your balance first
+
+ {/if}
+
+ {:else if $credentialIsCorrectQuery.data === false}
+
+ Recover
+
+ {#if extendSessionStart}
+ {@const estimatedDuration = ms("1.5 min")}
+
+ Remaining time: {formatDuration(
+ intervalToDuration({
+ start: now.value,
+ end: extendSessionStart + estimatedDuration,
+ }),
+ )}
+
+
+ {/if}
+ {/if}
+ How it works
+
+ {:else}
+
signIn(signer)}
+ onclick={async () => {
+ const privateKey = generatePrivateKey();
+ accStore.value = {
+ type: "privateKey",
+ privateKey,
+ address: privateKeyToAddress(privateKey),
+ };
+ }}
>
- Sign in with Google
+ Create account
- How it works
+
+
+ {
+ const address = prompt("Enter the address you want to recover");
+ if (address == null) {
+ return;
+ }
+ assert(isAddress(address), `Invalid address: ${address}`);
+ accStore.value = {
+ type: "address",
+ address,
+ };
+ }}
+ >
+ Recover
+
+
- {:else}
-
- {#snippet pending()}
- Loading...
- {/snippet}
- {#snippet success(data)}
- {#if data}
-
-
-
- Address: {utils.shortAddress(data.address)}
-
-
- Network: {publicClient.chain.name}
-
- {#if data.ownerInfo == null}
- No session
- {:else if data.ownerInfo === "expired"}
- Session expired
- {:else}
- Session expiration: in {formatDistance(
- data.ownerInfo.expirationTimestamp * 1000,
- now.value,
- )}
- {/if}
-
-
-
- {data.ownerInfo == null ? "Create" : "Extend"} session
-
- {#if extendSessionStart}
- {@const estimatedDuration = ms("1.5 min")}
- Remaining time: {formatDuration(
- intervalToDuration({
- start: now.value,
- end: extendSessionStart + estimatedDuration,
- }),
- )}
-
- {/if}
-
- {/if}
- {/snippet}
-
{/if}