[SDK] Feature: Export Glyph Wallet Connectors. Some Refactoring and AI Feedback Resolution.

0xShoobs · 0xShoobs · commit a809e59436ef · 2025-09-10T20:18:15.000+05:30
diff --git a/.changeset/six-zebras-move.md b/.changeset/six-zebras-move.md
@@ -1,5 +1,8 @@
 ---
-"thirdweb": patch
+"thirdweb": minor
 ---
 
-Added Glyph Wallet Connector to CreateWallet function
+Add Glyph wallet connector to `createWallet`, export the connector and also export new chains:
+
+- `apechain` (mainnet)
+- `curtis` (testnet)
diff --git a/packages/thirdweb/package.json b/packages/thirdweb/package.json
@@ -17,7 +17,7 @@
     "@noble/curves": "1.8.2",
     "@noble/hashes": "1.7.2",
     "@passwordless-id/webauthn": "^2.1.2",
-    "@privy-io/cross-app-connect": ">=0.2.3",
+    "@privy-io/cross-app-connect": "^0.2.3",
     "@radix-ui/react-dialog": "1.1.14",
     "@radix-ui/react-focus-scope": "1.1.7",
     "@radix-ui/react-icons": "1.3.2",
@@ -26,7 +26,7 @@
     "@tanstack/react-query": "5.81.5",
     "@thirdweb-dev/engine": "workspace:*",
     "@thirdweb-dev/insight": "workspace:*",
-    "@wagmi/core": ">=2.17.2",
+    "@wagmi/core": "^2.17.2",
     "@walletconnect/sign-client": "2.20.1",
     "@walletconnect/universal-provider": "2.21.4",
     "abitype": "1.0.8",
diff --git a/packages/thirdweb/src/chains/chain-definitions/apechain.ts b/packages/thirdweb/src/chains/chain-definitions/apechain.ts
@@ -13,8 +13,8 @@ export const apechain = /* @__PURE__ */ defineChain({
   id: 33139,
   name: "Ape Chain",
   nativeCurrency: {
-    name: 'ApeCoin',
-    symbol: 'APE',
+    name: "ApeCoin",
+    symbol: "APE",
     decimals: 18,
   },
 });
