Change usdc to usdc.e (#436)

* change usdc to usdc.e in orderly page * update usdc to usdc.e * fix Maintenance Margin Ratio field issue * remove log * update text in Spot page * fix block problem * fix ledger display issue * update totalCollateral logic * fix ledger select accout too long issue * remove price board * remove advertisement * fix env * reset TotalCollateral logic * add USDC.e Available Balance * reset orderly tip * update ui in mobile site * update text --------- Co-authored-by: nature.xie <[email protected]> Co-authored-by: Gavin <[email protected]>
ref-finance · Oct 31, 2023 · 9010f10 · 9010f10
1 parent 29e21c5
commit 9010f10
Show file tree

Hide file tree

Showing 46 changed files with 569 additions and 223 deletions.
diff --git a/package.json b/package.json
@@ -5,13 +5,13 @@
   "scripts": {
     "analyze": "source-map-explorer 'build/*.js'",
     "build": "craco build && gzip -k -f build/*.js",
-    "build:testnet": "NEAR_ENV=testnet craco build && gzip -k -f build/*.js",
-    "build:pub-testnet": "NEAR_ENV=pub-testnet craco build && gzip -k -f build/*.js",
-    "build:mainnet": "NEAR_ENV=mainnet craco build && gzip -k -f build/*.js",
+    "build:testnet": "REACT_APP_NEAR_ENV=testnet craco build && gzip -k -f build/*.js",
+    "build:pub-testnet": "REACT_APP_NEAR_ENV=pub-testnet craco build && gzip -k -f build/*.js",
+    "build:mainnet": "REACT_APP_NEAR_ENV=mainnet craco build && gzip -k -f build/*.js",
     "start": "craco start",
-    "start:mainnet": "NEAR_ENV=mainnet craco start",
-    "start:testnet": "NEAR_ENV=testnet craco start",
-    "start:pub-testnet": "NEAR_ENV=pub-testnet craco start",
+    "start:mainnet": "REACT_APP_NEAR_ENV=mainnet craco start",
+    "start:testnet": "REACT_APP_NEAR_ENV=testnet craco start",
+    "start:pub-testnet": "REACT_APP_NEAR_ENV=pub-testnet craco start",
     "prettier": "prettier --check src",
     "prettier:fix": "prettier --write src",
     "test": "jest test --runInBand",

diff --git a/src/components/layout/ExternalPopUp.tsx b/src/components/layout/ExternalPopUp.tsx
@@ -3,7 +3,7 @@ import { isMobile } from 'src/utils/device';
 import { useHistory, useLocation } from 'react-router-dom';
 export default function ExternalPopUp() {
   const location = useLocation();
-  const env = process.env.NEAR_ENV || '';
+  const env = process.env.REACT_APP_NEAR_ENV || '';
   const is_test_env = env == 'testnet' || env == 'pub-testnet';
   const dom_id = is_test_env ? 'pr3sence' : 'ref-mainnet';
   const is_mobile = isMobile();

diff --git a/src/components/layout/MobileNav.tsx b/src/components/layout/MobileNav.tsx
@@ -896,7 +896,7 @@ export function MobileNavBar(props: any) {
           />
         ) : null}
       </div>
-      {isMobile ? <Marquee></Marquee> : null}
+      {/* {isMobile ? <Marquee></Marquee> : null} */}
 
       <MobileBridgeModal
         isOpen={showBridgeModalMobile}

diff --git a/src/components/layout/NavigationBar.tsx b/src/components/layout/NavigationBar.tsx
@@ -1094,7 +1094,7 @@ function NavigationBar() {
             <Language></Language>
           </div>
         </nav>
-        {isMobile ? null : <Marquee></Marquee>}
+        {/* {isMobile ? null : <Marquee></Marquee>} */}
       </div>
       <MobileNavBar
         hasBalanceOnRefAccount={hasBalanceOnRefAccount}

diff --git a/src/components/portfolio/Tool.tsx b/src/components/portfolio/Tool.tsx
@@ -344,7 +344,7 @@ export function getAccountId() {
     const account_suffix = accountId.split('.')[1];
     const env_keys = env_map[account_suffix];
     if (account_suffix && env_keys) {
-      const real_env = process.env.NEAR_ENV || '';
+      const real_env = process.env.REACT_APP_NEAR_ENV || '';
       if (env_keys?.indexOf(real_env) == -1) return '';
     }
   }

diff --git a/src/components/rpc/index.tsx b/src/components/rpc/index.tsx
@@ -386,7 +386,7 @@ const ModalAddCustomNetWork = (props: any) => {
       }
     }
     // do not support testnet
-    const env = process.env.NEAR_ENV;
+    const env = process.env.REACT_APP_NEAR_ENV;
     if (env == 'testnet' || env == 'pub-testnet') {
       setNotSupportTestnetError(true);
       setCustomLoading(false);
@@ -791,7 +791,7 @@ async function pingChain(url: string) {
     chain_id,
   };
 }
-const isPrd = (env: string = process.env.NEAR_ENV) => {
+const isPrd = (env: string = process.env.REACT_APP_NEAR_ENV) => {
   if (env != 'pub-testnet' && env != 'testnet') return true;
 };
 function trimStr(str: string = '') {

diff --git a/src/context/modal-ui/components/DerivationPath.tsx b/src/context/modal-ui/components/DerivationPath.tsx
@@ -423,7 +423,7 @@ export const DerivationPath: React.FC<DerivationPathProps> = ({
               key={account.accountId}
               className="pt-10 text-center text-base font-bold"
             >
-              <div className="account">
+              <div className="account w-full overflow-hidden whitespace-nowrap overflow-ellipsis px-6">
                 <span>{account.accountId}</span>
               </div>
             </div>

diff --git a/src/context/modal-ui/components/HardwareWalletAccountsForm.tsx b/src/context/modal-ui/components/HardwareWalletAccountsForm.tsx
@@ -18,7 +18,7 @@ const HardwareWalletAccountsForm: React.FC<FormProps> = ({
   onSubmit,
 }) => {
   return (
-    <div className="choose-ledger-account-form-wrapper">
+    <div className="choose-ledger-account-form-wrapper w-full">
       <p className="text-sm text-center">
         <FormattedMessage id="we_found" defaultMessage={'We found'} />
         <span className="px-1">{accounts.length}</span>
@@ -31,14 +31,17 @@ const HardwareWalletAccountsForm: React.FC<FormProps> = ({
           onSubmit(accounts, e);
         }}
       >
-        <div>
-          <div className="px-10 flex flex-col">
+        <div className="">
+          <div className="px-8 flex flex-col max-h-60 overflow-auto">
             {accounts.map((account, index) => (
               <div
                 key={index}
-                className="w-full mt-3 relative px-4 py-3 bg-black text-sm bg-opacity-10 rounded-md"
+                className="flex items-center w-full mt-3 relative px-2 py-3 bg-black text-sm bg-opacity-10 rounded-md"
               >
-                <label className=" " htmlFor={account.accountId}>
+                <label
+                  className="w-full overflow-hidden whitespace-nowrap overflow-ellipsis"
+                  htmlFor={account.accountId}
+                >
                   {' '}
                   {account.accountId}
                 </label>
@@ -53,7 +56,7 @@ const HardwareWalletAccountsForm: React.FC<FormProps> = ({
               </div>
             ))}
           </div>
-          <div className="px-10">
+          <div className="px-8">
             <button
               className="py-1.5 mt-7 w-full flex items-center justify-center text-sm rounded-lg"
               style={{

diff --git a/src/locales/en_US.ts b/src/locales/en_US.ts
@@ -1041,7 +1041,7 @@ const en_US = {
   history_orderly: 'History',
   settle_pnl: 'Settle PnL',
   settle_pnl_tips:
-    'By doing this, we’ll move your profit or loss from perp markets into the USDC token balance. This has no impact on your open positions or health.',
+    'By doing this, we’ll move your profit or loss from perp markets into the USDC.e token balance. This has no impact on your open positions or health.',
   total_unsettled_pnl: 'Total unsettled PnL',
   fut_unreal_pnl: 'Fut. Unreal. PnL',
   fut_daily_real: 'Fut. Daily Real.',
@@ -1372,7 +1372,7 @@ const en_US = {
   TotalAssets: 'Total Assets',
   TokenAllocation: 'Token Allocation',
   perpTip:
-    'We will be conducting a system update from 06:00 to 09:00 (UTC) on October 31, 2023. Please check our Twitter for update details. During this time, deposits and withdrawals will be temporarily unavailable, and spot and perp trading will be disabled. Due to the unique nature of this update, we kindly request that you cancel all your orders before this period.',
+    'Welcome to Perpetual Futures trading! Please read {perpTipLink} to get started!',
   perpTipLink: '[Perpetual Futures Introduction]  ',
   perpetual: 'Perpetual',
   pred_funding_rate: 'Pred. Funding Rate',
@@ -1413,9 +1413,9 @@ const en_US = {
   liquidations_fee: 'Liquidations Fee',
   more_trading_price: 'More Trading Price',
   unsettle_pnl_tip:
-    'Move a profit or loss from perp markets into the USDC token balance. This has no impact on your open positions or health.',
+    'Move a profit or loss from perp markets into the USDC.e token balance. This has no impact on your open positions or health.',
   margin_ratio_tip:
-    'The margin ratio of an account is equal to the total collateral value (ie the USDC balance + any unrealized profit/loss) divided by the total open notional of the account (the sum of the absolute notional value of all positions)',
+    'The margin ratio of an account is equal to the total collateral value (ie the USDC.e balance + any unrealized profit/loss) divided by the total open notional of the account (the sum of the absolute notional value of all positions)',
   portfolio_total_est_tip: 'Portfolio value in USD.',
   size: 'Size',
   closing_1: 'Closing',

diff --git a/src/locales/es.ts b/src/locales/es.ts
@@ -1398,7 +1398,7 @@ const es = {
   TotalAssets: 'Activos Totales',
   TokenAllocation: 'Asignación de Tokens',
   perpTip:
-    'We will be conducting a system update from 06:00 to 09:00 (UTC) on October 31, 2023. Please check our Twitter for update details. During this time, deposits and withdrawals will be temporarily unavailable, and spot and perp trading will be disabled. Due to the unique nature of this update, we kindly request that you cancel all your orders before this period.',
+    '¡Bienvenido al trading de Futuros Perpetuos! Por favor, lee {perpTipLink} para empezar.',
   perpTipLink: '[Introducción a los Futuros Perpetuos]  ',
   perpetual: 'Perpetuo',
   pred_funding_rate: 'Tasa de Financiamiento Pred.',

diff --git a/src/locales/ja.ts b/src/locales/ja.ts
@@ -1041,7 +1041,7 @@ const ja = {
   history_orderly: 'History',
   settle_pnl: 'Settle PnL',
   settle_pnl_tips:
-    'By doing this, we’ll move your profit or loss from perp markets into the USDC token balance. This has no impact on your open positions or health.',
+    'By doing this, we’ll move your profit or loss from perp markets into the USDC.e token balance. This has no impact on your open positions or health.',
   total_unsettled_pnl: 'Total unsettled PnL',
   fut_unreal_pnl: 'Fut. Unreal. PnL',
   fut_daily_real: 'Fut. Daily Real.',
@@ -1364,7 +1364,7 @@ const ja = {
   TotalAssets: 'Total Assets',
   TokenAllocation: 'Token Allocation',
   perpTip:
-    'We will be conducting a system update from 06:00 to 09:00 (UTC) on October 31, 2023. Please check our Twitter for update details. During this time, deposits and withdrawals will be temporarily unavailable, and spot and perp trading will be disabled. Due to the unique nature of this update, we kindly request that you cancel all your orders before this period.',
+    'Welcome to Perpetual Futures trading! Please read {perpTipLink} to get started!',
   perpTipLink: '[Perpetual Futures Introduction]  ',
   perpetual: 'Perpetual',
   pred_funding_rate: 'Pred. Funding Rate',
@@ -1402,9 +1402,9 @@ const ja = {
   liquidations_fee: 'Liquidations Fee',
   more_trading_price: 'More Trading Price',
   unsettle_pnl_tip:
-    'Move a profit or loss from perp markets into the USDC token balance. This has no impact on your open positions or health.',
+    'Move a profit or loss from perp markets into the USDC.e token balance. This has no impact on your open positions or health.',
   margin_ratio_tip:
-    'The margin ratio of an account is equal to the total collateral value (ie the USDC balance + any unrealized profit/loss) divided by the total open notional of the account (the sum of the absolute notional value of all positions)',
+    'The margin ratio of an account is equal to the total collateral value (ie the USDC.e balance + any unrealized profit/loss) divided by the total open notional of the account (the sum of the absolute notional value of all positions)',
   portfolio_total_est_tip: 'Portfolio value in USD.',
   size: 'Size',
   closing_1: 'Closing',

diff --git a/src/locales/ko.ts b/src/locales/ko.ts
@@ -1360,7 +1360,7 @@ const ko = {
   TotalAssets: '총 자산',
   TokenAllocation: '토큰 할당',
   perpTip:
-    'We will be conducting a system update from 06:00 to 09:00 (UTC) on October 31, 2023. Please check our Twitter for update details. During this time, deposits and withdrawals will be temporarily unavailable, and spot and perp trading will be disabled. Due to the unique nature of this update, we kindly request that you cancel all your orders before this period. ',
+    '영구 선물 트레이딩에 오신 걸 환영합니다! 시작 전 {perpTipLink}를 확인해주세요! ',
   perpTipLink: '[영구 선물 소개]  ',
   perpetual: 'Perpetual',
   pred_funding_rate: 'Pred. Funding Rate',

diff --git a/src/locales/ru.ts b/src/locales/ru.ts
@@ -1066,7 +1066,7 @@ const ru = {
   history_orderly: 'History',
   settle_pnl: 'Settle PnL',
   settle_pnl_tips:
-    'By doing this, we’ll move your profit or loss from perp markets into the USDC token balance. This has no impact on your open positions or health.',
+    'By doing this, we’ll move your profit or loss from perp markets into the USDC.e token balance. This has no impact on your open positions or health.',
   total_unsettled_pnl: 'Total unsettled PnL',
   fut_unreal_pnl: 'Fut. Unreal. PnL',
   fut_daily_real: 'Fut. Daily Real.',
@@ -1389,7 +1389,7 @@ const ru = {
   TotalAssets: 'Total Assets',
   TokenAllocation: 'Token Allocation',
   perpTip:
-    'We will be conducting a system update from 06:00 to 09:00 (UTC) on October 31, 2023. Please check our Twitter for update details. During this time, deposits and withdrawals will be temporarily unavailable, and spot and perp trading will be disabled. Due to the unique nature of this update, we kindly request that you cancel all your orders before this period.',
+    'Welcome to Perpetual Futures trading! Please read {perpTipLink} to get started!',
   perpTipLink: '[Perpetual Futures Introduction]  ',
   perpetual: 'Perpetual',
   pred_funding_rate: 'Pred. Funding Rate',
@@ -1427,9 +1427,9 @@ const ru = {
   liquidations_fee: 'Liquidations Fee',
   more_trading_price: 'More Trading Price',
   unsettle_pnl_tip:
-    'Move a profit or loss from perp markets into the USDC token balance. This has no impact on your open positions or health.',
+    'Move a profit or loss from perp markets into the USDC.e token balance. This has no impact on your open positions or health.',
   margin_ratio_tip:
-    'The margin ratio of an account is equal to the total collateral value (ie the USDC balance + any unrealized profit/loss) divided by the total open notional of the account (the sum of the absolute notional value of all positions)',
+    'The margin ratio of an account is equal to the total collateral value (ie the USDC.e balance + any unrealized profit/loss) divided by the total open notional of the account (the sum of the absolute notional value of all positions)',
   portfolio_total_est_tip: 'Portfolio value in USD.',
   size: 'Size',
   closing_1: 'Closing',

diff --git a/src/locales/uk_UA.ts b/src/locales/uk_UA.ts
@@ -1045,7 +1045,7 @@ const uk_UA = {
   history_orderly: 'History',
   settle_pnl: 'Settle PnL',
   settle_pnl_tips:
-    'By doing this, we’ll move your profit or loss from perp markets into the USDC token balance. This has no impact on your open positions or health.',
+    'By doing this, we’ll move your profit or loss from perp markets into the USDC.e token balance. This has no impact on your open positions or health.',
   total_unsettled_pnl: 'Total unsettled PnL',
   fut_unreal_pnl: 'Fut. Unreal. PnL',
   fut_daily_real: 'Fut. Daily Real.',
@@ -1368,7 +1368,7 @@ const uk_UA = {
   TotalAssets: 'Total Assets',
   TokenAllocation: 'Token Allocation',
   perpTip:
-    'We will be conducting a system update from 06:00 to 09:00 (UTC) on October 31, 2023. Please check our Twitter for update details. During this time, deposits and withdrawals will be temporarily unavailable, and spot and perp trading will be disabled. Due to the unique nature of this update, we kindly request that you cancel all your orders before this period.',
+    'Welcome to Perpetual Futures trading! Please read {perpTipLink} to get started!',
   perpTipLink: '[Perpetual Futures Introduction]  ',
   perpetual: 'Perpetual',
   pred_funding_rate: 'Pred. Funding Rate',
@@ -1406,9 +1406,9 @@ const uk_UA = {
   liquidations_fee: 'Liquidations Fee',
   more_trading_price: 'More Trading Price',
   unsettle_pnl_tip:
-    'Move a profit or loss from perp markets into the USDC token balance. This has no impact on your open positions or health.',
+    'Move a profit or loss from perp markets into the USDC.e token balance. This has no impact on your open positions or health.',
   margin_ratio_tip:
-    'The margin ratio of an account is equal to the total collateral value (ie the USDC balance + any unrealized profit/loss) divided by the total open notional of the account (the sum of the absolute notional value of all positions)',
+    'The margin ratio of an account is equal to the total collateral value (ie the USDC.e balance + any unrealized profit/loss) divided by the total open notional of the account (the sum of the absolute notional value of all positions)',
   portfolio_total_est_tip: 'Portfolio value in USD.',
   size: 'Size',
   closing_1: 'Closing',

diff --git a/src/locales/vi.ts b/src/locales/vi.ts
@@ -1367,7 +1367,7 @@ const vi = {
   TotalAssets: 'Tổng tài sản',
   TokenAllocation: 'Phân bổ Token',
   perpTip:
-    'We will be conducting a system update from 06:00 to 09:00 (UTC) on October 31, 2023. Please check our Twitter for update details. During this time, deposits and withdrawals will be temporarily unavailable, and spot and perp trading will be disabled. Due to the unique nature of this update, we kindly request that you cancel all your orders before this period.',
+    'Chào mừng bạn đến với giao dịch Hợp đồng tương lai vĩnh viễn! Vui lòng đọc {perpTipLink} để bắt đầu!',
   perpTipLink: '[Giới thiệu Hợp đồng tương lai vĩnh viễn]',
   perpetual: 'Perpetual',
   pred_funding_rate: 'Tỷ lệ Dự định đòn bẩy',

diff --git a/src/locales/zh_CN.ts b/src/locales/zh_CN.ts
@@ -1218,8 +1218,7 @@ const zh_CN = {
   TotalInvested: '投资',
   TotalAssets: '资产',
   TokenAllocation: '代币分布',
-  perpTip:
-    'We will be conducting a system update from 06:00 to 09:00 (UTC) on October 31, 2023. Please check our Twitter for update details. During this time, deposits and withdrawals will be temporarily unavailable, and spot and perp trading will be disabled. Due to the unique nature of this update, we kindly request that you cancel all your orders before this period.',
+  perpTip: '欢迎来到永续期货交易！请阅读 {perpTipLink} 以开始交易！',
   perpTipLink: '[永续期货介绍]',
   perpetual: 'Perpetual',
   pred_funding_rate: '预测资金费率',

diff --git a/src/pages/Orderly/OrderlyTradingBoard.tsx b/src/pages/Orderly/OrderlyTradingBoard.tsx
@@ -263,7 +263,6 @@ function OrderlyTradingBoard() {
 
   return (
     <div className="mx-auto relative xs:bottom-6 bottom-9">
-      {!isMobile && <PerpOrderlyTip />}
       {!isMobile && <TradingBoard></TradingBoard>}
 
       {isMobile && <MobileTradingBoard></MobileTradingBoard>}

diff --git a/src/pages/Orderly/PorfolioOrderly.tsx b/src/pages/Orderly/PorfolioOrderly.tsx
@@ -1,4 +1,10 @@
-import React, { createContext, useEffect, useContext, useState } from 'react';
+import React, {
+  createContext,
+  useEffect,
+  useContext,
+  useState,
+  useMemo,
+} from 'react';
 import Big from 'big.js';
 import ReactTooltip from 'react-tooltip';
 import _ from 'lodash';
@@ -68,6 +74,8 @@ function PortfolioOrderly() {
     needRefresh,
     maintenance,
   } = useOrderlyContext();
+  const { symbolFrom, symbolTo } = parseSymbol(symbol);
+  const curHoldingOut = holdings?.find((h) => h.token === symbolTo);
   const isSignedIn = globalState.isSignedIn;
   // for connect wallet
   const [tradingKeySet, setTradingKeySet] = useState<boolean>(false);
@@ -104,7 +112,6 @@ function PortfolioOrderly() {
 
   // const [holdings, setHoldings] = useState<Holding[]>();
   const [operationType, setOperationType] = useState<'deposit' | 'withdraw'>();
-  const { symbolFrom } = parseSymbol(symbol);
 
   const tokenIn = useTokenMetaFromSymbol(symbolFrom, tokenInfo);
   const [operationId, setOperationId] = useState<string>(tokenIn?.id || '');
@@ -603,6 +610,7 @@ function PortfolioOrderly() {
         accountBalance={tokenInHolding || 0}
         tokenInfo={tokenInfo}
         freeCollateral={freeCollateral}
+        curHoldingOut={curHoldingOut}
       />
 
       <AssetManagerModal
@@ -619,6 +627,7 @@ function PortfolioOrderly() {
         accountBalance={tokenInHolding || 0}
         tokenInfo={tokenInfo}
         freeCollateral={freeCollateral}
+        curHoldingOut={curHoldingOut}
       />
 
       <MobileFilterModal