Fix wallet name in transactions history

package.json

@@ -21,6 +21,8 @@
     "moment-jalaali": "^0.10.0",
     "normalize.css": "^8.0.1",
     "radium": "^0.26.2",
+    "rc-dropdown": "^4.1.0",
+    "rc-menu": "^9.12.4",
     "rc-scrollbars": "^1.1.5",
     "react": "^18.2.0",
     "react-countdown": "^2.3.5",

public/assets/locales/en/translation.json

@@ -81,7 +81,7 @@
     "BUSD": "BUSD",
     "DOGE": "DOGE",
     "LTC": "LTC",
-    "TBNB": "TBUSD",
+    "TBNB": "TBNB",
     "TBUSD": "TBUSD",
     "BCH": "BCH",
     "TRX": "TRX"
@@ -250,6 +250,16 @@
     "category": "Categories",
     "size": "Number",
     "period" : "Period",
+    "assetBlock" : "Reservation",
+    "assetUnBlocked" : "Asset UnBlocked",
+    "refund" : "Refund",
+    "startRefund" : "Start Refund",
+    "cancelExchange" : "Canceled",
+    "readyToExchange" : "Awaiting",
+    "decreaseWallet" : "Deduction",
+    "increaseWallet" : "Addition",
+    "balanceStatus" : "Balance Status",
+    "selfTrade" : "Self Trade",
     "ascendingByTime" : "Ascending By Time"
   },
   "TransactionCategory": {
@@ -259,7 +269,7 @@
     "WITHDRAW": "Withdraw",
     "ORDER_CANCEL": "Cancel Order",
     "ORDER_CREATE": "Create Order",
-    "ORDER_FINALIZED": "Finalized Order",
+    "ORDER_FINALIZED": "Refund",
     "ETC" : "Unknown"
   },
   "DepositWithdraw": {

public/assets/locales/fa/translation.json

@@ -250,6 +250,16 @@
     "category" : "نوع تراکنش",
     "size" : "تعداد",
     "period" : "بازه زمانی",
+    "assetBlock" : "رزرو",
+    "assetUnBlocked" : "رفع مسدودی",
+    "refund" : "بازگشت وجه",
+    "startRefund" : "شروع بازگردانی",
+    "cancelExchange" : "لغو شده",
+    "readyToExchange" : "آماده مبادله",
+    "decreaseWallet" : "کاهش",
+    "increaseWallet" : "افزایش",
+    "balanceStatus" : "وضعیت موجودی",
+    "selfTrade" : "جیب به جیب",
     "ascendingByTime" : "نمایش براساس جدیدترین"
   },
   "TransactionCategory": {
@@ -259,7 +269,7 @@
     "WITHDRAW" : "برداشت",
     "ORDER_CANCEL" : "لغو سفارش",
     "ORDER_CREATE" : "ثبت سفارش",
-    "ORDER_FINALIZED" : "اتمام سفارش",
+    "ORDER_FINALIZED" : "بازگشت وجه",
     "ETC" : "نامشخص"
   },
   "DepositWithdraw": {

public/assets/locales/uzb/translation.json

@@ -81,7 +81,7 @@
     "BUSD": "BUSD",
     "DOGE": "DOGE",
     "LTC": "LTC",
-    "TBNB": "TBUSD",
+    "TBNB": "TBNB",
     "TBUSD": "TBUSD",
     "BCH": "BCH",
     "TRX": "TRX"
@@ -250,6 +250,16 @@
     "category": "Toifalar",
     "size": "Raqam",
     "period" : "Davr",
+    "assetBlock" : "Rezervasyon",
+    "assetUnBlocked" : "Blokdan chiqarish",
+    "refund" : "Qaytarish",
+    "startRefund" : "Qaytarishni boshlash",
+    "cancelExchange" : "Bekor qilindi",
+    "readyToExchange" : "Almashtirishga tayyor",
+    "decreaseWallet" : "Inventarizatsiyani qisqartirish",
+    "increaseWallet" : "Inventarning ko'payishi",
+    "balanceStatus" : "Muvozanat holati",
+    "selfTrade" : "O'z-o'zidan savdo",
     "ascendingByTime" : "Eng so'nggisiga asoslangan ko'rsatish"
   },
   "TransactionCategory": {
@@ -259,7 +269,7 @@
     "WITHDRAW": "Olib chiqish",
     "ORDER_CANCEL": "Buyurtmani bekor qilish",
     "ORDER_CREATE": "Buyurtma yaratish",
-    "ORDER_FINALIZED": "Buyurtma yakunlandi",
+    "ORDER_FINALIZED": "Qaytarish",
     "ETC" : "Noma'lum"
   },
   "DepositWithdraw": {

src/assets/fontIcon/opex-icon/config.json

@@ -951,6 +951,30 @@
       "search": [
         "exchange-arrow"
       ]
+    },
+    {
+      "uid": "3838a5aba604532d2dbae5904615ea39",
+      "css": "down",
+      "code": 529,
+      "src": "mfglabs"
+    },
+    {
+      "uid": "c21d309f797d3644dc8d28c4617738ce",
+      "css": "left",
+      "code": 530,
+      "src": "mfglabs"
+    },
+    {
+      "uid": "1d35198f5190ec004dd4ec742fbe19ca",
+      "css": "right",
+      "code": 531,
+      "src": "mfglabs"
+    },
+    {
+      "uid": "040e72500c863813088c9f9c9415f8e9",
+      "css": "up",
+      "code": 532,
+      "src": "mfglabs"
     }
   ]
 }

