fix(keychain): float→BigInt crash in token send + HMR provider exports

packages/keychain/.storybook/mock.tsx

@@ -10,7 +10,7 @@
   UpgradeContext,
   UpgradeInterface,
   UpgradeProviderProps,
-} from "../src/components/provider/upgrade";
+} from "../src/components/provider/upgrade-context";
 import { ConnectCtx, ConnectionCtx } from "../src/utils/connection/types";
 import { SemVer } from "semver";
 
@@ -24,7 +24,7 @@
   policies?: SessionPolicies;
 }
 
 export function useMockedConnection(
   parameters: StoryParameters = {},
 ): ConnectionContextValue {
   const {

packages/keychain/eslint.config.js

@@ -2,4 +2,13 @@ import config from "@cartridge/eslint";
 export default [
   ...config,
   { ignores: ["public/**", "src/utils/api/generated.ts"] },
+  {
+    files: ["**/*.{ts,tsx}"],
+    rules: {
+      "react-refresh/only-export-components": [
+        "warn",
+        { allowConstantExport: true },
+      ],
+    },
+  },
 ];

packages/keychain/src/components/app.tsx

@@ -52,7 +52,7 @@ import { DeployController } from "./DeployController";
 import { useConnection } from "@/hooks/connection";
 import { CreateController, Upgrade } from "./connect";
 import { HeadlessApprovalRoute } from "./connect/HeadlessApprovalRoute";
-import { useUpgrade } from "./provider/upgrade";
+import { useUpgrade } from "./provider/use-upgrade";
 import { Layout } from "@/components/layout";
 import { Disconnect } from "./disconnect";
 import { OnchainCheckout } from "./purchase/checkout/onchain";

packages/keychain/src/components/connect/Upgrade.tsx

@@ -1,7 +1,7 @@
 import { LayoutContent, BoltIcon, CircleIcon } from "@cartridge/controller-ui";
 import { ExecutionContainer } from "@/components/ExecutionContainer";
 import { useConnection } from "@/hooks/connection";
-import { useUpgrade } from "../provider/upgrade";
+import { useUpgrade } from "../provider/use-upgrade";
 
 export const Upgrade = () => {
   const { controller } = useConnection();

packages/keychain/src/components/connect/buttons/auth-button.tsx

@@ -1,4 +1,4 @@
-import { useWallets } from "@/hooks/wallets";
+import { useWallets } from "@/hooks/use-wallets";
 import { AUTH_METHODS_LABELS } from "@/utils/connection/constants";
 import { allUseSameAuth } from "@/utils/controller";
 import { AuthOption } from "@cartridge/controller";

packages/keychain/src/components/connect/buttons/change-wallet.tsx

@@ -1,5 +1,5 @@
 import { ErrorAlert } from "@/components/ErrorAlert";
-import { useWallets } from "@/hooks/wallets";
+import { useWallets } from "@/hooks/use-wallets";
 import { AUTH_METHODS_LABELS } from "@/utils/connection/constants";
 import { AuthOption } from "@cartridge/controller";
 import { formatAddress } from "@cartridge/controller-ui/utils";

packages/keychain/src/components/connect/create/ChooseSignupMethodForm.tsx

@@ -15,10 +15,10 @@
 import { SignupButton } from "../buttons/signup-button";
 import { credentialToAuth } from "../types";
 import { useUsernameValidation } from "./useUsernameValidation";
-import { useWallets } from "@/hooks/wallets";
+import { useWallets } from "@/hooks/use-wallets";
 
 export const INITIAL_OPTIONS: AuthOption[] = ["sms", "webauthn"];
 export const WALLET_OPTIONS: AuthOption[] = [
   ...EXTERNAL_WALLETS,
   "walletconnect",
 ];

packages/keychain/src/components/connect/create/CreateController.test.tsx

@@ -58,7 +58,7 @@ vi.mock("@/hooks/connection", () => ({
   useControllerTheme: () => mockUseControllerTheme(),
 }));
 
-vi.mock("@/hooks/wallets", () => ({
+vi.mock("@/hooks/use-wallets", () => ({
   useWallets: () => mockUseWallets(),
 }));
 

packages/keychain/src/components/connect/create/external-wallet/index.ts

@@ -1,5 +1,5 @@
 import { useConnection } from "@/hooks/connection";
-import { useWallets } from "@/hooks/wallets";
+import { useWallets } from "@/hooks/use-wallets";
 import {
   AuthOption,
   ExternalWalletResponse,

packages/keychain/src/components/connect/create/useCreateController.ts

@@ -1,8 +1,8 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { STABLE_CONTROLLER } from "@/components/provider/upgrade";
+import { STABLE_CONTROLLER } from "@/components/provider/upgrade-context";
 import { DEFAULT_SESSION_DURATION, now } from "@/constants";
 import { useConnection } from "@/hooks/connection";
-import { useWallets } from "@/hooks/wallets";
+import { useWallets } from "@/hooks/use-wallets";
 import Controller from "@/utils/controller";
 import { TurnkeyWallet } from "@/wallets/social/turnkey";
 import {

packages/keychain/src/components/inventory/token/send/amount.tsx

@@ -8,12 +8,14 @@ export function SendAmount({
   amount,
   submitted,
   setAmount,
+  setAmountInput,
   setError,
 }: {
   token: Token;
   amount: number | undefined;
   submitted: boolean;
   setAmount: (amount: number | undefined) => void;
+  setAmountInput: (amount: string | undefined) => void;
   setError: (error: Error | undefined) => void;
 }) {
   const conversion = useMemo(() => {
@@ -28,17 +30,20 @@ export function SendAmount({
     (e: React.MouseEvent<HTMLDivElement | HTMLButtonElement>) => {
       e.preventDefault();
       if (!token) return;
-      setAmount(parseFloat(token.balance.amount.toString()));
+      const max = token.balance.amount.toString();
+      setAmount(parseFloat(max));
+      setAmountInput(max);
     },
-    [token, setAmount],
+    [token, setAmount, setAmountInput],
   );
 
   const handleChange = useCallback(
     (e: React.ChangeEvent<HTMLInputElement>) => {
       const value = e.target.value;
       setAmount(value === "" ? undefined : Number(value));
+      setAmountInput(value === "" ? undefined : value);
     },
-    [setAmount],
+    [setAmount, setAmountInput],
   );
 
   if (!token) {

packages/keychain/src/components/inventory/token/send/send-drawer.tsx

@@ -15,6 +15,7 @@ import { Link, useSearchParams } from "react-router-dom";
 import { SendRecipient } from "@/components/modules/recipient";
 import { SendAmount } from "./amount";
 import { Disclosure } from "@cartridge/controller-ui";
+import { parseTokenAmount } from "@/utils/token-amount";
 
 export function SendTokenDrawer({
   disclosure,
@@ -35,6 +36,7 @@ export function SendTokenDrawer({
 
   const [to, setTo] = useState("");
   const [amount, setAmount] = useState<number | undefined>();
+  const [amountInput, setAmountInput] = useState<string | undefined>();
   const [amountError, setAmountError] = useState<Error | undefined>();
   const [toError, setToError] = useState<Error | undefined>();
   const [selectedToken, setSelectedToken] = useState<Token | undefined>(token);
@@ -52,13 +54,18 @@ export function SendTokenDrawer({
     ) {
       return "";
     } else {
+      const baseUnitAmount = parseTokenAmount(
+        amountInput,
+        selectedToken.metadata.decimals,
+      );
+      if (baseUnitAmount === undefined) {
+        return "";
+      }
+
       const sendParams = new URLSearchParams(searchParams);
       sendParams.set("tokenAddress", tokenAddress);
       sendParams.set("recipient", to);
-      sendParams.set(
-        "amount",
-        BigInt(amount * 10 ** selectedToken.metadata.decimals).toString(),
-      );
+      sendParams.set("amount", baseUnitAmount.toString());
       return `send?${sendParams.toString()}`;
     }
   }, [
@@ -68,6 +75,7 @@ export function SendTokenDrawer({
     toError,
     recipientLoading,
     amount,
+    amountInput,
     to,
     searchParams,
     tokenAddress,
@@ -88,9 +96,10 @@ export function SendTokenDrawer({
     (token: Token) => {
       setSelectedToken(token);
       setAmount(undefined);
+      setAmountInput(undefined);
       userSelectedToken.current = true;
     },
-    [setSelectedToken, setAmount],
+    [setSelectedToken, setAmount, setAmountInput],
   );
 
   if (!token) {
@@ -133,6 +142,7 @@ export function SendTokenDrawer({
             amount={amount}
             submitted={false}
             setAmount={setAmount}
+            setAmountInput={setAmountInput}
             setError={setAmountError}
           />
         )}

packages/keychain/src/components/provider/upgrade-context.ts

@@ -0,0 +1,128 @@
+import { createContext, ReactNode } from "react";
+import { addAddressPadding, Call } from "starknet";
+import type { Chain } from "@cartridge/controller";
+import { ControllerError } from "@/utils/connection";
+import Controller from "@/utils/controller";
+
+export enum OutsideExecutionVersion {
+  V2,
+  V3,
+}
+
+export type ControllerVersionInfo = {
+  version: string;
+  hash: string;
+  outsideExecutionVersion: OutsideExecutionVersion;
+  changes: string[];
+};
+
+export const CONTROLLER_VERSIONS: ControllerVersionInfo[] = [
+  {
+    version: "1.0.4",
+    hash: "0x24a9edbfa7082accfceabf6a92d7160086f346d622f28741bf1c651c412c9ab",
+    outsideExecutionVersion: OutsideExecutionVersion.V2,
+    changes: [],
+  },
+  {
+    version: "1.0.5",
+    hash: "0x32e17891b6cc89e0c3595a3df7cee760b5993744dc8dfef2bd4d443e65c0f40",
+    outsideExecutionVersion: OutsideExecutionVersion.V2,
+    changes: ["Improved session token implementation"],
+  },
+  {
+    version: "1.0.6",
+    hash: "0x59e4405accdf565112fe5bf9058b51ab0b0e63665d280b816f9fe4119554b77",
+    outsideExecutionVersion: OutsideExecutionVersion.V3,
+    changes: [
+      "Support session key message signing",
+      "Support session guardians",
+      "Improve paymaster nonce management",
+    ],
+  },
+  {
+    version: "1.0.7",
+    hash: "0x3e0a04bab386eaa51a41abe93d8035dccc96bd9d216d44201266fe0b8ea1115",
+    outsideExecutionVersion: OutsideExecutionVersion.V3,
+    changes: ["Unified message signature verification"],
+  },
+  {
+    version: "1.0.8",
+    hash: "0x511dd75da368f5311134dee2356356ac4da1538d2ad18aa66d57c47e3757d59",
+    outsideExecutionVersion: OutsideExecutionVersion.V3,
+    changes: ["Improved session message signature"],
+  },
+  {
+    version: "1.0.9",
+    hash: "0x743c83c41ce99ad470aa308823f417b2141e02e04571f5c0004e743556e7faf",
+    outsideExecutionVersion: OutsideExecutionVersion.V3,
+    changes: ["Wildcard session support"],
+  },
+];
+
+export const STABLE_CONTROLLER = CONTROLLER_VERSIONS[5];
+export const BETA_CONTROLLER = CONTROLLER_VERSIONS[5];
+
+export const findVersion = (
+  classHash: string,
+): ControllerVersionInfo | undefined =>
+  CONTROLLER_VERSIONS.find(
+    (v) => addAddressPadding(v.hash) === addAddressPadding(classHash),
+  );
+
+/**
+ * Determines if an upgrade is available and returns the appropriate controller version
+ * @param currentVersion The current controller version
+ * @param isBeta Whether beta features are enabled
+ * @returns An object containing whether an upgrade is available and the target controller version
+ */
+export function determineUpgradePath(
+  currentVersion: ControllerVersionInfo | undefined,
+  isBeta: boolean,
+): { available: boolean; targetVersion: ControllerVersionInfo } {
+  const targetVersion = isBeta ? BETA_CONTROLLER : STABLE_CONTROLLER;
+
+  if (!currentVersion) {
+    return { available: false, targetVersion };
+  }
+
+  // Find the indices of the current and target versions in the CONTROLLER_VERSIONS array
+  const currentIndex = CONTROLLER_VERSIONS.findIndex(
+    (v) => v === currentVersion,
+  );
+  const targetIndex = CONTROLLER_VERSIONS.findIndex((v) => v === targetVersion);
+
+  // Only set available to true if the target controller is newer than the current one
+  const available = currentIndex !== -1 && targetIndex > currentIndex;
+
+  return { available, targetVersion };
+}
+
+export interface UpgradeInterface {
+  available: boolean;
+  current?: ControllerVersionInfo;
+  latest: ControllerVersionInfo;
+  calls: Call[];
+  isSynced: boolean;
+  isUpgrading: boolean;
+  error?: ControllerError;
+  onUpgrade: () => Promise<void>;
+  isBeta: boolean;
+}
+
+export const UpgradeContext = createContext<UpgradeInterface | undefined>(
+  undefined,
+);
+
+export interface UpgradeProviderProps {
+  controller?: Controller;
+  /** Chains the dapp explicitly configured (see
+   *  `ConnectionContextValue.configuredChains`). The account's class is checked on
+   *  each of them - not just the controller's active chain - so an upgrade is offered
+   *  for e.g. an appchain still on a pre-wildcard class while the account is already
+   *  up to date on the settlement chain. */
+  chains?: Chain[];
+  children: ReactNode;
+}
+
+/** A chain whose account is behind the target version. */
+export type OutdatedChain = { rpcUrl: string; version: ControllerVersionInfo };

packages/keychain/src/components/provider/upgrade.test.tsx

@@ -8,10 +8,10 @@ import {
   ControllerVersionInfo,
   OutsideExecutionVersion,
   STABLE_CONTROLLER,
-  UpgradeProvider,
   determineUpgradePath,
-  useUpgrade,
-} from "./upgrade";
+} from "./upgrade-context";
+import { UpgradeProvider } from "./upgrade";
+import { useUpgrade } from "./use-upgrade";
 import { ReactNode } from "react";
 import { PostHogContext, PostHogWrapper } from "@cartridge/controller-ui/utils";
 import Controller from "@/utils/controller";