-
Notifications
You must be signed in to change notification settings - Fork 17
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* save * tweak off * cond * fix build * key * chain parse * save
- Loading branch information
Showing
10 changed files
with
3,522 additions
and
178 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -20,10 +20,12 @@ | |
| }, | ||
| "dependencies": { | ||
| "@crossmint/client-sdk-react-ui": "workspace:*", | ||
| "crypto": "npm:[email protected]", | ||
| "eslint-config-react-app": "7.0.1", | ||
| "react": "18.2.0", | ||
| "react-dom": "18.2.0", | ||
| "react-scripts": "5.0.1", | ||
| "stream": "npm:[email protected]", | ||
| "web-vitals": "3.4.0" | ||
| }, | ||
| "devDependencies": { | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,8 +1,13 @@ | ||
| import { z } from "zod"; | ||
|
|
||
| export const embeddedCheckoutV3OutgoingEvents = { | ||
| placeholder: z.object({ | ||
| placeholder: z.number(), | ||
| "crypto:connect-wallet.failed": z.object({ | ||
| error: z.string(), | ||
| }), | ||
| "crypto:connect-wallet.success": z.object({ | ||
| address: z.string(), | ||
| chain: z.string(), | ||
| walletProviderKey: z.string().optional(), | ||
| }), | ||
| }; | ||
| export type EmbeddedCheckoutV3OutgoingEventMap = typeof embeddedCheckoutV3OutgoingEvents; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
21 changes: 21 additions & 0 deletions
21
packages/client/ui/react-ui/src/components/dynamic-xyz/DynamicContextProviderWrapper.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| import { type DynamicContextProps, DynamicContextProvider } from "@dynamic-labs/sdk-react-core"; | ||
| import type { ReactNode } from "react"; | ||
|
|
||
| export interface DynamicContextProviderWrapperProps { | ||
| children?: ReactNode; | ||
| settings: Omit<DynamicContextProps["settings"], "initialAuthenticationMode" | "environmentId">; | ||
| } | ||
|
|
||
| export default function DynamicContextProviderWrapper({ children, settings }: DynamicContextProviderWrapperProps) { | ||
| return ( | ||
| <DynamicContextProvider | ||
| settings={{ | ||
| initialAuthenticationMode: "connect-only", | ||
| environmentId: "cd53135a-b32b-4704-bfca-324b665e9329", // TODO: Key per env | ||
| ...settings, | ||
| }} | ||
| > | ||
| {children} | ||
| </DynamicContextProvider> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
100 changes: 100 additions & 0 deletions
100
packages/client/ui/react-ui/src/components/embed/v3/crypto/CryptoWalletConnectionHandler.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,100 @@ | ||
| import DynamicContextProviderWrapper from "@/components/dynamic-xyz/DynamicContextProviderWrapper"; | ||
| import type { EmbeddedCheckoutV3IFrameEmitter } from "@crossmint/client-sdk-base"; | ||
| import { type BlockchainIncludingTestnet, chainIdToBlockchain } from "@crossmint/common-sdk-base"; | ||
| import { EthereumWalletConnectors } from "@dynamic-labs/ethereum"; | ||
| import { type HandleConnectedWallet, useDynamicContext } from "@dynamic-labs/sdk-react-core"; | ||
| import { SolanaWalletConnectors } from "@dynamic-labs/solana"; | ||
| import { useEffect } from "react"; | ||
|
|
||
| export function CryptoWalletConnectionHandler(props: { iframeClient: EmbeddedCheckoutV3IFrameEmitter | null }) { | ||
| const { iframeClient } = props; | ||
|
|
||
| return ( | ||
| <DynamicContextProviderWrapper | ||
| settings={{ | ||
| walletConnectors: [EthereumWalletConnectors, SolanaWalletConnectors], | ||
| events: { | ||
| onAuthFlowCancel() { | ||
| console.log("[CryptoWalletConnectionHandler] onAuthFlowCancel"); | ||
| iframeClient?.send("crypto:connect-wallet.failed", { | ||
| error: "cancelled", | ||
| }); | ||
| }, | ||
| onAuthFlowClose() { | ||
| console.log("[CryptoWalletConnectionHandler] onAuthFlowClose"); | ||
| }, | ||
| onAuthFailure(data, reason) { | ||
| console.error("[CryptoWalletConnectionHandler] onAuthFailure", data, reason); | ||
| }, | ||
| onAuthSuccess(data) { | ||
| console.log("[CryptoWalletConnectionHandler] onAuthSuccess", data); | ||
| }, | ||
| }, | ||
| handlers: { | ||
| handleConnectedWallet: async (wallet) => { | ||
| console.log("[CryptoWalletConnectionHandler] handleConnectedWallet", wallet); | ||
|
|
||
| const address = wallet.address; | ||
| if (!address) { | ||
| console.error("[CryptoWalletConnectionHandler] handleConnectedWallet: address is missing"); | ||
| iframeClient?.send("crypto:connect-wallet.failed", { | ||
| error: "address is missing", | ||
| }); | ||
| return false; | ||
| } | ||
|
|
||
| const chain = await dynamicChainToCrossmintChain(wallet); | ||
|
|
||
| iframeClient?.send("crypto:connect-wallet.success", { | ||
| address, | ||
| chain, | ||
| walletProviderKey: wallet.connector?.key, | ||
| }); | ||
|
|
||
| return true; | ||
| }, | ||
| }, | ||
| }} | ||
| > | ||
| <_CryptoWalletConnectionHandler {...props} /> | ||
| </DynamicContextProviderWrapper> | ||
| ); | ||
| } | ||
|
|
||
| function _CryptoWalletConnectionHandler({ iframeClient }: Parameters<typeof CryptoWalletConnectionHandler>[0]) { | ||
| const { setShowAuthFlow } = useDynamicContext(); | ||
|
|
||
| useEffect(() => { | ||
| if (iframeClient == null) { | ||
| return; | ||
| } | ||
| const listenerId = iframeClient.on("crypto:connect-wallet.show", ({ show }) => { | ||
| console.log("crypto:connect-wallet.show", show); | ||
| setShowAuthFlow(show); | ||
| }); | ||
|
|
||
| return () => { | ||
| iframeClient.off(listenerId); | ||
| }; | ||
| }, [iframeClient]); | ||
|
|
||
| return null; | ||
| } | ||
|
|
||
| async function dynamicChainToCrossmintChain( | ||
| wallet: Parameters<HandleConnectedWallet>[0] | ||
| ): Promise<BlockchainIncludingTestnet> { | ||
| const chain = wallet.chain; | ||
| if (chain === "SOL") { | ||
| return "solana"; | ||
| } | ||
| const chainId = await wallet.connector?.getNetwork(); | ||
| if (typeof chainId !== "number") { | ||
| throw new Error("chainId is not a number"); | ||
| } | ||
| const chainFromChainId = chainIdToBlockchain(chainId); | ||
| if (!chainFromChainId) { | ||
| throw new Error(`ChainId ${chainId} is not supported`); | ||
| } | ||
| return chainFromChainId as BlockchainIncludingTestnet; | ||
| } |
Oops, something went wrong.