UNPKG

@orderly.network/react-app

Version:

Create React App with Orderly Network components

12 lines (10 loc) 8.7 kB
import { OrderlyThemeProvider, TooltipProvider, ModalProvider, Toaster, toast, parseNumber, useScreen, modal } from '@orderly.network/ui'; import { createContext, useContext, useEffect, useRef, useState, useMemo } from 'react'; import { OrderlyConfigProvider, OrderlyTrackerProvider, useAccount, useEventEmitter, useSymbolsInfo, useDebouncedCallback, useRestrictedInfo, useChains, useConfig, useWalletConnector, useLocalStorage, useKeyStore, useSessionStorage, useWalletSubscription, useSettleSubscription, useStorageLedgerAddress, parseJSON } from '@orderly.network/hooks'; import { capitalizeString, transSymbolformString, parseChainIdToNumber, windowGuard, praseChainIdToNumber } from '@orderly.network/utils'; import { AlgoOrderRootType, SDKError, ChainNamespace, AccountStatusEnum } from '@orderly.network/types'; import { jsx, jsxs } from 'react/jsx-runtime'; var x=()=>{useEffect(()=>{let t=new URLSearchParams(window.location.search).get("ref");t&&localStorage.setItem("referral_code",t);},[]);};var E="orderly:wallet-info";function D(){let{connectedChain:e,disconnect:t}=useWalletConnector(),[r,o]=useLocalStorage("orderly_link_device",{}),{account:n}=useAccount(),{isMobile:s}=useScreen(),c=useConfig(),a=async d=>{localStorage.removeItem(E),await n.disconnect(),await t({label:d});};useEffect(()=>{let d=I(),u=JSON.parse(localStorage.getItem(E)??"{}");d&&u&&a(u.label);},[]);let i=async()=>{let d=I();if(!d)return;let{address:u,secretKey:p,chainId:f,chainNamespace:g}=d;if(!await n.importOrderlyKey({address:u,secretKey:p,chainNamespace:g}))return;o({chainId:f,chainNamespace:g});let C=new URL(window.location.href);C.searchParams.delete("link");let w=decodeURIComponent(C.toString());history.replaceState(null,"",w);};useEffect(()=>{s&&!e&&i();},[n,e,s]);let l=async()=>{let{chainId:d,chainNamespace:u}=ie()||{};if(s&&!e&&d&&u){let p=n.keyStore.getAddress(),f=n.keyStore.getOrderlyKey(),g=n.keyStore.getAccountId(p);await n.checkOrderlyKey(p,f,g)&&c.set("chainNamespace",u);}};return useEffect(()=>{l();},[n,s,e]),{linkDevice:i}}function ie(){try{let e=localStorage.getItem("orderly_link_device");return e?parseJSON(e):null}catch{}}function I(){let t=new URL(window.location.href).searchParams.get("link");if(!t)return;let{a:r,k:o,i:n,n:s}=ce(t)||{};if(r&&o&&n&&s)return {address:r,secretKey:o,chainId:n,chainNamespace:s}}function ce(e){try{let t=JSON.parse(window.atob(e)),r=Math.floor(Date.now()/1e3),o=t.t;return !o||r>o?void 0:t}catch{}}var T="orderly:wallet-info";var W=e=>{let{wallet:t,connect:r,connectedChain:o,disconnect:n,namespace:s}=useWalletConnector();if(typeof r!="function")throw new SDKError("Please provide a wallet connector provider");let c=useRef(false),{account:a,state:i}=useAccount(),l=useKeyStore(),d=useConfig("networkId"),[u,{checkChainSupport:p}]=useChains(),[f,g]=useState(false),S=useMemo(()=>t?.accounts?.[0]?.address,[t]),C=useMemo(()=>{let m=t?.chains?.[0]?.id,h=t?.chains?.[0]?.namespace;if(!(typeof m>"u"))return {id:parseChainIdToNumber(m),namespace:h}},[t]);return useEffect(()=>{if(!o){g(false);return}let m=p(o.id,d);g(!m);},[o,u,p,d]),useEffect(()=>{windowGuard(()=>{let m=l.getAddress(),h=JSON.parse(localStorage.getItem(T)??"{}");o?.namespace!==ChainNamespace.solana&&m&&a.address!==m&&h.label&&r({autoSelect:{label:h.label,disableModals:true}}).then(v=>{},v=>{});});},[t,a.address]),useEffect(()=>{if(t===null&&i.status>AccountStatusEnum.NotConnected&&!i.validating){a.disconnect();return}if(f||!o||c.current)return;let m=I();S&&S!==a.address&&!m&&(a.setAddress(S,{provider:t?.provider,chain:{id:praseChainIdToNumber(C.id),namespace:C.namespace.toUpperCase()},wallet:{name:t.label}}),windowGuard(()=>{localStorage.setItem(T,JSON.stringify({label:t.label}));})),C?.id!==a.chainId&&a.switchChainId(C?.id);},[t,o,S,C,a.address,i,a.chainId,f]),{connectWallet:async()=>(c.current=true,r({chainId:e.currentChainId}).then(async m=>{if(Array.isArray(m)&&m.length>0&&m[0]&&m[0].accounts.length>0){let h=m[0],v=praseChainIdToNumber(h.chains[0].id);if(!p(v,d))return {wrongNetwork:true};if(!a)throw new Error("account is not initialized");i.status===AccountStatusEnum.EnableTradingWithoutConnected&&(localStorage.removeItem("orderly_link_device"),await a.disconnect());let Z=await a.setAddress(h.accounts[0].address,{provider:h.provider,chain:{id:praseChainIdToNumber(h.chains[0].id),namespace:h.chains[0].namespace.toUpperCase()},wallet:{name:h.label}});return {wallet:h,status:Z,wrongNetwork:false}}return null}).finally(()=>{c.current=false;})),wrongNetwork:f}};function $(){let e=useEventEmitter(),t=useRef({}),[r,o]=useSessionStorage("orderly_wallet_change_id",{});t.current=r,useWalletSubscription({onMessage:n=>{let{id:s,side:c,transStatus:a}=n,i=true;if(["DEPOSIT","WITHDRAW"].includes(c)&&["COMPLETED","FAILED"].includes(a)){let l=t.current[s];o({...r,[s]:l?void 0:true}),i=!l;}if(a==="COMPLETED"&&i){let l=`${capitalizeString(c)} completed`;toast.success(l);}else if(a==="FAILED"&&i){let l=`${capitalizeString(c)} failed`;toast.error(l);}e.emit("wallet:changed",n);}});}function K(){useSettleSubscription({onMessage:e=>{let{status:t}=e;switch(t){case "COMPLETED":toast.success("Settlement completed");break;case "FAILED":toast.error("Settlement failed");break;}}});}function U(){let e=useEventEmitter(),{setLedgerAddress:t}=useStorageLedgerAddress();return useEffect(()=>{e.on("wallet:connect-error",r=>{toast.error(r.message);}),e.on("wallet:sign-message-with-ledger-error",r=>{window.setTimeout(()=>{modal.confirm({title:"Sign Message Failed",content:"Are you using Ledger Wallet?",size:"sm",onOk:async()=>(t(r.userAddress),Promise.resolve()),okLabel:"OK",onCancel:async()=>(toast.error(r.message),Promise.resolve()),cancelLabel:"No"}).then(o=>{});});});},[e]),{}}function J(e){let[t,r]=useState(),[o]=useChains(),n=useConfig("networkId"),{connectedChain:s}=useWalletConnector();return useEffect(()=>{if(s)r?.(typeof s.id=="number"?s.id:parseInt(s.id));else {if(t)return;let c,a=n==="mainnet"?o.mainnet?.[0]:o.testnet?.[0];typeof e=="function"?c=e(n,o):typeof e=="object"&&(c=n==="mainnet"?e?.mainnet:e?.testnet);let i=c?.id||a?.network_infos?.chain_id;if(!i)return;r?.(i);}},[s,o,t,n,r,e]),[t,r]}var H=createContext({}),b=()=>useContext(H),q=e=>{let[t,r]=J(e.defaultChain);D();let{connectWallet:o,wrongNetwork:n}=W({currentChainId:t});$(),K(),U();let s=useRestrictedInfo(e.restrictedInfo),c=s.restrictedOpen;return jsx(H.Provider,{value:{connectWallet:o,wrongNetwork:n,currentChainId:t,setCurrentChainId:r,onChainChanged:e.onChainChanged,disabledConnect:c,restrictedInfo:s},children:e.children})};var z=createContext({}),Ke=()=>useContext(z),B=e=>jsx(z.Provider,{value:e,children:e.children});function Y(e,t){let{symbol:r,side:o,quantity:n}=e,s="total_executed_quantity"in e?e.total_executed_quantity:0,c="status"in e?e.status:e.algo_status,a=t[r],i=a("base_dp"),l=capitalizeString(o),d=transSymbolformString(r),u="algo_type"in e&&e.algo_type===AlgoOrderRootType.POSITIONAL_TP_SL?"Entire position":i===void 0?n:parseNumber(n,{dp:i}),p="",f="";switch(c){case "NEW":p="Order opened",f=`${l} ${d} ${u}`;break;case "FILLED":case "PARTIAL_FILLED":let g=i===void 0?s:parseNumber(s,{dp:i});p="Order filled",f=`${l} ${d} ${g} / ${u}`;break;case "CANCELLED":p="Order cancelled",f=`${l} ${d} ${u}`;break;case "REJECTED":p="Order rejected",f=`${l} ${d} ${u}`;break;case "REPLACED":p="Order edited",f=`${o} ${d} ${s} / ${u}`;break;}return {title:p,msg:f}}function V(){let e=useEventEmitter(),t=useSymbolsInfo(),r=useRef({});useEffect(()=>{r.current=t;},[t]);let o=useDebouncedCallback(n=>{(c=>{let{title:a,msg:i}=Y(c,r.current);a&&i&&toast.success(jsxs("div",{children:[a,jsx("br",{}),jsx("div",{className:"orderly-text-white/[0.54] orderly-text-xs",children:i})]}));})(n);},100);useEffect(()=>(e.on("orders:changed",o),()=>{e.off("orders:changed",o);}),[]);}var X=e=>{let{components:t,appIcons:r,onChainChanged:o,defaultChain:n,...s}=e;return x(),V(),jsx(B,{appIcons:r,brokerName:e.brokerName,children:jsx(OrderlyThemeProvider,{components:t,overrides:e.overrides,children:jsxs(OrderlyConfigProvider,{...s,children:[jsx(q,{onChainChanged:o,defaultChain:n,restrictedInfo:e.restrictedInfo,children:jsx(OrderlyTrackerProvider,{children:jsx(TooltipProvider,{delayDuration:300,children:jsx(ModalProvider,{children:e.children})})})}),jsx(Toaster,{})]})})})};X.displayName="OrderlyAppProvider";var nt=(e,t)=>{let{wrongNetwork:r,disabledConnect:o}=b(),{state:n}=useAccount();return t?.skip?e:r||o||typeof t?.accountStatus<"u"&&n.status<t.accountStatus?typeof t?.fallbackData<"u"?t.fallbackData:null:e}; export { X as OrderlyAppProvider, Ke as useAppConfig, b as useAppContext, nt as useDataTap }; //# sourceMappingURL=out.js.map //# sourceMappingURL=index.mjs.map