@arcblock/did-connect-react 3.3.10 → 3.4.1

package/lib/Connect/contexts/state.js

@@ -1,57 +1,64 @@
 import { jsx as O } from "react/jsx-runtime";
 import r from "prop-types";
-import { createContext as V, useState as S, use as E, useRef as W, useEffect as X } from "react";
+import { useState as S, use as W, useRef as D, useEffect as V, createContext as X } from "react";
 import Y from "@arcblock/react-hooks/lib/useBrowser";
-import { useUpdate as Z, useCreation as i, useMemoizedFn as h, useLatest as _, useReactive as $, useSize as ee } from "ahooks";
-import x from "lodash/isUndefined";
-import te from "lodash/noop";
-import { Box as oe } from "@mui/material";
-import { translate as re } from "@arcblock/ux/lib/Locale/util";
-import { getMaster as D, getCurrentApp as ne } from "@arcblock/ux/lib/Util/federated";
-import { getDIDMotifInfo as se } from "@arcblock/did-motif";
-import { isEthereumDid as ie, getDIDColor as pe } from "@arcblock/ux/lib/Util";
-import ce from "../hooks/use-apps.js";
-import { SessionContext as ue } from "../../Session/context.js";
-import de from "../assets/locale.js";
-const R = V({
+import { useUpdate as Z, useCreation as n, useMemoizedFn as h, useLatest as $, useReactive as ee, useSize as te } from "ahooks";
+import E from "lodash/isUndefined";
+import oe from "lodash/noop";
+import { Box as re } from "@mui/material";
+import { translate as ne } from "@arcblock/ux/lib/Locale/util";
+import { getMaster as T, getCurrentApp as se } from "@arcblock/ux/lib/Util/federated";
+import { getDIDMotifInfo as ie } from "@arcblock/did-motif";
+import { isEthereumDid as ce, getDIDColor as pe } from "@arcblock/ux/lib/Util";
+import { GA_LAST_LOGIN_METHOD as ue } from "@arcblock/ux/lib/withTracker/constant";
+import ae from "../hooks/use-apps.js";
+import { SessionContext as de } from "../../Session/context.js";
+import le from "../assets/locale.js";
+const x = X({
   isWalletWebview: !1,
   isMobile: !1,
   matchSmallScreen: !1,
   blocklet: null
-}), { Provider: ae, Consumer: We } = R;
-function le({
-  children: T,
-  blocklet: p,
+}), { Provider: fe, Consumer: We } = x;
+function me({
+  children: R,
+  blocklet: c,
   masterBlocklet: P = void 0,
-  action: d,
+  action: a,
   extraParams: t = {},
-  locale: a = "en",
+  locale: d = "en",
   testOnlyBorderColor: l = void 0,
-  ...j
+  ...L
 }) {
-  const w = Z(), [f, q] = S([]), [z, J] = S(!1), [m, N] = S(""), U = i(() => new Map(f.map((e) => [e.name, e])), [f]), k = h((e) => U.get(e)), B = _(m), L = h((e, s = {}) => re(de, e, a, "en", s)), g = E(ue), o = $({
+  const w = Z(), [f, j] = S([]), [N, q] = S(!1), [m, z] = S(""), G = n(() => new Map(f.map((e) => [e.name, e])), [f]), J = h((e) => G.get(e)), U = $(m), _ = h((e, i = {}) => ne(le, e, d, "en", i)), g = W(de), o = ee({
     sourceAppPid: void 0,
     status: "created",
     autoActiveWebview: !0,
     deeplink: void 0,
     chooseMethod: "",
-    retryConnect: te
-  }), F = W({
+    retryConnect: oe
+  }), k = D({
     cancelCount: 0
-  }), n = Y(), { appInfoList: b, autoGenerateSourceAppPid: A, canSwitchApp: v } = ce({
-    blocklet: p,
+  }), s = Y(), { appInfoList: b, autoGenerateSourceAppPid: A, canSwitchApp: v } = ae({
+    blocklet: c,
     connectState: o,
-    action: d,
+    action: a,
     sourceAppPid: t?.sourceAppPid,
     enableSwitchApp: t?.forceSwitch || t?.enableSwitchApp
-  }), C = W(null), M = ee(C), y = i(() => (M?.width || 0) < 500, [M?.width]), c = i(() => {
+  }), B = n(() => {
+    try {
+      return localStorage.getItem(ue);
+    } catch {
+      return "";
+    }
+  }, []), C = D(null), M = te(C), y = n(() => (M?.width || 0) < 500, [M?.width]), p = n(() => {
     if (v)
       return {
         ...t,
-        sourceAppPid: x(o.sourceAppPid) ? A : o.sourceAppPid
+        sourceAppPid: E(o.sourceAppPid) ? A : o.sourceAppPid
       };
-    const e = D(p)?.appPid, s = D(globalThis.blocklet)?.appPid;
-    return g?.session?.user && (e === s || !e) ? x(t?.sourceAppPid) ? {
+    const e = T(c)?.appPid, i = T(globalThis.blocklet)?.appPid;
+    return g?.session?.user && (e === i || !e) ? E(t?.sourceAppPid) ? {
       ...t,
       sourceAppPid: g.session.user?.sourceAppPid
     } : t : {
@@ -62,70 +69,72 @@ function le({
     v,
     t,
     o.sourceAppPid,
-    d,
+    a,
     A,
     g?.session?.user
-  ]), G = i(() => {
+  ]), F = n(() => {
     const e = window?.navigator?.userAgent;
     return e.indexOf("Edge") > -1 || e.indexOf("Edg") > -1 ? "edge" : e.indexOf("Chrome") > -1 ? "chrome" : "unknown";
   }, []);
-  X(() => {
-    o.sourceAppPid = c.sourceAppPid;
-  }, [c.sourceAppPid]);
+  V(() => {
+    o.sourceAppPid = p.sourceAppPid;
+  }, [p.sourceAppPid]);
   const H = h((e) => {
     o.status = e || "created";
-  }), u = globalThis.blocklet ? ne(p) : globalThis.env, I = i(() => {
+  }), u = globalThis.blocklet ? se(c) : globalThis.env, I = n(() => {
     if (l)
       return l;
-    const e = u.appPid, s = ie(e), Q = s ? void 0 : se(e);
-    return s ? pe(e) : Q.color;
-  }, [u.appId, l]), K = i(() => ({
-    isWalletWebview: n.wallet || n.arcSphere,
-    isMobile: n.mobile.any,
+    const e = u.appPid, i = ce(e), Q = i ? void 0 : ie(e);
+    return i ? pe(e) : Q.color;
+  }, [u.appId, l]), K = n(() => ({
+    isWalletWebview: s.wallet || s.arcSphere,
+    isMobile: s.mobile.any,
     matchSmallScreen: y,
     connectState: o,
-    staticState: F,
+    staticState: k,
     reactiveState: o,
     appInfoList: b,
-    extraParams: c,
-    blocklet: p,
+    extraParams: p,
+    blocklet: c,
     masterBlocklet: P,
-    browserBrand: G,
+    browserBrand: F,
     currentAppInfo: u,
     currentAppColor: I,
-    t: L,
-    locale: a,
-    action: d,
+    t: _,
+    locale: d,
+    action: a,
     changeStatus: H,
-    getPlugin: k,
-    latestActivePlugin: B,
+    getPlugin: J,
+    latestActivePlugin: U,
     plugins: f,
-    setPlugins: q,
+    setPlugins: j,
     selectedPlugin: m,
-    setSelectedPlugin: N,
+    setSelectedPlugin: z,
     forceUpdate: w,
     // 控制钱包登录的显示
-    showWalletOptions: z,
-    setShowWalletOptions: J
+    showWalletOptions: N,
+    setShowWalletOptions: q,
+    // 用于记录上一次登录方式
+    lastLoginMethod: B
   }), [
-    n.wallet,
-    n.arcSphere,
-    n.mobile.any,
+    s.wallet,
+    s.arcSphere,
+    s.mobile.any,
     y,
     JSON.stringify(o),
     JSON.stringify(b),
-    JSON.stringify(c),
-    p,
+    JSON.stringify(p),
+    c,
     P,
-    a,
+    d,
     m,
     w,
     u,
     I
   ]);
-  return /* @__PURE__ */ O(ae, { value: K, children: /* @__PURE__ */ O(oe, { ...j, ref: C, children: T }) });
+  return /* @__PURE__ */ O(fe, { value: K, children: /* @__PURE__ */ O(re, { ...L, ref: C, children: R }) });
 }
-le.propTypes = {
+me.propTypes = {
   children: r.any.isRequired,
   blocklet: r.object.isRequired,
   masterBlocklet: r.object,
@@ -135,11 +144,11 @@ le.propTypes = {
   testOnlyBorderColor: r.string
 };
 function xe() {
-  return E(R);
+  return W(x);
 }
 export {
   We as StateConsumer,
-  R as StateContext,
-  le as StateProvider,
+  x as StateContext,
+  me as StateProvider,
   xe as useStateContext
 };

package/lib/Connect/fallback-connect.js

@@ -0,0 +1,53 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { DIDConnectFooter as a } from "@arcblock/ux/lib/DIDConnect";
+import { DID_CONNECT_SMALL_WIDTH as l } from "@arcblock/ux/lib/Util/constant";
+import { getCurrentApp as x } from "@arcblock/ux/lib/Util/federated";
+import { Box as o, Skeleton as i } from "@mui/material";
+function f(r) {
+  const n = globalThis.blocklet ? x(globalThis.blocklet) : globalThis.env;
+  return /* @__PURE__ */ t(
+    o,
+    {
+      className: "did-connect__root",
+      sx: {
+        backgroundColor: "background.default",
+        display: "flex",
+        flexDirection: "column",
+        height: "100%",
+        position: "relative",
+        maxWidth: "100%",
+        // eslint-disable-next-line react/prop-types
+        width: r.mode === "drawer" ? "100%" : l - 20,
+        transition: "width 0.2s ease-in-out",
+        margin: "auto",
+        p: 3,
+        pb: 0,
+        gap: 2.5
+      },
+      children: [
+        /* @__PURE__ */ t(o, { sx: { display: "flex", flexDirection: "column", gap: 1.5 }, children: [
+          /* @__PURE__ */ e(i, { variant: "rounded", height: 28, sx: { width: "6rem" } }),
+          /* @__PURE__ */ t(o, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
+            /* @__PURE__ */ e(i, { variant: "rounded", sx: { fontSize: "13px", height: "15px" } }),
+            /* @__PURE__ */ e(i, { variant: "rounded", sx: { fontSize: "13px", height: "15px", width: "3rem" } })
+          ] })
+        ] }),
+        /* @__PURE__ */ t(o, { sx: { display: "flex", flexDirection: "column", gap: 1.5 }, children: [
+          /* @__PURE__ */ e(i, { variant: "rounded", sx: { height: "35px" } }),
+          /* @__PURE__ */ e(i, { variant: "rounded", sx: { height: "35px" } }),
+          /* @__PURE__ */ e(i, { variant: "rounded", sx: { height: "35px" } }),
+          /* @__PURE__ */ t(o, { sx: { display: "flex", gap: 1.5, mt: 1 }, children: [
+            /* @__PURE__ */ e(i, { variant: "rounded", sx: { flex: 1, height: "32px" } }),
+            /* @__PURE__ */ e(i, { variant: "rounded", sx: { flex: 1, height: "32px" } }),
+            /* @__PURE__ */ e(i, { variant: "rounded", sx: { flex: 1, height: "32px" } }),
+            /* @__PURE__ */ e(i, { variant: "rounded", sx: { flex: 1, height: "32px" } })
+          ] })
+        ] }),
+        /* @__PURE__ */ e(a, { currentAppInfo: n })
+      ]
+    }
+  );
+}
+export {
+  f as default
+};

package/lib/Connect/hooks/provider-list.js

@@ -1,50 +1,66 @@
-import { useBrowser as m } from "@arcblock/react-hooks";
-import { useRequest as v, useCreation as u } from "ahooks";
-import c from "lodash/isNil";
-import { LOGIN_PROVIDER as o } from "@arcblock/ux/lib/Util/constant";
-import { getFederatedEnabled as w, getMaster as P, getBlockletData as E } from "@arcblock/ux/lib/Util/federated";
-const k = async ({ sourceAppPid: n }) => {
+import { useBrowser as k } from "@arcblock/react-hooks";
+import { useRequest as y, useCreation as L } from "ahooks";
+import n from "lodash/isNil";
+import { LOGIN_PROVIDER as s } from "@arcblock/ux/lib/Util/constant";
+import { getFederatedEnabled as A, getMaster as C, getBlockletData as T } from "@arcblock/ux/lib/Util/federated";
+import { useState as I } from "react";
+const S = async ({ sourceAppPid: a }) => {
   const t = globalThis?.blocklet;
   if (!t)
     return {
-      [o.WALLET]: {
+      [s.WALLET]: {
         order: 0,
         enabled: !0,
         showQrcode: !0
       },
-      [o.PASSKEY]: {
+      [s.PASSKEY]: {
         order: 1,
         enabled: !0
       }
     };
-  const s = w(t), e = P(t);
-  return s && e?.appPid && n === e?.appPid ? (await E(e.appUrl))?.settings?.authentication || {} : t?.settings?.authentication || {};
-}, y = async ({ sourceAppPid: n } = {}) => {
-  const t = await k({ sourceAppPid: n });
-  return Object.entries(t).map(([e, r]) => ({ ...r, provider: e })).filter((e) => e.enabled).sort((e, r) => !c(e?.order) && !c(r?.order) ? e.order - r.order : c(e?.order) ? 1 : -1);
+  const l = A(t), e = C(t);
+  return l && e?.appPid && a === e?.appPid ? (await T(e.appUrl))?.settings?.authentication || {} : t?.settings?.authentication || {};
+}, B = async ({ sourceAppPid: a } = {}) => {
+  const t = await S({ sourceAppPid: a });
+  return Object.entries(t).map(([e, o]) => ({ ...o, provider: e })).filter((e) => e.enabled).sort((e, o) => !n(e?.order) && !n(o?.order) ? e.order - o.order : n(e?.order) ? 1 : -1);
 };
-function I({
-  allowWallet: n = !0,
+function Y({
+  allowWallet: a = !0,
   passkeyBehavior: t = "none",
-  action: s,
+  action: l,
   sourceAppPid: e,
-  mode: r = "dialog",
-  blocklet: L = globalThis.blocklet,
-  isSmallView: f = !1
+  mode: o = "dialog",
+  blocklet: b = globalThis.blocklet,
+  isSmallView: p = !1,
+  lastLoginMethod: u = ""
 }) {
-  const h = ["login", "invite", "connect-to-did-space", "connect-to-did-domain", "destroy-self"], l = m(), { data: g = [] } = v(
-    async () => await y({ sourceAppPid: e }),
+  const [P, g] = I(!1), w = ["login", "invite", "connect-to-did-space", "connect-to-did-domain", "destroy-self"], c = k(), { data: h = [] } = y(
+    async () => {
+      g(!0);
+      const d = await B({ sourceAppPid: e });
+      return g(!1), d;
+    },
     { refreshDeps: [e] }
-  ), d = u(() => g.filter((i) => i.name === o.WALLET ? n : i.name === o.PASSKEY ? t !== "none" && !l.wallet && !l.arcSphere : i.name === o.EMAIL ? L?.settings?.notification?.email?.enabled ?? !1 : !(i.type === "oauth" && !h.includes(s))), [g]), p = u(() => {
-    const a = r === "drawer" || f && l.mobile.any;
-    return globalThis?.blocklet ? !!(d.find((b) => b.provider === o.WALLET)?.showQrcode !== !0 || a) : !!a;
-  }, [r, f, d]);
+  ), f = L(() => h.filter((r) => r.name === s.WALLET ? a : r.name === s.PASSKEY ? t !== "none" && !c.wallet && !c.arcSphere : r.name === s.EMAIL ? b?.settings?.notification?.email?.enabled ?? !1 : !(r.type === "oauth" && !w.includes(l))).sort((r, i) => {
+    if (u) {
+      const m = r.provider === u, v = i.provider === u;
+      if (m && !v)
+        return -1;
+      if (!m && v)
+        return 1;
+    }
+    return !n(r?.order) && !n(i?.order) ? r.order - i.order : n(r?.order) ? n(i?.order) ? 0 : 1 : -1;
+  }), [h, u]), E = L(() => {
+    const d = o === "drawer" || p && c.mobile.any;
+    return globalThis?.blocklet ? !!(f.find((i) => i.provider === s.WALLET)?.showQrcode !== !0 || d) : !!d;
+  }, [o, p, f]);
   return {
-    hideChooseList: u(() => !1),
-    hideQRCode: p,
-    providerList: d
+    hideChooseList: L(() => !1),
+    hideQRCode: E,
+    providerList: f,
+    loadingProviderList: P
   };
 }
 export {
-  I as default
+  Y as default
 };