diff --git a/package.json b/package.json index 3c1a50e4..80e72baa 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "opex", - "version": "v1.0.5-beta.16", + "version": "v1.0.7-beta.17", "homepage": "", "private": true, "dependencies": { @@ -31,7 +31,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-multi-date-picker": "^4.4.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 4059e4c4..83dddf61 100644 --- a/src/components/TextInput/TextInput.js +++ b/src/components/TextInput/TextInput.js @@ -2,8 +2,12 @@ import React from "react"; import Icon from "../Icon/Icon"; import Select from "react-select"; import classes from "./TextInput.module.css"; -import persian_fa from "react-date-object/locales/persian_fa"; +import gregorian from "react-date-object/calendars/gregorian"; import persian from "react-date-object/calendars/persian"; +import englishGregorian from "react-date-object/locales/gregorian_en"; +import farsiGregorian from "react-date-object/locales/gregorian_fa"; +import englishJalali from "react-date-object/locales/persian_en"; +import farsiJalali from "react-date-object/locales/persian_fa"; import DatePicker from "react-multi-date-picker"; import "react-multi-date-picker/styles/backgrounds/bg-dark.css" import {useSelector} from "react-redux"; @@ -28,6 +32,7 @@ const TextInput = (props) => { } = props const theme = useSelector((state) => state.global.theme) + const type = useSelector((state) => state.exchange.dateType) const optionClassHandler = (state) => { let className = classes.selectOptions @@ -42,6 +47,21 @@ const TextInput = (props) => { return className; } + const calenderTypeHandler = () => { + if (type === "Hijri" && i18n.language === "en") { + return englishGregorian + } + if (type === "Hijri" && i18n.language === "fa") { + return farsiGregorian + } + if (type === "Jalali" && i18n.language === "en") { + return englishJalali + } + if (type === "Jalali" && i18n.language === "fa") { + return farsiJalali + } + }; + let leadSection = null let afterSection = null let alertSection = null @@ -78,8 +98,8 @@ const TextInput = (props) => { if (datePicker) { inputSection = } {...other} @@ -121,3 +141,6 @@ const TextInput = (props) => { export default TextInput; + + + diff --git a/src/index.css b/src/index.css index ac6ce9e0..cc8b9900 100644 --- a/src/index.css +++ b/src/index.css @@ -182,10 +182,12 @@ html, body { --greenAlpha: #18a97978; --greenAlphaGradient: #09a16e85; --darkGreen: #18a979; + --blackGreen: #123f30; --red: #d73e36; --redAlpha: #d73e3678; --redAlphaGradient: #e124175e; --darkRed: #d73e36; + --blackRed: #79150f; --orange: #ff8124; --orangeAlpha: #e97b50b0; --blue: #0e4095; @@ -222,10 +224,12 @@ html, body { --greenAlpha: #18a97978; --greenAlphaGradient: #31cc6a4d; --darkGreen: #18a979; + --blackGreen: #123f30; --red: #ff5555; --redAlpha: #d73e3678; --redAlphaGradient: #e8201236; --darkRed: #d73e36; + --blackRed: #79150f; --orange: #ff8124; --orangeAlpha: #b16649d9; --blue: #6f9ffff5; diff --git a/src/index.js b/src/index.js index 100462f3..2758ac78 100644 --- a/src/index.js +++ b/src/index.js @@ -20,6 +20,9 @@ import i18n from "i18next"; import LanguageDetector from "i18next-browser-languagedetector"; import Backend from "i18next-http-backend"; import {initReactI18next} from "react-i18next"; +import toast, {ToastBar, Toaster} from "react-hot-toast"; +import Icon from "./components/Icon/Icon"; + const sagaMiddleware = createSagaMiddleware(); const rootReducer = combineReducers({ @@ -73,6 +76,59 @@ i18n }); +const Toast = () => { + return + {(t) => { + return + {({ icon, message }) => ( + <> + {t.type !== 'loading' && ( + /**/ + toast.dismiss(t.id)} + /> + )} + {message} + + )} + + } + } + ; +} + //React query client const queryClient = new QueryClient() @@ -85,6 +141,7 @@ root.render( {/**/}
+ {/**/} diff --git a/src/main/Browser/Browser.js b/src/main/Browser/Browser.js index 37f9cec0..289d9b94 100644 --- a/src/main/Browser/Browser.js +++ b/src/main/Browser/Browser.js @@ -59,35 +59,6 @@ const Browser = () => { meta.description.content = description ? description : " " }, [title, description]) - const Toast = () => - - if (isLoading) return if (hasError) return @@ -111,7 +82,6 @@ const Browser = () => { - ); }; diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Settings/components/Security/components/ActiveSessions/ActiveSessions.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Settings/components/Security/components/ActiveSessions/ActiveSessions.js index 5d8c65ef..725efa72 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Settings/components/Security/components/ActiveSessions/ActiveSessions.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Settings/components/Security/components/ActiveSessions/ActiveSessions.js @@ -10,6 +10,7 @@ import Icon from "../../../../../../../../../../../../components/Icon/Icon"; import {toast} from "react-hot-toast"; import {useGetUserActiveSessions} from "../../../../../../../../../../../../queries"; import {expireAllSessionsExceptCurrent} from "js-api-client"; +import Date from "../../../../../../../../../../../../components/Date/Date"; const ActiveSessions = () => { const {t} = useTranslation(); @@ -39,7 +40,7 @@ const ActiveSessions = () => { style={{backgroundColor: 'var(--tableHeader)'}}>{t("ActiveSessions.thisSession")}
- {moment(current?.lastAccess * 1000).format("HH:mm:ss , jYY/jMM/jDD")} + {moment(current?.lastAccess * 1000).format("HH:mm:ss")} , {other.length > 0 ? {t("ActiveSessions.closeOtherSessions")} : ""} diff --git a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Settings/components/Security/components/ActiveSessions/components/Session/Session.js b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Settings/components/Security/components/ActiveSessions/components/Session/Session.js index 01ebc845..f8b4e25e 100644 --- a/src/main/Browser/Pages/UserPanel/Sections/Content/components/Settings/components/Security/components/ActiveSessions/components/Session/Session.js +++ b/src/main/Browser/Pages/UserPanel/Sections/Content/components/Settings/components/Security/components/ActiveSessions/components/Session/Session.js @@ -6,6 +6,7 @@ import {Trans, useTranslation} from "react-i18next"; import {images} from "../../../../../../../../../../../../../../assets/images"; import {toast} from "react-hot-toast"; import {expireSessionById} from "js-api-client"; +import Date from "../../../../../../../../../../../../../../components/Date/Date"; const Session = ({list, reloadSessionsList}) => { const {t} = useTranslation(); @@ -36,7 +37,7 @@ const Session = ({list, reloadSessionsList}) => {
- {moment(list?.lastAccess * 1000).format("HH:mm:ss , jYY/jMM/jDD")} + {moment(list?.lastAccess * 1000).format("HH:mm:ss")} , {isLoading ? { @@ -24,8 +25,8 @@ const TransactionHistory = () => { const [query, setQuery] = useState({ "coin": null, // optional "category": null, // optional [DEPOSIT, FEE, TRADE, WITHDRAW, ORDER_CANCEL, ORDER_CREATE, ORDER_FINALIZED] - "startTime": moment().subtract(1, 'months').startOf("day").valueOf(), - "endTime": moment().endOf("day").valueOf(), + "startTime": null, + "endTime": null, "ascendingByTime": false, "limit": 10, "offset": 0 @@ -37,16 +38,6 @@ const TransactionHistory = () => { isLastPage: data?.length < query.limit } - /*console.log("Math.max", Math.max())*/ - - /*console.log("Math.max", Math.max(...data.map(o => o.y))) - console.log("data", data[data?.length-1]?.id) - console.log("data", data?.length) -*/ - /*useEffect(()=>{ - refetch() - },[query?.ascendingByTime])*/ - const isFirst = useRef(true); useEffect(() => { @@ -99,13 +90,13 @@ const TransactionHistory = () => { }) } const startDateHandler = (dateRange) => { - if (dateRange.length === 2) { - setQuery({ - ...query, - startTime: moment.unix(dateRange[0].toUnix()).startOf("day").valueOf(), - endTime: moment.unix(dateRange[1].toUnix()).endOf("day").valueOf() - }) - } + const start = dateRange[0] ? moment.unix(dateRange[0].toUnix()).startOf("day").valueOf() : null; + const end = dateRange[1] ? moment.unix(dateRange[1].toUnix()).endOf("day").valueOf() : null; + setQuery({ + ...query, + startTime: start, + endTime: end + }) } @@ -113,13 +104,26 @@ const TransactionHistory = () => { if (isLoading) return
if (error) return
if (data?.length === 0) return
{t("noTx")}
- - else return <> } + const periodTextHandler = () => { + if (query?.startTime && query?.endTime) return <> + {t("from")} + + {t("until")} + + + if (query?.startTime) return <> + {t("from")} + + {t("until")} + + + } + return
@@ -136,7 +140,7 @@ const TransactionHistory = () => { value: query?.coin, label: query?.coin ? t('currency.'+ query?.coin) : t('all'), }} - onchange={(e) => setQuery({...query, coin: e.value})} + onchange={(e) => setQuery({...query, coin: e.value, offset:0})} customClass={`width-24 ${classes.thisInput}`} /> { value: query?.category, label: query?.category ? t('TransactionCategory.'+ query?.category) : t('all'), }} - onchange={(e) => setQuery({...query, category: e.value})} + onchange={(e) => setQuery({...query, category: e.value, offset:0})} customClass={`width-24 ${classes.thisInput}`} /> { lead={t('TransactionHistory.period')} type="input" onChange={startDateHandler} + /*value={[query.startTime, query.endTime]}*/ value={[query.startTime, query.endTime]} - dateSeparator={" " + t('to') + " "} range + hideOnScroll + dataPanelPosition="Bottom" + position={`${i18n.language === "fa" ? "bottom-left" : "bottom-right" }`} customClass={`width-24 ${classes.thisInput}`} /> @@ -193,10 +200,7 @@ const TransactionHistory = () => {

{t("txHistory.title")}

- {t("from")} - - {t("until")} - + {periodTextHandler()}
diff --git a/src/queries/hooks/useGetUserAccount.js b/src/queries/hooks/useGetUserAccount.js index 42e01384..e2e6489a 100644 --- a/src/queries/hooks/useGetUserAccount.js +++ b/src/queries/hooks/useGetUserAccount.js @@ -3,8 +3,8 @@ import {getUserAccount, parseWalletsResponse} from "js-api-client"; import {useSelector} from "react-redux"; export const useGetUserAccount = () => { - const isLogin = useSelector((state) => state.auth.isLogin) - return useQuery(['userAccount'], () => getUserAccountFunc(isLogin), + const userId = useSelector((state) => state.auth.id) + return useQuery(['userAccount', userId], () => getUserAccountFunc(userId), { retry: 1, refetchInterval: 10000 @@ -12,8 +12,8 @@ export const useGetUserAccount = () => { ); } -export const getUserAccountFunc = async (isLogin) => { - if (!isLogin) return null +export const getUserAccountFunc = async (userId) => { + if (!userId) return null const params = new URLSearchParams(); params.append('timestamp', Date.now().toString()); const {data} = await getUserAccount() diff --git a/yarn.lock b/yarn.lock index e7469b4a..a831b18a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -10793,7 +10793,7 @@ __metadata: react-dropzone: ^11.3.1 react-hot-toast: ^2.4.1 react-i18next: ^12.2.2 - react-multi-date-picker: ^4.3.1 + react-multi-date-picker: ^4.4.1 react-number-format: ^4.9.3 react-qr-code: ^2.0.11 react-redux: ^8.0.5 @@ -12334,10 +12334,10 @@ __metadata: languageName: node linkType: hard -"react-date-object@npm:^2.1.5": - version: 2.1.7 - resolution: "react-date-object@npm:2.1.7" - checksum: f8e16484a16a56251697b52cb6c78c2aaa89ba33694c5f2032a967a68b70446cdb6ff9f4357e6e2a7ad50d48f1518f7b1b49ed7ca111542a8a32902c080a3c8a +"react-date-object@npm:^2.1.8": + version: 2.1.8 + resolution: "react-date-object@npm:2.1.8" + checksum: 8c4ecc7f849efccc483fd78411d88971b48b2e695f1fe331ff83a0e1d87299f3c9d073bd7efba0dd542f5500923ed05dc65af0ea03e1bb344918e3e9e998d703 languageName: node linkType: hard @@ -12478,16 +12478,16 @@ __metadata: languageName: node linkType: hard -"react-multi-date-picker@npm:^4.3.1": - version: 4.3.1 - resolution: "react-multi-date-picker@npm:4.3.1" +"react-multi-date-picker@npm:^4.4.1": + version: 4.4.1 + resolution: "react-multi-date-picker@npm:4.4.1" dependencies: - react-date-object: ^2.1.5 + react-date-object: ^2.1.8 react-element-popper: ^2.1.6 peerDependencies: react: ">=16.8.0" react-dom: ">=16.8.0" - checksum: 1b8352c355dd68be256f503cf02ab1ac059b8479a1bccea1ddfe180e93a028421ad9989bccac58798b2cddf985828f53fe7535e44a395b4c31143886de2c14e0 + checksum: fb225006e24f90ac1283f0e51339b941c17fcdf92418b55c7c51619a17e6f8786bed663187ef24b5f657c20d3bf178bb1ba56e593c314a9add30c43a491a0c6a languageName: node linkType: hard