debug all datatables

package-lock.json

@@ -24,6 +24,7 @@
         "image-to-file-converter": "^1.0.6",
         "material-react-table": "^1.11.1",
         "moment": "^2.29.4",
+        "moment-jalaali": "^0.10.0",
         "next": "^13.3.0",
         "next-intl": "^2.13.1",
         "next-useragent": "^2.8.0",
@@ -3417,6 +3418,11 @@
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
       "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="
     },
+    "node_modules/jalaali-js": {
+      "version": "1.2.6",
+      "resolved": "https://registry.npmjs.org/jalaali-js/-/jalaali-js-1.2.6.tgz",
+      "integrity": "sha512-io974va+Qyu+UfuVX3UIAgJlxLhAMx9Y8VMfh+IG00Js7hXQo1qNQuwSiSa0xxco0SVgx5HWNkaiCcV+aZ8WPw=="
+    },
     "node_modules/js-sdsl": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/js-sdsl/-/js-sdsl-4.3.0.tgz",
@@ -3671,6 +3677,28 @@
         "node": "*"
       }
     },
+    "node_modules/moment-jalaali": {
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/moment-jalaali/-/moment-jalaali-0.10.0.tgz",
+      "integrity": "sha512-XICH1+UHd3zyaE1bXWQBlhoXBqbzEyFfT0TrifNobHxLALRuTSwXn376bX8FmkYg9mZimevwwdd6EB57s5wuFA==",
+      "dependencies": {
+        "jalaali-js": "^1.1.0",
+        "moment": "^2.22.2",
+        "moment-timezone": "^0.5.21",
+        "rimraf": "^3.0.2"
+      }
+    },
+    "node_modules/moment-timezone": {
+      "version": "0.5.43",
+      "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.43.tgz",
+      "integrity": "sha512-72j3aNyuIsDxdF1i7CEgV2FfxM1r6aaqJyLB2vwb33mXYyoyLly+F1zbWqhA3/bVIoJ4szlUoMbUnVdid32NUQ==",
+      "dependencies": {
+        "moment": "^2.29.4"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
@@ -7413,6 +7441,11 @@
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
       "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="
     },
+    "jalaali-js": {
+      "version": "1.2.6",
+      "resolved": "https://registry.npmjs.org/jalaali-js/-/jalaali-js-1.2.6.tgz",
+      "integrity": "sha512-io974va+Qyu+UfuVX3UIAgJlxLhAMx9Y8VMfh+IG00Js7hXQo1qNQuwSiSa0xxco0SVgx5HWNkaiCcV+aZ8WPw=="
+    },
     "js-sdsl": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/js-sdsl/-/js-sdsl-4.3.0.tgz",
@@ -7601,6 +7634,25 @@
       "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz",
       "integrity": "sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w=="
     },
+    "moment-jalaali": {
+      "version": "0.10.0",
+      "resolved": "https://registry.npmjs.org/moment-jalaali/-/moment-jalaali-0.10.0.tgz",
+      "integrity": "sha512-XICH1+UHd3zyaE1bXWQBlhoXBqbzEyFfT0TrifNobHxLALRuTSwXn376bX8FmkYg9mZimevwwdd6EB57s5wuFA==",
+      "requires": {
+        "jalaali-js": "^1.1.0",
+        "moment": "^2.22.2",
+        "moment-timezone": "^0.5.21",
+        "rimraf": "^3.0.2"
+      }
+    },
+    "moment-timezone": {
+      "version": "0.5.43",
+      "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.43.tgz",
+      "integrity": "sha512-72j3aNyuIsDxdF1i7CEgV2FfxM1r6aaqJyLB2vwb33mXYyoyLly+F1zbWqhA3/bVIoJ4szlUoMbUnVdid32NUQ==",
+      "requires": {
+        "moment": "^2.29.4"
+      }
+    },
     "ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",

package.json

@@ -25,6 +25,7 @@
     "image-to-file-converter": "^1.0.6",
     "material-react-table": "^1.11.1",
     "moment": "^2.29.4",
+    "moment-jalaali": "^0.10.0",
     "next": "^13.3.0",
     "next-intl": "^2.13.1",
     "next-useragent": "^2.8.0",

public/fontiran.scss

@@ -16,6 +16,71 @@ This set of fonts are used in this project under the license: (.....)
 --------------------------------------------------------------------------------------
 *	
 **/
