From 824dbbfa67bd0937d7143b67b19e8d9c6cc247a3 Mon Sep 17 00:00:00 2001 From: Hossein Date: Tue, 26 Sep 2023 10:08:28 +0330 Subject: [PATCH 1/5] #37: Add transaction history lang file --- public/assets/locales/en/translation.json | 84 +++++++++++++------ public/assets/locales/fa/translation.json | 58 +++++++++---- .../PersonalProfileStep.js | 1 + 3 files changed, 102 insertions(+), 41 deletions(-) diff --git a/public/assets/locales/en/translation.json b/public/assets/locales/en/translation.json index 56449bf..5ec431a 100644 --- a/public/assets/locales/en/translation.json +++ b/public/assets/locales/en/translation.json @@ -1,8 +1,8 @@ { "title": "OPEX", - "signIn":"Sign In", + "signIn": "Sign In", "signUp": "Sign Up", - "signOut":"Sign Out", + "signOut": "Sign Out", "date": "Date", "time": "Time", "volume": "Volume", @@ -15,9 +15,8 @@ "max": "Max", "buy": "Buy", "sell": "Sell", - "all": "All", "orderType": "Order Type", - "status" : "Status", + "status": "Status", "pleaseLogin" : "Please Log In!", "comingSoon" : "Coming Soon!", "deposit": "Deposit", @@ -28,6 +27,12 @@ "commission": "Commission", "nextStep": "Next Step", "prevStep": "Prev Step", + "next": "next", + "all": "all", + "prev": "prev", + "ask": "ask", + "bid": "bid", + "to": "to", "submit": "Submit", "username": "Username", "password": "Password", @@ -44,21 +49,28 @@ "noTx": "There is no transaction!", "close": "Close", "unit": "Unit", + "from": "from", + "row": "Row", + "until": "until", + "withPrice": "with price", + "description": "Description", + "first": "First", "offline": "Check your connection!", - "improperMobileView ": "Not optimized for mobile view.", + "improperMobileView": "Not optimized for mobile view.", "home": "Home", "country": { - "iran" : "I. R. IRAN", - "germany" : "Germany", + "iran": "IRAN", + "germany": "Germany", "uk": "United Kingdom", - "turkey" : "Turkey" + "turkey": "Turkey", + "uzbekistan": "Uzbekistan" }, "currency": { - "IRT" : "IRT", - "Euro" : "Euro", - "USD" : "USD", - "BTC" : "BTC", - "ETH" : "ETH", + "IRT": "IRT", + "Euro": "Euro", + "USD": "USD", + "BTC": "BTC", + "ETH": "ETH", "USDT": "USDT", "TBTC": "TBTC", "TETH": "TETH", @@ -124,7 +136,7 @@ "LIMIT_MAKER": "Limit Maker" }, "header": { - "lastPrice" : "Last Price", + "lastPrice": "Last Price", "availableBalance" : "Available Balance", "free": "Available", "locked": "Locked", @@ -149,6 +161,9 @@ "technical": { "title": "Technical" }, + "txHistory": { + "title": "Transactions History" + }, "messages": { "title": "Messages" }, @@ -156,9 +171,10 @@ "title": "Settings" }, "Languages": { - "Persian": "فارسی", - "English": "English", - "Arabic": "عربي" + "fa": "فارسی", + "en": "English", + "ar": "عربي", + "uzb": "Oʻzbekcha" }, "Theme": { "Light": "Light", @@ -176,7 +192,7 @@ "title": "Order", "minOrder": "Minimum allowed order is {{min}} {{currency}}", "maxOrder": "Maximum allowed order is {{max}} {{currency}}", - "divisibility": "Divisibility !", + "divisibility": "The entered value must be divisible by {{mod}} !", "notEnoughBalance": "Insufficient Balance ", "availableAmount": "Available Amount", "bestOffer": "Best Offer", @@ -232,6 +248,21 @@ "showZeroBalance": "Do not show zero balance.", "estimateAlert": "The equivalent amount is calculated based on the highest buy offer" }, + "TransactionHistory": { + "coin": "Coins", + "category": "Categories", + "size": "Per page", + "period" : "Period" + }, + "TransactionCategory": { + "DEPOSIT": "Deposit", + "FEE": "Fee", + "TRADE": "Trade", + "WITHDRAW": "Withdraw", + "ORDER_CANCEL": "Cancel Order", + "ORDER_CREATE": "Create Order", + "ORDER_FINALIZED": "Finalized Order" + }, "DepositWithdraw": { "title": "Deposit / Withdraw", "success": "The Address is copied.", @@ -272,7 +303,7 @@ }, "IPGErrorCode": { "13003": "You are not allowed to pay.", - "13004":"You have an unpaid request.", + "13004": "You have an unpaid request.", "13005": "Request locked.", "13007": "Unknown Error" }, @@ -608,9 +639,9 @@ }, "Footer": { "darkMode": "Dark Mode", - "aboutUs" : "About Us", - "contactUS" : "Contact Us", - "blog" : "Blog", + "aboutUs": "About Us", + "contactUS": "Contact Us", + "blog": "Blog", "guide": "Guide", "rules": "Rules", "api": "API", @@ -628,10 +659,10 @@ "tooManyFiles": "Uploading more than one photo is not allowed!", "errorMsgDefault": "Uploaded photo is not valid!" }, - "errorPage" : { - "needKYC" : "Access denied for KYC status", - "reload" : "Try Again", - "errorText" : "Server connection error" + "errorPage": { + "needKYC": "Access denied for KYC status", + "reload": "Try Again", + "errorText": "Server connection error" }, "aboutUs": { "title": "About US", @@ -673,7 +704,6 @@ "p8": "", "p9": "", "text4": "" - }, "transferFees": { "title": "Transfer Fees", diff --git a/public/assets/locales/fa/translation.json b/public/assets/locales/fa/translation.json index d936d9d..4b32e8c 100644 --- a/public/assets/locales/fa/translation.json +++ b/public/assets/locales/fa/translation.json @@ -15,7 +15,6 @@ "max": "حداکثر", "buy": "خرید", "sell": "فروش", - "all": "همه", "orderType": "نوع سفارش", "status": "وضعیت", "pleaseLogin": "لطفاً وارد شوید!", @@ -28,6 +27,12 @@ "commission": "کارمزد", "nextStep": "گام بعدی", "prevStep": "گام قبلی", + "next": "بعدی", + "all": "همه موارد", + "prev": "قبلی", + "ask": "فروش", + "bid": "خرید", + "to": "تا", "submit": "ثبت", "username": "نام کاربری", "password": "رمز ورود", @@ -44,14 +49,21 @@ "noTx": "تراکنشی وجود ندارد.", "close": "بستن", "unit": "واحد", + "from": "از", + "row": "ردیف", + "until": "تا", + "withPrice": "با قیمت", + "description": "توضیحات", + "first": "ابتدا", "offline": "اتصال اینترنت را بررسی کنید!", - "improperMobileView ": "فعلاً برای موبایل بهینه نشده است.", + "improperMobileView": "فعلاً برای موبایل بهینه نشده است.", "home": "صفحه‌ اصلی", "country": { - "iran" : "ایران", - "germany" : "آلمان", + "iran": "ایران", + "germany": "آلمان", "uk": "انگلستان", - "turkey" : "ترکیه" + "turkey": "ترکیه", + "uzbekistan": "ازبکستان" }, "currency": { "IRT": "تومان", @@ -149,6 +161,9 @@ "technical": { "title": "تکنیکال" }, + "txHistory": { + "title": "تاریخچه تراکنش‌ ها" + }, "messages": { "title": "پیام ها" }, @@ -156,9 +171,10 @@ "title": "تنظیمات" }, "Languages": { - "Persian": "فارسی", - "English": "English", - "Arabic": "عربي" + "fa": "فارسی", + "en": "English", + "ar": "عربي", + "uzb": "Oʻzbekcha" }, "Theme": { "Light": "روشن", @@ -194,7 +210,7 @@ "success": "ثبت سفارش {{type}} {{reqAmount}} {{base}} با قیمت {{pricePerUnit}} {{quote}} با موفقیت انجام شد." }, "LastTrades": { - "title": "معامله‌های اخیر" + "title": "معامله‌ های اخیر" }, "charts": { "title": "نمودار قیمت", @@ -232,6 +248,21 @@ "showZeroBalance": "عدم نمایش موجودی صفر", "estimateAlert": "مبلغ دارایی معادل براساس بالاترین پیشنهاد خرید محاسبه شده" }, + "TransactionHistory": { + "coin" : "ارز", + "category" : "نوع تراکنش", + "size" : "تعداد", + "period" : "بازه زمانی" + }, + "TransactionCategory": { + "DEPOSIT" : "واریز", + "FEE" : "کارمزد", + "TRADE" : "معامله", + "WITHDRAW" : "برداشت", + "ORDER_CANCEL" : "لغو سفارش", + "ORDER_CREATE" : "ثبت سفارش", + "ORDER_FINALIZED" : "اتمام سفارش" + }, "DepositWithdraw": { "title": "واریز/برداشت", "success": "آدرس کپی شد", @@ -628,10 +659,10 @@ "tooManyFiles": "آپلود بیشتر از یک عکس مجاز نیست!", "errorMsgDefault": "عکس آپلود شده معتبر نیست!" }, - "errorPage" : { - "needKYC" : "دسترسی این بخش فقط برای کاربران احراز هویت شده مجاز است!", - "reload" : "تلاش مجدد", - "errorText" : "خطا در ارتباط با سرور" + "errorPage": { + "needKYC": "دسترسی این بخش فقط برای کاربران احراز هویت شده مجاز است!", + "reload": "تلاش مجدد", + "errorText": "خطا در ارتباط با سرور" }, "aboutUs": { "title": "درباره ما", @@ -673,7 +704,6 @@ "p8": "", "p9": "", "text4": "" - }, "transferFees": { "title": "کارمزد انتقال", diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/Settings/components/Authentication/components/PersonalProfileStep/PersonalProfileStep.js b/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/Settings/components/Authentication/components/PersonalProfileStep/PersonalProfileStep.js index 0cf4e4f..9d56fa9 100644 --- a/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/Settings/components/Authentication/components/PersonalProfileStep/PersonalProfileStep.js +++ b/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/Settings/components/Authentication/components/PersonalProfileStep/PersonalProfileStep.js @@ -34,6 +34,7 @@ const PersonalProfileStep = (props) => { {value: "germany", label: t('country.germany')}, {value: "uk", label: t('country.uk')}, {value: "turkey", label: t('country.turkey')}, + {value: "uzbekistan", label: t('country.uzbekistan')}, ] const convertUserInfoToState = (info) => { From adcaf67d1e06e8462c57ff0351351c7bdb7f5772 Mon Sep 17 00:00:00 2001 From: Hossein Date: Tue, 26 Sep 2023 10:58:09 +0330 Subject: [PATCH 2/5] #37: Add tx history base layout --- .../UserPanel/Secttions/Content/Content.js | 8 ++++- .../TransactionHistory/TransactionHistory.js | 31 +++++++++++++++++ .../TransactionHistory.module.css | 3 ++ .../TransactionHistoryTable.js | 12 +++++++ .../TransactionHistoryTable.module.css | 0 .../UserPanel/Secttions/Header/Header.js | 7 ++++ .../TransactionHistoryHeader.js | 34 +++++++++++++++++++ .../TransactionHistoryHeader.module.css | 0 .../Pages/UserPanel/Secttions/Menu/Menu.js | 27 ++++++++++----- .../Secttions/SubHeader/SubHeader.js | 3 +- src/main/Mobile/Routes/routes.js | 3 +- 11 files changed, 115 insertions(+), 13 deletions(-) create mode 100644 src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/TransactionHistory.js create mode 100644 src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/TransactionHistory.module.css create mode 100644 src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/components/TransactionHistoryTable/TransactionHistoryTable.js create mode 100644 src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/components/TransactionHistoryTable/TransactionHistoryTable.module.css create mode 100644 src/main/Mobile/Pages/UserPanel/Secttions/Header/components/TransactionHistoryHeader/TransactionHistoryHeader.js create mode 100644 src/main/Mobile/Pages/UserPanel/Secttions/Header/components/TransactionHistoryHeader/TransactionHistoryHeader.module.css diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/Content/Content.js b/src/main/Mobile/Pages/UserPanel/Secttions/Content/Content.js index 74069c5..c6123a2 100644 --- a/src/main/Mobile/Pages/UserPanel/Secttions/Content/Content.js +++ b/src/main/Mobile/Pages/UserPanel/Secttions/Content/Content.js @@ -3,13 +3,14 @@ import classes from "./Content.module.css"; import ScrollBar from "../../../../../../components/ScrollBar"; import {Navigate, Route, Routes} from "react-router-dom"; import * as RoutesName from "../../../../Routes/routes"; -import {DepositRelative} from "../../../../Routes/routes"; +import {DepositRelative, TxHistory} from "../../../../Routes/routes"; import {useTranslation} from "react-i18next"; import Wallet from "./components/Wallet/Wallet"; import Settings from "./components/Settings/Settings"; import ProtectedRoute from "../../../../../../components/ProtectedRoute/ProtectedRoute"; import {useSelector} from "react-redux"; import Market from "./components/Market/Market"; +import TransactionHistory from "./components/TransactionHistory/TransactionHistory"; const Content = () => { @@ -26,6 +27,7 @@ const Content = () => { }/> }> }/> + }/> }/> { element={} /> + } + /> } diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/TransactionHistory.js b/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/TransactionHistory.js new file mode 100644 index 0000000..16bb084 --- /dev/null +++ b/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/TransactionHistory.js @@ -0,0 +1,31 @@ +import React, {useEffect} from 'react'; +import classes from './TransactionHistory.module.css' +import * as RoutesName from "../../../../../../Routes/routes"; +import {activeOrderLayout} from "../../../../../../../../store/actions/global"; +import {useDispatch} from "react-redux"; +import {useLocation} from "react-router-dom"; + +const TransactionHistory = () => { + + const dispatch = useDispatch(); + const location = useLocation(); + + useEffect(() => { + + if (location.pathname === RoutesName.TxHistory) { + dispatch(activeOrderLayout(true)) + } + return () => { + dispatch(activeOrderLayout(false)) + } + + }, [location.pathname]); + + return ( +
+ TransactionHistory +
+ ); +}; + +export default TransactionHistory; diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/TransactionHistory.module.css b/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/TransactionHistory.module.css new file mode 100644 index 0000000..595bbbf --- /dev/null +++ b/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/TransactionHistory.module.css @@ -0,0 +1,3 @@ +.container { + +} \ No newline at end of file diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/components/TransactionHistoryTable/TransactionHistoryTable.js b/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/components/TransactionHistoryTable/TransactionHistoryTable.js new file mode 100644 index 0000000..60a4206 --- /dev/null +++ b/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/components/TransactionHistoryTable/TransactionHistoryTable.js @@ -0,0 +1,12 @@ +import React from 'react'; +import classes from './TransactionHistoryTable.module.css' + +const TransactionHistoryTable = () => { + return ( +
+ +
+ ); +}; + +export default TransactionHistoryTable; diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/components/TransactionHistoryTable/TransactionHistoryTable.module.css b/src/main/Mobile/Pages/UserPanel/Secttions/Content/components/TransactionHistory/components/TransactionHistoryTable/TransactionHistoryTable.module.css new file mode 100644 index 0000000..e69de29 diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/Header/Header.js b/src/main/Mobile/Pages/UserPanel/Secttions/Header/Header.js index 5880ac1..67ef08c 100644 --- a/src/main/Mobile/Pages/UserPanel/Secttions/Header/Header.js +++ b/src/main/Mobile/Pages/UserPanel/Secttions/Header/Header.js @@ -10,9 +10,13 @@ import {Route, Routes} from "react-router-dom"; import ProtectedRoute from "../../../../../../components/ProtectedRoute/ProtectedRoute"; import WalletHeader from "./components/WalletHeader/WalletHeader"; import SettingsHeader from "./components/SettingsHeader/SettingsHeader"; +import {useTranslation} from "react-i18next"; +import TransactionHistoryHeader from "./components/TransactionHistoryHeader/TransactionHistoryHeader"; const Header = () => { + + const {t} = useTranslation(); const dispatch = useDispatch(); return ( @@ -28,6 +32,9 @@ const Header = () => { }/> + + }/> }/> diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/Header/components/TransactionHistoryHeader/TransactionHistoryHeader.js b/src/main/Mobile/Pages/UserPanel/Secttions/Header/components/TransactionHistoryHeader/TransactionHistoryHeader.js new file mode 100644 index 0000000..c6bc1cc --- /dev/null +++ b/src/main/Mobile/Pages/UserPanel/Secttions/Header/components/TransactionHistoryHeader/TransactionHistoryHeader.js @@ -0,0 +1,34 @@ +import React from 'react'; +import classes from './TransactionHistoryHeader.module.css'; +import {useTranslation} from "react-i18next"; +import {useDispatch} from "react-redux"; +import {useLocation} from "react-router-dom"; +import * as RoutesName from "../../../../../../Routes/routes"; +import {activeActionSheet} from "../../../../../../../../store/actions/global"; +import Icon from "../../../../../../../../components/Icon/Icon"; + +const TransactionHistoryHeader = () => { + + const {t} = useTranslation() + const dispatch = useDispatch(); + const location = useLocation() + + const clickHandler = () => { + if (!(location.pathname.includes(RoutesName.TxHistoryRelative)) ) { + dispatch(activeActionSheet({subMenu: true})) + } + } + + return ( + <> +

clickHandler()}> + {t("txHistory.title")} +

+ dispatch(activeActionSheet({menu: true}))} + /> + + ); +}; + +export default TransactionHistoryHeader; diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/Header/components/TransactionHistoryHeader/TransactionHistoryHeader.module.css b/src/main/Mobile/Pages/UserPanel/Secttions/Header/components/TransactionHistoryHeader/TransactionHistoryHeader.module.css new file mode 100644 index 0000000..e69de29 diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/Menu/Menu.js b/src/main/Mobile/Pages/UserPanel/Secttions/Menu/Menu.js index a973ffe..e1f8226 100644 --- a/src/main/Mobile/Pages/UserPanel/Secttions/Menu/Menu.js +++ b/src/main/Mobile/Pages/UserPanel/Secttions/Menu/Menu.js @@ -27,28 +27,37 @@ const Menu = () => { - - {t("market.title")} + + {t("market.title")} - isActive ? `${classes.selected} width-50 row jc-between ai-center py-1` : "width-50 row jc-between ai-center py-1" + isActive ? `${classes.selected} width-70 row jc-between ai-center py-2` : "width-70 row jc-between ai-center py-2" } > - - {t("wallet.title")} + + {t("wallet.title")} + + + isActive ? `${classes.selected} width-70 row jc-between ai-center py-2` : "width-70 row jc-between ai-center py-2" + } + > + + {t("txHistory.title")} - isActive ? `${classes.selected} width-50 row jc-between ai-center py-1` : "width-50 row jc-between ai-center py-1" + isActive ? `${classes.selected} width-70 row jc-between ai-center py-2` : "width-70 row jc-between ai-center py-2" } > - - {t("settings.title")} + + {t("settings.title")} ); diff --git a/src/main/Mobile/Pages/UserPanel/Secttions/SubHeader/SubHeader.js b/src/main/Mobile/Pages/UserPanel/Secttions/SubHeader/SubHeader.js index 441bd5d..1a5bd73 100644 --- a/src/main/Mobile/Pages/UserPanel/Secttions/SubHeader/SubHeader.js +++ b/src/main/Mobile/Pages/UserPanel/Secttions/SubHeader/SubHeader.js @@ -13,9 +13,8 @@ const SubHeader = (props) => { const [expand, setExpand] = useState(false) const location = useLocation() - const clickHandler = () => { - if (!(location.pathname.includes(RoutesName.SettingsRelative)) ) { + if (!(location.pathname.includes(RoutesName.SettingsRelative) || RoutesName.TxHistoryRelative) ) { setExpand(true) } } diff --git a/src/main/Mobile/Routes/routes.js b/src/main/Mobile/Routes/routes.js index 7f0b1dd..0e42662 100644 --- a/src/main/Mobile/Routes/routes.js +++ b/src/main/Mobile/Routes/routes.js @@ -9,11 +9,12 @@ export const Guide = "/guide"; export const Rules = "/rules"; export const ContactUs = "/contact-us"; - export const User = "/user"; export const UserVerifyRelative = "verify"; export const UserForgetPasswordRelative = "forget-password"; +export const TxHistory = "/panel/transaction-history"; +export const TxHistoryRelative = "/transaction-history"; export const Panel = "/panel"; export const Market = "/panel/market"; From 2a01e546748116d03b1b73422a463860ccfa0406 Mon Sep 17 00:00:00 2001 From: Hossein Date: Tue, 26 Sep 2023 11:16:41 +0330 Subject: [PATCH 3/5] #37: Subjoin datePicker in textInput comp --- package.json | 1 + src/components/TextInput/TextInput.js | 42 +++++++- src/components/TextInput/TextInput.module.css | 98 ++++++++++++++++--- yarn.lock | 31 ++++++ 4 files changed, 155 insertions(+), 17 deletions(-) diff --git a/package.json b/package.json index d105297..1d21422 100644 --- a/package.json +++ b/package.json @@ -29,6 +29,7 @@ "react-dropzone": "^11.3.1", "react-hot-toast": "^2.4.1", "react-i18next": "^12.2.2", + "react-multi-date-picker": "^4.3.1", "react-number-format": "^4.9.3", "react-qr-code": "^2.0.11", "react-redux": "^8.0.5", diff --git a/src/components/TextInput/TextInput.js b/src/components/TextInput/TextInput.js index bde379c..5bb1ea7 100644 --- a/src/components/TextInput/TextInput.js +++ b/src/components/TextInput/TextInput.js @@ -2,9 +2,28 @@ import React from "react"; import Icon from "../Icon/Icon"; import Select from "react-select"; import classes from "./TextInput.module.css"; +import DatePicker from "react-multi-date-picker"; +import persian_fa from "react-date-object/locales/persian_fa"; +import persian from "react-date-object/calendars/persian"; +import {useSelector} from "react-redux"; +import i18n from "i18next"; const TextInput = (props) => { - const {customRef,readOnly,onchange,customClass,options, lead , after ,select ,alerts ,max , ...other} = props + const {customRef,readOnly,onchange,customClass,options, lead, ltr, after ,select ,alerts ,max, datePicker, ...other} = props + + const isDark = useSelector((state) => state.global.isDark) + + const optionClassHandler = (state) => { + let className = classes.selectOptions + if (state.isFocused) { + className = className + " " + classes.isFocused + } + if (state.isSelected) { + className = className + " " + classes.isSelected + } + return className; + } + let leadSection = null let afterSection = null @@ -15,6 +34,8 @@ const TextInput = (props) => { readOnly={readOnly} onChange={onchange} max={max} + className={`${classes.input}`} + style={{direction: ltr && 'ltr'}} {...other} /> @@ -24,13 +45,32 @@ const TextInput = (props) => { if ( select ){ inputSection =