UNPKG

@orderly.network/react-app

Version:

Create React App with Orderly Network components

20 lines (17 loc) 14.5 kB
'use strict'; var hooks = require('@orderly.network/hooks'); var ui = require('@orderly.network/ui'); var react = require('react'); var types = require('@orderly.network/types'); var i18n = require('@orderly.network/i18n'); var utils = require('@orderly.network/utils'); var jsxRuntime = require('react/jsx-runtime'); var locale = require('date-fns/locale'); var _=()=>{react.useEffect(()=>{let e=new URLSearchParams(window.location.search).get("ref");e&&localStorage.setItem("referral_code",e);},[]);};function ge(r){return r==="BUY"?i18n.i18n.t("common.buy"):r==="SELL"?i18n.i18n.t("common.sell"):utils.capitalizeString(r)}function W(r,e){let{symbol:a,side:o,quantity:i,client_order_id:d}=r,t="total_executed_quantity"in r?r.total_executed_quantity:0,s="status"in r?r.status:r.algo_status,p=e[a],c=p("base_dp"),n=ge(o),l=utils.transSymbolformString(a),u="algo_type"in r&&r.algo_type===types.AlgoOrderRootType.POSITIONAL_TP_SL?i18n.i18n.t("tpsl.entirePosition"):c===void 0?i:ui.parseNumber(i,{dp:c}),f="",m="";switch(s){case types.OrderStatus.NEW:d?.startsWith("scaled_")?(f=i18n.i18n.t("orders.status.scaledSubOrderOpened.toast.title"),m=`${n} ${l} ${u}`):(f=i18n.i18n.t("orders.status.opened.toast.title"),m=`${n} ${l} ${u}`);break;case types.OrderStatus.FILLED:case types.OrderStatus.PARTIAL_FILLED:let P=c===void 0?t:ui.parseNumber(t,{dp:c});f=i18n.i18n.t("orders.status.filled.toast.title"),m=`${n} ${l} ${P} / ${u}`;break;case types.OrderStatus.CANCELLED:f=i18n.i18n.t("orders.status.canceled.toast.title"),m=`${n} ${l} ${u}`;break;case types.OrderStatus.REJECTED:f=i18n.i18n.t("orders.status.rejected.toast.title"),m=`${n} ${l} ${u}`;break;case types.OrderStatus.REPLACED:f=i18n.i18n.t("orders.status.replaced.toast.title"),m=`${o} ${l} ${t} / ${u}`;break;}return {title:f,msg:m,status:s}}var xe="orderly_order_sound_alert",$=()=>{let r=hooks.useEventEmitter(),e=hooks.useSymbolsInfo(),a=react.useRef({}),{notification:o}=hooks.useOrderlyContext();react.useEffect(()=>{a.current=e;},[e]);let i=o?.orderFilled?.media??"",[d]=hooks.useLocalStorage(xe,o?.orderFilled?.defaultOpen??false),[t]=hooks.useAudioPlayer(i,{autoPlay:d,volume:1}),s=hooks.useDebouncedCallback(p=>{(n=>{let{title:l,msg:u,status:f}=W(n,a.current),m=f===types.OrderStatus.FILLED||f===types.OrderStatus.PARTIAL_FILLED,C=n.algo_type||n.type;l&&u&&ui.toast.success(jsxRuntime.jsxs("div",{children:[l,jsxRuntime.jsx("br",{}),jsxRuntime.jsx("div",{className:"orderly-text-white/[0.54] orderly-text-xs",children:u}),m&&t]}),{id:C});})(p);},100);react.useEffect(()=>(r.on("orders:changed",s),()=>{r.off("orders:changed",s),s.cancel();}),[r,s]);};function K(){let{t:r}=i18n.useTranslation(),e=i18n.useLocaleCode();return react.useMemo(()=>{let a={[i18n.LocaleEnum.en]:locale.enUS,[i18n.LocaleEnum.zh]:locale.zhCN};return {locale:e,dialog:{ok:r("common.ok"),cancel:r("common.cancel")},modal:{confirm:r("common.confirm"),cancel:r("common.cancel")},pagination:{morePages:r("ui.pagination.morePages"),rowsPerPage:r("ui.pagination.rowsPerPage")},picker:{selectDate:r("ui.picker.selectDate"),dayPicker:a[e]},empty:{description:r("ui.empty.description")}}},[r,e])}var v=react.createContext({}),De=()=>react.useContext(v);var H=r=>jsxRuntime.jsx(v.Provider,{value:r,children:r.children});var Q=()=>{let r=hooks.useWS(),{t:e}=i18n.useTranslation();react.useEffect(()=>{let a=r.privateSubscribe({id:"assetconvert",event:"subscribe",topic:"assetconvert",ts:utils.getTimestamp()},{onMessage(o){o.convertId&&ui.toast.success(e("transfer.convert.completed"));}});return ()=>a()},[]);};function V(r){let{storageChain:e,setStorageChain:a}=hooks.useStorageChain(),[o,i]=react.useState(),[d]=hooks.useChains(),t=hooks.useConfig("networkId"),{connectedChain:s}=hooks.useWalletConnector();return react.useEffect(()=>{if(s)i?.(typeof s.id=="number"?s.id:parseInt(s.id));else {if(o)return;let p,c=t==="mainnet"?d.mainnet?.[0]:d.testnet?.[0];typeof r=="function"?p=r(t,d):typeof r=="object"&&(p=t==="mainnet"?r?.mainnet:r?.testnet);let n=p?.id||c?.network_infos?.chain_id;if(!n)return;e?i?.(e.chainId):(a(n),i?.(n));}},[s,d,o,t,i,r]),[o,i]}var z="orderly:wallet-info";function B(){let{connectedChain:r,disconnect:e}=hooks.useWalletConnector(),[a,o]=hooks.useLocalStorage("orderly_link_device",{}),{account:i}=hooks.useAccount(),{isMobile:d}=ui.useScreen(),t=hooks.useConfig(),s=async n=>{localStorage.removeItem(z),await i.disconnect(),await e({label:n});};react.useEffect(()=>{let n=k(),l=JSON.parse(localStorage.getItem(z)??"{}");n&&l&&s(l.label);},[]);let p=async()=>{let n=k();if(!n)return;let{address:l,secretKey:u,chainId:f,chainNamespace:m}=n;if(!await i.importOrderlyKey({address:l,secretKey:u,chainNamespace:m}))return;o({chainId:f,chainNamespace:m});let P=new URL(window.location.href);P.searchParams.delete("link"),P.searchParams.set("utm_medium","qrcode");let w=decodeURIComponent(P.toString());history.replaceState(null,"",w);};react.useEffect(()=>{d&&!r&&p();},[i,r,d]);let c=async()=>{let{chainId:n,chainNamespace:l}=Xe()||{};if(d&&!r&&n&&l){let u=i.keyStore.getAddress(),f=i.keyStore.getOrderlyKey(),m=i.keyStore.getAccountId(u);await i.checkOrderlyKey(u,f,m)&&t.set("chainNamespace",l);}};return react.useEffect(()=>{c();},[i,d,r]),{linkDevice:p}}function Xe(){try{let r=localStorage.getItem("orderly_link_device");return r?hooks.parseJSON(r):null}catch{}}function k(){let e=new URL(window.location.href).searchParams.get("link");if(!e)return;let{a,k:o,i,n:d}=Ze(e)||{};if(a&&o&&i&&d)return {address:a,secretKey:o,chainId:i,chainNamespace:d}}function Ze(r){try{let e=JSON.parse(window.atob(r)),a=Math.floor(Date.now()/1e3),o=e.t;return !o||a>o?void 0:e}catch{}}function Y(){let{t:r}=i18n.useTranslation();hooks.useSettleSubscription({onMessage:e=>{let{status:a}=e;switch(a){case "COMPLETED":ui.toast.success(r("settle.settlement.completed"));break;case "FAILED":ui.toast.error(r("settle.settlement.failed"));break;}}});}function j(){let{t:r}=i18n.useTranslation(),e=hooks.useEventEmitter(),{setLedgerAddress:a}=hooks.useStorageLedgerAddress();return react.useEffect(()=>{e.on("wallet:connect-error",o=>{ui.toast.error(o.message);}),e.on("wallet:sign-message-with-ledger-error",o=>{window.setTimeout(()=>{ui.modal.confirm({title:r("connector.ledger.signMessageFailed"),content:r("connector.ledger.signMessageFailed.description"),size:"sm",onOk:async()=>(a(o.userAddress),Promise.resolve()),okLabel:r("common.ok"),onCancel:async()=>(ui.toast.error(o.message),Promise.resolve()),cancelLabel:r("common.no")}).then(i=>{});});});},[e,r]),{}}function ee(){let{t:r}=i18n.useTranslation(),e=hooks.useEventEmitter(),a=react.useRef({}),[o,i]=hooks.useSessionStorage("orderly_wallet_change_id",{});a.current=o,hooks.useWalletSubscription({onMessage:d=>{let{id:t,side:s,transStatus:p}=d,c=true;if(["DEPOSIT","WITHDRAW"].includes(s)&&["COMPLETED","FAILED"].includes(p)){let n=!!a.current[t];n||(a.current[t]=true,i(l=>({...l,[t]:true}))),c=!n;}if(p==="COMPLETED"&&c){let n=`${utils.capitalizeString(s)} completed`;s==="DEPOSIT"?n=r("transfer.deposit.completed"):s==="WITHDRAW"&&(n=r("transfer.withdraw.completed")),ui.toast.success(n);}else if(p==="FAILED"&&c){let n=`${utils.capitalizeString(s)} failed`;s==="DEPOSIT"?n=r("transfer.deposit.failed"):s==="WITHDRAW"&&(n=r("transfer.withdraw.failed")),ui.toast.error(n);}e.emit("wallet:changed",d);}});}var ie="orderly:wallet-info";var ae=r=>{let{wallet:e,connect:a,connectedChain:o,disconnect:i,namespace:d}=hooks.useWalletConnector();if(typeof a!="function")throw new types.SDKError("Please provide a wallet connector provider");hooks.useEventEmitter();let s=react.useRef(false);hooks.useConfig("brokerId");let {account:c,state:n}=hooks.useAccount(),l=hooks.useKeyStore(),u=hooks.useConfig("networkId"),[f,{checkChainSupport:m}]=hooks.useChains(),[C,P]=react.useState(false),{track:w,setTrackUserId:de}=hooks.useTrack(),x=react.useMemo(()=>e?.accounts?.[0]?.address,[e]),I=react.useMemo(()=>{let g=e?.chains?.[0]?.id,h=e?.chains?.[0]?.namespace;if(!(typeof g>"u"))return {id:utils.parseChainIdToNumber(g),namespace:h}},[e]);return react.useEffect(()=>{n.status>=types.AccountStatusEnum.EnableTrading&&c.accountId&&de(c.accountId);},[c,n]),react.useEffect(()=>{if(!o){P(false);return}let g=m(o.id,u);types.ABSTRACT_CHAIN_ID_MAP.has(parseInt(o.id))&&e?.label!=="AGW"&&(g=false),P(!g);},[o,f,m,u,e]),react.useEffect(()=>{utils.windowGuard(()=>{let g=l.getAddress(),h=JSON.parse(localStorage.getItem(ie)??"{}");o?.namespace!==types.ChainNamespace.solana&&g&&c.address!==g&&h.label&&a({autoSelect:{label:h.label,disableModals:true}}).then(b=>{},b=>{});});},[e,c.address]),react.useEffect(()=>{if(e===null&&n.status>types.AccountStatusEnum.NotConnected&&!n.validating){c.disconnect();return}if(C||!o||s.current)return;let g=k();x&&x!==c.address&&!g&&(c.setAddress(x,{provider:e?.provider,chain:{id:utils.praseChainIdToNumber(I.id),namespace:I.namespace.toUpperCase()},wallet:{name:e?.label??""},additionalInfo:e?.additionalInfo??{}}),w(types.TrackerEventName.walletConnect,{wallet:e?.label??"",network:I.namespace.toUpperCase()}),utils.windowGuard(()=>{localStorage.setItem(ie,JSON.stringify({label:e?.label??""}));})),I?.id!==c.chainId&&c.switchChainId(I?.id);},[e,o,x,I,c.address,n,c.chainId,C]),{connectWallet:async()=>(s.current=true,a({chainId:r.currentChainId}).then(async g=>{if(Array.isArray(g)&&g.length>0&&g[0]&&g[0].accounts.length>0){let h=g[0],b=utils.praseChainIdToNumber(h.chains[0].id);if(!m(b,u))return {wrongNetwork:true};if(!c)throw new Error("account is not initialized");n.status===types.AccountStatusEnum.EnableTradingWithoutConnected&&(localStorage.removeItem("orderly_link_device"),await c.disconnect());let le=await c.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 w(types.TrackerEventName.walletConnect,{wallet:h.label,network:h.chains[0].namespace.toUpperCase()}),{wallet:h,status:le,wrongNetwork:false}}return null}).finally(()=>{s.current=false;})),wrongNetwork:C}};var L=react.createContext({setCurrentChainId:r=>{},restrictedInfo:{},setShowAnnouncement:r=>{}}),D=()=>react.useContext(L);var se=r=>{let[e,a]=react.useState(false),[o,i]=V(r.defaultChain);B(),hooks.useTrackingInstance();let{connectWallet:d,wrongNetwork:t}=ae({currentChainId:o});ee(),Y(),Q(),j();let s=hooks.useRestrictedInfo(r.restrictedInfo),p=s.restrictedOpen,c=react.useMemo(()=>({connectWallet:d,wrongNetwork:t,currentChainId:o,setCurrentChainId:i,onChainChanged:r.onChainChanged,disabledConnect:p,restrictedInfo:s,showAnnouncement:e,setShowAnnouncement:a,onRouteChange:r.onRouteChange,widgetConfigs:r.widgetConfigs}),[d,o,p,r.onChainChanged,s,i,e,t,r.onRouteChange,r.widgetConfigs]);return jsxRuntime.jsx(L.Provider,{value:c,children:r.children})};var qr=()=>($(),null),ce=r=>{let{components:e,appIcons:a,onChainChanged:o,defaultChain:i,widgetConfigs:d,...t}=r;hooks.useTrack(),_();let s=K();return jsxRuntime.jsx(H,{appIcons:a,brokerName:r.brokerName,children:jsxRuntime.jsx(ui.OrderlyThemeProvider,{components:e,overrides:r.overrides,children:jsxRuntime.jsxs(hooks.OrderlyConfigProvider,{...t,children:[jsxRuntime.jsx(qr,{}),jsxRuntime.jsx(se,{onChainChanged:o,defaultChain:i,restrictedInfo:r.restrictedInfo,onRouteChange:r.onRouteChange,widgetConfigs:d,children:jsxRuntime.jsx(ui.LocaleProvider,{locale:s,children:jsxRuntime.jsx(ui.TooltipProvider,{delayDuration:300,children:jsxRuntime.jsx(ui.ModalProvider,{children:r.children})})})}),jsxRuntime.jsx(ui.Toaster,{})]})})})};process.env.NODE_ENV!=="production"&&(ce.displayName="OrderlyAppProvider");var Ur=(r,e)=>{let{wrongNetwork:a,disabledConnect:o}=D(),{state:i}=hooks.useAccount();return e?.skip?r:a||o||typeof e?.accountStatus<"u"&&i.status<e.accountStatus?typeof e?.fallbackData<"u"?e.fallbackData:null:r};function Hr(r){let{t:e}=i18n.useTranslation(),a=(i,d,t)=>({quantity:{required:e("orderEntry.orderQuantity.error.required"),min:e("orderEntry.orderQuantity.error.min",{value:t}),max:e("orderEntry.orderQuantity.error.max",{value:t})},order_quantity:{required:e("orderEntry.orderQuantity.error.required"),min:e("orderEntry.orderQuantity.error.min",{value:t}),max:e("orderEntry.orderQuantity.error.max",{value:t})},order_price:{required:e("orderEntry.orderPrice.error.required"),min:e("orderEntry.orderPrice.error.min",{value:t}),max:e("orderEntry.orderPrice.error.max",{value:t})},trigger_price:{required:e("orderEntry.triggerPrice.error.required"),min:e("orderEntry.triggerPrice.error.min",{value:t}),max:e("orderEntry.triggerPrice.error.max",{value:t})},tp_trigger_price:{required:e("tpsl.validate.tpTriggerPrice.error.required"),min:e("orderEntry.tpTriggerPrice.error.min",{value:t}),max:e("orderEntry.tpTriggerPrice.error.max",{value:t}),priceErrorMin:e("tpsl.validate.tpTriggerPrice.error.priceErrorMin"),priceErrorMax:e("tpsl.validate.tpTriggerPrice.error.priceErrorMax")},sl_trigger_price:{required:e("tpsl.validate.slTriggerPrice.error.required"),min:e("orderEntry.slTriggerPrice.error.min",{value:t}),max:e("orderEntry.slTriggerPrice.error.max",{value:t}),priceErrorMin:e("tpsl.validate.slTriggerPrice.error.priceErrorMin"),priceErrorMax:e("tpsl.validate.slTriggerPrice.error.priceErrorMax")},tp_order_price:{required:e("tpsl.validate.tpOrderPrice.error.required"),min:e("tpsl.validate.tpOrderPrice.error.min",{value:t}),max:e("tpsl.validate.tpOrderPrice.error.max",{value:t})},sl_order_price:{required:e("tpsl.validate.slOrderPrice.error.required"),min:e("tpsl.validate.slOrderPrice.error.min",{value:t}),max:e("tpsl.validate.slOrderPrice.error.max",{value:t})},total:{min:e("orderEntry.total.error.min",{value:t})},start_price:{required:e("orderEntry.startPrice.error.required"),min:e("orderEntry.startPrice.error.min",{value:t})},end_price:{required:e("orderEntry.endPrice.error.required"),min:e("orderEntry.endPrice.error.min",{value:t}),max:e("orderEntry.endPrice.error.max",{value:t})},total_orders:{required:e("orderEntry.totalOrders.error.required"),range:e("orderEntry.totalOrders.error.range")},skew:{required:e("orderEntry.skew.error.required"),min:e("orderEntry.skew.error.min",{value:t}),max:e("orderEntry.skew.error.max",{value:t})}})[i]?.[d]||"";return {parseErrorMsg:(i,d)=>{let{type:t,value:s}=r?.[i]||{};return t?a(i,t,d||s):""}}} exports.OrderlyAppProvider = ce; exports.useAppConfig = De; exports.useAppContext = D; exports.useDataTap = Ur; exports.useOrderEntryFormErrorMsg = Hr; //# sourceMappingURL=out.js.map //# sourceMappingURL=index.js.map