@gluwa/connect-kit 0.1.0-next.2 → 0.2.0-next.1

package/src/index.ts

@@ -1,12 +1,21 @@
+import { readContract, writeContract } from './api/contract';
+import { getBalance } from './api/balance';
+import { switchChain, getPublicClient } from './api/chain';
+import { waitForTransactionReceipt } from './api/transaction';
+import { getAccount, signMessage, signTypedData } from './api/account';
+import { watchAccount, watchConnections, reconnect, disconnectAll } from './events/account';
+
 export { ConnectModal } from './ConnectModal';
 export { ConnectKitProvider, useConnectKit } from './ConnectKitProvider';
 export type { ConnectKitContextValue, ConnectKitProviderProps } from './ConnectKitProvider';
-export { creditConnectConnector } from './creditConnectConnector';
-export type { CreditConnectConnectorOptions } from './creditConnectConnector';
+
+export { initConfig } from './core/config';
+
 export type {
   ConnectErrorContext,
   ConnectErrorReason,
   ConnectModalProps,
+  ConnectKitConfig,
   Connectors,
   ConnectResult,
   ConnectorId,
@@ -14,3 +23,25 @@ export type {
   WCSubView,
   WCWallet,
 } from './types';
+
+export const connectKit = {
+  api: {
+    readContract,
+    writeContract,
+    getBalance,
+    switchChain,
+    getPublicClient,
+    waitForTransactionReceipt,
+    getAccount,
+    signMessage,
+    signTypedData,
+  },
+  events: {
+    watchAccount,
+    watchConnections,
+    reconnect,
+    disconnectAll,
+  },
+} as const;
+
+export type * from '@wagmi/core';

package/src/types.ts

@@ -1,7 +1,16 @@
 import type { ReactNode } from 'react';
+import type { Chain, Transport } from 'viem';
+import type { CreateConnectorFn } from 'wagmi';
 
 export type ConnectorId = 'CREDIT_WALLET' | 'CREDIT_CONNECT' | 'METAMASK' | 'WALLET_CONNECT';
 
+export interface ConnectKitConfig {
+  chains: [Chain, ...Chain[]];
+  transports: Record<number, Transport>;
+  wcProjectId?: string;
+  extraConnectors?: CreateConnectorFn[];
+}
+
 export type CreditWalletStrategy = 'walletConnect' | 'creditConnect';
 
 export interface Connectors {

package/src/utils/platform.ts

@@ -1,16 +1,13 @@
-// 모바일 기기 감지
 export const isMobileDevice = (): boolean => {
   if (typeof window === 'undefined') return false;
   return /android|iphone|ipad|ipod/i.test(navigator.userAgent);
 };
 
-// 딥링크 열기 (walletConnect가 지원하는 지갑앱)
 export const tryOpenDeepLink = (uri: string, deepLinkBase: string): void => {
   const sep = deepLinkBase.endsWith('/') ? '' : '/';
-  window.location.href = `${deepLinkBase}${sep}wc?uri=${encodeURIComponent(uri)}`;
+  window.location.replace(`${deepLinkBase}${sep}wc?uri=${encodeURIComponent(uri)}`);
 };
 
-// metaMask extension 감지
 export const detectMetaMaskExtension = (): boolean =>
   typeof window !== 'undefined' &&
   Boolean((window as Window & { ethereum?: { isMetaMask?: boolean } }).ethereum?.isMetaMask);

package/src/views/CreditWalletView.tsx

@@ -1,4 +1,4 @@
-import { type FC, useEffect, useMemo } from 'react';
+import { type FC, useEffect, useMemo, useRef } from 'react';
 import { isMobileDevice, tryOpenDeepLink } from '../utils/platform';
 import { CONNECTOR_META } from '../connector-meta';
 import { type ConnectorId } from '../types';
@@ -12,9 +12,11 @@ interface CreditWalletViewProps {
 export const CreditWalletView: FC<CreditWalletViewProps> = ({ connectorId, qrUri }) => {
   const { downloadUrl, logoUrl, deepLinkBase } = CONNECTOR_META[connectorId];
   const isMobile = useMemo(() => isMobileDevice(), []);
+  const hasRedirectedRef = useRef(false);
 
   useEffect(() => {
-    if (isMobile && qrUri && deepLinkBase) {
+    if (isMobile && qrUri && deepLinkBase && !hasRedirectedRef.current) {
+      hasRedirectedRef.current = true;
       tryOpenDeepLink(qrUri, deepLinkBase);
     }
   }, [isMobile, qrUri, deepLinkBase]);

package/src/views/MetaMaskView.tsx

@@ -1,4 +1,4 @@
-import { type FC, useEffect, useMemo } from 'react';
+import { type FC, useEffect, useMemo, useRef } from 'react';
 import { isMobileDevice, tryOpenDeepLink } from '../utils/platform';
 import { CONNECTOR_META } from '../connector-meta';
 import { QRFrame, CopyLinkButton } from '../components/QRFrame';
@@ -13,9 +13,11 @@ interface MetaMaskViewProps {
 
 export const MetaMaskView: FC<MetaMaskViewProps> = ({ qrUri, hasExtension, logoUrl }) => {
   const isMobile = useMemo(() => isMobileDevice(), []);
+  const hasRedirectedRef = useRef(false);
 
   useEffect(() => {
-    if (isMobile && qrUri && deepLinkBase) {
+    if (isMobile && qrUri && deepLinkBase && !hasRedirectedRef.current) {
+      hasRedirectedRef.current = true;
       tryOpenDeepLink(qrUri, deepLinkBase);
     }
   }, [isMobile, qrUri]);

package/src/views/SwitchChainView.tsx

@@ -1,4 +1,4 @@
-import { useState, type FC } from 'react';
+import { useEffect, useRef, useState, type FC } from 'react';
 import { useSwitchChain } from 'wagmi';
 
 interface SwitchChainViewProps {
@@ -18,6 +18,13 @@ export const SwitchChainView: FC<SwitchChainViewProps> = ({
 }) => {
   const { switchChainAsync, isPending } = useSwitchChain();
   const [error, setError] = useState<Error | null>(null);
+  const isMountedRef = useRef(true);
+  useEffect(() => {
+    isMountedRef.current = true;
+    return () => {
+      isMountedRef.current = false;
+    };
+  }, []);
 
   const targetLabel = requiredChainName ?? `chain ${requiredChainId}`;
 
@@ -25,8 +32,6 @@ export const SwitchChainView: FC<SwitchChainViewProps> = ({
     setError(null);
     switchChainAsync({ chainId: requiredChainId }).catch((err: unknown) => {
       const normalized = err instanceof Error ? err : new Error(String(err));
-      // wagmi's MetaMask connector handles 4902 (chain not added) via wallet_addEthereumChain
-      // automatically when chain metadata is configured. We only surface what reaches us.
       const code =
         typeof err === 'object' && err !== null && 'code' in err
           ? (err as { code: unknown }).code
@@ -36,7 +41,7 @@ export const SwitchChainView: FC<SwitchChainViewProps> = ({
       } else {
         onLog?.(`[connect-kit] switch chain failed: ${normalized.message}`, normalized);
       }
-      setError(normalized);
+      if (isMountedRef.current) setError(normalized);
     });
   };
 

package/tsup.config.ts

@@ -2,7 +2,10 @@ import { defineConfig } from 'tsup';
 import { sassPlugin } from 'esbuild-sass-plugin';
 
 export default defineConfig({
-  entry: { index: 'src/index.ts' },
+  entry: {
+    index: 'src/index.ts',
+    'credit-connect': 'src/credit-connect.ts',
+  },
   format: ['esm'],
   dts: true,
   clean: true,
@@ -13,6 +16,7 @@ export default defineConfig({
     'wagmi',
     '@wagmi/core',
     'viem',
+    '@tanstack/react-query',
     '@gluwa/credit-connect-sdk',
     '@gluwa/credit-connect-sdk/dapp',
     '@gluwa/credit-connect-sdk/storage',
@@ -22,7 +26,7 @@ export default defineConfig({
   banner: {
     js: 'import React from "react";',
   },
-  esbuildPlugins: [sassPlugin({ type: 'style' })],
+  esbuildPlugins: [sassPlugin({ type: 'css' })],
   esbuildOptions(options) {
     options.loader = { ...options.loader, '.png': 'dataurl' };
   },