@orderly.network/react-app
Version:
Create React App with Orderly Network components
14 lines (12 loc) • 13.2 kB
JavaScript
import { useTrack, OrderlyConfigProvider, useAccount, useEventEmitter, useSymbolsInfo, useDebouncedCallback, useTrackingInstance, useRestrictedInfo, useStorageChain, useChains, useConfig, useWalletConnector, useLocalStorage, useKeyStore, useSessionStorage, useWalletSubscription, useSettleSubscription, useWS, useStorageLedgerAddress, parseJSON } from '@orderly.network/hooks';
import { OrderlyThemeProvider, LocaleProvider, TooltipProvider, ModalProvider, Toaster, toast, parseNumber, useScreen, modal } from '@orderly.network/ui';
import { createContext, useContext, useEffect, useRef, useMemo, useState } from 'react';
import { useTranslation, useLocaleCode, LocaleEnum, i18n } from '@orderly.network/i18n';
import { AlgoOrderRootType, OrderStatus, SDKError, AccountStatusEnum, ABSTRACT_CHAIN_ID_MAP, ChainNamespace, TrackerEventName } from '@orderly.network/types';
import { transSymbolformString, parseChainIdToNumber, windowGuard, praseChainIdToNumber, capitalizeString, getTimestamp } from '@orderly.network/utils';
import { jsx, jsxs } from 'react/jsx-runtime';
import { zhCN, enUS } from 'date-fns/locale';
var L=()=>{useEffect(()=>{let e=new URLSearchParams(window.location.search).get("ref");e&&localStorage.setItem("referral_code",e);},[]);};function fe(r){return r==="BUY"?i18n.t("common.buy"):r==="SELL"?i18n.t("common.sell"):capitalizeString(r)}function N(r,e){let{symbol:s,side:t,quantity:n,client_order_id:c}=r,o="total_executed_quantity"in r?r.total_executed_quantity:0,d="status"in r?r.status:r.algo_status,l=e[s],i=l("base_dp"),a=fe(t),u=transSymbolformString(s),g="algo_type"in r&&r.algo_type===AlgoOrderRootType.POSITIONAL_TP_SL?i18n.t("tpsl.entirePosition"):i===void 0?n:parseNumber(n,{dp:i}),h="",m="";switch(d){case OrderStatus.NEW:c?.startsWith("scaled_")?(h=i18n.t("orders.status.scaledSubOrderOpened.toast.title"),m=`${a} ${u} ${g}`):(h=i18n.t("orders.status.opened.toast.title"),m=`${a} ${u} ${g}`);break;case OrderStatus.FILLED:case OrderStatus.PARTIAL_FILLED:let C=i===void 0?o:parseNumber(o,{dp:i});h=i18n.t("orders.status.filled.toast.title"),m=`${a} ${u} ${C} / ${g}`;break;case OrderStatus.CANCELLED:h=i18n.t("orders.status.canceled.toast.title"),m=`${a} ${u} ${g}`;break;case OrderStatus.REJECTED:h=i18n.t("orders.status.rejected.toast.title"),m=`${a} ${u} ${g}`;break;case OrderStatus.REPLACED:h=i18n.t("orders.status.replaced.toast.title"),m=`${t} ${u} ${o} / ${g}`;break;}return {title:h,msg:m}}function M(){let r=useEventEmitter(),e=useSymbolsInfo(),s=useRef({});useEffect(()=>{s.current=e;},[e]);let t=useDebouncedCallback(n=>{(o=>{let{title:d,msg:l}=N(o,s.current),i=o.algo_type||o.type;d&&l&&toast.success(jsxs("div",{children:[d,jsx("br",{}),jsx("div",{className:"orderly-text-white/[0.54] orderly-text-xs",children:l})]}),{id:i});})(n);},100);useEffect(()=>(r.on("orders:changed",t),()=>{r.off("orders:changed",t);}),[]);}function $(){let{t:r}=useTranslation(),e=useLocaleCode();return useMemo(()=>{let s={[LocaleEnum.en]:enUS,[LocaleEnum.zh]: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:s[e]},empty:{description:r("ui.empty.description")}}},[r,e])}var U=()=>{let r=useWS(),{t:e}=useTranslation();useEffect(()=>{let s=r.privateSubscribe({id:"assetconvert",event:"subscribe",topic:"assetconvert",ts:getTimestamp()},{onMessage(t){t.convertId&&toast.success(e("transfer.convert.completed"));}});return ()=>s()},[]);};function K(r){let{storageChain:e,setStorageChain:s}=useStorageChain(),[t,n]=useState(),[c]=useChains(),o=useConfig("networkId"),{connectedChain:d}=useWalletConnector();return useEffect(()=>{if(d)n?.(typeof d.id=="number"?d.id:parseInt(d.id));else {if(t)return;let l,i=o==="mainnet"?c.mainnet?.[0]:c.testnet?.[0];typeof r=="function"?l=r(o,c):typeof r=="object"&&(l=o==="mainnet"?r?.mainnet:r?.testnet);let a=l?.id||i?.network_infos?.chain_id;if(!a)return;e?n?.(e.chainId):(s(a),n?.(a));}},[d,c,t,o,n,r]),[t,n]}var F="orderly:wallet-info";function H(){let{connectedChain:r,disconnect:e}=useWalletConnector(),[s,t]=useLocalStorage("orderly_link_device",{}),{account:n}=useAccount(),{isMobile:c}=useScreen(),o=useConfig(),d=async a=>{localStorage.removeItem(F),await n.disconnect(),await e({label:a});};useEffect(()=>{let a=b(),u=JSON.parse(localStorage.getItem(F)??"{}");a&&u&&d(u.label);},[]);let l=async()=>{let a=b();if(!a)return;let{address:u,secretKey:g,chainId:h,chainNamespace:m}=a;if(!await n.importOrderlyKey({address:u,secretKey:g,chainNamespace:m}))return;t({chainId:h,chainNamespace:m});let C=new URL(window.location.href);C.searchParams.delete("link"),C.searchParams.append("utm_medium","qrcode");let k=decodeURIComponent(C.toString());history.replaceState(null,"",k);};useEffect(()=>{c&&!r&&l();},[n,r,c]);let i=async()=>{let{chainId:a,chainNamespace:u}=He()||{};if(c&&!r&&a&&u){let g=n.keyStore.getAddress(),h=n.keyStore.getOrderlyKey(),m=n.keyStore.getAccountId(g);await n.checkOrderlyKey(g,h,m)&&o.set("chainNamespace",u);}};return useEffect(()=>{i();},[n,c,r]),{linkDevice:l}}function He(){try{let r=localStorage.getItem("orderly_link_device");return r?parseJSON(r):null}catch{}}function b(){let e=new URL(window.location.href).searchParams.get("link");if(!e)return;let{a:s,k:t,i:n,n:c}=Qe(e)||{};if(s&&t&&n&&c)return {address:s,secretKey:t,chainId:n,chainNamespace:c}}function Qe(r){try{let e=JSON.parse(window.atob(r)),s=Math.floor(Date.now()/1e3),t=e.t;return !t||s>t?void 0:e}catch{}}function z(){let{t:r}=useTranslation();useSettleSubscription({onMessage:e=>{let{status:s}=e;switch(s){case "COMPLETED":toast.success(r("settle.settlement.completed"));break;case "FAILED":toast.error(r("settle.settlement.failed"));break;}}});}function B(){let{t:r}=useTranslation(),e=useEventEmitter(),{setLedgerAddress:s}=useStorageLedgerAddress();return useEffect(()=>{e.on("wallet:connect-error",t=>{toast.error(t.message);}),e.on("wallet:sign-message-with-ledger-error",t=>{window.setTimeout(()=>{modal.confirm({title:r("connector.ledger.signMessageFailed"),content:r("connector.ledger.signMessageFailed.description"),size:"sm",onOk:async()=>(s(t.userAddress),Promise.resolve()),okLabel:r("common.ok"),onCancel:async()=>(toast.error(t.message),Promise.resolve()),cancelLabel:r("common.no")}).then(n=>{});});});},[e,r]),{}}function G(){let{t:r}=useTranslation(),e=useEventEmitter(),s=useRef({}),[t,n]=useSessionStorage("orderly_wallet_change_id",{});s.current=t,useWalletSubscription({onMessage:c=>{let{id:o,side:d,transStatus:l}=c,i=true;if(["DEPOSIT","WITHDRAW"].includes(d)&&["COMPLETED","FAILED"].includes(l)){let a=s.current[o];n({...t,[o]:a?void 0:true}),i=!a;}if(l==="COMPLETED"&&i){let a=`${capitalizeString(d)} completed`;d==="DEPOSIT"?a=r("transfer.deposit.completed"):d==="WITHDRAW"&&(a=r("transfer.withdraw.completed")),toast.success(a);}else if(l==="FAILED"&&i){let a=`${capitalizeString(d)} failed`;d==="DEPOSIT"?a=r("transfer.deposit.failed"):d==="WITHDRAW"&&(a=r("transfer.withdraw.failed")),toast.error(a);}e.emit("wallet:changed",c);}});}var re="orderly:wallet-info";var te=r=>{let{wallet:e,connect:s,connectedChain:t,disconnect:n,namespace:c}=useWalletConnector();if(typeof s!="function")throw new SDKError("Please provide a wallet connector provider");useEventEmitter();let d=useRef(false);useConfig("brokerId");let {account:i,state:a}=useAccount(),u=useKeyStore(),g=useConfig("networkId"),[h,{checkChainSupport:m}]=useChains(),[P,C]=useState(false),{track:k,setTrackUserId:ce}=useTrack(),w=useMemo(()=>e?.accounts?.[0]?.address,[e]),E=useMemo(()=>{let p=e?.chains?.[0]?.id,f=e?.chains?.[0]?.namespace;if(!(typeof p>"u"))return {id:parseChainIdToNumber(p),namespace:f}},[e]);return useEffect(()=>{a.status>=AccountStatusEnum.EnableTrading&&i.accountId&&ce(i.accountId);},[i,a]),useEffect(()=>{if(!t){C(false);return}let p=m(t.id,g);ABSTRACT_CHAIN_ID_MAP.has(parseInt(t.id))&&e?.label!=="AGW"&&(p=false),C(!p);},[t,h,m,g,e]),useEffect(()=>{windowGuard(()=>{let p=u.getAddress(),f=JSON.parse(localStorage.getItem(re)??"{}");t?.namespace!==ChainNamespace.solana&&p&&i.address!==p&&f.label&&s({autoSelect:{label:f.label,disableModals:true}}).then(x=>{},x=>{});});},[e,i.address]),useEffect(()=>{if(e===null&&a.status>AccountStatusEnum.NotConnected&&!a.validating){i.disconnect();return}if(P||!t||d.current)return;let p=b();w&&w!==i.address&&!p&&(i.setAddress(w,{provider:e?.provider,chain:{id:praseChainIdToNumber(E.id),namespace:E.namespace.toUpperCase()},wallet:{name:e?.label??""},additionalInfo:e?.additionalInfo??{}},{validateOrderlyKeyScope:f=>f.includes("asset")}),k(TrackerEventName.walletConnect,{wallet:e?.label??"",network:E.namespace.toUpperCase()}),windowGuard(()=>{localStorage.setItem(re,JSON.stringify({label:e?.label??""}));})),E?.id!==i.chainId&&i.switchChainId(E?.id);},[e,t,w,E,i.address,a,i.chainId,P]),{connectWallet:async()=>(d.current=true,s({chainId:r.currentChainId}).then(async p=>{if(Array.isArray(p)&&p.length>0&&p[0]&&p[0].accounts.length>0){let f=p[0],x=praseChainIdToNumber(f.chains[0].id);if(!m(x,g))return {wrongNetwork:true};if(!i)throw new Error("account is not initialized");a.status===AccountStatusEnum.EnableTradingWithoutConnected&&(localStorage.removeItem("orderly_link_device"),await i.disconnect());let de=await i.setAddress(f.accounts[0].address,{provider:f.provider,chain:{id:praseChainIdToNumber(f.chains[0].id),namespace:f.chains[0].namespace.toUpperCase()},wallet:{name:f.label}});return k(TrackerEventName.walletConnect,{wallet:f.label,network:f.chains[0].namespace.toUpperCase()}),{wallet:f,status:de,wrongNetwork:false}}return null}).finally(()=>{d.current=false;})),wrongNetwork:P}};var oe=createContext({setCurrentChainId:r=>{},restrictedInfo:{},setShowAnnouncement:r=>{}}),D=()=>useContext(oe),ne=r=>{let[e,s]=useState(false),[t,n]=K(r.defaultChain);H(),useTrackingInstance();let{connectWallet:c,wrongNetwork:o}=te({currentChainId:t});G(),z(),U(),B();let d=useRestrictedInfo(r.restrictedInfo),l=d.restrictedOpen,i=useMemo(()=>({connectWallet:c,wrongNetwork:o,currentChainId:t,setCurrentChainId:n,onChainChanged:r.onChainChanged,disabledConnect:l,restrictedInfo:d,showAnnouncement:e,setShowAnnouncement:s,onRouteChange:r.onRouteChange}),[c,t,l,r.onChainChanged,d,n,e,o,r.onRouteChange]);return jsx(oe.Provider,{value:i,children:r.children})};var se=createContext({}),wr=()=>useContext(se),ae=r=>jsx(se.Provider,{value:r,children:r.children});var ie=r=>{let{components:e,appIcons:s,onChainChanged:t,defaultChain:n,...c}=r;useTrack(),L(),M();let o=$();return jsx(ae,{appIcons:s,brokerName:r.brokerName,children:jsx(OrderlyThemeProvider,{components:e,overrides:r.overrides,children:jsxs(OrderlyConfigProvider,{...c,children:[jsx(ne,{onChainChanged:t,defaultChain:n,restrictedInfo:r.restrictedInfo,onRouteChange:r.onRouteChange,children:jsx(LocaleProvider,{locale:o,children:jsx(TooltipProvider,{delayDuration:300,children:jsx(ModalProvider,{children:r.children})})})}),jsx(Toaster,{})]})})})};ie.displayName="OrderlyAppProvider";var _r=(r,e)=>{let{wrongNetwork:s,disabledConnect:t}=D(),{state:n}=useAccount();return e?.skip?r:s||t||typeof e?.accountStatus<"u"&&n.status<e.accountStatus?typeof e?.fallbackData<"u"?e.fallbackData:null:r};function Mr(r){let{t:e}=useTranslation(),s=(n,c,o)=>({quantity:{required:e("orderEntry.orderQuantity.error.required"),min:e("orderEntry.orderQuantity.error.min",{value:o}),max:e("orderEntry.orderQuantity.error.max",{value:o})},order_quantity:{required:e("orderEntry.orderQuantity.error.required"),min:e("orderEntry.orderQuantity.error.min",{value:o}),max:e("orderEntry.orderQuantity.error.max",{value:o})},order_price:{required:e("orderEntry.orderPrice.error.required"),min:e("orderEntry.orderPrice.error.min",{value:o}),max:e("orderEntry.orderPrice.error.max",{value:o})},trigger_price:{required:e("orderEntry.triggerPrice.error.required"),min:e("orderEntry.triggerPrice.error.min",{value:o}),max:e("orderEntry.triggerPrice.error.max",{value:o})},tp_trigger_price:{min:e("orderEntry.tpTriggerPrice.error.min",{value:o}),max:e("orderEntry.tpTriggerPrice.error.max",{value:o})},sl_trigger_price:{min:e("orderEntry.slTriggerPrice.error.min",{value:o}),max:e("orderEntry.slTriggerPrice.error.max",{value:o})},total:{min:e("orderEntry.total.error.min",{value:o})},max_price:{required:e("orderEntry.upperPrice.error.required"),min:e("orderEntry.upperPrice.error.min",{value:o}),max:e("orderEntry.upperPrice.error.max",{value:o})},min_price:{required:e("orderEntry.lowerPrice.error.required"),min:e("orderEntry.lowerPrice.error.min",{value:o}),max:e("orderEntry.lowerPrice.error.max")},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:o}),max:e("orderEntry.skew.error.max",{value:o})}})[n]?.[c]||"";return {parseErrorMsg:n=>{let{type:c,value:o}=r?.[n]||{};return c?s(n,c,o):""}}}
export { ie as OrderlyAppProvider, wr as useAppConfig, D as useAppContext, _r as useDataTap, Mr as useOrderEntryFormErrorMsg };
//# sourceMappingURL=out.js.map
//# sourceMappingURL=index.mjs.map