diff --git a/packages/thirdweb/src/chains/chain-definitions/curtis.ts b/packages/thirdweb/src/chains/chain-definitions/curtis.ts
@@ -2,6 +2,7 @@ import { defineChain } from "../utils.js";
 
 /**
  * @chain
+ * Curtis test network (Ape Chain testnet variant).
  */
 export const curtis = /* @__PURE__ */ defineChain({
   blockExplorers: [
@@ -12,6 +13,6 @@ export const curtis = /* @__PURE__ */ defineChain({
   ],
   id: 33_111,
   name: "Curtis",
-  nativeCurrency: { name: 'ApeCoin', symbol: 'APE', decimals: 18 },
+  nativeCurrency: { name: "ApeCoin", symbol: "APE", decimals: 18 },
   testnet: true,
 });
diff --git a/packages/thirdweb/src/exports/wallets/glyph.ts b/packages/thirdweb/src/exports/wallets/glyph.ts
@@ -0,0 +1,4 @@
+export {
+  glyphWalletTW,
+  glyphWalletWagmiConnector,
+} from "../../wallets/glyph/glyph-wallet.js";
diff --git a/packages/thirdweb/src/wallets/glyph/constants.ts b/packages/thirdweb/src/wallets/glyph/constants.ts
@@ -1,12 +1,15 @@
-export const STAGING_GLYPH_APP_ID = 'clxt9p8e601al6tgmsyhu7j3t';
-export const GLYPH_APP_ID = 'cly38x0w10ac945q9yg9sm71i';
-export const GLYPH_ICON_URL = 'https://i.ibb.co/TxcwPQyr/Group-12489-1.png';
+/** Staging tenant id for Glyph Cross-App Connect. @internal */
+export const STAGING_GLYPH_APP_ID = "clxt9p8e601al6tgmsyhu7j3t";
+/** Production tenant id for Glyph Cross-App Connect. @internal */
+export const GLYPH_APP_ID = "cly38x0w10ac945q9yg9sm71i";
+/** Icon used in connectors & UIs. @internal */
+export const GLYPH_ICON_URL = "https://i.ibb.co/TxcwPQyr/Group-12489-1.png";
 
 export const glyphConnectorDetails = {
-  id: 'io.useglyph.privy',
-  name: 'Glyph',
+  id: "io.useglyph.privy",
+  name: "Glyph",
   iconUrl: GLYPH_ICON_URL,
-  iconBackground: '#ffffff',
-  shortName: 'Glyph',
-  type: 'injected',
+  iconBackground: "#ffffff",
+  shortName: "Glyph",
+  type: "injected",
 } as const;
diff --git a/packages/thirdweb/src/wallets/glyph/glyph-wallet.ts b/packages/thirdweb/src/wallets/glyph/glyph-wallet.ts
@@ -1,12 +1,28 @@
 import { toPrivyWalletConnector } from "@privy-io/cross-app-connect/rainbow-kit";
 import type { CreateConnectorFn } from "@wagmi/core";
 import { createEmitter } from "@wagmi/core/internal";
+import type { Chain, EIP1193Provider } from "viem";
+import {
+  abstract,
+  apeChain,
+  arbitrum,
+  arbitrumSepolia,
+  base,
+  baseSepolia,
+  curtis,
+  mainnet,
+  optimism,
+  optimismSepolia,
+  polygon,
+  sepolia,
+} from "viem/chains";
 import { fromProvider } from "../../adapters/eip1193/from-eip1193.js";
-import { apechain } from "../../chains/chain-definitions/apechain.js";
-import { GLYPH_APP_ID, glyphConnectorDetails, STAGING_GLYPH_APP_ID } from "../../wallets/glyph/constants.js";
+import {
+  GLYPH_APP_ID,
+  glyphConnectorDetails,
+  STAGING_GLYPH_APP_ID,
+} from "../../wallets/glyph/constants.js";
 import type { Wallet } from "../../wallets/interfaces/wallet.js";
-import type { Chain, EIP1193Provider } from "viem";
-import { abstract, apeChain, arbitrum, arbitrumSepolia, base, baseSepolia, curtis, mainnet, optimism, optimismSepolia, polygon, sepolia } from "viem/chains";
 
 /**
  * Create a wagmi connector for the Glyph Global Wallet.
@@ -17,47 +33,50 @@ import { abstract, apeChain, arbitrum, arbitrumSepolia, base, baseSepolia, curti
  * @example
  * import { createConfig, http } from "wagmi";
  * import { apeChain } from "wagmi/chains";
- * import { glyphWalletConnector } from "@use-glyph/sdk-react"
+ * import { glyphWalletWagmiConnector } from "thirdweb/wallets/glyph"
  *
  * export const wagmiConfig = createConfig({
  *   chains: [apeChain],
  *   transports: {
  *     [apeChain.id]: http(),
  *   },
- *   connectors: [glyphWalletConnector()],
+ *   connectors: [glyphWalletWagmiConnector()],
  *   ssr: true,
  * });
  */
-function glyphWalletConnector(options?: {
-    useStagingTenant?: boolean
+function glyphWalletWagmiConnector(options?: {
+  useStagingTenant?: boolean;
 }): CreateConnectorFn {
-    const { useStagingTenant } = options ?? {};
+  const { useStagingTenant } = options ?? {};
 
-    return (params) => {
-        const connector = toPrivyWalletConnector({
-            iconUrl: glyphConnectorDetails.iconUrl,
-            id: useStagingTenant ? STAGING_GLYPH_APP_ID : GLYPH_APP_ID,
-            name: glyphConnectorDetails.name
-        })(params);
+  return (params) => {
+    const connector = toPrivyWalletConnector({
+      iconUrl: glyphConnectorDetails.iconUrl,
+      id: useStagingTenant ? STAGING_GLYPH_APP_ID : GLYPH_APP_ID,
+      name: glyphConnectorDetails.name,
+    })(params);
 
-        const getGlyphProvider = async (parameters?: { chainId?: number | undefined } | undefined) => {
-            const chainId = parameters?.chainId ?? params.chains?.[0]?.id ?? apechain.id;
+    const getGlyphProvider = async (
+      parameters?: { chainId?: number | undefined } | undefined,
+    ) => {
+      const chainId =
+        parameters?.chainId ?? params.chains?.[0]?.id ?? apeChain.id;
 
-            const provider = await connector.getProvider({
-                chainId
-            });
+      const provider = await connector.getProvider({
+        chainId,
+      });
 
-            return provider;
-        };
+      return provider;
+    };
 
-        const glyphConnector = {
-            ...connector,
-            getProvider: getGlyphProvider,
-            type: glyphConnectorDetails.type,
-            id: glyphConnectorDetails.id
-        };
-        return glyphConnector;
+    const glyphConnector = {
+      ...connector,
+      getProvider: getGlyphProvider,
+      type: glyphConnectorDetails.type,
+      id: glyphConnectorDetails.id,
     };
+    return glyphConnector;
+  };
 }
 
 /**
@@ -68,24 +87,37 @@ function glyphWalletConnector(options?: {
  * @example
  * ```tsx
  * import { createThirdwebClient } from "thirdweb";
- * import { glyphWalletTW } from "@use-glyph/sdk-react"
+ * import { glyphWalletTW } from "thirdweb/wallets/glyph"
  *
  * const client = createThirdwebClient({ clientId });
  *
  * <ConnectButton client={client} wallets=[glyphWalletTW()]>
  * ```
  */
-const glyphWalletTW = (chains?: [Chain, ...Chain[]]): Wallet => {
-    const connector = glyphWalletConnector()({
-        chains: chains ?? [apeChain, curtis, mainnet, base, arbitrum, polygon, optimism, abstract, sepolia, baseSepolia, optimismSepolia, arbitrumSepolia],
-        emitter: createEmitter("io.useglyph")
-    });
-    return fromProvider({
-        provider: connector.getProvider as (
-            parameters?: { chainId?: number | undefined } | undefined
-        ) => Promise<EIP1193Provider>,
-        walletId: "io.useglyph"
-    });
-};
+function glyphWalletTW(chains?: [Chain, ...Chain[]]): Wallet {
+  const connector = glyphWalletWagmiConnector()({
+    chains: chains ?? [
+      apeChain,
+      curtis,
+      mainnet,
+      base,
+      arbitrum,
+      polygon,
+      optimism,
+      abstract,
+      sepolia,
+      baseSepolia,
+      optimismSepolia,
+      arbitrumSepolia,
+    ],
+    emitter: createEmitter("io.useglyph"),
+  });
+  return fromProvider({
+    provider: connector.getProvider as (
+      parameters?: { chainId?: number | undefined } | undefined,
+    ) => Promise<EIP1193Provider>,
+    walletId: "io.useglyph",
+  });
+}
 
-export { glyphWalletTW };
+export { glyphWalletTW, glyphWalletWagmiConnector };
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
