@b3dotfun/sdk 0.0.73 → 0.0.74-alpha.0

package/dist/cjs/global-account/react/components/ManageAccount/HomeActions.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("../../../../global-account/react");
+const BankIcon_1 = require("../../../../global-account/react/components/icons/BankIcon");
+const SwapIcon_1 = require("../../../../global-account/react/components/icons/SwapIcon");
+const utils_1 = require("../../../../shared/utils");
+const SendIcon = () => ((0, jsx_runtime_1.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: (0, jsx_runtime_1.jsx)("path", { d: "M17.9958 1.21467C17.666 1.10449 17.359 1.18417 17.2063 1.22851C17.04 1.27683 16.8417 1.35425 16.6428 1.43191L2.51187 6.94641C2.28951 7.03315 2.07413 7.11717 1.9079 7.19936C1.76427 7.27038 1.45899 7.42845 1.28859 7.75646C1.10067 8.11818 1.10092 8.54881 1.28927 8.9103C1.46006 9.23811 1.76552 9.39582 1.90924 9.46667C2.07556 9.54867 2.29099 9.63241 2.51345 9.71889L6.4468 11.2485C6.74023 11.3626 6.88695 11.4197 7.03291 11.4232C7.16193 11.4263 7.2899 11.3994 7.40674 11.3446C7.53893 11.2826 7.65024 11.1713 7.87287 10.9487L11.9107 6.91083C12.2361 6.58539 12.7638 6.58539 13.0892 6.91083C13.4147 7.23626 13.4147 7.7639 13.0892 8.08934L9.05138 12.1272C8.82875 12.3498 8.71744 12.4611 8.65545 12.5933C8.60065 12.7101 8.57374 12.8381 8.57684 12.9671C8.58035 13.1131 8.6374 13.2598 8.75152 13.5532L10.2811 17.4865C10.3676 17.709 10.4514 17.9245 10.5334 18.0908C10.6042 18.2345 10.7619 18.54 11.0897 18.7108C11.4512 18.8991 11.8819 18.8994 12.2436 18.7115C12.5716 18.541 12.7297 18.2358 12.8007 18.0921C12.8829 17.9259 12.9669 17.7106 13.0536 17.4882L18.5681 3.35726C18.6458 3.15833 18.7232 2.96007 18.7715 2.79371C18.8159 2.64105 18.8955 2.334 18.7854 2.00419C18.6609 1.63157 18.3685 1.33915 17.9958 1.21467Z", fill: "#0C68E9" }) }));
+const BuyIcon = () => ((0, jsx_runtime_1.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", children: [(0, jsx_runtime_1.jsx)("path", { d: "M9.99998 8.75C9.30962 8.75 8.74998 9.30964 8.74998 10C8.74998 10.6904 9.30962 11.25 9.99998 11.25C10.6903 11.25 11.25 10.6904 11.25 10C11.25 9.30964 10.6903 8.75 9.99998 8.75Z", fill: "#0C68E9" }), (0, jsx_runtime_1.jsx)("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M14.1666 2.5C12.3642 2.5 10.8013 2.95205 9.44241 3.37018L9.18862 3.44844C7.90485 3.84476 6.86213 4.16667 5.83332 4.16667C5.09512 4.16667 4.43564 4.08819 3.88041 3.98151L3.85421 3.97647C3.44746 3.89831 3.10585 3.83267 2.84038 3.79758C2.60748 3.76679 2.26236 3.7302 1.94675 3.84126C1.78134 3.89947 1.60242 3.98249 1.43327 4.12224C1.26411 4.26199 1.14882 4.42202 1.06045 4.57348C0.898119 4.85168 0.864329 5.167 0.849347 5.3925C0.833297 5.63407 0.833306 5.94132 0.833317 6.29588L0.833315 15.2922C0.833263 15.4565 0.833201 15.6516 0.932434 15.9263C0.981719 16.0628 1.06288 16.1945 1.10974 16.2664C1.15659 16.3383 1.24436 16.4657 1.34932 16.5659C1.41718 16.6306 1.49456 16.6992 1.58722 16.76C1.67809 16.8196 1.76087 16.8559 1.79699 16.8717L1.80356 16.8746C2.48669 17.1759 3.71203 17.5 5.83332 17.5C7.63579 17.5 9.19862 17.0479 10.5576 16.6298L10.8113 16.5516C12.0951 16.1552 13.1378 15.8333 14.1666 15.8333C14.9048 15.8333 15.5643 15.9118 16.1196 16.0185L16.1458 16.0235C16.5525 16.1017 16.8941 16.1673 17.1596 16.2024C17.3925 16.2332 17.7376 16.2698 18.0532 16.1587C18.2186 16.1005 18.3975 16.0175 18.5667 15.8778C18.7359 15.738 18.8511 15.578 18.9395 15.4265C19.1018 15.1483 19.1356 14.833 19.1506 14.6075C19.1667 14.3659 19.1667 14.0587 19.1666 13.7041L19.1667 4.70776C19.1667 4.54347 19.1668 4.34839 19.0675 4.07365C19.0182 3.9372 18.9371 3.80547 18.8902 3.73359C18.8434 3.6617 18.7556 3.53428 18.6507 3.43412C18.5828 3.36935 18.5054 3.30084 18.4127 3.24003C18.3219 3.1804 18.2391 3.14413 18.203 3.1283L18.1964 3.12542C17.5133 2.82409 16.2879 2.5 14.1666 2.5ZM15.8333 7.5C15.8333 7.03976 15.4602 6.66667 15 6.66667C14.5397 6.66667 14.1666 7.03976 14.1666 7.5V10.8333C14.1666 11.2936 14.5397 11.6667 15 11.6667C15.4602 11.6667 15.8333 11.2936 15.8333 10.8333V7.5ZM7.08331 10C7.08331 8.38917 8.38915 7.08333 9.99998 7.08333C11.6108 7.08333 12.9166 8.38917 12.9166 10C12.9166 11.6108 11.6108 12.9167 9.99998 12.9167C8.38915 12.9167 7.08331 11.6108 7.08331 10ZM4.99998 8.33333C5.46022 8.33333 5.83331 8.70643 5.83331 9.16667V12.5C5.83331 12.9602 5.46022 13.3333 4.99998 13.3333C4.53974 13.3333 4.16665 12.9602 4.16665 12.5V9.16667C4.16665 8.70643 4.53974 8.33333 4.99998 8.33333Z", fill: "#0C68E9" })] }));
+const HomeActionButton = ({ customClass, icon, label, onClick, }) => {
+    return ((0, jsx_runtime_1.jsxs)(react_1.Button, { className: (0, utils_1.cn)("border-b3-line hover:border-b3-primary-blue flex h-[84px] w-full flex-col items-center justify-center gap-2 rounded-2xl border-[1.5px] bg-[#FAFAFA] shadow-[0_0_0_1px_rgba(10,13,18,0.18)_inset,0_-2px_0_0_rgba(10,13,18,0.05)_inset,0_1px_2px_0_rgba(10,13,18,0.05)] hover:bg-[#FAFAFA]", customClass), onClick: onClick, children: [icon, (0, jsx_runtime_1.jsx)("div", { className: "text-b3-grey font-neue-montreal-semibold", children: label })] }));
+};
+const HomeActions = ({ showDeposit, showSwap }) => {
+    const setB3ModalOpen = (0, react_1.useModalStore)(state => state.setB3ModalOpen);
+    const setB3ModalContentType = (0, react_1.useModalStore)(state => state.setB3ModalContentType);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "b3-modal-home-actions border-b3-line grid grid-cols-4 gap-3 border-b px-5 pb-6", children: [showDeposit && ((0, jsx_runtime_1.jsx)(HomeActionButton, { customClass: "manage-account-deposit", icon: (0, jsx_runtime_1.jsx)(BankIcon_1.BankIcon, { size: 24, className: "text-b3-primary-blue shrink-0" }), label: "Deposit", onClick: () => {
+                    setB3ModalOpen(true);
+                    setB3ModalContentType({
+                        type: "deposit",
+                        showBackButton: true,
+                    });
+                } })), (0, jsx_runtime_1.jsx)(HomeActionButton, { customClass: "manage-account-send", icon: (0, jsx_runtime_1.jsx)(SendIcon, {}), label: "Send", onClick: () => {
+                    setB3ModalOpen(true);
+                    setB3ModalContentType({
+                        type: "send",
+                        showBackButton: true,
+                    });
+                } }), showSwap && ((0, jsx_runtime_1.jsx)(HomeActionButton, { customClass: "manage-account-swap", icon: (0, jsx_runtime_1.jsx)(SwapIcon_1.SwapIcon, { size: 24, className: "text-b3-primary-blue" }), label: "Swap", onClick: () => {
+                    setB3ModalOpen(true);
+                    setB3ModalContentType({
+                        type: "anySpend",
+                        showBackButton: true,
+                    });
+                } })), (0, jsx_runtime_1.jsx)(HomeActionButton, { customClass: "manage-account-buy ", icon: (0, jsx_runtime_1.jsx)(BuyIcon, {}), label: "Buy", onClick: () => {
+                    setB3ModalOpen(true);
+                    setB3ModalContentType({
+                        type: "anySpend",
+                        defaultActiveTab: "fiat",
+                        showBackButton: true,
+                    });
+                } })] }));
+};
+exports.default = HomeActions;

