@blocklet/ui-react 2.13.70 → 3.0.0

package/lib/UserCenter/components/storage/preview-nft.js

@@ -1,69 +1,66 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import ReactPlaceholder from "react-placeholder";
-import { Dialog, DialogContent, IconButton } from "@mui/material";
-import CloseOutlinedIcon from "@mui/icons-material/CloseOutlined";
-import EmptySpacesNFT from "./icons/empty-spaces-nft.svg?react";
-function PreviewSpaceNft({ src, alt }) {
-  const [showEmptySpaceNFT, setShowEmptySpaceNFT] = useState(false);
-  const [open, setOpen] = useState(false);
-  const handleOpen = () => setOpen(true);
-  const handleClose = () => setOpen(false);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      ReactPlaceholder,
+import { jsxs as a, Fragment as d, jsx as e } from "react/jsx-runtime";
+import { useState as n } from "react";
+import m from "react-placeholder";
+import { Dialog as f, DialogContent as u, IconButton as g } from "@mui/material";
+import { CloseOutlined as y } from "@mui/icons-material";
+import s from "./icons/empty-spaces-nft.svg.js";
+function k({ src: t, alt: p }) {
+  const [o, c] = n(!1), [h, i] = n(!1), r = () => i(!0), l = () => i(!1);
+  return /* @__PURE__ */ a(d, { children: [
+    /* @__PURE__ */ e(
+      m,
       {
-        ready: showEmptySpaceNFT,
+        ready: o,
         customPlaceholder: (
           // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
-          /* @__PURE__ */ jsx(
+          /* @__PURE__ */ e(
             "img",
             {
               style: { cursor: "pointer" },
-              alt,
-              src,
+              alt: p,
+              src: t,
               width: "58px",
               height: "58px",
-              onError: () => setShowEmptySpaceNFT(true),
-              onClick: handleOpen
+              onError: () => c(!0),
+              onClick: r
             }
           )
         ),
-        children: /* @__PURE__ */ jsx(EmptySpacesNFT, { style: { cursor: "pointer", width: "58px", height: "58px" }, onClick: handleOpen })
+        children: /* @__PURE__ */ e(s, { style: { cursor: "pointer", width: "58px", height: "58px" }, onClick: r })
       }
     ),
-    /* @__PURE__ */ jsx(
-      Dialog,
+    /* @__PURE__ */ e(
+      f,
       {
-        open,
-        onClose: handleClose,
+        open: h,
+        onClose: l,
         "aria-labelledby": "preview-space-nft-display",
         "aria-describedby": "preview space nft display",
-        fullWidth: true,
+        fullWidth: !0,
         maxWidth: "md",
-        children: /* @__PURE__ */ jsxs(DialogContent, { style: { padding: "8px 8px", backgroundColor: "rgba(0,0,0,0.8)" }, children: [
-          /* @__PURE__ */ jsx(
-            IconButton,
+        children: /* @__PURE__ */ a(u, { style: { padding: "8px 8px", backgroundColor: "rgba(0,0,0,0.8)" }, children: [
+          /* @__PURE__ */ e(
+            g,
             {
               color: "inherit",
-              onClick: handleClose,
+              onClick: l,
               "aria-label": "close",
               style: { position: "absolute", top: 8, right: 8, color: "white" },
-              children: /* @__PURE__ */ jsx(CloseOutlinedIcon, {})
+              children: /* @__PURE__ */ e(y, {})
             }
           ),
-          showEmptySpaceNFT ? /* @__PURE__ */ jsx(
-            EmptySpacesNFT,
+          o ? /* @__PURE__ */ e(
+            s,
             {
               style: {
                 width: "100%",
                 height: "75vh"
               }
             }
-          ) : /* @__PURE__ */ jsx(
+          ) : /* @__PURE__ */ e(
             "img",
             {
-              src,
+              src: t,
               alt: "",
               style: {
                 width: "100%",
@@ -77,4 +74,6 @@ function PreviewSpaceNft({ src, alt }) {
     )
   ] });
 }
-export default PreviewSpaceNft;
+export {
+  k as default
+};

package/lib/UserCenter/components/third-party-login/index.js

@@ -1,166 +1,93 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import noop from "lodash/noop";
-import { useContext, useState } from "react";
-import { Box } from "@mui/material";
-import { useAsyncEffect, useCreation } from "ahooks";
-import { getConnectedAccounts, getSourceProvider } from "@arcblock/ux/lib/SessionUser/libs/utils";
-import { LOGIN_PROVIDER } from "@arcblock/ux/lib/Util/constant";
-import { SessionContext } from "@arcblock/did-connect/lib/Session";
-import { PasskeyActions } from "@arcblock/did-connect/lib/Passkey";
-import { useBrowser } from "@arcblock/react-hooks";
-import ThirdPartyItem from "./third-party-item.js";
-export default function ThirdPartyLogin({ user }) {
-  const { session } = useContext(SessionContext);
-  const [oauthConfigs, setOauthConfigs] = useState({});
-  const { getOAuthConfigs } = session.useOAuth();
-  const browser = useBrowser();
-  useAsyncEffect(async () => {
-    const data = await getOAuthConfigs({
-      sourceAppPid: user?.sourceAppPid
+import { jsx as s, jsxs as L, Fragment as O } from "react/jsx-runtime";
+import a from "lodash/noop";
+import { use as k, useState as H } from "react";
+import { Box as U } from "@mui/material";
+import { useAsyncEffect as B, useCreation as f } from "ahooks";
+import { getConnectedAccounts as l, getSourceProvider as G } from "@arcblock/ux/lib/SessionUser/libs/utils";
+import { LOGIN_PROVIDER as t } from "@arcblock/ux/lib/Util/constant";
+import { SessionContext as I } from "@arcblock/did-connect/lib/Session";
+import { PasskeyActions as T } from "@arcblock/did-connect/lib/Passkey";
+import { useBrowser as S } from "@arcblock/react-hooks";
+import u from "./third-party-item.js";
+function q({ user: r }) {
+  const { session: C } = k(I), [m, w] = H({}), { getOAuthConfigs: E } = C.useOAuth(), A = S();
+  B(async () => {
+    const e = await E({
+      sourceAppPid: r == null ? void 0 : r.sourceAppPid
     });
-    setOauthConfigs(data);
-  }, [user?.sourceAppPid]);
-  const availableProviders = useCreation(() => {
-    const oauthList = Object.keys(oauthConfigs).map((x) => {
-      return {
-        ...oauthConfigs[x],
-        provider: x
-      };
-    }).filter((x) => x.enabled);
-    return oauthList;
-  }, [oauthConfigs]);
-  const oauthAccounts = useCreation(() => {
-    const connectedAccounts = getConnectedAccounts(user);
-    let removeAuth0 = false;
-    let patchProvider = "";
-    let sourceProvider = getSourceProvider(user);
-    const auth0ConnectedAccount = connectedAccounts.find((x) => x.provider === LOGIN_PROVIDER.AUTH0);
-    if (auth0ConnectedAccount) {
-      if (auth0ConnectedAccount.id.startsWith("google-oauth2|")) {
-        if (!connectedAccounts.some((x) => x.provider === "google")) {
-          removeAuth0 = true;
-          patchProvider = LOGIN_PROVIDER.GOOGLE;
-          if (sourceProvider === LOGIN_PROVIDER.AUTH0) {
-            sourceProvider = LOGIN_PROVIDER.GOOGLE;
-          }
-        }
-      }
-      if (auth0ConnectedAccount.id.startsWith("appleid|")) {
-        if (!connectedAccounts.some((x) => x.provider === LOGIN_PROVIDER.APPLE)) {
-          removeAuth0 = true;
-          patchProvider = LOGIN_PROVIDER.APPLE;
-          if (sourceProvider === LOGIN_PROVIDER.AUTH0) {
-            sourceProvider = LOGIN_PROVIDER.APPLE;
-          }
-        }
-      }
-      if (auth0ConnectedAccount.id.startsWith("github|")) {
-        if (!connectedAccounts.some((x) => x.provider === LOGIN_PROVIDER.GITHUB)) {
-          removeAuth0 = true;
-          patchProvider = LOGIN_PROVIDER.GITHUB;
-          if (sourceProvider === LOGIN_PROVIDER.AUTH0) {
-            sourceProvider = LOGIN_PROVIDER.GITHUB;
-          }
-        }
-      }
-    }
-    const transformedProviders = availableProviders.map((x) => {
-      if (x.provider === LOGIN_PROVIDER.AUTH0 && removeAuth0) {
+    w(e);
+  }, [r == null ? void 0 : r.sourceAppPid]);
+  const P = f(() => Object.keys(m).map((i) => ({
+    ...m[i],
+    provider: i
+  })).filter((i) => i.enabled), [m]), h = f(() => {
+    const e = l(r);
+    let i = !1, n = "", c = G(r);
+    const p = e.find((o) => o.provider === t.AUTH0);
+    return p && (p.id.startsWith("google-oauth2|") && (e.some((o) => o.provider === "google") || (i = !0, n = t.GOOGLE, c === t.AUTH0 && (c = t.GOOGLE))), p.id.startsWith("appleid|") && (e.some((o) => o.provider === t.APPLE) || (i = !0, n = t.APPLE, c === t.AUTH0 && (c = t.APPLE))), p.id.startsWith("github|") && (e.some((o) => o.provider === t.GITHUB) || (i = !0, n = t.GITHUB, c === t.AUTH0 && (c = t.GITHUB)))), P.map((o) => {
+      if (o.provider === t.AUTH0 && i)
         return null;
-      }
-      const findConnectedAccount = removeAuth0 && x.provider === patchProvider ? connectedAccounts.find((i) => i.provider === LOGIN_PROVIDER.AUTH0) : connectedAccounts.find((i) => i.provider === x.provider);
-      if (findConnectedAccount) {
-        return {
-          ...x,
-          provider: x.provider,
-          did: findConnectedAccount.did,
-          pk: findConnectedAccount.pk,
-          userInfo: findConnectedAccount.userInfo,
-          _bind: true,
-          _rawProvider: findConnectedAccount.provider,
-          _mainProvider: x.provider === sourceProvider
-        };
-      }
-      return {
-        ...x,
-        provider: x.provider,
-        _rawProvider: x.provider,
-        _mainProvider: x.provider === sourceProvider
-      };
-    }).filter(Boolean).sort((a, b) => {
-      if (a?.order !== void 0 && b?.order !== void 0) {
-        return a.order - b.order;
-      }
-      if (a?.order !== void 0) {
-        return -1;
-      }
-      return 1;
-    });
-    return transformedProviders;
-  }, [user?.connectedAccounts, availableProviders]);
-  const passkeyAccounts = useCreation(() => {
-    const connectedAccounts = getConnectedAccounts(user);
-    const passkeyConnectedAccount = connectedAccounts.filter(
-      (x) => x.provider === LOGIN_PROVIDER.PASSKEY && x.did !== user?.did
-    );
-    return passkeyConnectedAccount.map((x) => {
-      return {
-        ...x,
-        _bind: true
+      const d = i && o.provider === n ? e.find((v) => v.provider === t.AUTH0) : e.find((v) => v.provider === o.provider);
+      return d ? {
+        ...o,
+        provider: o.provider,
+        did: d.did,
+        pk: d.pk,
+        userInfo: d.userInfo,
+        _bind: !0,
+        _rawProvider: d.provider,
+        _mainProvider: o.provider === c
+      } : {
+        ...o,
+        provider: o.provider,
+        _rawProvider: o.provider,
+        _mainProvider: o.provider === c
       };
-    });
-  }, [user]);
-  const walletAccounts = useCreation(() => {
-    const connectedAccounts = getConnectedAccounts(user);
-    const walletConnectedAccount = connectedAccounts.filter(
-      (x) => x.provider === LOGIN_PROVIDER.WALLET && x.did !== user?.did
-    );
-    return walletConnectedAccount.map((x) => {
-      return {
-        ...x,
-        _mainProvider: true
-      };
-    });
-  }, [user]);
-  return /* @__PURE__ */ jsx(
-    Box,
+    }).filter(Boolean).sort((o, d) => (o == null ? void 0 : o.order) !== void 0 && (d == null ? void 0 : d.order) !== void 0 ? o.order - d.order : (o == null ? void 0 : o.order) !== void 0 ? -1 : 1);
+  }, [r == null ? void 0 : r.connectedAccounts, P]), g = f(() => l(r).filter(
+    (n) => n.provider === t.PASSKEY && n.did !== (r == null ? void 0 : r.did)
+  ).map((n) => ({
+    ...n,
+    _bind: !0
+  })), [r]), y = f(() => l(r).filter(
+    (n) => n.provider === t.WALLET && n.did !== (r == null ? void 0 : r.did)
+  ).map((n) => ({
+    ...n,
+    _mainProvider: !0
+  })), [r]);
+  return /* @__PURE__ */ s(
+    U,
     {
       sx: {
         gap: 1,
         display: "grid",
         gridTemplateColumns: "1fr min-content"
       },
-      children: !oauthAccounts.length && !passkeyAccounts.length && !walletAccounts.length ? /* @__PURE__ */ jsx(
-        PasskeyActions,
+      children: !h.length && !g.length && !y.length ? /* @__PURE__ */ s(
+        T,
         {
           behavior: "only-new",
           action: "connect",
           createMode: "connect",
           createButtonText: "Add Passkey",
-          onSuccess: noop,
-          onError: noop,
-          dense: true
+          onSuccess: a,
+          onError: a,
+          dense: !0
         }
-      ) : /* @__PURE__ */ jsxs(Fragment, { children: [
-        oauthAccounts.map((account) => {
-          return /* @__PURE__ */ jsx(ThirdPartyItem, { item: account }, account?.provider);
-        }),
-        passkeyAccounts.map((account) => {
-          return /* @__PURE__ */ jsx(ThirdPartyItem, { item: account }, account.id);
-        }),
-        walletAccounts.map((account) => {
-          return /* @__PURE__ */ jsx(ThirdPartyItem, { item: account }, account.id);
-        }),
-        browser.wallet || browser.arcSphere ? null : /* @__PURE__ */ jsx(
-          PasskeyActions,
+      ) : /* @__PURE__ */ L(O, { children: [
+        h.map((e) => /* @__PURE__ */ s(u, { item: e }, e == null ? void 0 : e.provider)),
+        g.map((e) => /* @__PURE__ */ s(u, { item: e }, e.id)),
+        y.map((e) => /* @__PURE__ */ s(u, { item: e }, e.id)),
+        A.wallet || A.arcSphere ? null : /* @__PURE__ */ s(
+          T,
           {
             behavior: "only-new",
             action: "connect",
             createMode: "connect",
             createButtonText: "Add New Passkey",
-            onSuccess: noop,
-            onError: noop,
-            dense: true,
+            onSuccess: a,
+            onError: a,
+            dense: !0,
             sx: {
               px: 1.5,
               py: 1,
@@ -172,3 +99,6 @@ export default function ThirdPartyLogin({ user }) {
     }
   );
 }
+export {
+  q as default
+};