@hfunlabs/hypurr-connect 0.1.9 → 0.1.10

package/src/HypurrConnectProvider.tsx

@@ -3,7 +3,11 @@ import {
   HttpTransport,
   type IRequestTransport,
 } from "@hfunlabs/hyperliquid";
-import { PrivateKeySigner, signUserSignedAction } from "@hfunlabs/hyperliquid/signing";
+import {
+  PrivateKeySigner,
+  signUserSignedAction,
+} from "@hfunlabs/hyperliquid/signing";
+import type { RpcOptions } from "@protobuf-ts/runtime-rpc";
 import type { TelegramUserResponse } from "hypurr-grpc/ts/hypurr/telegram/telegram_service";
 import type {
   TelegramUser as HypurrTelegramUser,
@@ -40,30 +44,30 @@ import type {
   HypurrUser,
   SignTypedDataFn,
   StoredAgent,
-  TelegramLoginData,
 } from "./types";
 
 /** @internal context value — extends the public type with fields used only by library internals */
 interface InternalConnectState extends HypurrConnectState {
-  loginTelegram: (data: TelegramLoginData) => void;
+  loginTelegram: () => void;
   botUsername: string;
   useWidget: boolean;
 }
 
-const TELEGRAM_STORAGE_KEY = "hypurr-connect-tg-user";
-
-function toAuthDataMap(data: TelegramLoginData): Record<string, string> {
-  const map: Record<string, string> = {
-    id: String(data.id),
-    first_name: data.first_name,
-    auth_date: String(data.auth_date),
-    hash: data.hash,
-  };
-  if (data.last_name) map.last_name = data.last_name;
-  if (data.username) map.username = data.username;
-  if (data.photo_url) map.photo_url = data.photo_url;
-  return map;
-}
+const TELEGRAM_STORAGE_KEY = "hypurr-connect-tg-jwt";
+const LEGACY_TELEGRAM_STORAGE_KEY = "hypurr-connect-tg-user";
+const TELEGRAM_AUTH_STATE_KEY = "hypurr-connect-auth-state";
+const TELEGRAM_AUTH_MESSAGE = "hypurr-connect:telegram-auth";
+const DEFAULT_AUTH_HUB_URL = "https://127.0.0.1:443/login";
+const DEFAULT_TELEGRAM_SCOPES = [
+  "telegram:user:read",
+  "telegram:wallet:read",
+  "telegram:wallet:write",
+  "telegram:trade:read",
+  "telegram:trade:write",
+  "telegram:cabal:read",
+  "telegram:cabal:write",
+  "telegram:agent:write",
+];
 
 function isInvalidTelegramAuthError(err: unknown): boolean {
   const msg =
@@ -72,7 +76,55 @@ function isInvalidTelegramAuthError(err: unknown): boolean {
       : typeof err === "object" && err !== null && "message" in err
         ? String((err as { message: unknown }).message)
         : String(err);
-  return /invalid telegram auth data/i.test(msg);
+  return /invalid telegram auth data|invalid auth token|missing authorization token/i.test(
+    msg,
+  );
+}
+
+function currentReturnTo(): string {
+  const url = new URL(window.location.href);
+  for (const param of [
+    "token",
+    "token_type",
+    "token_source",
+    "state",
+    "scope",
+  ]) {
+    url.searchParams.delete(param);
+  }
+  return url.toString();
+}
+
+function randomState(): string {
+  const bytes = new Uint8Array(16);
+  crypto.getRandomValues(bytes);
+  return Array.from(bytes, (byte) => byte.toString(16).padStart(2, "0")).join(
+    "",
+  );
+}
+
+function normalizeScopes(scope?: string | string[]): string {
+  if (Array.isArray(scope)) return scope.join(" ");
+  return scope?.trim() || DEFAULT_TELEGRAM_SCOPES.join(" ");
+}
+
+function isTelegramAuthMessage(
+  data: unknown,
+): data is {
+  type: typeof TELEGRAM_AUTH_MESSAGE;
+  token: string;
+  state: string;
+} {
+  return (
+    typeof data === "object" &&
+    data !== null &&
+    "type" in data &&
+    "token" in data &&
+    "state" in data &&
+    (data as { type: unknown }).type === TELEGRAM_AUTH_MESSAGE &&
+    typeof (data as { token: unknown }).token === "string" &&
+    typeof (data as { state: unknown }).state === "string"
+  );
 }
 
 const HypurrConnectContext = createContext<InternalConnectState | null>(null);
@@ -107,23 +159,24 @@ export function HypurrConnectProvider({
   const staticClient = useMemo(() => createStaticClient(config), [config]);
 
   // ── Telegram auth state ──────────────────────────────────────
-  const [tgLoginData, setTgLoginData] = useState<TelegramLoginData | null>(
-    () => {
-      try {
-        const stored = localStorage.getItem(TELEGRAM_STORAGE_KEY);
-        return stored ? JSON.parse(stored) : null;
-      } catch {
-        return null;
-      }
-    },
-  );
+  const [tgAuthToken, setTgAuthToken] = useState<string | null>(() => {
+    try {
+      return localStorage.getItem(TELEGRAM_STORAGE_KEY);
+    } catch {
+      return null;
+    }
+  });
   const [tgUser, setTgUser] = useState<HypurrTelegramUser | null>(null);
   const [tgLoading, setTgLoading] = useState(false);
   const [tgError, setTgError] = useState<string | null>(null);
 
-  const authDataMap = useMemo(
-    () => (tgLoginData ? toAuthDataMap(tgLoginData) : {}),
-    [tgLoginData],
+  const authDataMap = useMemo(() => ({}), []);
+  const telegramRpcOptions = useMemo<RpcOptions | undefined>(
+    () =>
+      tgAuthToken
+        ? { meta: { authorization: `Bearer ${tgAuthToken}` } }
+        : undefined,
+    [tgAuthToken],
   );
 
   const [tgUserTick, setTgUserTick] = useState(0);
@@ -131,26 +184,99 @@ export function HypurrConnectProvider({
   // Auto-disconnect when the server rejects telegram auth data.
   const onInvalidAuthRef = useRef<(() => void) | null>(null);
   onInvalidAuthRef.current = () => {
-    console.warn("[HypurrConnect] Invalid telegram auth data — disconnecting.");
-    setTgLoginData(null);
+    console.warn(
+      "[HypurrConnect] Invalid Telegram auth token — disconnecting.",
+    );
+    setTgAuthToken(null);
     setTgUser(null);
     setTgError(null);
     localStorage.removeItem(TELEGRAM_STORAGE_KEY);
+    localStorage.removeItem(LEGACY_TELEGRAM_STORAGE_KEY);
   };
 
+  const acceptTelegramToken = useCallback((token: string) => {
+    setTgAuthToken(token);
+    setTgError(null);
+    localStorage.setItem(TELEGRAM_STORAGE_KEY, token);
+    localStorage.removeItem(LEGACY_TELEGRAM_STORAGE_KEY);
+  }, []);
+
   useEffect(() => {
-    if (!tgLoginData) return;
+    const params = new URLSearchParams(window.location.search);
+    const token = params.get("token");
+    if (!token) {
+      localStorage.removeItem(LEGACY_TELEGRAM_STORAGE_KEY);
+      return;
+    }
+
+    const callbackState = params.get("state") ?? "";
+
+    if (window.opener && window.opener !== window) {
+      window.opener.postMessage(
+        {
+          type: TELEGRAM_AUTH_MESSAGE,
+          token,
+          state: callbackState,
+        },
+        window.location.origin,
+      );
+      window.close();
+      return;
+    }
+
+    const expectedState = sessionStorage.getItem(TELEGRAM_AUTH_STATE_KEY);
+    sessionStorage.removeItem(TELEGRAM_AUTH_STATE_KEY);
+    if (!expectedState || callbackState !== expectedState) {
+      setTgError("Invalid auth callback state.");
+      return;
+    }
+
+    acceptTelegramToken(token);
+
+    const cleanUrl = new URL(window.location.href);
+    for (const param of [
+      "token",
+      "token_type",
+      "token_source",
+      "state",
+      "scope",
+    ]) {
+      cleanUrl.searchParams.delete(param);
+    }
+    window.history.replaceState({}, document.title, cleanUrl.toString());
+  }, [acceptTelegramToken]);
+
+  useEffect(() => {
+    function onMessage(event: MessageEvent) {
+      if (event.origin !== window.location.origin) return;
+      if (!isTelegramAuthMessage(event.data)) return;
+
+      const expectedState = sessionStorage.getItem(TELEGRAM_AUTH_STATE_KEY);
+      sessionStorage.removeItem(TELEGRAM_AUTH_STATE_KEY);
+      if (!expectedState || event.data.state !== expectedState) {
+        setTgError("Invalid auth callback state.");
+        return;
+      }
+
+      acceptTelegramToken(event.data.token);
+    }
+
+    window.addEventListener("message", onMessage);
+    return () => window.removeEventListener("message", onMessage);
+  }, [acceptTelegramToken]);
+
+  useEffect(() => {
+    if (!tgAuthToken || !telegramRpcOptions) return;
     let cancelled = false;
     setTgLoading(true);
     setTgError(null);
 
     (async () => {
       try {
-        const authData = toAuthDataMap(tgLoginData);
         const [{ response: userResp }, { response: walletsResp }] =
           await Promise.all([
-            tgClient.telegramUser({ authData }),
-            tgClient.telegramUserWallets({ authData }),
+            tgClient.telegramUser({ authData: {} }, telegramRpcOptions),
+            tgClient.telegramUserWallets({ authData: {} }, telegramRpcOptions),
           ]);
         if (cancelled) return;
         const user = (userResp as TelegramUserResponse).user ?? null;
@@ -176,7 +302,7 @@ export function HypurrConnectProvider({
     return () => {
       cancelled = true;
     };
-  }, [tgLoginData, tgClient, tgUserTick]);
+  }, [tgAuthToken, telegramRpcOptions, tgClient, tgUserTick]);
 
   // ── EOA auth state ───────────────────────────────────────────
   const [eoaAddress, setEoaAddress] = useState<`0x${string}` | null>(null);
@@ -186,7 +312,7 @@ export function HypurrConnectProvider({
   const eoaSignerRef = useRef<EoaSigner | null>(null);
 
   // ── Derived auth ─────────────────────────────────────────────
-  const authMethod: AuthMethod = tgLoginData
+  const authMethod: AuthMethod = tgAuthToken
     ? "telegram"
     : eoaAddress
       ? "eoa"
@@ -244,14 +370,20 @@ export function HypurrConnectProvider({
       try {
         const [{ response: twapResp }, { response: scaleResp }] =
           await Promise.all([
-            tgClient.hyperliquidWalletTwapSessions({
-              authData: authDataMap,
-              walletId: selectedWalletId,
-            }),
-            tgClient.hyperliquidWalletScaleSessions({
-              authData: authDataMap,
-              walletId: selectedWalletId,
-            }),
+            tgClient.hyperliquidWalletTwapSessions(
+              {
+                authData: {},
+                walletId: selectedWalletId,
+              },
+              telegramRpcOptions,
+            ),
+            tgClient.hyperliquidWalletScaleSessions(
+              {
+                authData: {},
+                walletId: selectedWalletId,
+              },
+              telegramRpcOptions,
+            ),
           ]);
         if (cancelled) return;
         setWallets((prev) =>
@@ -281,19 +413,24 @@ export function HypurrConnectProvider({
       cancelled = true;
       clearInterval(id);
     };
-  }, [authMethod, selectedWalletId, pollInterval, tgClient, authDataMap]);
+  }, [
+    authMethod,
+    selectedWalletId,
+    pollInterval,
+    tgClient,
+    telegramRpcOptions,
+  ]);
 
   const user = useMemo<HypurrUser | null>(() => {
-    if (tgLoginData && authMethod === "telegram" && selectedWallet) {
+    if (tgAuthToken && authMethod === "telegram" && selectedWallet && tgUser) {
       return {
         address: selectedWallet.ethereumAddress,
         walletId: selectedWallet.id,
-        displayName: tgLoginData.username
-          ? `@${tgLoginData.username}`
-          : tgLoginData.first_name,
-        photoUrl: tgLoginData.photo_url,
+        displayName: tgUser.telegramUsername
+          ? `@${tgUser.telegramUsername}`
+          : `Telegram ${tgUser.telegramId}`,
         authMethod: "telegram",
-        telegramId: String(tgLoginData.id),
+        telegramId: String(tgUser.telegramId),
         hfunScore: tgUser?.reputation?.hfunScore,
         reputationScore: tgUser?.reputation?.reputationScore,
       };
@@ -307,7 +444,7 @@ export function HypurrConnectProvider({
       };
     }
     return null;
-  }, [tgLoginData, selectedWallet, eoaAddress, authMethod, tgUser]);
+  }, [tgAuthToken, selectedWallet, eoaAddress, authMethod, tgUser]);
 
   // ── Exchange client ──────────────────────────────────────────
   // Telegram: GrpcExchangeTransport → HyperliquidCoreAction (server signs)
@@ -350,7 +487,7 @@ export function HypurrConnectProvider({
       const transport = new GrpcExchangeTransport({
         isTestnet: config.isTestnet ?? false,
         telegramClient: tgClient,
-        authDataMap,
+        rpcOptions: telegramRpcOptions,
         walletId: user.walletId,
         onAuthError: () => onInvalidAuthRef.current?.(),
       });
@@ -435,7 +572,8 @@ export function HypurrConnectProvider({
             const { privateKey, address: agentAddress } =
               await generateAgentKey();
 
-            const chainIdHex = `0x${signer.chainId.toString(16)}` as `0x${string}`;
+            const chainIdHex =
+              `0x${signer.chainId.toString(16)}` as `0x${string}`;
             const nonce = Date.now();
             const action = {
               type: "approveAgent" as const,
@@ -567,7 +705,7 @@ export function HypurrConnectProvider({
     eoaAddress,
     config.isTestnet,
     tgClient,
-    authDataMap,
+    telegramRpcOptions,
   ]);
 
   const handleClearAgent = useCallback(() => {
@@ -580,43 +718,52 @@ export function HypurrConnectProvider({
   // ── Wallet management (Telegram only) ───────────────────────
   const createWallet = useCallback(
     async (name: string): Promise<HyperliquidWallet> => {
-      const { response } = await tgClient.hyperliquidWalletCreate({
-        authData: authDataMap,
-        name,
-      });
+      const { response } = await tgClient.hyperliquidWalletCreate(
+        {
+          authData: {},
+          name,
+        },
+        telegramRpcOptions,
+      );
       refreshWallets();
       if (!response.wallet)
         throw new Error("Wallet creation returned no wallet");
       return response.wallet;
     },
-    [tgClient, authDataMap, refreshWallets],
+    [tgClient, telegramRpcOptions, refreshWallets],
   );
 
   const deleteWallet = useCallback(
     async (walletId: number): Promise<void> => {
-      await tgClient.hyperliquidWalletDelete({
-        authData: authDataMap,
-        walletId,
-      });
+      await tgClient.hyperliquidWalletDelete(
+        {
+          authData: {},
+          walletId,
+        },
+        telegramRpcOptions,
+      );
       if (walletId === selectedWalletId) {
         const remaining = wallets.filter((w) => w.id !== walletId);
         setSelectedWalletId(remaining[0]?.id ?? 0);
       }
       refreshWallets();
     },
-    [tgClient, authDataMap, selectedWalletId, wallets, refreshWallets],
+    [tgClient, telegramRpcOptions, selectedWalletId, wallets, refreshWallets],
   );
 
   const createWalletPack = useCallback(
     async (name: string): Promise<number> => {
-      const { response } = await tgClient.telegramChatWalletPackCreate({
-        authData: authDataMap,
-        name,
-      });
+      const { response } = await tgClient.telegramChatWalletPackCreate(
+        {
+          authData: {},
+          name,
+        },
+        telegramRpcOptions,
+      );
       refreshWallets();
       return response.packId;
     },
-    [tgClient, authDataMap, refreshWallets],
+    [tgClient, telegramRpcOptions, refreshWallets],
   );
 
   const addPackLabel = useCallback(
@@ -625,13 +772,16 @@ export function HypurrConnectProvider({
       walletLabel: string;
       packId: number;
     }): Promise<void> => {
-      await tgClient.telegramChatWalletPackLabelAdd({
-        authData: authDataMap,
-        ...params,
-      });
+      await tgClient.telegramChatWalletPackLabelAdd(
+        {
+          authData: {},
+          ...params,
+        },
+        telegramRpcOptions,
+      );
       refreshWallets();
     },
-    [tgClient, authDataMap, refreshWallets],
+    [tgClient, telegramRpcOptions, refreshWallets],
   );
 
   const modifyPackLabel = useCallback(
@@ -640,24 +790,30 @@ export function HypurrConnectProvider({
       walletLabelNew: string;
       packId: number;
     }): Promise<void> => {
-      await tgClient.telegramChatWalletPackLabelModify({
-        authData: authDataMap,
-        ...params,
-      });
+      await tgClient.telegramChatWalletPackLabelModify(
+        {
+          authData: {},
+          ...params,
+        },
+        telegramRpcOptions,
+      );
       refreshWallets();
     },
-    [tgClient, authDataMap, refreshWallets],
+    [tgClient, telegramRpcOptions, refreshWallets],
   );
 
   const removePackLabel = useCallback(
     async (params: { walletLabel: string; packId: number }): Promise<void> => {
-      await tgClient.telegramChatWalletPackLabelRemove({
-        authData: authDataMap,
-        ...params,
-      });
+      await tgClient.telegramChatWalletPackLabelRemove(
+        {
+          authData: {},
+          ...params,
+        },
+        telegramRpcOptions,
+      );
       refreshWallets();
     },
-    [tgClient, authDataMap, refreshWallets],
+    [tgClient, telegramRpcOptions, refreshWallets],
   );
 
   // ── TWAP session management (Telegram only) ─────────────────
@@ -668,11 +824,14 @@ export function HypurrConnectProvider({
         "authData" | "walletId"
       >,
     ) => {
-      const { response } = await tgClient.hyperliquidTwapCreate({
-        authData: authDataMap,
-        walletId: selectedWalletId,
-        ...params,
-      });
+      const { response } = await tgClient.hyperliquidTwapCreate(
+        {
+          authData: {},
+          walletId: selectedWalletId,
+          ...params,
+        },
+        telegramRpcOptions,
+      );
       if (!response.session)
         throw new Error("TWAP creation returned no session");
       const session = response.session;
@@ -685,7 +844,7 @@ export function HypurrConnectProvider({
       );
       return session;
     },
-    [tgClient, authDataMap, selectedWalletId],
+    [tgClient, telegramRpcOptions, selectedWalletId],
   );
 
   const modifyTwap = useCallback(
@@ -695,13 +854,15 @@ export function HypurrConnectProvider({
         "authData" | "walletId"
       >,
     ) => {
-      const { response } = await tgClient.hyperliquidTwapModify({
-        authData: authDataMap,
-        walletId: selectedWalletId,
-        ...params,
-      });
-      if (!response.session)
-        throw new Error("TWAP modify returned no session");
+      const { response } = await tgClient.hyperliquidTwapModify(
+        {
+          authData: {},
+          walletId: selectedWalletId,
+          ...params,
+        },
+        telegramRpcOptions,
+      );
+      if (!response.session) throw new Error("TWAP modify returned no session");
       const session = response.session;
       setWallets((prev) =>
         prev.map((w) =>
@@ -717,16 +878,19 @@ export function HypurrConnectProvider({
       );
       return session;
     },
-    [tgClient, authDataMap, selectedWalletId],
+    [tgClient, telegramRpcOptions, selectedWalletId],
   );
 
   const cancelTwap = useCallback(
     async (sessionId: number) => {
-      await tgClient.hyperliquidTwapCancel({
-        authData: authDataMap,
-        walletId: selectedWalletId,
-        twapSessionId: sessionId,
-      });
+      await tgClient.hyperliquidTwapCancel(
+        {
+          authData: {},
+          walletId: selectedWalletId,
+          twapSessionId: sessionId,
+        },
+        telegramRpcOptions,
+      );
       setWallets((prev) =>
         prev.map((w) =>
           w.id === selectedWalletId
@@ -738,7 +902,7 @@ export function HypurrConnectProvider({
         ),
       );
     },
-    [tgClient, authDataMap, selectedWalletId],
+    [tgClient, telegramRpcOptions, selectedWalletId],
   );
 
   // ── Scale session management (Telegram only) ───────────────
@@ -749,11 +913,14 @@ export function HypurrConnectProvider({
         "authData" | "walletId"
       >,
     ) => {
-      const { response } = await tgClient.hyperliquidScaleCreate({
-        authData: authDataMap,
-        walletId: selectedWalletId,
-        ...params,
-      });
+      const { response } = await tgClient.hyperliquidScaleCreate(
+        {
+          authData: {},
+          walletId: selectedWalletId,
+          ...params,
+        },
+        telegramRpcOptions,
+      );
       if (!response.session)
         throw new Error("Scale creation returned no session");
       const session = response.session;
@@ -766,16 +933,19 @@ export function HypurrConnectProvider({
       );
       return session;
     },
-    [tgClient, authDataMap, selectedWalletId],
+    [tgClient, telegramRpcOptions, selectedWalletId],
   );
 
   const cancelScale = useCallback(
     async (sessionId: number) => {
-      await tgClient.hyperliquidScaleCancel({
-        authData: authDataMap,
-        walletId: selectedWalletId,
-        scaleSessionId: sessionId,
-      });
+      await tgClient.hyperliquidScaleCancel(
+        {
+          authData: {},
+          walletId: selectedWalletId,
+          scaleSessionId: sessionId,
+        },
+        telegramRpcOptions,
+      );
       setWallets((prev) =>
         prev.map((w) =>
           w.id === selectedWalletId
@@ -789,7 +959,7 @@ export function HypurrConnectProvider({
         ),
       );
     },
-    [tgClient, authDataMap, selectedWalletId],
+    [tgClient, telegramRpcOptions, selectedWalletId],
   );
 
   // ── Login modal state ────────────────────────────────────────
@@ -798,23 +968,60 @@ export function HypurrConnectProvider({
   const closeLoginModal = useCallback(() => setLoginModalOpen(false), []);
 
   // ── Auth actions ─────────────────────────────────────────────
-  const loginTelegram = useCallback((data: TelegramLoginData) => {
-    setTgLoginData(data);
-    localStorage.setItem(TELEGRAM_STORAGE_KEY, JSON.stringify(data));
-    setEoaAddress(null);
-    setAgent(null);
-    setEoaError(null);
-  }, []);
+  const loginTelegram = useCallback(() => {
+    const state = randomState();
+    sessionStorage.setItem(TELEGRAM_AUTH_STATE_KEY, state);
+
+    const configuredReturnTo = config.telegram.returnTo;
+    const returnTo =
+      typeof configuredReturnTo === "function"
+        ? configuredReturnTo()
+        : configuredReturnTo || currentReturnTo();
+
+    const authUrl = new URL(config.telegram.authHubUrl || DEFAULT_AUTH_HUB_URL);
+    authUrl.searchParams.set("return_to", returnTo);
+    authUrl.searchParams.set("state", state);
+    authUrl.searchParams.set("scope", normalizeScopes(config.telegram.scope));
+
+    const width = 520;
+    const height = 720;
+    const left = window.screenX + Math.max(0, (window.outerWidth - width) / 2);
+    const top = window.screenY + Math.max(0, (window.outerHeight - height) / 2);
+    const popup = window.open(
+      authUrl.toString(),
+      "hypurr_telegram_auth",
+      [
+        `width=${width}`,
+        `height=${height}`,
+        `left=${Math.round(left)}`,
+        `top=${Math.round(top)}`,
+        "resizable=yes",
+        "scrollbars=yes",
+      ].join(","),
+    );
+
+    if (popup) {
+      popup.focus();
+      return;
+    }
+
+    window.location.assign(authUrl.toString());
+  }, [
+    config.telegram.authHubUrl,
+    config.telegram.returnTo,
+    config.telegram.scope,
+  ]);
 
   const connectEoa = useCallback(
     (address: `0x${string}`, signer?: EoaSigner) => {
       eoaSignerRef.current = signer ?? null;
       setEoaAddress(address);
-      setTgLoginData(null);
+      setTgAuthToken(null);
       setTgUser(null);
       setTgError(null);
       setEoaError(null);
       localStorage.removeItem(TELEGRAM_STORAGE_KEY);
+      localStorage.removeItem(LEGACY_TELEGRAM_STORAGE_KEY);
 
       const existing = loadAgent(address);
       if (existing && existing.validUntil > Date.now()) {
@@ -932,14 +1139,15 @@ export function HypurrConnectProvider({
   );
 
   const logout = useCallback(() => {
-    setTgLoginData(null);
     setTgUser(null);
     setTgError(null);
+    setTgAuthToken(null);
     setEoaAddress(null);
     setAgent(null);
     setEoaError(null);
     eoaSignerRef.current = null;
     localStorage.removeItem(TELEGRAM_STORAGE_KEY);
+    localStorage.removeItem(LEGACY_TELEGRAM_STORAGE_KEY);
   }, []);
 
   // ── Context value ────────────────────────────────────────────
@@ -991,6 +1199,8 @@ export function HypurrConnectProvider({
       useWidget: config.telegram?.useWidget ?? false,
 
       authDataMap,
+      authToken: tgAuthToken,
+      telegramRpcOptions,
       telegramClient: tgClient,
       staticClient,
     }),
@@ -1032,6 +1242,8 @@ export function HypurrConnectProvider({
       config.telegram?.botUsername,
       config.telegram?.useWidget,
       authDataMap,
+      tgAuthToken,
+      telegramRpcOptions,
       tgClient,
       staticClient,
     ],