package/dist/cjs/global-account/react/components/ManageAccount/HomeContent.d.ts

@@ -0,0 +1,6 @@
+interface HomeContentProps {
+    showDeposit?: boolean;
+    showSwap?: boolean;
+}
+export declare function HomeContent({ showDeposit, showSwap }: HomeContentProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/global-account/react/components/ManageAccount/HomeContent.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HomeContent = HomeContent;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Tabs_1 = require("../ui/Tabs");
+const Header_1 = require("./Header");
+const HomeActions_1 = __importDefault(require("./HomeActions"));
+const NFTContent_1 = __importDefault(require("./NFTContent"));
+const ProfileSection_1 = __importDefault(require("./ProfileSection"));
+const TokenContent_1 = __importDefault(require("./TokenContent"));
+function HomeContent({ showDeposit = false, showSwap = true }) {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col", children: [(0, jsx_runtime_1.jsx)(Header_1.Header, {}), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col", children: [(0, jsx_runtime_1.jsx)(ProfileSection_1.default, {}), (0, jsx_runtime_1.jsx)(HomeActions_1.default, { showDeposit: showDeposit, showSwap: showSwap }), (0, jsx_runtime_1.jsx)("div", { className: "b3-modal-balance-content space-y-2 p-5", children: (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { defaultValue: "balance", children: [(0, jsx_runtime_1.jsxs)(Tabs_1.TabsList, { className: "b3-modal-balance-tabs-list", children: [(0, jsx_runtime_1.jsx)(Tabs_1.TabTrigger, { value: "balance", className: "font-neue-montreal-semibold p-0 pr-3", children: "Balance" }), (0, jsx_runtime_1.jsx)(Tabs_1.TabTrigger, { value: "nfts", className: "font-neue-montreal-semibold p-0 pr-3", children: "NFTs" })] }), (0, jsx_runtime_1.jsx)(Tabs_1.TabsContent, { value: "balance", className: "px-0 pb-4 pt-2", children: (0, jsx_runtime_1.jsx)(TokenContent_1.default, {}) }), (0, jsx_runtime_1.jsx)(Tabs_1.TabsContent, { value: "nfts", className: "px-0 pb-4 pt-2", children: (0, jsx_runtime_1.jsx)(NFTContent_1.default, {}) })] }) })] })] }));
+}

package/dist/cjs/global-account/react/components/ManageAccount/ManageAccount.js

@@ -5,202 +5,24 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ManageAccount = ManageAccount;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const app_1 = __importDefault(require("../../../../global-account/app"));
 const react_1 = require("../../../../global-account/react");
