use shouldUpdateSessionKey in login flow (#6348)

Author: joaquim-verges

apps/login/src/api/login/config.ts

@@ -13,9 +13,8 @@ export async function getLoginConfig(clientId: string): Promise<LoginConfig> {
       ...DEFAULT_CONFIG,
       id: "mode_earn_app",
       name: "Mode Earn App",
-      logo: "https://www.modemobile.com/",
-      logoLink:
-        "https://cdn.prod.website-files.com/61c25b8fda22538c7d02b8ae/64109452b73a8648ed02afee_mode-logo.svg",
+      logo: "https://cdn.prod.website-files.com/61c25b8fda22538c7d02b8ae/64109452b73a8648ed02afee_mode-logo.svg",
+      logoLink: "https://www.modemobile.com/",
       chainId: polygonAmoy.id,
       sessionKeySignerAddress: "0xb89e32a18350d6df5bf0b89a227E098013C4Fa72",
     };

apps/login/src/components/login-form.tsx

@@ -6,15 +6,17 @@ import { toast } from "sonner";
 import { getContract, sendAndConfirmTransaction } from "thirdweb";
 import type { Chain, ThirdwebClient } from "thirdweb";
 import { defineChain } from "thirdweb/chains";
-import { addSessionKey, isActiveSigner } from "thirdweb/extensions/erc4337";
+import {
+  addSessionKey,
+  shouldUpdateSessionKey,
+} from "thirdweb/extensions/erc4337";
 import {
   ConnectButton,
   ConnectEmbed,
   useActiveAccount,
   useActiveWallet,
   useSiweAuth,
 } from "thirdweb/react";
-import { isContractDeployed } from "thirdweb/utils";
 import { type Account, inAppWallet } from "thirdweb/wallets";
 import { createCode } from "../actions/create-code";
 import {
@@ -163,39 +165,37 @@ async function ensureSessionKey(options: {
     client: options.client,
   });
 
+  const newPermissions = {
+    approvedTargets:
+      typeof options.permissions["contracts:write"] === "boolean"
+        ? ("*" as const)
+        : options.permissions["contracts:write"],
+    permissionEndTimestamp: options.permissions.expiration,
+    nativeTokenLimitPerTransaction: options.permissions["native:spend"],
+  };
+
+  const needsUpdate = await shouldUpdateSessionKey({
+    accountContract,
+    sessionKeyAddress: options.sessionKeySignerAddress,
+    newPermissions,
+  });
+
   // check if already added
-  const accountDeployed = await isContractDeployed(accountContract);
-  if (accountDeployed) {
-    if (
-      await isActiveSigner({
-        contract: accountContract,
-        signer: options.sessionKeySignerAddress,
-      })
-    ) {
-      return {
-        success: true,
-        message: "Session key already added",
-        transaction: null,
-      };
-    }
+  if (!needsUpdate) {
+    return {
+      success: true,
+      message: "Session key already added",
+      transaction: null,
+    };
   }
-  // if not added, send tx to add the session key
-
+  // if not added or needs to be updated, send tx to add the session key
   const tx = await sendAndConfirmTransaction({
     account: options.account,
     transaction: addSessionKey({
       account: options.account,
       contract: accountContract,
       sessionKeyAddress: options.sessionKeySignerAddress,
-      // hard coded for now
-      permissions: {
-        approvedTargets:
-          typeof options.permissions["contracts:write"] === "boolean"
-            ? "*"
-            : options.permissions["contracts:write"],
-        permissionEndTimestamp: options.permissions.expiration,
-        nativeTokenLimitPerTransaction: options.permissions["native:spend"],
-      },
+      permissions: newPermissions,
     }),
   });