diff --git a/frontend/package.json b/frontend/package.json index 0785920..cb1c573 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -27,6 +27,7 @@ "jwt-decode": "^4.0.0", "prettier": "^3.1.0", "react": "^18.2.0", + "react-date-object": "^2.1.8", "react-dom": "^18.2.0", "react-router-dom": "^6.16.0", "typescript": "^5.2.2" diff --git a/frontend/src/components/item-card/item-card.jsx b/frontend/src/components/item-card/item-card.jsx index 1a50232..0187ff8 100644 --- a/frontend/src/components/item-card/item-card.jsx +++ b/frontend/src/components/item-card/item-card.jsx @@ -4,6 +4,9 @@ import { Button, Card, CardActions, CardContent, CardHeader, Chip, Divider, Stac import PropTypes from 'prop-types'; import { Helper } from '../../utils/Helper.js'; import MoreInfoModal from './more-info-modal'; +import DateObject from 'react-date-object'; +import persian from "react-date-object/calendars/persian"; +import persian_en from "react-date-object/locales/persian_en"; export const Presenter = ({ presenterName }) => ( @@ -145,10 +148,20 @@ const ItemCard = ({ {Helper.omitLongString(description, 50)} - From: {new Date(startDate).toLocaleString('fa-IR-u-nu-latn').replace(/:\d{2}$/, '')} + From: {new DateObject({ + date: new Date(startDate), + format: "YYYY/MM/DD, HH:mm", + calendar: persian, + locale: persian_en, + }).format()} - To: {new Date(endDate).toLocaleString('fa-IR-u-nu-latn').replace(/:\d{2}$/, '')} + To: {new DateObject({ + date: new Date(endDate), + format: "YYYY/MM/DD, HH:mm", + calendar: persian, + locale: persian_en, + }).format()} diff --git a/frontend/src/pages/schedule/useSchedulePage.js b/frontend/src/pages/schedule/useSchedulePage.js index bee8681..6acf622 100644 --- a/frontend/src/pages/schedule/useSchedulePage.js +++ b/frontend/src/pages/schedule/useSchedulePage.js @@ -1,6 +1,8 @@ import {useAPI} from "../../providers/APIProvider/APIProvider.jsx"; import {useEffect, useState} from "react"; -import {Helper} from "../../utils/Helper.js"; +import DateObject from 'react-date-object'; +import persian from "react-date-object/calendars/persian"; +import persian_en from "react-date-object/locales/persian_en"; export default function useSchedulePage() { const { @@ -21,15 +23,21 @@ export default function useSchedulePage() { useEffect(() => { if (workshopsData == null) return setTableWorkshopsData(workshopsData.map(item => { - const startDate = new Date(item["start_date"]).toLocaleString('fa-IR-u-nu-latn') - .replace(/:\d{2}$/, '') - const endDate = new Date(item["end_date"]).toLocaleString('fa-IR-u-nu-latn') - .replace(/:\d{2}$/, '') + const startDate = new DateObject({ + date: new Date(item["start_date"]), + calendar: persian, + locale: persian_en, + }) + const endDate = new DateObject({ + date: new Date(item["end_date"]), + calendar: persian, + locale: persian_en, + }) return { Title: item.name, - date: startDate.split(',')[0], - Starts: startDate.split(',')[1], - Ends: endDate.split(',')[1], + date: startDate.format("YYYY/MM/DD"), + Starts: startDate.format("HH:mm"), + Ends: endDate.format("HH:mm"), } })) }, [workshopsData]) @@ -39,15 +47,21 @@ export default function useSchedulePage() { setTablePresentationsData(presentationsData.filter(element => { return element.name != null }).map(item => { - const startDate = new Date(item["start_date"]).toLocaleString('fa-IR-u-nu-latn') - .replace(/:\d{2}$/, '') - const endDate = new Date(item["end_date"]).toLocaleString('fa-IR-u-nu-latn') - .replace(/:\d{2}$/, '') + const startDate = new DateObject({ + date: new Date(item["start_date"]), + calendar: persian, + locale: persian_en, + }) + const endDate = new DateObject({ + date: new Date(item["end_date"]), + calendar: persian, + locale: persian_en, + }) return { Title: item.name, - date: startDate.split(',')[0], - Starts: startDate.split(',')[1], - Ends: endDate.split(',')[1], + date: startDate.format("YYYY/MM/DD"), + Starts: startDate.format("HH:mm"), + Ends: endDate.format("HH:mm"), } })) }, [presentationsData])