From 75d59fd5742cb847b684fc9e0baf767bcb2de64e Mon Sep 17 00:00:00 2001 From: Tarrence van As Date: Wed, 18 Dec 2024 16:16:44 -0500 Subject: [PATCH] Revert "Add theme origin mismatch warning (#1183)" This reverts commit e418c137ef98df48a85eb7b428fa04ba95ce184b. --- .../src/components/Provider/connection.tsx | 4 +- .../src/components/layout/Footer/index.tsx | 13 ----- packages/keychain/src/hooks/connection.ts | 54 ++++++------------- packages/keychain/src/hooks/theme.tsx | 12 ++--- 4 files changed, 20 insertions(+), 63 deletions(-) diff --git a/packages/keychain/src/components/Provider/connection.tsx b/packages/keychain/src/components/Provider/connection.tsx index 76466867f..d08c00ed0 100644 --- a/packages/keychain/src/components/Provider/connection.tsx +++ b/packages/keychain/src/components/Provider/connection.tsx @@ -3,8 +3,8 @@ import Controller from "utils/controller"; import { ConnectionCtx } from "utils/connection"; import { Prefund } from "@cartridge/controller"; import { UpgradeInterface } from "hooks/upgrade"; +import { ControllerTheme } from "@cartridge/presets"; import { ParsedSessionPolicies } from "hooks/session"; -import { VerifiableControllerTheme } from "hooks/theme"; export const ConnectionContext = createContext< ConnectionContextValue | undefined @@ -18,7 +18,7 @@ export type ConnectionContextValue = { chainId?: string; chainName?: string; policies?: ParsedSessionPolicies; - theme: VerifiableControllerTheme; + theme: ControllerTheme; prefunds: Prefund[]; hasPrefundRequest: boolean; error?: Error; diff --git a/packages/keychain/src/components/layout/Footer/index.tsx b/packages/keychain/src/components/layout/Footer/index.tsx index c8e9de74e..3ae7c9d9f 100644 --- a/packages/keychain/src/components/layout/Footer/index.tsx +++ b/packages/keychain/src/components/layout/Footer/index.tsx @@ -3,8 +3,6 @@ import { CartridgeLogo } from "@cartridge/ui"; import React, { useEffect, useRef } from "react"; import { FOOTER_HEIGHT, useLayout } from "components/layout"; import NextLink from "next/link"; -import { useControllerTheme } from "hooks/theme"; -import { ErrorAlert } from "../../ErrorAlert"; export function Footer({ children, @@ -14,7 +12,6 @@ export function Footer({ }) { const ref = useRef(null); const { footer } = useLayout(); - const theme = useControllerTheme(); useEffect(() => { if (!ref.current) return; @@ -55,16 +52,6 @@ export function Footer({ p={4} pb={showCatridgeLogo ? 1 : 4} > - {!theme.verified && ( -
- -
- )} {children} diff --git a/packages/keychain/src/hooks/connection.ts b/packages/keychain/src/hooks/connection.ts index 51318e7bf..683c247ad 100644 --- a/packages/keychain/src/hooks/connection.ts +++ b/packages/keychain/src/hooks/connection.ts @@ -11,7 +11,6 @@ import { RpcProvider } from "starknet"; import { Prefund, ResponseCodes, - toArray, toSessionPolicies, } from "@cartridge/controller"; import { mergeDefaultETHPrefund } from "utils/token"; @@ -29,7 +28,6 @@ import { ControllerTheme, } from "@cartridge/presets"; import { ParsedSessionPolicies, parseSessionPolicies } from "./session"; -import { VerifiableControllerTheme } from "./theme"; type ParentMethods = AsyncMethodReturns<{ close: () => Promise }>; @@ -40,10 +38,7 @@ export function useConnectionValue() { const [rpcUrl, setRpcUrl] = useState(); const [chainId, setChainId] = useState(); const [policies, setPolicies] = useState(); - const [theme, setTheme] = useState({ - verified: true, - ...defaultTheme, - }); + const [theme, setTheme] = useState(defaultTheme); const [controller, setControllerRaw] = useState(); const [prefunds, setPrefunds] = useState([]); const [hasPrefundRequest, setHasPrefundRequest] = useState(false); @@ -136,17 +131,9 @@ export function useConnectionValue() { const decodedPreset = decodeURIComponent(themeParam); try { const parsedTheme = JSON.parse(decodedPreset) as ControllerTheme; - setTheme({ - ...parsedTheme, - verified: true, - }); + setTheme(parsedTheme); } catch (e) { - if (controllerConfigs[decodedPreset].theme) { - setTheme({ - ...controllerConfigs[decodedPreset].theme, - verified: true, - }); - } + setTheme(controllerConfigs[decodedPreset].theme || defaultTheme); } } @@ -169,39 +156,28 @@ export function useConnectionValue() { } // Application provided policies take precedence over preset policies. - if (presetParam && presetParam in controllerConfigs) { - const verified = - origin && - toArray(controllerConfigs[presetParam].origin).some((allowedOrigin) => { - const originUrl = new URL(origin); - return originUrl.hostname === allowedOrigin; - }); - - if (controllerConfigs[presetParam].theme) { - setTheme({ - verified: !!verified, - ...controllerConfigs[presetParam].theme, - }); - } + if ( + presetParam && + presetParam in controllerConfigs + // TODO: Reenable + // && + // origin && + // (origin.startsWith("http://localhost") || + // toArray(controllerConfigs[presetParam].origin).includes(origin)) + ) { + setTheme(controllerConfigs[presetParam].theme || defaultTheme); // Set policies from preset if no URL policies if (!policiesParam && controllerConfigs[presetParam].policies) { setPolicies( parseSessionPolicies({ - verified: !!verified, + verified: true, policies: controllerConfigs[presetParam].policies, }), ); } } - }, [ - origin, - setTheme, - setPolicies, - setHasPrefundRequest, - setOrigin, - setPrefunds, - ]); + }, [setTheme, setPolicies, setHasPrefundRequest, setOrigin, setPrefunds]); useEffect(() => { const connection = connectToController({ diff --git a/packages/keychain/src/hooks/theme.tsx b/packages/keychain/src/hooks/theme.tsx index cf831ac3e..5b87a9c2a 100644 --- a/packages/keychain/src/hooks/theme.tsx +++ b/packages/keychain/src/hooks/theme.tsx @@ -2,18 +2,12 @@ import { ControllerColor, ControllerTheme } from "@cartridge/presets"; import { CartridgeTheme } from "@cartridge/ui"; import { useContext, createContext, useMemo } from "react"; -export type VerifiableControllerTheme = ControllerTheme & { - verified: boolean; -}; - export const ControllerThemeContext = createContext< - VerifiableControllerTheme | undefined + ControllerTheme | undefined >(undefined); export function useControllerTheme() { - const ctx = useContext( - ControllerThemeContext, - ); + const ctx = useContext(ControllerThemeContext); if (!ctx) { throw new Error("ControllerThemeProvider must be placed"); } @@ -21,7 +15,7 @@ export function useControllerTheme() { return ctx; } -export function useChakraTheme(preset: VerifiableControllerTheme) { +export function useChakraTheme(preset: ControllerTheme) { return useMemo( () => ({ ...CartridgeTheme,