src/assets/fontIcon/opex-icon/css/opex-icon-codes.css

@@ -76,6 +76,10 @@
 .icon-trash-2:before { content: '\0208'; } /* 'Ȉ' */
 .icon-cicle-plus-01:before { content: '\0209'; } /* 'ȉ' */
 .icon-exchange-arrow:before { content: '\0210'; } /* 'Ȑ' */
+.icon-down:before { content: '\0211'; } /* 'ȑ' */
+.icon-left:before { content: '\0212'; } /* 'Ȓ' */
+.icon-right:before { content: '\0213'; } /* 'ȓ' */
+.icon-up:before { content: '\0214'; } /* 'Ȕ' */
 .icon-market:before { content: '\e800'; } /* '' */
 .icon-cancel-circled2:before { content: '\e801'; } /* '' */
 .icon-settings:before { content: '\e802'; } /* '' */

src/assets/fontIcon/opex-icon/css/opex-icon-ie7-codes.css

@@ -76,6 +76,10 @@
 .icon-trash-2 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'Ȉ '); }
 .icon-cicle-plus-01 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'ȉ '); }
 .icon-exchange-arrow { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'Ȑ '); }
+.icon-down { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'ȑ '); }
+.icon-left { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'Ȓ '); }
+.icon-right { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'ȓ '); }
+.icon-up { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'Ȕ '); }
 .icon-market { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
 .icon-cancel-circled2 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
 .icon-settings { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }

src/assets/fontIcon/opex-icon/css/opex-icon-ie7.css

@@ -87,6 +87,10 @@
 .icon-trash-2 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'Ȉ '); }
 .icon-cicle-plus-01 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'ȉ '); }
 .icon-exchange-arrow { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'Ȑ '); }
