@agg-market/ui 11.0.0 → 12.0.0

package/dist/{chunk-5FSWOXEG.mjs → chunk-TA74OXPL.mjs}

@@ -34,7 +34,7 @@ import {
   formatAmountDisplay,
   formatCompactUsd,
   venueLogoLabels
-} from "./chunk-IUJXJEDQ.mjs";
+} from "./chunk-XUML4ZJQ.mjs";
 
 // src/deposit/index.tsx
 import { useState as useState3 } from "react";
@@ -606,8 +606,7 @@ var DepositModal = ({
     setStep("method");
   };
   const handleSelectMethod = (method) => {
-    if (!selectedVenue)
-      return;
+    if (!selectedVenue) return;
     if (method === "card") {
       setStep("card-deposit");
     } else {
@@ -1019,10 +1018,9 @@ var OnrampModal = ({
     },
     [onOpenChange]
   );
-  const handleGetQuotes = useCallback4(() => __async(void 0, null, function* () {
+  const handleGetQuotes = useCallback4(() => __async(null, null, function* () {
     const numericAmount2 = Number(formValues.amount);
-    if (!numericAmount2 || numericAmount2 <= 0)
-      return;
+    if (!numericAmount2 || numericAmount2 <= 0) return;
     setStep("quotes");
     setIsLoadingQuotes(true);
     setQuoteError(null);
@@ -1042,7 +1040,7 @@ var OnrampModal = ({
     }
   }), [formValues, transactionType, onGetQuotes]);
   const handleSelectQuote = useCallback4(
-    (quote) => __async(void 0, null, function* () {
+    (quote) => __async(null, null, function* () {
       setStep("widget");
       setIsCreatingSession(true);
       try {
@@ -1143,8 +1141,7 @@ var VenueRow2 = ({ venue, onSelect }) => {
       onClick: (e) => {
         e.stopPropagation();
         e.preventDefault();
-        if (!isDisabled)
-          onSelect(venue.venue);
+        if (!isDisabled) onSelect(venue.venue);
       },
       onKeyDown: (e) => {
         if (!isDisabled && (e.key === "Enter" || e.key === " ")) {
@@ -1509,15 +1506,13 @@ var WithdrawModal = ({
     setSelectedMethod(null);
   };
   const handleSelectMethod = (method) => {
-    if (!selectedVenue)
-      return;
+    if (!selectedVenue) return;
     setSelectedMethod(method);
     setStep("withdraw-amount");
     onSelectWithdrawMethod == null ? void 0 : onSelectWithdrawMethod(selectedVenue.venue, method);
   };
   const handleContinueWithdraw = (amount) => {
-    if (!selectedVenue || !selectedMethod)
-      return;
+    if (!selectedVenue || !selectedMethod) return;
     if (selectedMethod === "wallet") {
       onContinueWalletWithdraw == null ? void 0 : onContinueWalletWithdraw(selectedVenue.venue, amount);
     } else {
@@ -1600,8 +1595,7 @@ var HowItWorksStep = ({ onContinue, icons }) => {
   const [showBottomGradient, setShowBottomGradient] = useState7(true);
   const handleScroll = useCallback6(() => {
     const el = scrollRef.current;
-    if (!el)
-      return;
+    if (!el) return;
     setShowTopGradient(el.scrollTop > 0);
     setShowBottomGradient(el.scrollTop + el.clientHeight < el.scrollHeight - 1);
   }, []);
@@ -1684,8 +1678,7 @@ var ProfileSetupStep = ({ onContinue }) => {
   const handleFileChange = useCallback7((e) => {
     var _a;
     const file = (_a = e.target.files) == null ? void 0 : _a[0];
-    if (!file)
-      return;
+    if (!file) return;
     setAvatarFile(file);
     const reader = new FileReader();
     reader.onload = (event) => {
@@ -1705,30 +1698,51 @@ var ProfileSetupStep = ({ onContinue }) => {
     /* @__PURE__ */ jsx18("h2", { className: "text-center text-agg-2xl font-agg-bold text-agg-foreground", children: labels.onboarding.profileSetup.title }),
     /* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-5 items-center w-full", children: [
       /* @__PURE__ */ jsxs18("div", { className: "flex justify-center", children: [
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsxs18(
           "button",
           {
             type: "button",
             onClick: handleAvatarClick,
             className: cn(
-              "relative flex items-center justify-center",
+              "group relative flex items-center justify-center",
               "h-[80px] w-[80px]",
               "rounded-agg-full",
-              "border border-dashed border-agg-separator",
               "bg-agg-secondary-hover",
-              "hover:bg-agg-tertiary",
+              !avatarPreview && "hover:bg-agg-tertiary",
               "transition-colors cursor-pointer",
               "overflow-hidden"
             ),
             "aria-label": labels.onboarding.profileSetup.uploadProfilePictureAria,
-            children: avatarPreview ? /* @__PURE__ */ jsx18(
-              RemoteImage,
-              {
-                src: avatarPreview,
-                alt: labels.onboarding.profileSetup.profilePreviewAlt,
-                className: "h-full w-full object-cover"
-              }
-            ) : /* @__PURE__ */ jsx18(ProfileIcon, { className: "h-7 w-7 text-agg-muted-foreground" })
+            children: [
+              !avatarPreview ? /* @__PURE__ */ jsx18(
+                "svg",
+                {
+                  "aria-hidden": true,
+                  viewBox: "0 0 80 80",
+                  className: "pointer-events-none absolute inset-0 h-full w-full text-agg-separator group-hover:text-agg-muted-foreground",
+                  children: /* @__PURE__ */ jsx18(
+                    "circle",
+                    {
+                      cx: "40",
+                      cy: "40",
+                      r: "39.5",
+                      fill: "none",
+                      stroke: "currentColor",
+                      strokeWidth: "1",
+                      strokeDasharray: "8 8"
+                    }
+                  )
+                }
+              ) : null,
+              avatarPreview ? /* @__PURE__ */ jsx18(
+                RemoteImage,
+                {
+                  src: avatarPreview,
+                  alt: labels.onboarding.profileSetup.profilePreviewAlt,
+                  className: "h-full w-full object-cover"
+                }
+              ) : /* @__PURE__ */ jsx18(ProfileIcon, { className: "h-7 w-7 text-agg-muted-foreground" })
+            ]
           }
         ),
         /* @__PURE__ */ jsx18(
@@ -1931,9 +1945,8 @@ var ConnectKalshiModal = ({
   const handleCancel = useCallback8(() => {
     onOpenChange(false);
   }, [onOpenChange]);
-  const handleVerify = useCallback8(() => __async(void 0, null, function* () {
-    if (!canVerify || verifying)
-      return;
+  const handleVerify = useCallback8(() => __async(null, null, function* () {
+    if (!canVerify || verifying) return;
     setVerifying(true);
     setError(void 0);
     try {
@@ -2179,9 +2192,8 @@ var ConnectOnchainModal = ({
   const handleCancel = useCallback9(() => {
     onOpenChange(false);
   }, [onOpenChange]);
-  const handleConnect = useCallback9(() => __async(void 0, null, function* () {
-    if (connecting)
-      return;
+  const handleConnect = useCallback9(() => __async(null, null, function* () {
+    if (connecting) return;
     setConnecting(true);
     setError(void 0);
     try {
@@ -2321,7 +2333,7 @@ var OnboardingModal = ({
   const handleOpenOnchainModal = useCallback10(() => {
     setOnchainModalOpen(true);
   }, []);
-  const handleOnchainConnect = useCallback10(() => __async(void 0, null, function* () {
+  const handleOnchainConnect = useCallback10(() => __async(null, null, function* () {
     yield onConnectOnchain == null ? void 0 : onConnectOnchain();
     setOnchainConnected(true);
   }), [onConnectOnchain]);
@@ -2329,7 +2341,7 @@ var OnboardingModal = ({
     setKalshiModalOpen(true);
   }, []);
   const handleKalshiVerify = useCallback10(
-    (credentials) => __async(void 0, null, function* () {
+    (credentials) => __async(null, null, function* () {
       yield onConnectKalshi == null ? void 0 : onConnectKalshi(credentials);
       setKalshiConnected(true);
     }),
@@ -2382,7 +2394,8 @@ var OnboardingModal = ({
 OnboardingModal.displayName = "OnboardingModal";
 
 // src/profile/index.tsx
-import { useState as useState12, useEffect as useEffect2, useCallback as useCallback12 } from "react";
+import { useState as useState12, useEffect as useEffect2, useCallback as useCallback12, useMemo as useMemo2 } from "react";
+import { useAggClient, useAggAuthState } from "@agg-market/hooks";
 
 // src/profile/profile-modal.constants.ts
 var PROFILE_TAB_KEYS = {
@@ -2400,7 +2413,7 @@ import { useLabels as useLabels7 } from "@agg-market/hooks";
 import { jsx as jsx23, jsxs as jsxs23 } from "react/jsx-runtime";
 var AboutTab = ({
   avatarPreview,
-  onDeleteProfile,
+  onDeleteProfile: _onDeleteProfile,
   draftUsername,
   onDraftUsernameChange,
   onDraftAvatarChange,
@@ -2416,8 +2429,7 @@ var AboutTab = ({
     (e) => {
       var _a;
       const file = (_a = e.target.files) == null ? void 0 : _a[0];
-      if (!file)
-        return;
+      if (!file) return;
       const reader = new FileReader();
       reader.onload = (event) => {
         var _a2;
@@ -2428,32 +2440,54 @@ var AboutTab = ({
     [onDraftAvatarChange]
   );
   const resolvedPreview = draftAvatarPreview != null ? draftAvatarPreview : avatarPreview;
+  const hasAvatarPreview = Boolean(resolvedPreview);
   return /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-8", children: [
     /* @__PURE__ */ jsxs23("div", { className: "flex justify-center", children: [
-      /* @__PURE__ */ jsx23(
+      /* @__PURE__ */ jsxs23(
         "button",
         {
           type: "button",
           onClick: handleAvatarClick,
           className: cn(
-            "relative flex items-center justify-center",
+            "group relative flex items-center justify-center",
             "h-[80px] w-[80px]",
             "rounded-agg-full",
-            "border-2 border-dashed border-agg-separator",
             "bg-agg-secondary",
-            "hover:border-agg-muted-foreground hover:bg-agg-secondary-hover",
+            !hasAvatarPreview && "hover:bg-agg-secondary-hover",
             "transition-colors cursor-pointer",
             "overflow-hidden"
           ),
           "aria-label": labels.onboarding.profileSetup.uploadProfilePictureAria,
-          children: resolvedPreview ? /* @__PURE__ */ jsx23(
-            RemoteImage,
-            {
-              src: resolvedPreview,
-              alt: labels.onboarding.profileSetup.profilePreviewAlt,
-              className: "h-full w-full object-cover"
-            }
-          ) : /* @__PURE__ */ jsx23(ProfileIcon, { className: "h-8 w-8 text-agg-muted-foreground" })
+          children: [
+            !hasAvatarPreview ? /* @__PURE__ */ jsx23(
+              "svg",
+              {
+                "aria-hidden": true,
+                viewBox: "0 0 80 80",
+                className: "pointer-events-none absolute inset-0 h-full w-full text-agg-separator group-hover:text-agg-muted-foreground",
+                children: /* @__PURE__ */ jsx23(
+                  "circle",
+                  {
+                    cx: "40",
+                    cy: "40",
+                    r: "39.5",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "1",
+                    strokeDasharray: "8 8"
+                  }
+                )
+              }
+            ) : null,
+            resolvedPreview ? /* @__PURE__ */ jsx23(
+              RemoteImage,
+              {
+                src: resolvedPreview,
+                alt: labels.onboarding.profileSetup.profilePreviewAlt,
+                className: "h-full w-full object-cover"
+              }
+            ) : /* @__PURE__ */ jsx23(ProfileIcon, { className: "h-8 w-8 text-agg-muted-foreground" })
+          ]
         }
       ),
       /* @__PURE__ */ jsx23(
@@ -2498,28 +2532,6 @@ var AboutTab = ({
           )
         }
       )
-    ] }),
-    /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-4", children: [
-      /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-1", children: [
-        /* @__PURE__ */ jsx23("span", { className: "text-agg-sm font-agg-bold leading-agg-5 text-agg-foreground", children: "Delete your profile" }),
-        /* @__PURE__ */ jsx23("span", { className: "text-agg-sm leading-agg-5 text-agg-foreground", children: "This will permanently delete your account and all of its data. You will not be able to reactivate this account." })
-      ] }),
-      /* @__PURE__ */ jsx23(
-        "button",
-        {
-          type: "button",
-          onClick: onDeleteProfile,
-          className: cn(
-            "self-start cursor-pointer",
-            "rounded-agg-full border border-[#e5455f]",
-            "h-8 px-4",
-            "text-agg-sm font-agg-bold leading-agg-5 text-[#e5455f]",
-            "bg-agg-secondary hover:bg-[#e5455f]/10",
-            "transition-colors"
-          ),
-          children: "Delete Profile"
-        }
-      )
     ] })
   ] });
 };
@@ -2565,15 +2577,13 @@ var AccountsWalletsTab = ({
   onDisconnectExchange,
   onConnectTwitter,
   onDisconnectTwitter,
-  onConnectDiscord,
-  onDisconnectDiscord,
-  onConnectTelegram,
-  onDisconnectTelegram,
+  onConnectDiscord: _onConnectDiscord,
+  onDisconnectDiscord: _onDisconnectDiscord,
+  onConnectTelegram: _onConnectTelegram,
+  onDisconnectTelegram: _onDisconnectTelegram,
   onConnectEmail
 }) => {
   const twitter = socialAccounts == null ? void 0 : socialAccounts.twitter;
-  const discord = socialAccounts == null ? void 0 : socialAccounts.discord;
-  const telegram = socialAccounts == null ? void 0 : socialAccounts.telegram;
   return /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-8", children: [
     /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-3", children: [
       /* @__PURE__ */ jsx24(SectionTitle, { children: "Exchanges" }),
@@ -2602,29 +2612,13 @@ var AccountsWalletsTab = ({
     ] }),
     /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-3", children: [
       /* @__PURE__ */ jsx24(SectionTitle, { children: "Social Accounts" }),
-      /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-2", children: [
-        /* @__PURE__ */ jsxs24(AccountRow, { children: [
-          /* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-3", children: [
-            /* @__PURE__ */ jsx24("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center text-agg-foreground", children: /* @__PURE__ */ jsx24(Icon, { name: "twitter", size: "small", color: "currentColor" }) }),
-            /* @__PURE__ */ jsx24("span", { className: "text-agg-base font-agg-normal leading-6 text-agg-foreground whitespace-nowrap", children: "X (Twitter)" })
-          ] }),
-          (twitter == null ? void 0 : twitter.connected) ? /* @__PURE__ */ jsx24(DisconnectTextButton, { onClick: onDisconnectTwitter }) : /* @__PURE__ */ jsx24(ConnectTextButton, { onClick: onConnectTwitter })
+      /* @__PURE__ */ jsx24("div", { className: "flex flex-col gap-2", children: /* @__PURE__ */ jsxs24(AccountRow, { children: [
+        /* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsx24("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center text-agg-foreground", children: /* @__PURE__ */ jsx24(Icon, { name: "twitter", size: "small", color: "currentColor" }) }),
+          /* @__PURE__ */ jsx24("span", { className: "text-agg-base font-agg-normal leading-6 text-agg-foreground whitespace-nowrap", children: "X (Twitter)" })
         ] }),
-        /* @__PURE__ */ jsxs24(AccountRow, { children: [
-          /* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-3", children: [
-            /* @__PURE__ */ jsx24("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center text-[#5865F2]", children: /* @__PURE__ */ jsx24(Icon, { name: "discord", size: "small", color: "currentColor" }) }),
-            /* @__PURE__ */ jsx24("span", { className: "text-agg-base font-agg-normal leading-6 text-agg-foreground whitespace-nowrap", children: "Discord" })
-          ] }),
-          (discord == null ? void 0 : discord.connected) ? /* @__PURE__ */ jsx24(DisconnectTextButton, { onClick: onDisconnectDiscord }) : /* @__PURE__ */ jsx24(ConnectTextButton, { onClick: onConnectDiscord })
-        ] }),
-        /* @__PURE__ */ jsxs24(AccountRow, { children: [
-          /* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-3", children: [
-            /* @__PURE__ */ jsx24("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center text-[#26A5E4]", children: /* @__PURE__ */ jsx24(Icon, { name: "telegram", size: "small", color: "currentColor" }) }),
-            /* @__PURE__ */ jsx24("span", { className: "text-agg-base font-agg-normal leading-6 text-agg-foreground whitespace-nowrap", children: "Telegram" })
-          ] }),
-          (telegram == null ? void 0 : telegram.connected) ? /* @__PURE__ */ jsx24(DisconnectTextButton, { onClick: onDisconnectTelegram }) : /* @__PURE__ */ jsx24(ConnectTextButton, { onClick: onConnectTelegram })
-        ] })
-      ] })
+        (twitter == null ? void 0 : twitter.connected) ? /* @__PURE__ */ jsx24(DisconnectTextButton, { onClick: onDisconnectTwitter }) : /* @__PURE__ */ jsx24(ConnectTextButton, { onClick: onConnectTwitter })
+      ] }) })
     ] }),
     /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-3", children: [
       /* @__PURE__ */ jsx24(SectionTitle, { children: "Email Address" }),
@@ -2674,6 +2668,9 @@ var ProfileModal = ({
   onDisconnectTelegram,
   onConnectEmail
 }) => {
+  var _a, _b, _c, _d, _e, _f;
+  const client = useAggClient();
+  const { user, startAuth } = useAggAuthState();
   const [activeTab, setActiveTab] = useState12(PROFILE_TAB_KEYS.ABOUT);
   const [draftUsername, setDraftUsername] = useState12(username != null ? username : "");
   const [draftAvatarFile, setDraftAvatarFile] = useState12();
@@ -2711,21 +2708,112 @@ var ProfileModal = ({
     []
   );
   const hasChanges = draftUsername !== (username != null ? username : "") || draftAvatarFile !== void 0;
-  const handleSave = useCallback12(() => {
+  const handleSave = useCallback12(() => __async(null, null, function* () {
     setIsSaving(true);
-    onSave({
-      username: draftUsername || void 0,
-      avatarFile: draftAvatarFile,
-      avatarPreview: draftAvatarPreview
-    });
-    setTimeout(() => {
-      setIsSaving(false);
+    try {
+      const normalizedUsername = draftUsername.trim();
+      if (normalizedUsername !== (username != null ? username : "")) {
+        yield client.updateUser({ username: normalizedUsername || void 0 });
+      }
+      if (draftAvatarFile) {
+        const { uploadUrl } = yield client.createAvatarUploadUrl(draftAvatarFile.type);
+        yield fetch(uploadUrl, {
+          method: "PUT",
+          headers: {
+            "Content-Type": draftAvatarFile.type
+          },
+          body: draftAvatarFile
+        });
+        yield client.updateUser({ confirmAvatar: true });
+      }
+      yield client.getCurrentUser();
+      onSave({
+        username: normalizedUsername || void 0,
+        avatarFile: draftAvatarFile,
+        avatarPreview: draftAvatarPreview
+      });
       onOpenChange(false);
-    }, 500);
-  }, [draftUsername, draftAvatarFile, draftAvatarPreview, onSave, onOpenChange]);
+    } finally {
+      setIsSaving(false);
+    }
+  }), [client, draftAvatarFile, draftAvatarPreview, draftUsername, onOpenChange, onSave, username]);
   const handleCancel = useCallback12(() => {
     handleOpenChange(false);
   }, [handleOpenChange]);
+  const isAccountConnected = (providers) => {
+    var _a2, _b2, _c2;
+    const normalizedProviders = providers.map((provider) => provider.toLowerCase());
+    const fromAccounts = (_b2 = (_a2 = user == null ? void 0 : user.accounts) == null ? void 0 : _a2.some(
+      (account) => normalizedProviders.includes(String(account.provider).toLowerCase())
+    )) != null ? _b2 : false;
+    const legacyIdentities = user == null ? void 0 : user.identities;
+    const fromLegacy = (_c2 = legacyIdentities == null ? void 0 : legacyIdentities.some(
+      (identity) => {
+        var _a3;
+        return normalizedProviders.includes(String((_a3 = identity.provider) != null ? _a3 : "").toLowerCase());
+      }
+    )) != null ? _c2 : false;
+    return fromAccounts || fromLegacy;
+  };
+  const resolvedSocialAccounts = socialAccounts != null ? socialAccounts : {
+    twitter: {
+      connected: isAccountConnected(["twitter"])
+    }
+  };
+  const resolvedEmail = (_f = (_e = email != null ? email : (_b = (_a = user == null ? void 0 : user.accounts) == null ? void 0 : _a.find(
+    (account) => String(account.provider).toLowerCase() === "email"
+  )) == null ? void 0 : _b.providerAccountId) != null ? _e : (_d = (_c = user == null ? void 0 : user.identities) == null ? void 0 : _c.find((identity) => {
+    var _a2;
+    return String((_a2 = identity.provider) != null ? _a2 : "").toLowerCase() === "email";
+  })) == null ? void 0 : _d.providerAccountId) != null ? _f : null;
+  const resolveRedirectUrl = () => {
+    if (typeof window === "undefined") return "http://localhost";
+    return `${window.location.origin}${window.location.pathname}${window.location.search}`;
+  };
+  const handleConnectTwitter = useCallback12(() => __async(null, null, function* () {
+    const result = yield startAuth({
+      provider: "twitter",
+      redirectUrl: resolveRedirectUrl()
+    });
+    onConnectTwitter == null ? void 0 : onConnectTwitter();
+    if (result.type === "redirect" && typeof window !== "undefined") {
+      window.location.assign(result.url);
+    }
+  }), [onConnectTwitter, startAuth]);
+  const handleDisconnectTwitter = useCallback12(() => __async(null, null, function* () {
+    yield client.disconnectAccount("twitter");
+    yield client.getCurrentUser();
+    onDisconnectTwitter == null ? void 0 : onDisconnectTwitter();
+  }), [client, onDisconnectTwitter]);
+  const handleConnectEmail = useCallback12(() => __async(null, null, function* () {
+    var _a2;
+    const typedEmail = typeof window !== "undefined" ? (_a2 = window.prompt("Enter your email to receive a magic link")) == null ? void 0 : _a2.trim() : void 0;
+    if (!typedEmail) return;
+    yield startAuth({
+      provider: "email",
+      email: typedEmail,
+      redirectUrl: resolveRedirectUrl()
+    });
+    onConnectEmail == null ? void 0 : onConnectEmail();
+  }), [onConnectEmail, startAuth]);
+  const providerActionMap = useMemo2(
+    () => ({
+      twitter: {
+        connect: () => {
+          void handleConnectTwitter();
+        },
+        disconnect: () => {
+          void handleDisconnectTwitter();
+        }
+      },
+      email: {
+        connect: () => {
+          void handleConnectEmail();
+        }
+      }
+    }),
+    [handleConnectEmail, handleConnectTwitter, handleDisconnectTwitter]
+  );
   return /* @__PURE__ */ jsx25(Modal, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ jsxs25(Modal.Container, { maxWidth: "800px", "aria-label": "Edit Profile", children: [
     /* @__PURE__ */ jsx25(Modal.Header, { title: "Edit Profile" }),
     /* @__PURE__ */ jsx25(Modal.Body, { children: /* @__PURE__ */ jsxs25("div", { className: "flex flex-col sm:flex-row sm:gap-10", children: [
@@ -2811,16 +2899,16 @@ var ProfileModal = ({
           AccountsWalletsTab,
           {
             exchanges,
-            socialAccounts,
-            email,
+            socialAccounts: resolvedSocialAccounts,
+            email: resolvedEmail,
             onDisconnectExchange,
-            onConnectTwitter,
-            onDisconnectTwitter,
+            onConnectTwitter: providerActionMap.twitter.connect,
+            onDisconnectTwitter: providerActionMap.twitter.disconnect,
             onConnectDiscord,
             onDisconnectDiscord,
             onConnectTelegram,
             onDisconnectTelegram,
-            onConnectEmail
+            onConnectEmail: providerActionMap.email.connect
           }
         ) : null
       ] })