@matchain/matchid-sdk-react 0.1.8 → 0.1.9

package/dist/index.mjs

@@ -395,7 +395,7 @@ function ModalWithHeader({
 }
 
 // src/components/PasswordModal/index.tsx
-import { useEffect as useEffect3, useMemo as useMemo3, useState as useState3 } from "react";
+import { useEffect as useEffect2, useMemo as useMemo2, useState as useState2 } from "react";
 
 // src/components/Input/index.tsx
 import { useState } from "react";
@@ -596,6 +596,20 @@ var getToken = () => {
   }
 };
 
+// src/utils/matchlog.ts
+var matchDevExists = () => localStorage.getItem("matchid-sdk-react-debug") !== null;
+var handler = {
+  get(target, prop) {
+    if (matchDevExists() && typeof target[prop] === "function") {
+      return target[prop].bind(console);
+    }
+    return () => {
+    };
+  }
+};
+var matchlog = new Proxy(console, handler);
+var matchlog_default = matchlog;
+
 // src/api/request.ts
 var SUCCESS_CODE = 0;
 var isSuccess = (res) => {
@@ -617,7 +631,7 @@ var request = async (config) => {
       instance.defaults.headers.common["Authorization"] = token;
     }
     const { data } = await instance.request(config);
-    console.log("api", data);
+    matchlog_default.log("api", data);
     if (data.code == 401001) {
       localStore.getState().logout();
       throw new Error("Your session has expired, please log in again");
@@ -673,6 +687,72 @@ var setUserNameApi = (data) => {
     data
   });
 };