+@font-face {
+	font-family: IRANSansFaNum;
+	font-style: normal;
+	font-weight: 900;
+	src: url('./fonts/eot/IRANSansWeb(FaNum)_Black.eot');
+	src: url('./fonts/eot/IRANSansWeb(FaNum)_Black.eot?#iefix') format('embedded-opentype'),/* IE6-8 */
+		url('./fonts/woff2/IRANSansWeb(FaNum)_Black.woff2') format('woff2'),/* FF39+,Chrome36+, Opera24+*/
+		url('./fonts/woff/IRANSansWeb(FaNum)_Black.woff') format('woff'),/* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+		url('./fonts/ttf/IRANSansWeb(FaNum)_Black.ttf') format('truetype');
+}
+
+@font-face {
+	font-family: IRANSansFaNum;
+	font-style: normal;
+	font-weight: bold;
+	src: url('./fonts/eot/IRANSansWeb(FaNum)_Bold.eot');
+	src: url('./fonts/eot/IRANSansWeb(FaNum)_Bold.eot?#iefix') format('embedded-opentype'),/* IE6-8 */
+		url('./fonts/woff2/IRANSansWeb(FaNum)_Bold.woff2') format('woff2'),/* FF39+,Chrome36+, Opera24+*/
+		url('./fonts/woff/IRANSansWeb(FaNum)_Bold.woff') format('woff'),/* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+		url('./fonts/ttf/IRANSansWeb(FaNum)_Bold.ttf') format('truetype');
+}
+
+@font-face {
+	font-family: IRANSansFaNum;
+	font-style: normal;
+	font-weight: 500;
+	src: url('./fonts/eot/IRANSansWeb(FaNum)_Medium.eot');
+	src: url('./fonts/eot/IRANSansWeb(FaNum)_Medium.eot?#iefix') format('embedded-opentype'),/* IE6-8 */
+		url('./fonts/woff2/IRANSansWeb(FaNum)_Medium.woff2') format('woff2'),/* FF39+,Chrome36+, Opera24+*/
+		url('./fonts/woff/IRANSansWeb(FaNum)_Medium.woff') format('woff'),/* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+		url('./fonts/ttf/IRANSansWeb(FaNum)_Medium.ttf') format('truetype');
+}
+
+@font-face {
+	font-family: IRANSansFaNum;
+	font-style: normal;
+	font-weight: 300;
+	src: url('./fonts/eot/IRANSansWeb(FaNum)_Light.eot');
+	src: url('./fonts/eot/IRANSansWeb(FaNum)_Light.eot?#iefix') format('embedded-opentype'),/* IE6-8 */
+		url('./fonts/woff2/IRANSansWeb(FaNum)_Light.woff2') format('woff2'),/* FF39+,Chrome36+, Opera24+*/
+		url('./fonts/woff/IRANSansWeb(FaNum)_Light.woff') format('woff'),/* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+		url('./fonts/ttf/IRANSansWeb(FaNum)_Light.ttf') format('truetype');
+}
+
+@font-face {
+	font-family: IRANSansFaNum;
+	font-style: normal;
+	font-weight: 200;
+	src: url('./fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot');
+	src: url('./fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot?#iefix') format('embedded-opentype'),/* IE6-8 */
+		url('./fonts/woff2/IRANSansWeb(FaNum)_UltraLight.woff2') format('woff2'),/* FF39+,Chrome36+, Opera24+*/
+		url('./fonts/woff/IRANSansWeb(FaNum)_UltraLight.woff') format('woff'),/* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+		url('./fonts/ttf/IRANSansWeb(FaNum)_UltraLight.ttf') format('truetype');
+}
+
+@font-face {
+	font-family: IRANSansFaNum;
+	font-style: normal;
+	font-weight: normal;
+	src: url('./fonts/eot/IRANSansWeb(FaNum).eot');
+	src: url('./fonts/eot/IRANSansWeb(FaNum).eot?#iefix') format('embedded-opentype'),/* IE6-8 */
+		url('./fonts/woff2/IRANSansWeb(FaNum).woff2') format('woff2'),/* FF39+,Chrome36+, Opera24+*/
+		url('./fonts/woff/IRANSansWeb(FaNum).woff') format('woff'),/* FF3.6+, IE9, Chrome6+, Saf5.1+*/
+		url('./fonts/ttf/IRANSansWeb(FaNum).ttf') format('truetype');
+}
 @font-face {
 	font-family: IRANSans;
 	font-style: normal;

src/components/dashboard/machinary-office/index.jsx

@@ -7,7 +7,12 @@ import { GET_MACHINARY_OFFICE } from "@/core/data/apiRoutes";
 import { useTranslations } from "next-intl";
 import TableRowActions from "./TableRowActions";
 import { format } from "date-fns-jalali";
-
+import {
+  LocalizationProvider,
+  MobileDateTimePicker,
+} from "@mui/x-date-pickers";
+import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali";
+import moment from "moment";
 function DashboardMachinaryOfficeComponent() {
   const t = useTranslations();
   const columns = useMemo(
@@ -82,39 +87,55 @@ function DashboardMachinaryOfficeComponent() {
         ),
       },
       {
-        accessorFn: (row) => format(new Date(row.created_at), "yyyy/mm/dd"),
+        accessorFn: (row) =>
+          format(new Date(row.created_at), "HH:mm | yyyy/mm/dd"),
         id: "created_at",
         header: t("MachinaryOffice.created_at"),
         enableColumnFilter: true,
-        datatype: "numeric",
-        filterFn: "equals",
-        columnFilterModeOptions: [
-          "equals",
-          "notEquals",
-          "contains",
-          "lessThan",
-          "greaterThan",
-          "between",
-        ],
-        Cell: ({ renderedCellValue }) => (
-          <Typography variant="body2">{renderedCellValue}</Typography>
-        ),
+        datatype: "date",
+        filterFn: "lessThan",
+        columnFilterModeOptions: ["lessThan", "greaterThan"],
+        Cell: ({ renderedCellValue }) => {
+          return (
+            <Typography variant="body2" style={{ minWidth: "200px" }}>
+              {renderedCellValue}
+            </Typography>
+          );
+        },
+        Header: ({ column }) => <em>{column.columnDef.header}</em>,
+        Filter: ({ column }) => {
+          return (
+            <LocalizationProvider dateAdapter={AdapterDateFnsJalali}>
+              <MobileDateTimePicker
+                onChange={(newValue) => {
+                  const date = new Date(newValue);
+                  const formattedDate = moment(date)
+                    .locale("en")
+                    .format("YYYY-MM-DD HH:mm");
+                  column.setFilterValue(formattedDate);
+                }}
+                slotProps={{
+                  textField: {
+                    helperText: `Filter Mode: ${column.columnDef._filterFn}`,
+                    sx: { minWidth: "120px" },
+                    variant: "standard",
+                  },
+                }}
+                value={moment(column.getFilterValue())
+                  .locale("fa")
+                  .format("yyyy/mm/dd HH:mm")}
+              />
+            </LocalizationProvider>
+          );
+        },
       },
       {
-        accessorFn: (row) => format(new Date(row.updated_at), "yyyy/mm/dd"),
+        accessorFn: (row) =>
+          format(new Date(row.updated_at), "HH:mm | yyyy/mm/dd"),
         id: "updated_at",
         header: t("MachinaryOffice.updated_at"),
-        enableColumnFilter: true,
+        enableColumnFilter: false,
         datatype: "numeric",
-        filterFn: "equals",
-        columnFilterModeOptions: [
-          "equals",
-          "notEquals",
-          "contains",
-          "lessThan",
-          "greaterThan",
-          "between",
-        ],
         Cell: ({ renderedCellValue }) => (
           <Typography variant="body2">{renderedCellValue}</Typography>
         ),
@@ -154,9 +175,9 @@ function DashboardMachinaryOfficeComponent() {
         accessorFn: (row) => row.state_name,
         id: "state_id",
         header: t("MachinaryOffice.state_name"),
-        enableColumnFilter: true,
+        enableColumnFilter: false,
         datatype: "numeric",
-        filterFn: "equals",
+        // filterFn: "equals",
         // filterSelectOptions: [
         // ],
         // filterVariant: "select",

src/components/dashboard/passenger-office/index.jsx

@@ -7,12 +7,16 @@ import { GET_PASSENGER_OFFICE } from "@/core/data/apiRoutes";
 import { useTranslations } from "next-intl";
 import TableRowActions from "./TableRowActions";
 import { format } from "date-fns-jalali";
-import { DateTimePicker, LocalizationProvider } from "@mui/x-date-pickers";
+import {
+  LocalizationProvider,
+  MobileDateTimePicker,
+} from "@mui/x-date-pickers";
 import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali";
 import moment from "moment";
 
 function DashboardPassengerOfficeComponent() {
   const t = useTranslations();
+
   const columns = useMemo(
     () => [
       {
@@ -86,7 +90,7 @@ function DashboardPassengerOfficeComponent() {
       },
       {
         accessorFn: (row) =>
-          format(new Date(row.created_at), "yyyy/mm/dd HH:mm"),
+          format(new Date(row.created_at), "HH:mm | yyyy/mm/dd"),
         id: "created_at",
         header: t("PassengerOffice.created_at"),
         enableColumnFilter: true,
@@ -94,28 +98,22 @@ function DashboardPassengerOfficeComponent() {
         filterFn: "lessThan",
         columnFilterModeOptions: ["lessThan", "greaterThan"],
         Cell: ({ renderedCellValue }) => {
-          return <Typography variant="body2">{renderedCellValue}</Typography>;
+          return (
+            <Typography variant="body2" style={{ minWidth: "200px" }}>
+              {renderedCellValue}
+            </Typography>
+          );
         },
         Header: ({ column }) => <em>{column.columnDef.header}</em>,
         Filter: ({ column }) => {
           return (
             <LocalizationProvider dateAdapter={AdapterDateFnsJalali}>
-              <DateTimePicker
+              <MobileDateTimePicker
                 onChange={(newValue) => {
-                  console.log({ newValue });
                   const date = new Date(newValue);
-                  console.log({ date });
                   const formattedDate = moment(date)
                     .locale("en")
                     .format("YYYY-MM-DD HH:mm");
-                  console.log(formattedDate);
-                  // const formattedDate = format(date, "YYYY-MM-DD HH:mm");
-                  // console.log(
-                  //   "moment",
-                  //   moment(formattedDate)
-                  //     .locale("en")
-                  //     .format("YYYY-MM-DD HH:mm")
-                  // );
                   column.setFilterValue(formattedDate);
                 }}
                 slotProps={{
@@ -125,27 +123,21 @@ function DashboardPassengerOfficeComponent() {
                     variant: "standard",
                   },
                 }}
-                value={column.getFilterValue()}
+                value={moment(column.getFilterValue())
+                  .locale("fa")
+                  .format("yyyy/mm/dd HH:mm")}
               />
             </LocalizationProvider>
           );
         },
       },
       {
-        accessorFn: (row) => format(new Date(row.updated_at), "yyyy/mm/dd"),
+        accessorFn: (row) =>
+          format(new Date(row.updated_at), "HH:mm | yyyy/mm/dd"),
         id: "updated_at",
         header: t("PassengerOffice.updated_at"),
-        enableColumnFilter: true,
+        enableColumnFilter: false,
         datatype: "numeric",
-        filterFn: "equals",
-        columnFilterModeOptions: [
-          "equals",
-          "notEquals",
-          "contains",
-          "lessThan",
-          "greaterThan",
-          "between",
-        ],
         Cell: ({ renderedCellValue }) => (
           <Typography variant="body2">{renderedCellValue}</Typography>
         ),
@@ -185,9 +177,9 @@ function DashboardPassengerOfficeComponent() {
         accessorFn: (row) => row.state_name,
         id: "state_id",
         header: t("PassengerOffice.state_name"),
-        enableColumnFilter: true,
+        enableColumnFilter: false,
         datatype: "numeric",
-        filterFn: "equals",
+        // filterFn: "equals",
         // filterSelectOptions: [
         // ],
         // filterVariant: "select",

src/components/dashboard/transportation-assistance/index.jsx

@@ -7,7 +7,12 @@ import { GET_TRANSPORTATION_ASSISTANCE } from "@/core/data/apiRoutes";
 import { useTranslations } from "next-intl";
 import TableRowActions from "./TableRowActions";
 import { format } from "date-fns-jalali";
-
+import {
+  LocalizationProvider,
+  MobileDateTimePicker,
+} from "@mui/x-date-pickers";
+import { AdapterDateFnsJalali } from "@mui/x-date-pickers/AdapterDateFnsJalali";
+import moment from "moment";
 function DashboardTransportationAssistanceComponent() {
   const t = useTranslations();
   const columns = useMemo(
@@ -83,39 +88,53 @@ function DashboardTransportationAssistanceComponent() {
         ),
       },
       {
-        accessorFn: (row) => format(new Date(row.created_at), "yyyy/mm/dd"),
+        accessorFn: (row) =>
+          format(new Date(row.created_at), "HH:mm | yyyy/mm/dd"),
         id: "created_at",
         header: t("TransportationAssistance.created_at"),
         enableColumnFilter: true,
-        datatype: "numeric",
-        filterFn: "equals",
-        columnFilterModeOptions: [
-          "equals",
-          "notEquals",
-          "contains",
-          "lessThan",
-          "greaterThan",
-          "between",
-        ],
+        datatype: "date",
+        filterFn: "lessThan",
+        columnFilterModeOptions: ["lessThan", "greaterThan"],
         Cell: ({ renderedCellValue }) => (
-          <Typography variant="body2">{renderedCellValue}</Typography>
+          <Typography variant="body2" style={{ minWidth: "200px" }}>
+            {renderedCellValue}
+          </Typography>
         ),
+        Header: ({ column }) => <em>{column.columnDef.header}</em>,
+        Filter: ({ column }) => {
+          return (
+            <LocalizationProvider dateAdapter={AdapterDateFnsJalali}>
+              <MobileDateTimePicker
+                onChange={(newValue) => {
+                  const date = new Date(newValue);
+                  const formattedDate = moment(date)
+                    .locale("en")
+                    .format("YYYY-MM-DD HH:mm");
+                  column.setFilterValue(formattedDate);
+                }}
+                slotProps={{
+                  textField: {
+                    helperText: `Filter Mode: ${column.columnDef._filterFn}`,
+                    sx: { minWidth: "120px" },
+                    variant: "standard",
+                  },
+                }}
+                value={moment(column.getFilterValue())
+                  .locale("fa")
+                  .format("yyyy/mm/dd HH:mm")}
+              />
+            </LocalizationProvider>
+          );
+        },
       },
       {
-        accessorFn: (row) => format(new Date(row.updated_at), "yyyy/mm/dd"),
+        accessorFn: (row) =>
+          format(new Date(row.updated_at), "HH:mm | yyyy/mm/dd"),
         id: "updated_at",
         header: t("TransportationAssistance.updated_at"),
-        enableColumnFilter: true,
+        enableColumnFilter: false,
         datatype: "numeric",
-        filterFn: "equals",
-        columnFilterModeOptions: [
-          "equals",
-          "notEquals",
-          "contains",
-          "lessThan",
-          "greaterThan",
-          "between",
-        ],
         Cell: ({ renderedCellValue }) => (
           <Typography variant="body2">{renderedCellValue}</Typography>
         ),
@@ -155,9 +174,9 @@ function DashboardTransportationAssistanceComponent() {
         accessorFn: (row) => row.state_name,
         id: "state_id",
         header: t("TransportationAssistance.state_name"),
-        enableColumnFilter: true,
+        enableColumnFilter: false,
         datatype: "numeric",
-        filterFn: "equals",
+        // filterFn: "equals",
         // filterSelectOptions: [
         // ],
         // filterVariant: "select",

src/core/components/Datatable.jsx

@@ -3,7 +3,7 @@ import useLanguage from "@/lib/app/hooks/useLanguage";
 import { Typography } from "@mui/material";
 import axios from "axios";
 import MaterialReactTable from "material-react-table";
-import moment from "moment";
+import moment from "moment-jalaali";
 import { useTranslations } from "next-intl";
 import { useContext, useEffect, useMemo, useState } from "react";
 import useSWR from "swr";
@@ -12,6 +12,7 @@ const DataTable = (props) => {
   const { reloadDataTable, setReloadDataTable } = useContext(
     ReloadDataTableContext
   );
+
   const fetcher = (...args) => {
     return axios
       .get(args, {
@@ -43,8 +44,9 @@ const DataTable = (props) => {
   const [sorting, setSorting] = useState([]);
   const [pagination, setPagination] = useState({ pageIndex: 0, pageSize: 10 });
   const [rowCount, setRowCount] = useState(0);
+  console.log(moment());
   const [updateTime, setupdateTime] = useState(
-    moment().locale(languageApp).format("LL (HH:mm:ss)")
+    moment().format("HH:mm | jYYYY/jM/jD")
   );
 
   const tableLocalization = useMemo(
@@ -97,7 +99,7 @@ const DataTable = (props) => {
   }, [reloadDataTable, setReloadDataTable]);
 
   useEffect(() => {
-    setupdateTime(moment().locale(languageApp).format("LL (HH:mm:ss)"));
+    setupdateTime(moment().format("HH:mm | jYYYY/jM/jD"));
   }, [isValidating, languageApp]);
 
   return (

src/core/utils/theme-rtl.jsx

@@ -4,7 +4,7 @@ import theme from "./theme";
 const themeRtl = createTheme({
   direction: "rtl",
   typography: {
-    fontFamily: `IRANSans, sans-serif`,
+    fontFamily: `IRANSansFaNum, sans-serif`,
   },
   ...theme,
 });