@orderly.network/react-app
Version:
Create React App with Orderly Network components
17 lines (14 loc) • 8.69 kB
JavaScript
var ui = require('@orderly.network/ui');
var react = require('react');
var hooks = require('@orderly.network/hooks');
var utils = require('@orderly.network/utils');
var types = require('@orderly.network/types');
var jsxRuntime = require('react/jsx-runtime');
var x=()=>{react.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}=hooks.useWalletConnector(),[r,o]=hooks.useLocalStorage("orderly_link_device",{}),{account:n}=hooks.useAccount(),{isMobile:s}=ui.useScreen(),c=hooks.useConfig(),a=async d=>{localStorage.removeItem(E),await n.disconnect(),await t({label:d});};react.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);};react.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 react.useEffect(()=>{l();},[n,s,e]),{linkDevice:i}}function ie(){try{let e=localStorage.getItem("orderly_link_device");return e?hooks.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}=hooks.useWalletConnector();if(typeof r!="function")throw new types.SDKError("Please provide a wallet connector provider");let c=react.useRef(false),{account:a,state:i}=hooks.useAccount(),l=hooks.useKeyStore(),d=hooks.useConfig("networkId"),[u,{checkChainSupport:p}]=hooks.useChains(),[f,g]=react.useState(false),S=react.useMemo(()=>t?.accounts?.[0]?.address,[t]),C=react.useMemo(()=>{let m=t?.chains?.[0]?.id,h=t?.chains?.[0]?.namespace;if(!(typeof m>"u"))return {id:utils.parseChainIdToNumber(m),namespace:h}},[t]);return react.useEffect(()=>{if(!o){g(false);return}let m=p(o.id,d);g(!m);},[o,u,p,d]),react.useEffect(()=>{utils.windowGuard(()=>{let m=l.getAddress(),h=JSON.parse(localStorage.getItem(T)??"{}");o?.namespace!==types.ChainNamespace.solana&&m&&a.address!==m&&h.label&&r({autoSelect:{label:h.label,disableModals:true}}).then(v=>{},v=>{});});},[t,a.address]),react.useEffect(()=>{if(t===null&&i.status>types.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:utils.praseChainIdToNumber(C.id),namespace:C.namespace.toUpperCase()},wallet:{name:t.label}}),utils.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=utils.praseChainIdToNumber(h.chains[0].id);if(!p(v,d))return {wrongNetwork:true};if(!a)throw new Error("account is not initialized");i.status===types.AccountStatusEnum.EnableTradingWithoutConnected&&(localStorage.removeItem("orderly_link_device"),await a.disconnect());let Z=await a.setAddress(h.accounts[0].address,{provider:h.provider,chain:{id:utils.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=hooks.useEventEmitter(),t=react.useRef({}),[r,o]=hooks.useSessionStorage("orderly_wallet_change_id",{});t.current=r,hooks.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=`${utils.capitalizeString(c)} completed`;ui.toast.success(l);}else if(a==="FAILED"&&i){let l=`${utils.capitalizeString(c)} failed`;ui.toast.error(l);}e.emit("wallet:changed",n);}});}function K(){hooks.useSettleSubscription({onMessage:e=>{let{status:t}=e;switch(t){case "COMPLETED":ui.toast.success("Settlement completed");break;case "FAILED":ui.toast.error("Settlement failed");break;}}});}function U(){let e=hooks.useEventEmitter(),{setLedgerAddress:t}=hooks.useStorageLedgerAddress();return react.useEffect(()=>{e.on("wallet:connect-error",r=>{ui.toast.error(r.message);}),e.on("wallet:sign-message-with-ledger-error",r=>{window.setTimeout(()=>{ui.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()=>(ui.toast.error(r.message),Promise.resolve()),cancelLabel:"No"}).then(o=>{});});});},[e]),{}}function J(e){let[t,r]=react.useState(),[o]=hooks.useChains(),n=hooks.useConfig("networkId"),{connectedChain:s}=hooks.useWalletConnector();return react.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=react.createContext({}),b=()=>react.useContext(H),q=e=>{let[t,r]=J(e.defaultChain);D();let{connectWallet:o,wrongNetwork:n}=W({currentChainId:t});$(),K(),U();let s=hooks.useRestrictedInfo(e.restrictedInfo),c=s.restrictedOpen;return jsxRuntime.jsx(H.Provider,{value:{connectWallet:o,wrongNetwork:n,currentChainId:t,setCurrentChainId:r,onChainChanged:e.onChainChanged,disabledConnect:c,restrictedInfo:s},children:e.children})};var z=react.createContext({}),Ke=()=>react.useContext(z),B=e=>jsxRuntime.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=utils.capitalizeString(o),d=utils.transSymbolformString(r),u="algo_type"in e&&e.algo_type===types.AlgoOrderRootType.POSITIONAL_TP_SL?"Entire position":i===void 0?n:ui.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:ui.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=hooks.useEventEmitter(),t=hooks.useSymbolsInfo(),r=react.useRef({});react.useEffect(()=>{r.current=t;},[t]);let o=hooks.useDebouncedCallback(n=>{(c=>{let{title:a,msg:i}=Y(c,r.current);a&&i&&ui.toast.success(jsxRuntime.jsxs("div",{children:[a,jsxRuntime.jsx("br",{}),jsxRuntime.jsx("div",{className:"orderly-text-white/[0.54] orderly-text-xs",children:i})]}));})(n);},100);react.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(),jsxRuntime.jsx(B,{appIcons:r,brokerName:e.brokerName,children:jsxRuntime.jsx(ui.OrderlyThemeProvider,{components:t,overrides:e.overrides,children:jsxRuntime.jsxs(hooks.OrderlyConfigProvider,{...s,children:[jsxRuntime.jsx(q,{onChainChanged:o,defaultChain:n,restrictedInfo:e.restrictedInfo,children:jsxRuntime.jsx(hooks.OrderlyTrackerProvider,{children:jsxRuntime.jsx(ui.TooltipProvider,{delayDuration:300,children:jsxRuntime.jsx(ui.ModalProvider,{children:e.children})})})}),jsxRuntime.jsx(ui.Toaster,{})]})})})};X.displayName="OrderlyAppProvider";var nt=(e,t)=>{let{wrongNetwork:r,disabledConnect:o}=b(),{state:n}=hooks.useAccount();return t?.skip?e:r||o||typeof t?.accountStatus<"u"&&n.status<t.accountStatus?typeof t?.fallbackData<"u"?t.fallbackData:null:e};
exports.OrderlyAppProvider = X;
exports.useAppConfig = Ke;
exports.useAppContext = b;
exports.useDataTap = nt;
//# sourceMappingURL=out.js.map
//# sourceMappingURL=index.js.map
;