-const SignOutIcon_1 = require("../../../../global-account/react/components/icons/SignOutIcon");
-const formatNumber_1 = require("../../../../shared/utils/formatNumber");
-const thirdweb_1 = require("../../../../shared/utils/thirdweb");
-const truncateAddress_1 = require("../../../../shared/utils/truncateAddress");
-const lucide_react_1 = require("lucide-react");
-const react_2 = require("react");
-const sonner_1 = require("sonner");
-const react_3 = require("thirdweb/react");
-const viem_1 = require("viem");
-const profileDisplay_1 = require("../../utils/profileDisplay");
-const AccountAssets_1 = require("../AccountAssets/AccountAssets");
-const ContentTokens_1 = require("./ContentTokens");
-// Helper function to check if a string is a wallet address and format it
-const formatProfileTitle = (title) => {
-    // Check if title looks like an Ethereum address (0x followed by 40 hex characters)
-    const isEthereumAddress = /^0x[a-fA-F0-9]{40}$/.test(title);
-    if (isEthereumAddress) {
-        return {
-            displayTitle: (0, truncateAddress_1.truncateAddress)(title),
-            isAddress: true,
-        };
-    }
-    return {
-        displayTitle: title,
-        isAddress: false,
-    };
-};
-const BalanceContent_1 = require("./BalanceContent");
+const BottomNavigation_1 = __importDefault(require("./BottomNavigation"));
+const HomeContent_1 = require("./HomeContent");
+const SettingsContent_1 = __importDefault(require("./SettingsContent"));
 function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit, chain, partnerId, showSwap, showDeposit, }) {
-    const [revokingSignerId, setRevokingSignerId] = (0, react_2.useState)(null);
-    const account = (0, react_3.useActiveAccount)();
-    const { data: nfts, isLoading } = (0, react_1.useAccountAssets)(account?.address);
-    const { data: signers, refetch: refetchSigners } = (0, react_1.useGetAllTWSigners)({
-        chain,
-        accountAddress: account?.address,
-    });
-    const { setB3ModalOpen, contentType } = (0, react_1.useModalStore)();
-    const { activeTab = "overview", setActiveTab } = contentType;
-    const { logout } = (0, react_1.useAuthentication)(partnerId);
-    const [logoutLoading, setLogoutLoading] = (0, react_2.useState)(false);
-    const { removeSessionKey } = (0, react_1.useRemoveSessionKey)({
-        chain,
-        onSuccess: tx => {
-            console.log("@@removeSessionKey:tx", tx);
-            setRevokingSignerId(null);
-        },
-        onError: error => {
-            console.error("Error revoking access:", error);
-            setRevokingSignerId(null);
-        },
-        refetchSigners: () => refetchSigners(),
-    });
-    const handleRevoke = async (signer) => {
-        setRevokingSignerId(signer.id);
-        await removeSessionKey(signer);
-    };
-    const onLogoutEnhanced = async () => {
-        setLogoutLoading(true);
-        await logout();
-        onLogout?.();
-        setB3ModalOpen(false);
-        setLogoutLoading(false);
-    };
-    const AppsContent = () => ((0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [signers?.map((signer) => ((0, jsx_runtime_1.jsx)("div", { className: "rounded-xl border border-gray-200 p-4 dark:border-gray-800", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-start justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-start gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex h-10 w-10 items-center justify-center rounded-full bg-gray-100 dark:bg-gray-800", children: (0, jsx_runtime_1.jsx)("span", { className: "text-xs font-medium text-gray-600 dark:text-gray-400", children: "App" }) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h3", { className: "font-medium text-gray-900 dark:text-white", children: signer.partner.name }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-2 space-y-1", children: [(0, jsx_runtime_1.jsxs)("p", { className: "text-xs text-gray-500", children: ["Added ", new Date(signer.createdAt).toLocaleDateString()] }), (0, jsx_runtime_1.jsxs)("p", { className: "text-xs text-gray-500", children: ["Expires ", new Date(Number(signer.endTimestamp) * 1000).toLocaleDateString()] }), (0, jsx_runtime_1.jsxs)("p", { className: "text-xs text-gray-500", children: ["Max spend: ", (0, formatNumber_1.formatNumber)(Number((0, viem_1.formatUnits)(signer.nativeTokenLimitPerTransaction, 18))), " ETH"] })] })] })] }), (0, jsx_runtime_1.jsx)(react_1.Button, { variant: "outline", size: "sm", className: "border-red-200 text-red-500 hover:border-red-300 hover:text-red-600", onClick: () => handleRevoke(signer), disabled: revokingSignerId === signer.id, children: revokingSignerId === signer.id ? "Revoking..." : "Revoke" })] }) }, signer.id))), !signers?.length && (0, jsx_runtime_1.jsx)("div", { className: "py-12 text-center text-gray-500", children: "No connected apps" })] }));
-    const SettingsContent = () => {
-        const [unlinkingAccountId, setUnlinkingAccountId] = (0, react_2.useState)(null);
-        const { data: profilesRaw = [], isLoading: isLoadingProfiles } = (0, react_3.useProfiles)({ client: thirdweb_1.client });
-        const { mutate: unlinkProfile, isPending: isUnlinking } = (0, react_3.useUnlinkProfile)();
-        const { setB3ModalOpen, setB3ModalContentType, isLinking, contentType } = (0, react_1.useModalStore)();
-        const { user, setUser } = (0, react_1.useB3)();
-        const [isUpdatingCode, setIsUpdatingCode] = (0, react_2.useState)(false);
-        const [newReferralCode, setNewReferralCode] = (0, react_2.useState)("");
-        const [isEditingCode, setIsEditingCode] = (0, react_2.useState)(false);
-        const referallCodeRef = (0, react_2.useRef)(null);
-        const { data: referrals, isLoading: isLoadingReferrals } = (0, react_1.useQueryB3)("referrals", "find", { query: { referrerId: user?.userId } }, !!user?.userId);
-        const showReferralInfo = contentType?.showReferralInfo ?? false;
-        const mutationOptions = {
-            onError: (error) => {
-                console.error("Error Unlinking account:", error);
-                sonner_1.toast.error(error.message);
-            },
-            onSuccess: async (data) => {
-                console.log("Raw Link Account Data:", data);
-                try {
-                    console.log("Sync user data...");
-                    await app_1.default.service("users").syncTwProfiles({});
+    const contentType = (0, react_1.useModalStore)(state => state.contentType);
+    const { activeTab = "home", setActiveTab } = contentType;
+    const setB3ModalContentType = (0, react_1.useModalStore)(state => state.setB3ModalContentType);
+    return ((0, jsx_runtime_1.jsx)("div", { className: "b3-manage-account flex-1", children: (0, jsx_runtime_1.jsxs)(react_1.TabsPrimitive, { defaultValue: activeTab, onValueChange: value => {
+                const tab = value;
+                if (tab === "swap") {
+                    setB3ModalContentType({
+                        type: "anySpend",
+                        showBackButton: true,
+                    });
                 }
-                catch (refreshError) {
-                    console.warn("⚠️ Could not sync user data:", refreshError);
+                else if (["home", "tokens", "nfts", "apps", "settings"].includes(tab)) {
+                    setActiveTab?.(tab);
                 }
-            },
-        };
-        // Fetch referred users
-        const currentReferralCode = user?.referralCode || user?.userId || "";
-        const handleCopyCode = async () => {
-            try {
-                await navigator.clipboard.writeText(currentReferralCode);
-                sonner_1.toast.success("Referral code copied to clipboard!");
-            }
-            catch (error) {
-                sonner_1.toast.error("Failed to copy referral code");
-            }
-        };
-        const handleUpdateReferralCode = async () => {
-            if (!newReferralCode)
-                return;
-            setIsUpdatingCode(true);
-            try {
-                // @ts-expect-error - setReferralCode is not typed for some reason
-                const newUser = await app_1.default.service("users").setReferralCode({
-                    userId: user?.userId,
-                    referralCode: newReferralCode,
-                });
-                setUser(newUser);
-                sonner_1.toast.success("Referral code updated successfully!");
-                setIsEditingCode(false);
-                setNewReferralCode("");
-            }
-            catch (error) {
-                sonner_1.toast.error("Failed to update referral code");
-            }
-            finally {
-                setIsUpdatingCode(false);
-            }
-        };
-        const profiles = profilesRaw
-            .filter((profile) => !["custom_auth_endpoint"].includes(profile.type))
-            .map((profile) => ({
-            ...(0, profileDisplay_1.getProfileDisplayInfo)(profile),
-            originalProfile: profile,
-        }));
-        const handleUnlink = async (profile) => {
-            setUnlinkingAccountId(profile.title);
-            try {
-                unlinkProfile({ client: thirdweb_1.client, profileToUnlink: profile.originalProfile }, mutationOptions);
-            }
-            catch (error) {
-                console.error("Error unlinking account:", error);
-            }
-            finally {
-                setUnlinkingAccountId(null);
-            }
-        };
-        const handleOpenLinkModal = () => {
-            setB3ModalOpen(true);
-            setB3ModalContentType({
-                type: "linkAccount",
-                showBackButton: true,
-                partnerId,
-                chain,
-                onSuccess: async () => {
-                    // Let the LinkAccount component handle modal closing
-                },
-                onError: () => {
-                    // Let the LinkAccount component handle errors
-                },
-                onClose: () => {
-                    // Let the LinkAccount component handle closing
-                },
-            });
-        };
-        console.log("@@profiles", profiles);
-        return ((0, jsx_runtime_1.jsxs)("div", { className: "linked-accounts-settings space-y-8", children: [(0, jsx_runtime_1.jsxs)("div", { className: "linked-accounts-section space-y-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "linked-accounts-header flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-b3-grey font-neue-montreal-semibold linked-accounts-settings-title text-xl", children: "Linked Accounts" }), (0, jsx_runtime_1.jsxs)(react_1.Button, { className: "linked-accounts-settings-button linked-accounts-link-button bg-b3-primary-wash hover:bg-b3-primary-wash/70 flex items-center gap-2 rounded-full px-4 py-2", onClick: handleOpenLinkModal, disabled: isLinking, children: [isLinking ? ((0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "linked-accounts-link-loading text-b3-primary-blue animate-spin", size: 16 })) : ((0, jsx_runtime_1.jsx)(lucide_react_1.LinkIcon, { size: 16, className: "linked-accounts-link-icon text-b3-primary-blue" })), (0, jsx_runtime_1.jsx)("span", { className: "linked-accounts-link-text text-b3-grey font-neue-montreal-semibold", children: isLinking ? "Linking..." : "Link New Account" })] })] }), isLoadingProfiles ? ((0, jsx_runtime_1.jsx)("div", { className: "linked-accounts-loading flex justify-center py-8", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "text-b3-grey animate-spin" }) })) : profiles.length > 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "linked-accounts-list space-y-4", children: profiles.map(profile => ((0, jsx_runtime_1.jsxs)("div", { className: "linked-account-item bg-b3-line group flex items-center justify-between rounded-xl p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "linked-account-info flex items-center gap-3", children: [profile.imageUrl ? ((0, jsx_runtime_1.jsx)("img", { src: profile.imageUrl, alt: profile.title, className: "linked-account-avatar linked-account-avatar-image size-10 rounded-full" })) : ((0, jsx_runtime_1.jsx)("div", { className: "linked-account-avatar linked-account-avatar-placeholder bg-b3-primary-wash flex h-10 w-10 items-center justify-center rounded-full", children: (0, jsx_runtime_1.jsx)("span", { className: "linked-account-initial text-b3-grey font-neue-montreal-semibold text-sm uppercase", children: profile.initial }) })), (0, jsx_runtime_1.jsxs)("div", { className: "linked-account-details", children: [(0, jsx_runtime_1.jsxs)("div", { className: "linked-account-title-row flex items-center gap-2", children: [(() => {
-                                                                const { displayTitle, isAddress } = formatProfileTitle(profile.title);
-                                                                const handleCopyAddress = async (e) => {
-                                                                    e.stopPropagation();
-                                                                    try {
-                                                                        await navigator.clipboard.writeText(profile.title);
-                                                                        sonner_1.toast.success("Address copied to clipboard!");
-                                                                    }
-                                                                    catch (error) {
-                                                                        sonner_1.toast.error("Failed to copy address");
-                                                                    }
-                                                                };
-                                                                return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("span", { className: `linked-account-title text-b3-grey font-neue-montreal-semibold ${isAddress
-                                                                                ? "font-mono text-sm" // Use monospace font for addresses
-                                                                                : "break-words" // Use break-words for emails/names (better than break-all)
-                                                                            }`, title: isAddress ? profile.title : undefined, children: displayTitle }), isAddress && ((0, jsx_runtime_1.jsx)("button", { onClick: handleCopyAddress, className: "linked-account-copy-button ml-1 rounded p-1 opacity-0 transition-opacity hover:bg-gray-100 group-hover:opacity-100", title: "Copy full address", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { size: 12, className: "text-gray-500 hover:text-gray-700" }) }))] }));
-                                                            })(), (0, jsx_runtime_1.jsx)("span", { className: "linked-account-type text-b3-foreground-muted font-neue-montreal-medium bg-b3-primary-wash rounded px-2 py-0.5 text-xs", children: profile.type.toUpperCase() })] }), (0, jsx_runtime_1.jsx)("div", { className: "linked-account-subtitle text-b3-foreground-muted font-neue-montreal-medium text-sm", children: profile.subtitle })] })] }), (0, jsx_runtime_1.jsx)(react_1.Button, { variant: "ghost", size: "icon", className: "linked-account-unlink-button text-b3-grey hover:text-b3-negative", onClick: () => handleUnlink(profile), disabled: unlinkingAccountId === profile.title || isUnlinking, children: unlinkingAccountId === profile.title || isUnlinking ? ((0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "linked-account-unlink-loading animate-spin" })) : ((0, jsx_runtime_1.jsx)(lucide_react_1.UnlinkIcon, { size: 16, className: "linked-account-unlink-icon" })) })] }, profile.title))) })) : ((0, jsx_runtime_1.jsx)("div", { className: "linked-accounts-empty text-b3-foreground-muted py-8 text-center", children: "No linked accounts found" }))] }), showReferralInfo && (
-                /* Referral Section */
-                (0, jsx_runtime_1.jsxs)("div", { className: "referrals-section space-y-4", children: [(0, jsx_runtime_1.jsx)("h3", { className: "referrals-title text-b3-grey font-neue-montreal-semibold text-xl", children: "Referrals" }), (0, jsx_runtime_1.jsxs)("div", { className: "referral-code-container bg-b3-line rounded-xl p-4", children: [isEditingCode && ((0, jsx_runtime_1.jsxs)("div", { className: "referral-code-header-editing", children: [(0, jsx_runtime_1.jsx)("div", { className: "referral-code-title text-b3-grey font-neue-montreal-semibold", children: "Your Referral Code" }), (0, jsx_runtime_1.jsx)("div", { className: "referral-code-description text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "Share this code with friends to earn rewards" })] })), (0, jsx_runtime_1.jsxs)("div", { className: "referral-code-content flex items-center justify-between", children: [!isEditingCode && ((0, jsx_runtime_1.jsxs)("div", { className: "referral-code-header", children: [(0, jsx_runtime_1.jsx)("div", { className: "referral-code-title text-b3-grey font-neue-montreal-semibold", children: "Your Referral Code" }), (0, jsx_runtime_1.jsx)("div", { className: "referral-code-description text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "Share this code with friends to earn rewards" })] })), (0, jsx_runtime_1.jsx)("div", { className: "referral-code-actions flex items-center gap-2", children: isEditingCode ? ((0, jsx_runtime_1.jsxs)("div", { className: "referral-code-edit-form flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("input", { type: "text", value: newReferralCode, onChange: e => setNewReferralCode(e.target.value), className: "referral-code-input rounded-lg border border-gray-200 bg-white px-3 py-1.5 text-sm", placeholder: "Enter new code", ref: referallCodeRef }), (0, jsx_runtime_1.jsx)(react_1.Button, { size: "sm", className: "referral-code-save-button", onClick: handleUpdateReferralCode, disabled: isUpdatingCode || !newReferralCode, children: isUpdatingCode ? ((0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "referral-code-save-loading h-4 w-4 animate-spin" })) : ("Save") }), (0, jsx_runtime_1.jsx)(react_1.Button, { size: "sm", variant: "ghost", className: "referral-code-cancel-button", onClick: () => {
-                                                            setIsEditingCode(false);
-                                                            setNewReferralCode("");
-                                                        }, children: "Cancel" })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "referral-code-display rounded-lg border border-gray-200 bg-white px-3 py-1.5 text-sm", children: currentReferralCode }), (0, jsx_runtime_1.jsx)(react_1.Button, { size: "icon", variant: "ghost", className: "referral-code-copy-button", onClick: handleCopyCode, children: (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "referral-code-copy-icon h-4 w-4" }) }), (0, jsx_runtime_1.jsx)(react_1.Button, { size: "icon", variant: "ghost", className: "referral-code-edit-button", onClick: () => {
-                                                            setIsEditingCode(true);
-                                                            setTimeout(() => {
-                                                                referallCodeRef.current?.focus();
-                                                            }, 100);
-                                                        }, children: (0, jsx_runtime_1.jsx)(lucide_react_1.Pencil, { className: "referral-code-edit-icon h-4 w-4" }) })] })) })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "referred-users-container bg-b3-line rounded-xl p-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "referred-users-title text-b3-grey font-neue-montreal-semibold mb-4", children: "Referred Users" }), isLoadingReferrals ? ((0, jsx_runtime_1.jsx)("div", { className: "referred-users-loading flex justify-center py-4", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-6 w-6 animate-spin text-gray-400" }) })) : referrals?.data?.length ? ((0, jsx_runtime_1.jsx)("div", { className: "referred-users-list space-y-3", children: referrals.data.map((referral) => ((0, jsx_runtime_1.jsxs)("div", { className: "referred-user-item flex items-center justify-between rounded-lg bg-white p-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "referred-user-id text-sm font-medium", children: referral.referreeId }), (0, jsx_runtime_1.jsx)("div", { className: "referred-user-date text-sm text-gray-500", children: new Date(referral.createdAt).toLocaleDateString() })] }, String(referral._id)))) })) : ((0, jsx_runtime_1.jsx)("div", { className: "referred-users-empty py-4 text-center text-gray-500", children: "No referred users yet" }))] })] })), (0, jsx_runtime_1.jsxs)("div", { className: "account-preferences-section space-y-4", children: [(0, jsx_runtime_1.jsx)("h3", { className: "account-preferences-title text-b3-grey font-neue-montreal-semibold text-xl", children: "Account Preferences" }), (0, jsx_runtime_1.jsx)("div", { className: "account-preferences-container bg-b3-line rounded-xl p-4", children: (0, jsx_runtime_1.jsxs)("div", { className: "account-preference-item flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("div", { className: "account-preference-info", children: [(0, jsx_runtime_1.jsx)("div", { className: "account-preference-title text-b3-grey font-neue-montreal-semibold", children: "Dark Mode" }), (0, jsx_runtime_1.jsx)("div", { className: "account-preference-description text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "Switch between light and dark theme" })] }), (0, jsx_runtime_1.jsx)("div", { className: "account-preference-toggle theme-toggle-placeholder bg-b3-primary-wash h-6 w-12 rounded-full" })] }) })] }), (0, jsx_runtime_1.jsxs)("button", { className: "logout-button logout-section border-b3-line hover:bg-b3-line relative flex w-full items-center justify-center rounded-2xl border p-4 transition-colors", onClick: onLogoutEnhanced, children: [(0, jsx_runtime_1.jsx)("span", { className: "logout-text font-neue-montreal-semibold text-b3-grey", children: "Sign out" }), (0, jsx_runtime_1.jsx)("div", { className: "logout-icon-container absolute right-4", children: logoutLoading ? ((0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "logout-loading animate-spin", size: 16 })) : ((0, jsx_runtime_1.jsx)(SignOutIcon_1.SignOutIcon, { size: 16, className: "logout-icon text-b3-grey" })) })] })] }));
-    };
-    return ((0, jsx_runtime_1.jsx)("div", { className: "b3-manage-account bg-b3-background flex flex-col rounded-xl", children: (0, jsx_runtime_1.jsx)("div", { className: "flex-1", children: (0, jsx_runtime_1.jsxs)(react_1.TabsPrimitive, { defaultValue: activeTab, onValueChange: value => {
-                    const tab = value;
-                    if (["overview", "tokens", "nfts", "apps", "settings"].includes(tab)) {
-                        setActiveTab?.(tab);
-                    }
-                }, children: [(0, jsx_runtime_1.jsx)("div", { className: "px-4", children: (0, jsx_runtime_1.jsxs)(react_1.TabsListPrimitive, { className: "grid h-auto grid-cols-2 grid-rows-2 gap-3 rounded-none border-none bg-transparent", children: [(0, jsx_runtime_1.jsxs)(react_1.TabTriggerPrimitive, { value: "overview", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.BarChart3, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "Overview" })] }), (0, jsx_runtime_1.jsxs)(react_1.TabTriggerPrimitive, { value: "tokens", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Coins, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "Tokens" })] }), (0, jsx_runtime_1.jsxs)(react_1.TabTriggerPrimitive, { value: "nfts", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Image, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "NFTs" })] }), (0, jsx_runtime_1.jsxs)(react_1.TabTriggerPrimitive, { value: "settings", className: "data-[state=active]:bg-b3-primary-blue data-[state=active]:hover:bg-b3-primary-blue data-[state=active]:border-b3-primary-blue group flex h-12 w-full items-center justify-center gap-2 rounded-xl border border-gray-200 bg-white p-2 text-center shadow-sm transition-all duration-200 hover:bg-gray-50 hover:shadow-md data-[state=active]:shadow-lg", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Settings, { size: 20, className: "text-b3-primary-blue shrink-0 group-data-[state=active]:text-white" }), (0, jsx_runtime_1.jsx)("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm group-data-[state=active]:text-white", children: "Settings" })] })] }) }), (0, jsx_runtime_1.jsx)(react_1.TabsContentPrimitive, { value: "overview", className: "px-4 pb-4 pt-2", children: (0, jsx_runtime_1.jsx)(BalanceContent_1.BalanceContent, { onLogout: onLogout, showDeposit: showDeposit, showSwap: showSwap }) }), (0, jsx_runtime_1.jsx)(react_1.TabsContentPrimitive, { value: "tokens", className: "px-4 pb-4 pt-2", children: (0, jsx_runtime_1.jsx)(ContentTokens_1.ContentTokens, { activeTab: activeTab }) }), (0, jsx_runtime_1.jsx)(react_1.TabsContentPrimitive, { value: "nfts", className: "px-4 pb-4 pt-2", children: (0, jsx_runtime_1.jsx)("div", { className: "grid grid-cols-3 gap-4", children: nfts?.nftResponse ? ((0, jsx_runtime_1.jsx)(AccountAssets_1.AccountAssets, { nfts: nfts.nftResponse, isLoading: isLoading })) : ((0, jsx_runtime_1.jsx)("div", { className: "col-span-3 py-12 text-center text-gray-500", children: "No NFTs found" })) }) }), (0, jsx_runtime_1.jsx)(react_1.TabsContentPrimitive, { value: "apps", className: "px-4 pb-4 pt-2", children: (0, jsx_runtime_1.jsx)(AppsContent, {}) }), (0, jsx_runtime_1.jsx)(react_1.TabsContentPrimitive, { value: "settings", className: "px-4 pb-4 pt-2", children: (0, jsx_runtime_1.jsx)(SettingsContent, {}) })] }) }) }));
+            }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "p-0", children: [(0, jsx_runtime_1.jsx)(react_1.TabsContentPrimitive, { value: "home", className: "m-0 p-0 pb-2", children: (0, jsx_runtime_1.jsx)(HomeContent_1.HomeContent, { showDeposit: showDeposit, showSwap: showSwap }) }), (0, jsx_runtime_1.jsx)(react_1.TabsContentPrimitive, { value: "swap", className: "hidden" }), (0, jsx_runtime_1.jsx)(react_1.TabsContentPrimitive, { value: "settings", className: "m-0 p-0 pb-2", children: (0, jsx_runtime_1.jsx)(SettingsContent_1.default, { partnerId: partnerId, onLogout: onLogout, chain: chain }) })] }), (0, jsx_runtime_1.jsx)(BottomNavigation_1.default, {})] }) }));
 }