+.icon-down { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'ȑ '); }
+.icon-left { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'Ȓ '); }
+.icon-right { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'ȓ '); }
+.icon-up { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'Ȕ '); }
 .icon-market { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
 .icon-cancel-circled2 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
 .icon-settings { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }

src/assets/fontIcon/opex-icon/css/opex-icon.css

@@ -1,11 +1,11 @@
 @font-face {
   font-family: 'opex-icon';
-  src: url('../font/opex-icon.eot?50181082');
-  src: url('../font/opex-icon.eot?50181082#iefix') format('embedded-opentype'),
-       url('../font/opex-icon.woff2?50181082') format('woff2'),
-       url('../font/opex-icon.woff?50181082') format('woff'),
-       url('../font/opex-icon.ttf?50181082') format('truetype'),
-       url('../font/opex-icon.svg?50181082#opex-icon') format('svg');
+  src: url('../font/opex-icon.eot?89928706');
+  src: url('../font/opex-icon.eot?89928706#iefix') format('embedded-opentype'),
+       url('../font/opex-icon.woff2?89928706') format('woff2'),
+       url('../font/opex-icon.woff?89928706') format('woff'),
+       url('../font/opex-icon.ttf?89928706') format('truetype'),
+       url('../font/opex-icon.svg?89928706#opex-icon') format('svg');
   font-weight: normal;
   font-style: normal;
 }
@@ -15,7 +15,7 @@
 @media screen and (-webkit-min-device-pixel-ratio:0) {
   @font-face {
     font-family: 'opex-icon';
-    src: url('../font/opex-icon.svg?50181082#opex-icon') format('svg');
+    src: url('../font/opex-icon.svg?89928706#opex-icon') format('svg');
   }
 }
 */
@@ -131,6 +131,10 @@
 .icon-trash-2:before { content: '\0208'; } /* 'Ȉ' */
 .icon-cicle-plus-01:before { content: '\0209'; } /* 'ȉ' */
 .icon-exchange-arrow:before { content: '\0210'; } /* 'Ȑ' */
+.icon-down:before { content: '\0211'; } /* 'ȑ' */
+.icon-left:before { content: '\0212'; } /* 'Ȓ' */
+.icon-right:before { content: '\0213'; } /* 'ȓ' */
+.icon-up:before { content: '\0214'; } /* 'Ȕ' */
 .icon-market:before { content: '\e800'; } /* '' */
 .icon-cancel-circled2:before { content: '\e801'; } /* '' */
 .icon-settings:before { content: '\e802'; } /* '' */

src/assets/fontIcon/opex-icon/demo.html

@@ -146,11 +146,11 @@
     }
     @font-face {
       font-family: 'opex-icon';
-      src: url('./font/opex-icon.eot?44260891');
-      src: url('./font/opex-icon.eot?44260891#iefix') format('embedded-opentype'),
-           url('./font/opex-icon.woff?44260891') format('woff'),
-           url('./font/opex-icon.ttf?44260891') format('truetype'),
-           url('./font/opex-icon.svg?44260891#opex-icon') format('svg');
+      src: url('./font/opex-icon.eot?2721479');
+      src: url('./font/opex-icon.eot?2721479#iefix') format('embedded-opentype'),
+           url('./font/opex-icon.woff?2721479') format('woff'),
+           url('./font/opex-icon.ttf?2721479') format('truetype'),
+           url('./font/opex-icon.svg?2721479#opex-icon') format('svg');
       font-weight: normal;
       font-style: normal;
     }
@@ -480,6 +480,20 @@ <h1>opex-icon <small>font demo</small></h1>
         <div class="span3" title="Code: 0x0210">
           <i class="demo-icon icon-exchange-arrow">&#x0210;</i> <span class="i-name">icon-exchange-arrow</span><span class="i-code">0x0210</span>
         </div>
+        <div class="span3" title="Code: 0x0211">
+          <i class="demo-icon icon-down">&#x0211;</i> <span class="i-name">icon-down</span><span class="i-code">0x0211</span>
+        </div>
+        <div class="span3" title="Code: 0x0212">
+          <i class="demo-icon icon-left">&#x0212;</i> <span class="i-name">icon-left</span><span class="i-code">0x0212</span>
+        </div>
+        <div class="span3" title="Code: 0x0213">
+          <i class="demo-icon icon-right">&#x0213;</i> <span class="i-name">icon-right</span><span class="i-code">0x0213</span>
+        </div>
+      </div>
+      <div class="row">
+        <div class="span3" title="Code: 0x0214">
+          <i class="demo-icon icon-up">&#x0214;</i> <span class="i-name">icon-up</span><span class="i-code">0x0214</span>
+        </div>
         <div class="span3" title="Code: 0xe800">
           <i class="demo-icon icon-market">&#xe800;</i> <span class="i-name">icon-market</span><span class="i-code">0xe800</span>
         </div>

src/components/Layout/LayoutHeader/LayoutHeader.js

@@ -1,7 +1,7 @@
-import React from 'react';
+import React, {useState} from 'react';
 import classes from './LayoutHeader.module.css';
 import {useTranslation} from "react-i18next";
-import {Link, NavLink, Route, Routes, useLocation} from "react-router-dom";
+import {Link, NavLink, Route, Routes, useLocation, useNavigate} from "react-router-dom";
 import * as RoutesName from "../../../main/Browser/Routes/routes";
 import {Login} from "../../../main/Browser/Routes/routes";
 import {toAbsoluteUrl} from "../../../utils/utils";