+var getBindListApi = () => {
+  return request_default({
+    url: `/bind/list`,
+    method: "GET"
+  });
+};
+var getPohListApi = () => {
+  return request_default({
+    url: `/poh/list`,
+    method: "GET"
+  });
+};
+var getBindInfoApi = () => {
+  return request_default({
+    url: `/bind`,
+    method: "GET"
+  });
+};
+var bindCexApi = ({ cex, api_key, api_secret }) => {
+  return request_default({
+    url: `/cex/subscribe`,
+    method: "POST",
+    data: { cex, api_key, api_secret }
+  });
+};
+var unBindApi = ({ type }) => {
+  return request_default({
+    url: `/unbind`,
+    method: "POST",
+    data: { type }
+  });
+};
+var unBindWalletApi = ({ address }) => {
+  return request_default({
+    url: `/wallet/unbind`,
+    method: "POST",
+    data: { address }
+  });
+};
+var verifyPohApi = ({
+  taskId,
+  schemaId,
+  publicFields,
+  allocatorAddress,
+  publicFieldsHash,
+  allocatorSignature,
+  uHash,
+  validatorAddress,
+  validatorSignature
+}) => {
+  return request_default({
+    url: `/poh/zkpass`,
+    method: "POST",
+    data: {
+      taskId,
+      schemaId,
+      publicFields,
+      allocatorAddress,
+      publicFieldsHash,
+      allocatorSignature,
+      uHash,
+      validatorAddress,
+      validatorSignature
+    }
+  });
+};
 
 // src/hooks/eventManager.ts
 var EventManager = class {
@@ -754,7 +834,7 @@ function useUserInfo() {
   };
   const loginByMethod = (method) => {
     const link = `${endpoints.back}auth/${method}?appid=${appid}&provider=${method}&redirect=${encodeURIComponent(endpoints.login + "login/" + method)}&authorization=${(/* @__PURE__ */ new Date()).getTime()}`;
-    console.log("link", link);
+    matchlog_default.log("link", link);
     const authWindow = window.open(
       link,
       // Replace with the actual authorization URL
@@ -870,24 +950,21 @@ function useUserInfo() {
 import { useEffect } from "react";
 function useMatchEvents(handlers) {
   useEffect(() => {
-    Object.entries(handlers).forEach(([event, handler]) => {
-      if (handler) {
-        eventManager_default.on(event, handler);
+    Object.entries(handlers).forEach(([event, handler2]) => {
+      if (handler2) {
+        eventManager_default.on(event, handler2);
       }
     });
     return () => {
-      Object.entries(handlers).forEach(([event, handler]) => {
-        if (handler) {
-          eventManager_default.off(event, handler);
+      Object.entries(handlers).forEach(([event, handler2]) => {
+        if (handler2) {
+          eventManager_default.off(event, handler2);
         }
       });
     };
   }, [handlers]);
 }
 
-// src/hooks/useWallet.tsx
-import { useEffect as useEffect2, useState as useState2 } from "react";
-
 // src/store/useStore.ts
 import { create as create2 } from "zustand";
 var useStore = create2((set) => ({
@@ -941,7 +1018,7 @@ function useWallet() {
   const signMessage = async (message, type) => {
     return new Promise(async (resolve, reject) => {
       const res = await isRecovered();
-      console.log("isRecovered", res);
+      matchlog_default.log("isRecovered", res);
       const getSign = async () => {
         try {
           const recoverRes = await window.waitMatchUntilWalletMessage("signMessage", {
@@ -959,7 +1036,7 @@ function useWallet() {
         setRecoveryModal({
           open: true,
           success: async () => {
-            console.log("recover Success");
+            matchlog_default.log("recover Success");
             await getSign();
           },
           close: async () => {
@@ -979,7 +1056,7 @@ function useWallet() {
   const signTransaction = async (transaction, type) => {
     return new Promise(async (resolve, reject) => {
       const res = await isRecovered();
-      console.log("isRecovered", res);
+      matchlog_default.log("isRecovered", res);
       const getSign = async () => {
         try {
           const recoverRes = await window.waitMatchUntilWalletMessage("signTransaction", {
@@ -997,7 +1074,7 @@ function useWallet() {
         setRecoveryModal({
           open: true,
           success: async () => {
-            console.log("recover Success");
+            matchlog_default.log("recover Success");
             await getSign();
           },
           close: async () => {
@@ -1030,131 +1107,6 @@ function useWallet() {
     isRecovered
   };
 }
-var useWalletInit = ({
-  refreshOverview
-}) => {
-  const { env } = useLocalStore_default();
-  const getWalletIframe = () => {
-    return document.getElementById("match-wallet");
-  };
-  const [walletInited, setWalletInited] = useState2(false);
-  const { appid, token, overview } = useLocalStore_default();
-  const { initWallet, generateWallet } = useWallet();
-  useEffect2(() => {
-    if (env) {
-      if (!window.matchWalletMessageIdMap) {
-        window.matchWalletMessageIdMap = {};
-      }
-      const config = env_default[env];
-      const endpoints = config.endpoints;
-      const existingIframe = getWalletIframe();
-      if (!existingIframe) {
-        const iframe = document.createElement("iframe");
-        iframe.id = "match-wallet";
-        iframe.src = endpoints.login + "wallet";
-        iframe.style.display = "none";
-        iframe.style.width = "0";
-        iframe.style.height = "0";
-        iframe.onload = () => {
-          setWalletInited(true);
-        };
-        document.body.insertBefore(iframe, document.body.firstChild);
-        window.sendMatchWalletMessage = (method, data) => {
-          const messageId = Date.now().toString() + Math.random().toString().slice(6);
-          const message = {
-            method,
-            data,
-            messageId,
-            source: "matchid"
-          };
-          if (document.getElementById("match-wallet")) {
-            getWalletIframe()?.contentWindow?.postMessage(message, "*");
-            return messageId;
-          }
-          console.error("not found iframe");
-          return false;
-        };
-        window.waitMatchUntilWalletMessage = async (method, data, timeout = 5e3) => {
-          return new Promise((resolve, reject) => {
-            const messageId = window.sendMatchWalletMessage(method, data);
-            if (!messageId) {
-              console.error("Can't find wallet message");
-              reject(new Error("Can't find wallet message"));
-              return;
-            }
-            window.matchWalletMessageIdMap[messageId] = { resolve, reject };
-            window.matchWalletMessageIdMap[messageId].timeout = setTimeout(() => {
-              console.error("Get wallet result timeout", {
-                messageId,
-                method,
-                data
-              });
-              delete window.matchWalletMessageIdMap[messageId];
-              reject(new Error("Get wallet result timeout"));
-            }, timeout);
-          });
-        };
-      } else {
-        if (existingIframe.src !== endpoints.login + "wallet") {
-          existingIframe.src = endpoints.login + "wallet";
-        }
-        setWalletInited(true);
-      }
-    }
-  }, [env]);
-  useEffect2(() => {
-    const messageHandle = async (e) => {
-      const res = e.data;
-      if (res.source != "match-wallet") {
-        return;
-      }
-      const messageId = res.messageId;
-      if (messageId && window.matchWalletMessageIdMap[messageId]) {
-        const { resolve, reject, timeout } = window.matchWalletMessageIdMap[messageId];
-        delete window.matchWalletMessageIdMap[messageId];
-        clearTimeout(timeout);
-        if (res.status == "success") {
-          resolve(res.data);
-        } else {
-          console.error("qwe-waller-error", res);
-          reject(new Error(res.data.message));
-        }
-      }
-    };
-    window.addEventListener("message", messageHandle);
-    return () => {
-      window.removeEventListener("message", messageHandle);
-    };
-  }, []);
-  useEffect2(() => {
-    if (token && overview && overview.did && walletInited) {
-      const did = overview.did.split(":")[2];
-      const newUserInit = async () => {
-        await window.waitMatchUntilWalletMessage(
-          "initCore",
-          {
-            AppId: appid,
-            AppClientId,
-            UserId: did,
-            AccessToken: token,
-            Address: ""
-          }
-        );
-      };
-      if (!overview.address) {
-        newUserInit();
-      } else {
-        initWallet({
-          address: overview.address,
-          did
-        });
-      }
-    }
-  }, [overview, token, walletInited]);
-  return {
-    walletInited
-  };
-};
 
 // src/components/PasswordModal/index.tsx
 import { jsx as jsx24, jsxs as jsxs15 } from "react/jsx-runtime";
@@ -1166,27 +1118,27 @@ function PasswordModal({
 }) {
   const { refreshOverview } = useUserInfo();
   const { isLogin, did } = useUserInfo();
-  const [password, setPassword] = useState3("");
-  const [rePassword, setRePassword] = useState3("");
-  const [error, setError] = useState3("");
+  const [password, setPassword] = useState2("");
+  const [rePassword, setRePassword] = useState2("");
+  const [error, setError] = useState2("");
   const { generateWallet } = useWallet();
-  const passwordError = useMemo3(() => {
+  const passwordError = useMemo2(() => {
     if (password.length < 6) return "Password must be at least 6 characters";
     return "";
   }, [password]);
-  const rePasswordError = useMemo3(() => {
+  const rePasswordError = useMemo2(() => {
     if (rePassword != password) {
       return "The password you entered twice do not match";
     }
     return "";
   }, [rePassword, password]);
-  useEffect3(() => {
+  useEffect2(() => {
     if (isOpen) {
       setPassword("");
       setRePassword("");
     }
   }, [isOpen]);
-  const [isSubmitting, setIsSubmitting] = useState3(false);
+  const [isSubmitting, setIsSubmitting] = useState2(false);
   const onContinue = async () => {
     if (isSubmitting) return;
     try {
@@ -1246,7 +1198,7 @@ function PasswordModal({
 }
 
 // src/components/RecoveryModal/index.tsx
-import { useEffect as useEffect4, useMemo as useMemo4, useState as useState4 } from "react";
+import { useEffect as useEffect3, useMemo as useMemo3, useState as useState3 } from "react";
 import { jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
 function RecoveryModal({
   title,
@@ -1256,19 +1208,19 @@ function RecoveryModal({
 }) {
   const { refreshOverview } = useUserInfo();
   const { isLogin } = useUserInfo();
-  const [password, setPassword] = useState4("");
+  const [password, setPassword] = useState3("");
   const { recoveryWallet } = useWallet();
-  const [error, setError] = useState4("");
-  const passwordError = useMemo4(() => {
+  const [error, setError] = useState3("");
+  const passwordError = useMemo3(() => {
     if (password.length < 6) return "Password must be at least 6 characters";
     return "";
   }, [password]);
-  useEffect4(() => {
+  useEffect3(() => {
     if (isOpen) {
       setPassword("");
     }
   }, [isOpen]);
-  const [isSubmitting, setIsSubmitting] = useState4(false);
+  const [isSubmitting, setIsSubmitting] = useState3(false);
   const onContinue = async () => {
     if (isSubmitting) return;
     try {
@@ -1342,8 +1294,146 @@ var Providers = ({ children }) => {
 };
 var context_default = Providers;
 
+// src/hooks/useWalletInit.ts
+import { useEffect as useEffect4, useState as useState4 } from "react";
+var AppClientId2 = "react-sdk-" + getVersion();
+function useWalletInit({
+  refreshOverview
+}) {
+  const { env } = useLocalStore_default();
+  const getWalletIframe = () => {
+    return document.getElementById("match-wallet");
+  };
+  const [walletInited, setWalletInited] = useState4(false);
+  const { appid, token, overview } = useLocalStore_default();
+  const { initWallet, generateWallet } = useWallet();
+  useEffect4(() => {
+    if (env) {
+      if (!window.matchWalletMessageIdMap) {
+        window.matchWalletMessageIdMap = {};
+      }
+      const config = env_default[env];
+      const endpoints = config.endpoints;
+      const existingIframe = getWalletIframe();
+      if (!existingIframe) {
+        const iframe = document.createElement("iframe");
+        iframe.id = "match-wallet";
+        iframe.src = endpoints.login + "wallet";
+        iframe.style.display = "none";
+        iframe.style.width = "0";
+        iframe.style.height = "0";
+        document.body.insertBefore(iframe, document.body.firstChild);
+        window.sendMatchWalletMessage = (method, data) => {
+          const messageId = Date.now().toString() + Math.random().toString().slice(6);
+          const message = {
+            method,
+            data,
+            messageId,
+            source: "matchid"
+          };
+          if (document.getElementById("match-wallet")) {
+            matchlog_default.log("matchid.sdk.sendMatchWalletMessage", message, endpoints.login);
+            getWalletIframe()?.contentWindow?.postMessage(message, endpoints.login);
+            return messageId;
+          }
+          console.error("not found iframe");
+          return false;
+        };
+        window.waitMatchUntilWalletMessage = async (method, data, timeout = 1e4) => {
+          return new Promise((resolve, reject) => {
+            const messageId = window.sendMatchWalletMessage(method, data);
+            if (!messageId) {
+              console.error("Can't find wallet message");
+              reject(new Error("Can't find wallet message"));
+              return;
+            }
+            window.matchWalletMessageIdMap[messageId] = { resolve, reject };
+            window.matchWalletMessageIdMap[messageId].timeout = setTimeout(() => {
+              console.error("Get wallet result timeout", {
+                messageId,
+                method,
+                data
+              });
+              delete window.matchWalletMessageIdMap[messageId];
+              reject(new Error("Get wallet result timeout"));
+            }, timeout);
+          });
+        };
+      } else {
+        if (existingIframe.src !== endpoints.login + "wallet") {
+          setWalletInited(false);
+          existingIframe.src = endpoints.login + "wallet";
+        } else {
+          setWalletInited(true);
+        }
+      }
+    }
+  }, [env]);
+  useEffect4(() => {
+    const messageHandle = async (e) => {
+      if (e.origin !== env_default[env].endpoints.login.substring(0, env_default[env].endpoints.login.length - 1)) {
+        return;
+      }
+      const res = e.data;
+      if (res.source != "match-wallet") {
+        return;
+      }
+      matchlog_default.log("sdk.wallet.receive", e);
+      const messageId = res.messageId;
+      if (messageId == "init") {
+        matchlog_default.log("wallet init");
+        setWalletInited(true);
+        return;
+      }
+      if (messageId && window.matchWalletMessageIdMap[messageId]) {
+        const { resolve, reject, timeout } = window.matchWalletMessageIdMap[messageId];
+        delete window.matchWalletMessageIdMap[messageId];
+        clearTimeout(timeout);
+        if (res.status == "success") {
+          resolve(res.data);
+        } else {
+          console.error("qwe-waller-error", res);
+          reject(new Error(res.data.message));
+        }
+      }
+    };
+    window.addEventListener("message", messageHandle);
+    return () => {
+      window.removeEventListener("message", messageHandle);
+    };
+  }, []);
+  useEffect4(() => {
+    if (token && overview && overview.did && walletInited) {
+      const did = overview.did.split(":")[2];
+      const newUserInit = async () => {
+        await window.waitMatchUntilWalletMessage(
+          "initCore",
+          {
+            AppId: appid,
+            AppClientId: AppClientId2,
+            UserId: did,
+            AccessToken: token,
+            Address: ""
+          }
+        );
+      };
+      if (!overview.address) {
+        newUserInit();
+      } else {
+        initWallet({
+          address: overview.address,
+          did
+        });
+      }
+    }
+  }, [overview, token, walletInited]);
+  return {
+    walletInited
+  };
+}
+
 // src/hooks/useInit.tsx
-import { useEffect as useEffect5, useRef as useRef2 } from "react";
+import { useEffect as useEffect5, useRef } from "react";
 function useInit({
   theme,
   appid,
@@ -1359,7 +1449,7 @@ function useInit({
     setOverview,
     setTheme
   } = useLocalStore_default();
-  const overviewLoadingRef = useRef2(false);
+  const overviewLoadingRef = useRef(false);
   const searchParams = new URLSearchParams(window.location.search);
   const matchToken = searchParams.get("matchToken");
   const config = env_default[env];
@@ -1405,7 +1495,7 @@ function useInit({
     };
   }, []);
   const loadOverview = async () => {
-    console.log("loadOverview");
+    matchlog_default.log("loadOverview");
     if (overviewLoadingRef.current) {
       return;
     }
@@ -1451,7 +1541,9 @@ function useInit({
 }
 
 // src/MatchContext.tsx
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { jsx as jsx28 } from "react/jsx-runtime";
+var queryClient = new QueryClient();
 var MatchContext = createContext(void 0);
 var MatchProvider = ({ children, appid, env = "main", events, theme = "light" }) => {
   const { loadOverview, login, config, endpoints } = useInit({
@@ -1463,7 +1555,7 @@ var MatchProvider = ({ children, appid, env = "main", events, theme = "light" })
   useWalletInit({
     refreshOverview: loadOverview
   });
-  return /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsx28(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx28(
     MatchContext.Provider,
     {
       value: {
@@ -1476,7 +1568,7 @@ var MatchProvider = ({ children, appid, env = "main", events, theme = "light" })
       },
       children: /* @__PURE__ */ jsx28(context_default, { children })
     }
-  );
+  ) });
 };
 var useMatch = () => {
   const context = useContext(MatchContext);
@@ -1507,7 +1599,7 @@ __export(components_exports, {
 import { useEffect as useEffect9, useState as useState8 } from "react";
 
 // src/components/EmailModal/StepEmail.tsx
-import { useEffect as useEffect7, useMemo as useMemo5, useState as useState6 } from "react";
+import { useEffect as useEffect7, useMemo as useMemo4, useState as useState6 } from "react";
 import { jsx as jsx29, jsxs as jsxs18 } from "react/jsx-runtime";
 function StepEmail(props) {
   const [emailVal, setEmailVal] = useState6("");
@@ -1516,7 +1608,7 @@ function StepEmail(props) {
       setEmailVal(props.email);
     }
   }, []);
-  const canContinue = useMemo5(() => {
+  const canContinue = useMemo4(() => {
     return isValidEmail(emailVal);
   }, [emailVal]);
   const onContinue = async () => {
@@ -1538,7 +1630,7 @@ function StepEmail(props) {
 }
 
 // src/components/EmailModal/StepVerify.tsx
-import { useEffect as useEffect8, useMemo as useMemo6, useRef as useRef4, useState as useState7 } from "react";
+import { useEffect as useEffect8, useMemo as useMemo5, useRef as useRef3, useState as useState7 } from "react";
 
 // src/config/index.tsx
 var EMAIL_INTERVAL = 60;
@@ -1552,11 +1644,11 @@ function StepVerify(props) {
   const [code, setCode] = useState7("");
   const [sending, setSending] = useState7(false);
   const [submitting, setSubmitting] = useState7(false);
-  const sendTimeRef = useRef4(0);
+  const sendTimeRef = useRef3(0);
   const [sendBtnText, setSendBtnText] = useState7("Send");
   const intervalTime = EMAIL_INTERVAL;
   const codeLength = EMAIL_CODE_LENGTH;
-  const intervalRef = useRef4(null);
+  const intervalRef = useRef3(null);
   const onSend = async () => {
     if (sendTimeRef.current > 0) {
       return;
@@ -1590,7 +1682,7 @@ function StepVerify(props) {
       }
     };
   }, []);
-  const canContinue = useMemo6(() => {
+  const canContinue = useMemo5(() => {
     return code.length === codeLength;
   }, [code]);
   const onContinue = async () => {
@@ -1686,7 +1778,7 @@ function EmailModal({
 }
 
 // src/components/LoginBox/index.tsx
-import { useMemo as useMemo7, useState as useState9 } from "react";
+import { useMemo as useMemo6, useState as useState9 } from "react";
 import { Fragment as Fragment3, jsx as jsx32, jsxs as jsxs20 } from "react/jsx-runtime";
 function LoginBox({
   methods,
@@ -1701,7 +1793,7 @@ function LoginBox({
     "telegram",
     "X"
   ];
-  const methodList = useMemo7(() => {
+  const methodList = useMemo6(() => {
     return methods || defaultMethods;
   }, [methods]);
   const LoginItem = ({
@@ -1840,7 +1932,7 @@ function LoginButton({
 }
 
 // src/components/UsernameModal/index.tsx
-import { useEffect as useEffect10, useMemo as useMemo8, useState as useState11 } from "react";
+import { useEffect as useEffect10, useMemo as useMemo7, useState as useState11 } from "react";
 
 // src/assets/icon/InfoRoundIcon.tsx
 import { jsx as jsx36, jsxs as jsxs23 } from "react/jsx-runtime";
@@ -1890,10 +1982,10 @@ function UsernameModal({
       setError("");
     }
   }, [isOpen]);
-  const isValid = useMemo8(() => {
+  const isValid = useMemo7(() => {
     return isValidUsername(val);
   }, [val]);
-  const isLength = useMemo8(() => {
+  const isLength = useMemo7(() => {
     return val.length >= 2 && val.length <= 32;
   }, [val]);
   const isSafe = isValid && isLength;
@@ -1947,7 +2039,70 @@ function UsernameModal({
     }, onClick: props.onClose, size: "lg", block: true, children: "Next Time" })
   ] }) });
 }
+
+// src/hooks/api/index.ts
+var api_exports = {};
+__export(api_exports, {
+  bind: () => bind_exports,
+  poh: () => poh_exports
+});
+
+// src/hooks/api/bind.ts
+var bind_exports = {};
+__export(bind_exports, {
+  bindCexApi: () => bindCexApi,
+  unBindApi: () => unBindApi,
+  unBindWalletApi: () => unBindWalletApi,
+  useBindInfo: () => useBindInfo,
+  useBindList: () => useBindList
+});
+import { useQuery } from "@tanstack/react-query";
+function useBindList(options) {
+  const { isLogin } = useUserInfo();
+  return useQuery({
+    queryKey: ["bindList"],
+    enabled: isLogin,
+    queryFn: async () => {
+      let res = await getBindListApi();
+      return res.data;
+    },
+    ...options
+  });
+}
+function useBindInfo(options) {
+  const { isLogin } = useUserInfo();
+  return useQuery({
+    queryKey: ["bindInfo"],
+    enabled: isLogin,
+    queryFn: async () => {
+      let res = await getBindInfoApi();
+      return res.data;
+    },
+    ...options
+  });
+}
+
+// src/hooks/api/poh.ts
+var poh_exports = {};
+__export(poh_exports, {
+  usePohList: () => usePohList,
+  verifyPohApi: () => verifyPohApi
+});
+import { useQuery as useQuery2 } from "@tanstack/react-query";
+function usePohList(options) {
+  const { isLogin } = useUserInfo();
+  return useQuery2({
+    queryKey: ["pohList"],
+    enabled: isLogin,
+    queryFn: async () => {
+      let res = await getPohListApi();
+      return res.data;
+    },
+    ...options
+  });
+}
 export {
+  api_exports as Api,
   components_exports as Components,
   hooks_exports as Hooks,
   MatchProvider,