fix: 🐛 liquidation percentage, roundTo helper function,next18n

package.json

@@ -1,6 +1,6 @@
 {
   "name": "src",
-  "version": "0.8.0+43.1",
+  "version": "0.8.0+43.2",
   "private": true,
   "scripts": {
     "dev": "next dev",

src/components/announcement_modal/announcement_modal.tsx

@@ -4,7 +4,7 @@ import {IAnnouncementModal} from '../../contexts/global_context';
 import {NotificationContext} from '../../contexts/notification_context';
 import {ImCross} from 'react-icons/im';
 import {MessageType} from '../../constants/message_type';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 
 type TranslateFunction = (s: string) => string;
 

src/components/app_download_container/app_download_container.tsx

@@ -1,6 +1,6 @@
 import Image from 'next/image';
 import React from 'react';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 
 type TranslateFunction = (s: string) => string;
 

src/components/assets_page_body/assets_page_body.tsx

@@ -10,7 +10,7 @@ import Skeleton, {SkeletonTheme} from 'react-loading-skeleton';
 // import {SKELETON_DISPLAY_TIME} from '../../constants/display';
 */
 import Footer from '../footer/footer';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {CustomError, isCustomError} from '../../lib/custom_error';
 import {Code} from '../../constants/code';
 

src/components/audit_report/audit_report.tsx

@@ -2,7 +2,7 @@ import Image from 'next/image';
 import Link from 'next/link';
 import {BiLinkAlt} from 'react-icons/bi';
 import {TranslateFunction} from '../../interfaces/tidebit_defi_background/locale';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 
 const AuditReport = () => {
   const {t}: {t: TranslateFunction} = useTranslation('common');

src/components/badge_modal/badge_modal.tsx

@@ -6,7 +6,7 @@ import {IBadgeModal} from '../../contexts/global_context';
 import {BADGE_LIST} from '../../constants/display';
 import {ImCross} from 'react-icons/im';
 import {BsFacebook, BsTwitter, BsReddit} from 'react-icons/bs';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import useShareProcess from '../../lib/hooks/use_share_process';
 import {ShareType} from '../../constants/share_type';
 import {ShareSettings, SocialMediaConstant} from '../../constants/social_media';

src/components/banner/banner.tsx

@@ -1,6 +1,6 @@
 import Image from 'next/image';
 import React from 'react';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {useGlobal} from '../../contexts/global_context';
 import {LayoutAssertion} from '../../constants/layout_assertion';
 

src/components/candlestick_chart/candlestick_chart.tsx

@@ -70,7 +70,7 @@ import {TimeSpanUnion, getTime} from '../../constants/time_span_union';
 import {freemem} from 'os';
 import {normalize} from 'path';
 import {TranslateFunction} from '../../interfaces/tidebit_defi_background/locale';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {create} from 'domain';
 import {LayoutAssertion} from '../../constants/layout_assertion';
 

src/components/crypto_card/crypto_card.tsx

@@ -9,7 +9,7 @@ import {MarketContext} from '../../contexts/market_context';
 import {useGlobal} from '../../contexts/global_context';
 import {ICurrency} from '../../constants/currency';
 import {ToastTypeAndText} from '../../constants/toast_type';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {FRACTION_DIGITS} from '../../constants/config';
 import {LayoutAssertion} from '../../constants/layout_assertion';
 

src/components/crypto_category/crypto_category.tsx

@@ -4,7 +4,7 @@ import {MarketContext, IMarketContext} from '../../contexts/market_context';
 import {CRYPTO_CARD_COLORS} from '../../constants/display';
 import Link from 'next/link';
 import {ITickerData} from '../../interfaces/tidebit_defi_background/ticker_data';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 
 type TranslateFunction = (s: string) => string;
 const CryptoCategory = ({...otherProps}) => {

src/components/crypto_summary/crypto_summary.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import Image from 'next/image';
 import {BiLinkAlt} from 'react-icons/bi';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import Link from 'next/link';
 
 type TranslateFunction = (s: string) => string;

src/components/deposit_history_modal/deposit_history_modal.tsx

@@ -8,7 +8,7 @@ import {OrderStatusUnion} from '../../constants/order_status_union';
 import {UNIVERSAL_NUMBER_FORMAT_LOCALE} from '../../constants/display';
 import {FRACTION_DIGITS} from '../../constants/config';
 import {timestampToString} from '../../lib/common';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {IAcceptedDepositOrder} from '../../interfaces/tidebit_defi_background/accepted_deposit_order';
 import {ToastId} from '../../constants/toast_id';
 import {ToastTypeAndText} from '../../constants/toast_type';

src/components/deposit_modal/deposit_modal.tsx

@@ -10,7 +10,7 @@ import {
 import Image from 'next/image';
 import {DELAYED_HIDDEN_SECONDS, UNIVERSAL_NUMBER_FORMAT_LOCALE} from '../../constants/display';
 import {useGlobal} from '../../contexts/global_context';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {findCodeByReason, locker, randomHex, wait} from '../../lib/common';
 import {OrderType} from '../../constants/order_type';
 import {UserContext} from '../../contexts/user_context';

src/components/failed_modal/failed_modal.tsx

@@ -2,7 +2,7 @@ import Lottie from 'lottie-react';
 import failedAnimation from '../../../public/animation/Lottie_Main_Comp.json';
 import RippleButton from '../ripple_button/ripple_button';
 import {ImCross} from 'react-icons/im';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 
 type TranslateFunction = (s: string) => string;
 

src/components/footer/footer.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import Link from 'next/link';
 import TideLink from '../tide_link/tide_link';
 import RippleButton from '../ripple_button/ripple_button';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {TBDURL} from '../../constants/api_request';
 import {COPYRIGHT} from '../../constants/config';
 import {useRouter} from 'next/router';

src/components/hero_description/hero_description.tsx

@@ -10,7 +10,7 @@ import HeroReverse from '../hero_reverse/hero_reverse';
 import HeroReverse1 from '../hero_reverse1/hero_reverse1';
 import StatisticBlock from '../statistic/statistic';
 import ReserveRatio from '../reserve_ratio/reserve_ratio';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {MarketContext} from '../../contexts/market_context';
 import AuditReport from '../audit_report/audit_report';
 

src/components/history_position_item/history_position_item.tsx

@@ -7,7 +7,7 @@ import {roundToDecimalPlaces, timestampToString, toPnl} from '../../lib/common';
 import {TypeOfPosition} from '../../constants/type_of_position';
 import {useGlobal} from '../../contexts/global_context';
 import {IDisplayCFDOrder} from '../../interfaces/tidebit_defi_background/display_accepted_cfd_order';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {MarketContext} from '../../contexts/market_context';
 import SafeMath from '../../lib/safe_math';
 
@@ -28,7 +28,8 @@ const HistoryPositionItem = ({closedCfdDetails, ...otherProps}: IHistoryPosition
 
   const closeValue = roundToDecimalPlaces(
     +SafeMath.mult(closedCfdDetails.closePrice!, closedCfdDetails.amount),
-    2
+    2,
+    true
   );
   const spread = marketCtx.getTickerSpread(closedCfdDetails.instId);
   const pnl =

src/components/history_position_modal/history_position_modal.tsx

@@ -11,7 +11,7 @@ import {numberFormatted, roundToDecimalPlaces, timestampToString, toPnl} from '.
 import {CFDClosedType} from '../../constants/cfd_closed_type';
 import {OrderState} from '../../constants/order_state';
 import {IDisplayCFDOrder} from '../../interfaces/tidebit_defi_background/display_accepted_cfd_order';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {UserContext} from '../../contexts/user_context';
 import useShareProcess from '../../lib/hooks/use_share_process';
 import {ShareType} from '../../constants/share_type';
@@ -57,7 +57,8 @@ const HistoryPositionModal = ({
 
   const closeValue = roundToDecimalPlaces(
     +SafeMath.mult(closedCfdDetails.closePrice!, closedCfdDetails.amount),
-    2
+    2,
+    true
   );
   const spread = marketCtx.getTickerSpread(closedCfdDetails.instId);
   const pnl =

src/components/interest_section/interest_section.tsx

@@ -5,7 +5,7 @@ import {DEFAULT_INTEREST_RATE, UNIVERSAL_NUMBER_FORMAT_LOCALE} from '../../const
 import runningDog from '../../../public/animation/70560-puli-dog-run.json';
 import {useGlobal} from '../../contexts/global_context';
 import {UserContext} from '../../contexts/user_context';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {LayoutAssertion} from '../../constants/layout_assertion';
 
 type TranslateFunction = (s: string) => string;

src/components/notification_item/notification_item.tsx

@@ -6,7 +6,7 @@ import {INotificationItem} from '../../interfaces/tidebit_defi_background/notifi
 import {timestampToString} from '../../lib/common';
 import {MessageType} from '../../constants/message_type';
 import {NotificationLevel} from '../../constants/notification_level';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 
 type TranslateFunction = (s: string) => string;
 

src/components/open_position_item/open_position_item.tsx

@@ -12,12 +12,12 @@ import PositionLineGraph from '../position_line_graph/position_line_graph';
 import {useGlobal} from '../../contexts/global_context';
 import {ProfitState} from '../../constants/profit_state';
 import {TypeOfPosition} from '../../constants/type_of_position';
-import {numberFormatted, timestampToString, toPnl} from '../../lib/common';
+import {numberFormatted, roundToDecimalPlaces, timestampToString, toPnl} from '../../lib/common';
 import {cfdStateCode} from '../../constants/cfd_state_code';
 import {POSITION_CLOSE_COUNTDOWN_SECONDS, FRACTION_DIGITS} from '../../constants/config';
 import {MarketContext} from '../../contexts/market_context';
 import {IDisplayCFDOrder} from '../../interfaces/tidebit_defi_background/display_accepted_cfd_order';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {defaultResultFailed} from '../../interfaces/tidebit_defi_background/result';
 import {IQuotation} from '../../interfaces/tidebit_defi_background/quotation';
 import {ToastTypeAndText} from '../../constants/toast_type';
@@ -314,7 +314,7 @@ const OpenPositionItem = ({openCfdDetails}: IOpenPositionItemProps) => {
         <div className="">
           <div className="text-xs text-lightGray">{t('TRADE_PAGE.OPEN_POSITION_ITEM_VALUE')}</div>
           <div className="text-sm">
-            $ {openValue.toLocaleString(UNIVERSAL_NUMBER_FORMAT_LOCALE, FRACTION_DIGITS)}
+            $ {numberFormatted(roundToDecimalPlaces(openValue, 2, true))}
           </div>
         </div>
 

src/components/personal_achievement_modal/personal_achievement_modal.tsx

@@ -8,7 +8,7 @@ import Skeleton, {SkeletonTheme} from 'react-loading-skeleton';
 import {unitAsset} from '../../constants/config';
 import {ProfitState} from '../../constants/profit_state';
 import {numberFormatted, timestampToString, accountTruncate} from '../../lib/common';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {
   IPersonalAchievement,
   defaultPersonalAchievement,

src/components/pnl_section/pnl_section.tsx

@@ -1,5 +1,5 @@
 import React, {useContext} from 'react';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {UserContext} from '../../contexts/user_context';
 import {numberFormatted} from '../../lib/common';
 import {DEFAULT_PNL_DATA, TypeOfPnLColor} from '../../constants/display';

src/components/position_closed_modal/position_closed_modal.tsx

@@ -37,7 +37,7 @@ import {useGlobal} from '../../contexts/global_context';
 import {BsClockHistory} from 'react-icons/bs';
 import {ProfitState} from '../../constants/profit_state';
 import {UserContext} from '../../contexts/user_context';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {IDisplayCFDOrder} from '../../interfaces/tidebit_defi_background/display_accepted_cfd_order';
 import {IApplyCloseCFDOrder} from '../../interfaces/tidebit_defi_background/apply_close_cfd_order';
 import {IPnL} from '../../interfaces/tidebit_defi_background/pnl';
@@ -197,7 +197,7 @@ const PositionClosedModal = ({
     const closePrice = quotation.price;
     const leverage = marketCtx.tickerStatic?.leverage ?? DEFAULT_LEVERAGE;
 
-    const openValue = roundToDecimalPlaces(+SafeMath.mult(openPrice, cfd.amount), 2);
+    const openValue = roundToDecimalPlaces(+SafeMath.mult(openPrice, cfd.amount), 2, true);
 
     const pnl: IPnL =
       cfd?.pnl ||

src/components/position_open_modal/position_open_modal.tsx

@@ -29,12 +29,12 @@ import {
   CFD_LIQUIDATION_TIME,
   DISPLAY_QUOTATION_RENEWAL_INTERVAL_SECONDS,
   FRACTION_DIGITS,
-  LIQUIDATION_FIVE_LEVERAGE,
+  LIQUIDATION_PERCENTAGE,
   WAITING_TIME_FOR_USER_SIGNING,
   unitAsset,
 } from '../../constants/config';
 import {IApplyCreateCFDOrder} from '../../interfaces/tidebit_defi_background/apply_create_cfd_order';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {
   defaultResultSuccess,
   defaultResultFailed,
@@ -333,8 +333,8 @@ const PositionOpenModal = ({
 
     const newLiquidationPrice =
       openCfdRequest.typeOfPosition === TypeOfPosition.BUY
-        ? +SafeMath.mult(newQuotation.price, SafeMath.minus(1, LIQUIDATION_FIVE_LEVERAGE))
-        : +SafeMath.mult(newQuotation.price, SafeMath.plus(1, LIQUIDATION_FIVE_LEVERAGE));
+        ? +SafeMath.mult(newQuotation.price, SafeMath.minus(1, LIQUIDATION_PERCENTAGE))
+        : +SafeMath.mult(newQuotation.price, SafeMath.plus(1, LIQUIDATION_PERCENTAGE));
     const gslFee = +SafeMath.mult(gsl ?? 0, SafeMath.mult(openCfdRequest.amount, newPrice));
 
     globalCtx.dataPositionOpenModalHandler({

src/components/position_updated_modal/position_updated_modal.tsx

@@ -19,7 +19,7 @@ import {MarketContext} from '../../contexts/market_context';
 import {IUpdatedCFDInputProps, useGlobal} from '../../contexts/global_context';
 import {TypeOfPosition} from '../../constants/type_of_position';
 import {UserContext} from '../../contexts/user_context';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {unitAsset, FRACTION_DIGITS} from '../../constants/config';
 import {IDisplayApplyCFDOrder} from '../../interfaces/tidebit_defi_background/display_apply_cfd_order';
 import {IApplyUpdateCFDOrder} from '../../interfaces/tidebit_defi_background/apply_update_cfd_order';

src/components/receipt_section/receipt_section.tsx

@@ -14,7 +14,7 @@ import {
   IDepositOrder,
   IWithdrawOrder,
 } from '../../interfaces/tidebit_defi_background/order';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {TranslateFunction} from '../../interfaces/tidebit_defi_background/locale';
 
 const ReceiptSection = () => {

src/components/reserve_card/reserve_card.tsx

@@ -1,7 +1,7 @@
 import Image from 'next/image';
 import Link from 'next/link';
 import React from 'react';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {BiLinkAlt} from 'react-icons/bi';
 import {TranslateFunction} from '../../interfaces/tidebit_defi_background/locale';
 

src/components/searching_modal/searching_modal.tsx

@@ -1,7 +1,7 @@
 import Lottie from 'lottie-react';
 import searching from '../../../public/animation/searching.json';
 import {ImCross} from 'react-icons/im';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 import {TranslateFunction} from '../../interfaces/tidebit_defi_background/locale';
 
 interface ISearchingModalProps {

src/components/trade_statistics/trade_statistics.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import {UNIVERSAL_NUMBER_FORMAT_LOCALE} from '../../constants/display';
 import {FRACTION_DIGITS} from '../../constants/config';
-import {useTranslation} from 'react-i18next';
+import {useTranslation} from 'next-i18next';
 
 type TranslateFunction = (s: string) => string;
 interface ITradeStatistics {