diff --git a/packages/keychain/src/components/connect/CreateController.tsx b/packages/keychain/src/components/connect/CreateController.tsx index 9441bb968..6e38caf8f 100644 --- a/packages/keychain/src/components/connect/CreateController.tsx +++ b/packages/keychain/src/components/connect/CreateController.tsx @@ -2,13 +2,11 @@ import { useState } from "react"; import { Signup } from "./Signup"; import { Login } from "./Login"; import { useConnection } from "hooks/connection"; -import { ConnectCtx } from "utils/connection"; export function CreateController({ isSlot }: { isSlot?: boolean }) { - const { chainId, rpcUrl, context, setController, error } = useConnection(); + const { error } = useConnection(); const [showSignup, setShowSignup] = useState(false); const [prefilledUsername, setPrefilledUsername] = useState(); - const ctx = context as ConnectCtx; if (error) { return <>{error.message}; @@ -16,30 +14,20 @@ export function CreateController({ isSlot }: { isSlot?: boolean }) { return showSignup ? ( { setPrefilledUsername(username); setShowSignup(false); }} - onSuccess={setController} isSlot={isSlot} /> ) : ( { setPrefilledUsername(username); setShowSignup(true); }} - onSuccess={setController} isSlot={isSlot} /> ); diff --git a/packages/keychain/src/components/connect/Login.tsx b/packages/keychain/src/components/connect/Login.tsx index 74d8e8210..9c5c84edc 100644 --- a/packages/keychain/src/components/connect/Login.tsx +++ b/packages/keychain/src/components/connect/Login.tsx @@ -16,17 +16,15 @@ import { RegistrationLink } from "./RegistrationLink"; import { useControllerTheme } from "hooks/theme"; import { doLogin } from "hooks/account"; import { Error as ErrorComp } from "components/Error"; +import { useConnection } from "hooks/connection"; export function Login({ - chainId, - rpcUrl, - origin, - policies, prefilledName = "", isSlot, onSuccess, onSignup, }: LoginProps) { + const { origin, policies, chainId, rpcUrl, setController } = useConnection(); const { event: log } = useAnalytics(); const theme = useControllerTheme(); const [isLoading, setIsLoading] = useState(false); @@ -63,7 +61,11 @@ export function Login({ } controller.store(); - onSuccess(controller); + setController(controller); + + if (onSuccess) { + onSuccess(); + } log({ type: "webauthn_login", address }); } catch (e) { @@ -80,7 +82,7 @@ export function Login({ setIsLoading(false); }, - [chainId, rpcUrl, origin, policies, expiresAt, isSlot, log, onSuccess], + [chainId, rpcUrl, origin, policies, expiresAt, isSlot, log], ); return ( diff --git a/packages/keychain/src/components/connect/Signup.tsx b/packages/keychain/src/components/connect/Signup.tsx index 1cd6d01c7..44f43fa23 100644 --- a/packages/keychain/src/components/connect/Signup.tsx +++ b/packages/keychain/src/components/connect/Signup.tsx @@ -25,14 +25,11 @@ import { doSignup } from "hooks/account"; import { useControllerTheme } from "hooks/theme"; import { Error as ErrorComp } from "components/Error"; import { shortString } from "starknet"; +import { useConnection } from "hooks/connection"; export function Signup({ prefilledName = "", - origin, - policies, isSlot, - chainId, - rpcUrl, onSuccess, onLogin, }: SignupProps) { @@ -78,15 +75,11 @@ export function Signup({ validateOnBlur={false} >
@@ -97,10 +90,6 @@ export function Signup({ } function Form({ - origin, - policies, - chainId, - rpcUrl, isRegistering, isLoading, isSlot, @@ -114,6 +103,7 @@ function Form({ setIsRegistering: (val: boolean) => void; error: Error; }) { + const { origin, policies, chainId, rpcUrl, setController } = useConnection(); const theme = useControllerTheme(); const { values, isValidating } = useFormikContext(); @@ -160,7 +150,11 @@ function Form({ controller.store(); await controller.account.sync(); - onSuccess(controller); + setController(controller); + + if (onSuccess) { + onSuccess(); + } }, }, ); diff --git a/packages/keychain/src/components/connect/types.ts b/packages/keychain/src/components/connect/types.ts index c4cea6910..28c0c154a 100644 --- a/packages/keychain/src/components/connect/types.ts +++ b/packages/keychain/src/components/connect/types.ts @@ -1,6 +1,3 @@ -import Controller from "utils/controller"; -import { Policy } from "@cartridge/controller"; - export type FormValues = { username: string; }; @@ -9,12 +6,8 @@ export type AuthProps = SignupProps | LoginProps; type AuthBaseProps = { prefilledName?: string; - origin?: string; - policies?: Policy[]; isSlot?: boolean; - chainId: string; - rpcUrl: string; - onSuccess: (controller: Controller) => void; + onSuccess?: () => void; }; export type SignupProps = AuthBaseProps & { diff --git a/packages/keychain/src/hooks/connection.tsx b/packages/keychain/src/hooks/connection.tsx index c63c6a7a5..741c58e78 100644 --- a/packages/keychain/src/hooks/connection.tsx +++ b/packages/keychain/src/hooks/connection.tsx @@ -41,19 +41,23 @@ export function ConnectionProvider({ children }: PropsWithChildren) { const parsePolicies = (policiesStr: string | null): Policy[] => { if (!policiesStr) return []; return JSON.parse(policiesStr); - } + }; useEffect(() => { if (!isIframe()) { const urlParams = new URLSearchParams(window.location.search); setOrigin(urlParams.get("origin") || process.env.NEXT_PUBLIC_ORIGIN); - setRpcUrl(urlParams.get("rpc_url") || process.env.NEXT_PUBLIC_RPC_SEPOLIA); + setRpcUrl( + urlParams.get("rpc_url") || process.env.NEXT_PUBLIC_RPC_SEPOLIA, + ); setPolicies(parsePolicies(urlParams.get("policies"))); return; } const connection = connectToController({ + setOrigin, setRpcUrl, + setPolicies, setContext, setController, }); diff --git a/packages/keychain/src/pages/login.tsx b/packages/keychain/src/pages/login.tsx index 0d6d43df0..61e4e91cd 100644 --- a/packages/keychain/src/pages/login.tsx +++ b/packages/keychain/src/pages/login.tsx @@ -21,8 +21,6 @@ const Login: NextPage = () => { return ( router.push({ pathname: "/signup", query: router.query })} onSuccess={async () => { router.replace(`${process.env.NEXT_PUBLIC_ADMIN_URL}/profile`); diff --git a/packages/keychain/src/pages/signup.tsx b/packages/keychain/src/pages/signup.tsx index fc79b2a9e..83bf33e22 100644 --- a/packages/keychain/src/pages/signup.tsx +++ b/packages/keychain/src/pages/signup.tsx @@ -20,8 +20,6 @@ export default function Signup() { return ( router.push({ pathname: "/login", query: router.query })} onSuccess={() => { router.replace(`${process.env.NEXT_PUBLIC_ADMIN_URL}/profile`); diff --git a/packages/keychain/src/utils/connection/connect.ts b/packages/keychain/src/utils/connection/connect.ts index c64632b24..0b0afb6b7 100644 --- a/packages/keychain/src/utils/connection/connect.ts +++ b/packages/keychain/src/utils/connection/connect.ts @@ -3,15 +3,21 @@ import { ConnectCtx, ConnectionCtx } from "./types"; import Controller from "utils/controller"; export function connectFactory({ + setOrigin, setRpcUrl, + setPolicies, setContext, }: { + setOrigin: (origin: string) => void; setRpcUrl: (url: string) => void; + setPolicies: (policies: Policy[]) => void; setContext: (context: ConnectionCtx) => void; }) { return (origin: string) => (policies: Policy[], rpcUrl: string): Promise => { + setOrigin(origin); setRpcUrl(rpcUrl); + setPolicies(policies); return new Promise((resolve, reject) => { setContext({ diff --git a/packages/keychain/src/utils/connection/index.ts b/packages/keychain/src/utils/connection/index.ts index 251a3788c..36b5f15c7 100644 --- a/packages/keychain/src/utils/connection/index.ts +++ b/packages/keychain/src/utils/connection/index.ts @@ -1,6 +1,6 @@ export * from "./types"; -import { ConnectError, ResponseCodes } from "@cartridge/controller"; +import { ConnectError, Policy, ResponseCodes } from "@cartridge/controller"; import { connectToParent } from "@cartridge/penpal"; import { normalize as normalizeOrigin } from "utils/url"; import Controller from "utils/controller"; @@ -15,17 +15,23 @@ import { username } from "./username"; import { ConnectionCtx } from "./types"; export function connectToController({ + setOrigin, setRpcUrl, + setPolicies, setContext, setController, }: { + setOrigin: (origin: string) => void; setRpcUrl: (url: string) => void; + setPolicies: (policies: Policy[]) => void; setContext: (ctx: ConnectionCtx) => void; setController: (controller: Controller) => void; }) { return connectToParent({ methods: { - connect: normalize(connectFactory({ setRpcUrl, setContext })), + connect: normalize( + connectFactory({ setOrigin, setRpcUrl, setPolicies, setContext }), + ), disconnect: normalize(validate(disconnectFactory(setController))), execute: normalize(validate(executeFactory({ setContext }))), estimateDeclareFee: normalize(validate(estimateDeclareFee)),