@@ -11,9 +11,16 @@ import {logout} from "js-api-client";
 import {toast} from "react-hot-toast";
 import {setLogoutInitiate} from "../../../store/actions";
 
+
+import Dropdown from 'rc-dropdown';
+import Menu, { Item as MenuItem, Divider } from 'rc-menu';
+import 'rc-dropdown/assets/index.css';
+import Icon from "../../Icon/Icon";
+
 const LayoutHeader = () => {
     const {t} = useTranslation();
 
+    const navigate = useNavigate();
     const dispatch = useDispatch();
 
     const isLogin = useSelector((state) => state.auth.isLogin)
@@ -23,6 +30,30 @@ const LayoutHeader = () => {
 
     const interval = useSelector((state) => state.global.marketInterval)
 
+    const [visible, setVisible] = useState(false);
+
+    const onVisibleChange = (visible) => {
+
+        setVisible(visible)
+        /*this.setState({
+            visible,
+        });*/
+    }
+    let selected = [];
+
+    const saveSelected = ({ selectedKeys }) => {
+        return selected = selectedKeys;
+    }
+
+    const confirm = () => {
+        setVisible(false)
+
+       /* this.setState({
+            visible: false,
+        });*/
+    }
+
+
     const logOutHandler = async () => {
         logout().then(() => {
             toast.success(t("header.logOutSuccess"))
@@ -32,6 +63,34 @@ const LayoutHeader = () => {
         })
     }
 
+
+    const menu = (
+        <Menu
+            style={{
+                width: "100%",
+                padding: "1vh 0"
+            }}
+            multiple
+            onSelect={()=>saveSelected()}
+            onDeselect={()=>saveSelected()}
+        >
+
+            <div className={`${classes.dropBox} column jc-center ai-center py-3  width-92 m-auto`}>
+                <Icon
+                    iconName={`text-white flex`}
+                    customClass={`${classes.icon}  icon-user-circle-o flex mb-1`}
+                />
+                <p className={`mt-1 ${classes.title} text-center fs-0-9`}>
+                    {firstName + " " + lastName}
+                </p>
+            </div>
+
+            <div className={`my-3 px-1 menuItem cursor-pointer hover-text fs-0-8`} onClick={()=>navigate(RoutesName.TxHistory)}>{t("txHistory.title")}</div>
+            <div className={`my-3 px-1 menuItem cursor-pointer hover-text fs-0-8`} onClick={()=>navigate(RoutesName.Settings)}>{t("settings.title")}</div>
+            <div className={`my-3 px-1 menuItem cursor-pointer hover-text fs-0-8 text-red`} onClick={logOutHandler}>{t("signOut")}</div>
+        </Menu>
+    );
+
     return (
         <div className={`width-100 flex jc-center ai-center ${classes.container}`}>
             <div className={`${classes.content} width-90 height-100 row jc-center ai-center`}>
@@ -80,9 +139,33 @@ const LayoutHeader = () => {
                             <p>{t("signIn")} | {t("signUp")}</p>
                         </Link>
                     ) : (
-                        <p className="">
-                            {firstName + " " + lastName}
-                        </p>
+
+                        <>
+                            {/*<p className="">
+                                {firstName + " " + lastName}
+                            </p>*/}
+
+                            <Dropdown
+                                trigger={['click']}
+                                onVisibleChange={()=>onVisibleChange()}
+                                visible={visible}
+                                closeOnSelect={false}
+                                overlay={menu}
+                                animation="slide-up"
+                            >
+                                <button className={`button ${classes.thisButton} flex jc-end ai-center cursor-pointer width-85 fs-01`}>
+                                    <p className={`ml-1 ${classes.name}`}>
+                                        {firstName + " " + lastName}
+                                    </p>
+                                    <Icon
+                                        iconName={`${classes.iconInfo} text-white fs-0-7 flex`}
+                                        customClass="icon-down-open-1 flex"
+                                    />
+                                </button>
+
+                            </Dropdown>
+                        </>
+
                     )}
                     {/*<p style={{direction: "ltr"}}>
                         <Clock/>