package/dist/cjs/global-account/react/components/ManageAccount/NFTContent.d.ts

@@ -0,0 +1,2 @@
+declare const NFTContent: () => import("react/jsx-runtime").JSX.Element;
+export default NFTContent;

package/dist/cjs/global-account/react/components/ManageAccount/NFTContent.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("thirdweb/react");
+const __1 = require("..");
+const hooks_1 = require("../../hooks");
+const NFTContent = () => {
+    // Get active wallet state
+    const activeWallet = (0, react_1.useActiveWallet)();
+    const activeAccount = activeWallet?.getAccount();
+    const activeAddress = activeAccount?.address;
+    const { data: nfts, isLoading } = (0, hooks_1.useAccountAssets)(activeAddress);
+    return ((0, jsx_runtime_1.jsx)("div", { style: { minHeight: "100px" }, children: nfts?.nftResponse ? ((0, jsx_runtime_1.jsx)(__1.AccountAssets, { nfts: nfts.nftResponse, isLoading: isLoading })) : ((0, jsx_runtime_1.jsx)("div", { className: "py-12 text-center text-gray-500", children: "No NFTs found" })) }));
+};
+exports.default = NFTContent;

package/dist/cjs/global-account/react/components/ManageAccount/NotificationChannel.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from "react";
+interface NotificationChannelProps {
+    icon: ReactNode;
+    title: string;
+    isConnected: boolean;
+    isConnecting: boolean;
+    isDisconnecting: boolean;
+    connectedInfo?: ReactNode;
+    inputSection?: ReactNode;
+    addButtonSection?: ReactNode;
+    iconClassName?: string;
+    onToggle: () => void;
+    showBorder?: boolean;
+}
+export declare const NotificationChannel: ({ icon, title, isConnected, isConnecting, isDisconnecting, connectedInfo, inputSection, addButtonSection, iconClassName, onToggle, showBorder, }: NotificationChannelProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/cjs/global-account/react/components/ManageAccount/NotificationChannel.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NotificationChannel = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const utils_1 = require("../../../../shared/utils");
+const NotificationChannel = ({ icon, title, isConnected, isConnecting, isDisconnecting, connectedInfo, inputSection, addButtonSection, iconClassName, onToggle, showBorder = true, }) => {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: `flex items-start gap-3 p-[15px] ${showBorder ? "border-b border-[#e4e4e7]" : ""}`, children: [(0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("flex h-10 w-10 shrink-0 items-center justify-center", iconClassName), children: icon }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1", children: [(0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] font-semibold leading-[20px] text-[#3f3f46]", children: title }), isConnecting ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-1", children: (0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: "Connecting..." }) })) : isDisconnecting ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-1", children: (0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: "Disconnecting..." }) })) : isConnected && connectedInfo ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-1", children: (0, jsx_runtime_1.jsx)("p", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-[#51525c]", children: connectedInfo }) })) : inputSection ? (inputSection) : (addButtonSection)] }), (0, jsx_runtime_1.jsx)(ToggleSwitch, { enabled: isConnected, onChange: onToggle })] }));
+};
+exports.NotificationChannel = NotificationChannel;
+// Toggle Switch Component
+const ToggleSwitch = ({ enabled, onChange, disabled, }) => {
+    return ((0, jsx_runtime_1.jsx)("button", { onClick: onChange, disabled: disabled, className: `relative inline-flex h-5 w-9 shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none disabled:opacity-50 ${enabled ? "bg-[#0c68e9]" : "bg-gray-200"}`, role: "switch", "aria-checked": enabled, children: (0, jsx_runtime_1.jsx)("span", { className: `pointer-events-none inline-block h-4 w-4 rounded-full bg-white shadow-lg ring-0 transition duration-200 ease-in-out ${enabled ? "translate-x-4" : "translate-x-0"}` }) }));
+};

package/dist/cjs/global-account/react/components/ManageAccount/NotificationsContent.d.ts

@@ -0,0 +1,8 @@
+import { Chain } from "thirdweb";
+interface NotificationsContentProps {
+    partnerId: string;
+    chain: Chain;
+    onSuccess?: () => void;
+}
+declare const NotificationsContent: ({ partnerId, chain, onSuccess }: NotificationsContentProps) => import("react/jsx-runtime").JSX.Element;
+export default NotificationsContent;

package/dist/cjs/global-account/react/components/ManageAccount/NotificationsContent.js

@@ -0,0 +1,152 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("../../../../global-account/react");
+const auth_token_1 = require("../../../../shared/utils/auth-token");
+const debug_1 = require("../../../../shared/utils/debug");
+const react_2 = require("react");
+const useUserQuery_1 = require("../../hooks/useUserQuery");
+const notificationsAPI_1 = require("../../utils/notificationsAPI");
+const ModalHeader_1 = __importDefault(require("../ModalHeader/ModalHeader"));
+const toastApi_1 = require("../Toast/toastApi");
+const channels_1 = require("./channels");
+const debug = (0, debug_1.debugB3React)("NotificationsContent");
+const NotificationsContent = ({ partnerId, chain, onSuccess }) => {
+    const setB3ModalContentType = (0, react_1.useModalStore)(state => state.setB3ModalContentType);
+    const setB3ModalOpen = (0, react_1.useModalStore)(state => state.setB3ModalOpen);
+    const { user } = (0, useUserQuery_1.useUserQuery)();
+    const [userData, setUserData] = (0, react_2.useState)(null);
+    const [loading, setLoading] = (0, react_2.useState)(true);
+    const [error, setError] = (0, react_2.useState)(null);
+    const [isSendingTest, setIsSendingTest] = (0, react_2.useState)(false);
+    const [testSuccess, setTestSuccess] = (0, react_2.useState)(false);
+    // Optimistic UI state
+    const [optimisticChannelStates, setOptimisticChannelStates] = (0, react_2.useState)({});
+    const userId = user?.userId;
+    const jwtToken = (0, auth_token_1.getAuthToken)();
+    const fetchUserData = (0, react_2.useCallback)(async (showLoading = true) => {
+        if (!userId || !jwtToken) {
+            if (showLoading)
+                setLoading(false);
+            return;
+        }
+        try {
+            if (showLoading)
+                setLoading(true);
+            const data = await notificationsAPI_1.notificationsAPI.getUser(userId, jwtToken);
+            setUserData(data);
+            setError(null);
+        }
+        catch (err) {
+            debug("Error loading user data:", err);
+            // Try to register the user if they don't exist
+            try {
+                await notificationsAPI_1.notificationsAPI.registerUser(jwtToken);
+                const data = await notificationsAPI_1.notificationsAPI.getUser(userId, jwtToken);
+                setUserData(data);
+                setError(null);
+            }
+            catch (registerErr) {
+                debug("Error registering user:", registerErr);
+                setError("Failed to load notification settings");
+            }
+        }
+        finally {
+            if (showLoading)
+                setLoading(false);
+        }
+    }, [userId, jwtToken]);
+    (0, react_2.useEffect)(() => {
+        fetchUserData(true);
+    }, [fetchUserData]);
+    const handleConnectionChange = () => {
+        fetchUserData(false); // Refresh without showing loading screen
+        onSuccess?.();
+    };
+    const handleToggleChannel = async (channelType, shouldDisconnect) => {
+        if (!userId || !jwtToken)
+            return;
+        if (shouldDisconnect) {
+            // Optimistically update UI
+            setOptimisticChannelStates(prev => ({ ...prev, [channelType]: false }));
+            try {
+                await notificationsAPI_1.notificationsAPI.disconnectChannel(userId, channelType, jwtToken);
+                await fetchUserData(false); // Refresh without showing loading screen
+                setOptimisticChannelStates(prev => {
+                    const newState = { ...prev };
+                    delete newState[channelType];
+                    return newState;
+                });
+                toastApi_1.toast.success(`${channelType.charAt(0).toUpperCase() + channelType.slice(1)} disconnected successfully!`);
+            }
+            catch (err) {
+                debug("Error disconnecting channel:", err);
+                setError(`Failed to disconnect ${channelType}`);
+                toastApi_1.toast.error(`Failed to disconnect ${channelType}`);
+                // Revert optimistic update
+                setOptimisticChannelStates(prev => {
+                    const newState = { ...prev };
+                    delete newState[channelType];
+                    return newState;
+                });
+            }
+        }
+    };
+    const handleSendTestNotification = async () => {
+        if (!userId || !jwtToken)
+            return;
+        try {
+            setIsSendingTest(true);
+            setTestSuccess(false);
+            await notificationsAPI_1.notificationsAPI.sendTestNotification(userId, partnerId, jwtToken);
+            setTestSuccess(true);
+            setTimeout(() => setTestSuccess(false), 5000);
+        }
+        catch (err) {
+            debug("Error sending test notification:", err);
+            setError("Failed to send test notification. Make sure you have at least one channel connected.");
+        }
+        finally {
+            setIsSendingTest(false);
+        }
+    };
+    const handleBack = () => {
+        setB3ModalContentType({
+            type: "manageAccount",
+            chain,
+            partnerId,
+            activeTab: "settings",
+        });
+        setB3ModalOpen(true);
+    };
+    const emailChannel = userData?.channels?.find(c => c.channel_type === "email");
+    const smsChannel = userData?.channels?.find(c => c.channel_type === "sms");
+    const whatsappChannel = userData?.channels?.find(c => c.channel_type === "whatsapp");
+    const telegramChannel = userData?.channels?.find(c => c.channel_type === "telegram");
+    const discordChannel = userData?.channels?.find(c => c.channel_type === "discord");
+    // Real connection states
+    const emailConnected = emailChannel?.enabled === 1;
+    const smsConnected = smsChannel?.enabled === 1;
+    const whatsappConnected = whatsappChannel?.enabled === 1;
+    const telegramConnected = telegramChannel?.enabled === 1;
+    const discordConnected = discordChannel?.enabled === 1;
+    // Apply optimistic updates
+    const optimisticEmailConnected = optimisticChannelStates["email"] !== undefined ? optimisticChannelStates["email"] : emailConnected;
+    const optimisticSMSConnected = optimisticChannelStates["sms"] !== undefined ? optimisticChannelStates["sms"] : smsConnected;
+    const optimisticWhatsAppConnected = optimisticChannelStates["whatsapp"] !== undefined ? optimisticChannelStates["whatsapp"] : whatsappConnected;
+    const optimisticTelegramConnected = optimisticChannelStates["telegram"] !== undefined ? optimisticChannelStates["telegram"] : telegramConnected;
+    const optimisticDiscordConnected = optimisticChannelStates["discord"] !== undefined ? optimisticChannelStates["discord"] : discordConnected;
+    const hasAnyChannelConnected = optimisticEmailConnected ||
+        optimisticSMSConnected ||
+        optimisticWhatsAppConnected ||
+        optimisticTelegramConnected ||
+        optimisticDiscordConnected;
+    if (loading) {
+        return ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-[470px] flex-col", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { showBackButton: true, showCloseButton: false, title: "Notifications", handleBack: handleBack }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-1 items-center justify-center", children: (0, jsx_runtime_1.jsx)("div", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-gray-500", children: "Loading..." }) })] }));
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex h-[470px] flex-col", children: [(0, jsx_runtime_1.jsx)(ModalHeader_1.default, { showBackButton: true, showCloseButton: false, title: "Notifications", handleBack: handleBack }), (0, jsx_runtime_1.jsxs)("div", { className: "flex-1 space-y-2 overflow-y-auto px-5 py-6", children: [error && ((0, jsx_runtime_1.jsx)("div", { className: "mb-3 rounded-lg bg-red-50 p-3 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-red-600 dark:bg-red-900/20 dark:text-red-400", children: error })), userId && jwtToken && ((0, jsx_runtime_1.jsxs)("div", { className: "rounded-[20px] bg-[#f4f4f5]", children: [(0, jsx_runtime_1.jsx)(channels_1.PhoneChannel, { userId: userId, jwtToken: jwtToken, smsChannel: smsChannel, whatsappChannel: whatsappChannel, isSMSConnected: smsConnected, isWhatsAppConnected: whatsappConnected, isOptimisticallySMSConnected: optimisticSMSConnected, isOptimisticallyWhatsAppConnected: optimisticWhatsAppConnected, onConnectionChange: handleConnectionChange, onToggle: (type, shouldDisconnect) => handleToggleChannel(type, shouldDisconnect) }), (0, jsx_runtime_1.jsx)(channels_1.EmailChannel, { userId: userId, jwtToken: jwtToken, emailChannel: emailChannel, isConnected: emailConnected, isOptimisticallyConnected: optimisticEmailConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("email", enabled) }), (0, jsx_runtime_1.jsx)(channels_1.TelegramChannel, { userId: userId, jwtToken: jwtToken, telegramChannel: telegramChannel, isConnected: telegramConnected, isOptimisticallyConnected: optimisticTelegramConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("telegram", enabled) }), (0, jsx_runtime_1.jsx)(channels_1.DiscordChannel, { userId: userId, jwtToken: jwtToken, discordChannel: discordChannel, isConnected: discordConnected, isOptimisticallyConnected: optimisticDiscordConnected, onConnectionChange: handleConnectionChange, onToggle: enabled => handleToggleChannel("discord", enabled) })] })), process.env.NODE_ENV === "development" && hasAnyChannelConnected && ((0, jsx_runtime_1.jsxs)("div", { className: "mt-6 rounded-xl border border-[#e4e4e7] bg-white p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-3 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-lg", children: "\uD83E\uDDEA" }), (0, jsx_runtime_1.jsx)("h3", { className: "font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] font-semibold leading-[20px] text-gray-900", children: "Test Notifications" })] }), (0, jsx_runtime_1.jsx)("p", { className: "mb-3 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-gray-600", children: "Send a test notification to all your connected channels to verify they're working correctly." }), (0, jsx_runtime_1.jsx)("button", { onClick: handleSendTestNotification, disabled: isSendingTest, className: "w-full rounded-lg bg-purple-600 px-4 py-2 font-['Inter',sans-serif] text-[14px] font-semibold leading-[20px] text-white transition-colors hover:bg-purple-700 disabled:opacity-50", children: isSendingTest ? "Sending..." : "Send Test Notification" }), testSuccess && ((0, jsx_runtime_1.jsx)("div", { className: "mt-3 rounded-lg bg-green-50 p-3 font-['PP_Neue_Montreal','PP_Neue_Montreal_Fallback',sans-serif] text-[14px] leading-[20px] text-green-700", children: "\u2713 Test notification sent! Check your connected channels." }))] }))] })] }));
+};
+exports.default = NotificationsContent;

package/dist/cjs/global-account/react/components/ManageAccount/ProfileSection.d.ts

@@ -0,0 +1,2 @@
+declare const ProfileSection: () => import("react/jsx-runtime").JSX.Element;
+export default ProfileSection;

package/dist/cjs/global-account/react/components/ManageAccount/ProfileSection.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("../../../../global-account/react");
+const utils_1 = require("../../../../shared/utils");
+const number_1 = require("../../../../shared/utils/number");
+const lucide_react_1 = require("lucide-react");
+const react_2 = require("react");
+const react_3 = require("thirdweb/react");
+const useFirstEOA_1 = require("../../hooks/useFirstEOA");
+const IPFSMediaRenderer_1 = require("../IPFSMediaRenderer/IPFSMediaRenderer");
+const ProfileSection = () => {
+    const account = (0, react_3.useActiveAccount)();
+    const { address: eoaAddress } = (0, useFirstEOA_1.useFirstEOA)();
+    const { address: smartWalletAddress } = (0, react_1.useAccountWallet)();
+    const { data: profile } = (0, react_1.useProfile)({
+        address: eoaAddress || account?.address,
+        fresh: true,
+    });
+    const { user } = (0, react_1.useB3)();
+    const setB3ModalOpen = (0, react_1.useModalStore)(state => state.setB3ModalOpen);
+    const setB3ModalContentType = (0, react_1.useModalStore)(state => state.setB3ModalContentType);
+    const navigateBack = (0, react_1.useModalStore)(state => state.navigateBack);
+    const { data: simBalance } = (0, react_1.useSimBalance)(smartWalletAddress);
+    // Calculate total balance in USD
+    const totalBalanceUsd = (0, react_2.useMemo)(() => {
+        if (!simBalance?.balances)
+            return 0;
+        return simBalance.balances.reduce((sum, token) => sum + (token.value_usd || 0), 0);
+    }, [simBalance]);
+    const handleEditAvatar = () => {
+        setB3ModalOpen(true);
+        setB3ModalContentType({
+            type: "avatarEditor",
+            onSuccess: () => {
+                // navigate back on success
+                navigateBack();
+            },
+        });
+    };
+    // IPFSMediaRenderer will handle IPFS URL conversion and validation
+    const avatarSrc = user?.avatar || profile?.avatar;
+    // Get current username - prioritize user.username, fallback to profile data
+    const currentUsername = user?.username || profile?.displayName || (0, utils_1.formatUsername)(profile?.name || "");
+    return ((0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-between px-5 py-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "global-account-profile flex items-center gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "global-account-profile-avatar relative", children: [(0, jsx_runtime_1.jsx)(IPFSMediaRenderer_1.IPFSMediaRenderer, { src: avatarSrc, alt: "Profile Avatar", className: "border-b3-line border-1 bg-b3-primary-wash size-14 rounded-full border" }), (0, jsx_runtime_1.jsx)("button", { onClick: handleEditAvatar, className: "border-b3-background hover:bg-b3-grey/80 absolute -bottom-1 -right-1 flex size-6 items-center justify-center rounded-full border-4 bg-[#a0a0ab] transition-colors", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Pencil, { size: 10, className: "text-b3-background" }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: "global-account-profile-info flex flex-col gap-1", children: [(0, jsx_runtime_1.jsxs)("h2", { className: "text-b3-grey font-neue-montreal-semibold flex h-[38px] items-center gap-1 text-xl", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-b3-foreground-muted", children: " $" }), (0, jsx_runtime_1.jsx)("div", { className: "text-[30px]", children: (0, number_1.formatDisplayNumber)(totalBalanceUsd, { fractionDigits: 2 }) })] }), (0, jsx_runtime_1.jsx)("div", { className: "b3-modal-username font-neue-montreal-semibold text-base leading-none text-[#0B57C2]", children: currentUsername })] })] }) }));
+};
+exports.default = ProfileSection;

package/dist/cjs/global-account/react/components/ManageAccount/SettingsContent.d.ts

@@ -0,0 +1,7 @@
+import { Chain } from "thirdweb";
+declare const SettingsContent: ({ partnerId, onLogout, chain, }: {
+    partnerId: string;
+    onLogout?: () => void;
+    chain: Chain;
+}) => import("react/jsx-runtime").JSX.Element;
+export default SettingsContent;