refactor(utils): Update date formatters to control time visibility

The `unixToDate` and `msToDate` utility functions have been updated to provide more control over the output format. They now accept an object with a `hasTime` boolean property, allowing the caller to specify whether the time should be included in the formatted date string.

This change was implemented to hide the time portion of the `seen_at` field on the notification details page, displaying only the date. All existing calls to these functions across the application have been updated to use the new signature.
This commit is contained in:
AmirReza Jamali
2025-09-27 10:29:28 +03:30
parent da250b805d
commit e7089a2e60
6 changed files with 19 additions and 20 deletions
@@ -5,6 +5,7 @@ import { ShowcaseSection } from "@/components/Layouts/showcase-section";
import IsVisible from "@/components/ui/IsVisible"; import IsVisible from "@/components/ui/IsVisible";
import { useGetNotificationDetails } from "@/hooks/queries/useNotificationQueries"; import { useGetNotificationDetails } from "@/hooks/queries/useNotificationQueries";
import { BreadcrumbItem } from "@/types/shared"; import { BreadcrumbItem } from "@/types/shared";
import { unixToDate } from "@/utils/shared";
import { use } from "react"; import { use } from "react";
interface IProps { interface IProps {
@@ -60,7 +61,7 @@ const NotificationDetailsPage = ({ params }: IProps) => {
</IsVisible> </IsVisible>
<IsVisible condition={!!data?.data.seen_at}> <IsVisible condition={!!data?.data.seen_at}>
<ShowcaseSection title="Seen at"> <ShowcaseSection title="Seen at">
{data?.data.seen_at} {unixToDate({ unix: data?.data.seen_at ?? 0, hasTime: false })}
</ShowcaseSection> </ShowcaseSection>
</IsVisible> </IsVisible>
+2 -10
View File
@@ -4,20 +4,12 @@ import { LocationIcon } from "@/assets/icons";
import Breadcrumb from "@/components/Breadcrumbs/Breadcrumb"; import Breadcrumb from "@/components/Breadcrumbs/Breadcrumb";
import { ShowcaseSection } from "@/components/Layouts/showcase-section"; import { ShowcaseSection } from "@/components/Layouts/showcase-section";
import Status from "@/components/ui/Status"; import Status from "@/components/ui/Status";
import {
Table,
TableBody,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import { useTenderDetailQuery } from "@/hooks/queries"; import { useTenderDetailQuery } from "@/hooks/queries";
import { useGetFlagQuery } from "@/hooks/queries/useFlagsQueries"; import { useGetFlagQuery } from "@/hooks/queries/useFlagsQueries";
import { msToDate, unixToDate } from "@/utils/shared"; import { msToDate } from "@/utils/shared";
import getSymbolFromCurrency from "currency-symbol-map"; import getSymbolFromCurrency from "currency-symbol-map";
import { use } from "react";
import { TableCell } from "../../../components/ui/table";
import Link from "next/link"; import Link from "next/link";
import { use } from "react";
interface IProps { interface IProps {
params: Promise<{ params: Promise<{
@@ -2,7 +2,6 @@
import { PencilSquareIcon, TrashIcon } from "@/assets/icons"; import { PencilSquareIcon, TrashIcon } from "@/assets/icons";
import { Switch } from "@/components/FormElements/switch"; import { Switch } from "@/components/FormElements/switch";
import ConfirmationModal from "@/components/ui/ConfirmationModal"; import ConfirmationModal from "@/components/ui/ConfirmationModal";
import { _TooltipDefaultParams } from "@/constants/tooltip";
import IsVisible from "@/components/ui/IsVisible"; import IsVisible from "@/components/ui/IsVisible";
import { import {
Table, Table,
@@ -13,6 +12,7 @@ import {
TableRow, TableRow,
} from "@/components/ui/table"; } from "@/components/ui/table";
import TableSkeleton from "@/components/ui/TableSkeleton"; import TableSkeleton from "@/components/ui/TableSkeleton";
import { _TooltipDefaultParams } from "@/constants/tooltip";
import { unixToDate } from "@/utils/shared"; import { unixToDate } from "@/utils/shared";
import Link from "next/link"; import Link from "next/link";
import { Tooltip } from "react-tooltip"; import { Tooltip } from "react-tooltip";
@@ -67,7 +67,7 @@ const CompanyCategoriesTable = () => {
<TableCell colSpan={100}>{category.name}</TableCell> <TableCell colSpan={100}>{category.name}</TableCell>
<TableCell colSpan={100}>{category.description}</TableCell> <TableCell colSpan={100}>{category.description}</TableCell>
<TableCell colSpan={100}> <TableCell colSpan={100}>
{unixToDate(category.created_at)} {unixToDate({ unix: category.created_at, hasTime: true })}
</TableCell> </TableCell>
<TableCell colSpan={100}> <TableCell colSpan={100}>
<IsVisible condition={isToggling}> <IsVisible condition={isToggling}>
+3 -3
View File
@@ -1,7 +1,6 @@
"use client"; "use client";
import { ExclamationIcon, PencilSquareIcon, TrashIcon } from "@/assets/icons"; import { ExclamationIcon, PencilSquareIcon, TrashIcon } from "@/assets/icons";
import ConfirmationModal from "@/components/ui/ConfirmationModal"; import ConfirmationModal from "@/components/ui/ConfirmationModal";
import { _TooltipDefaultParams } from "@/constants/tooltip";
import { import {
Table, Table,
TableBody, TableBody,
@@ -10,6 +9,7 @@ import {
TableHeader, TableHeader,
TableRow, TableRow,
} from "@/components/ui/table"; } from "@/components/ui/table";
import { _TooltipDefaultParams } from "@/constants/tooltip";
import Link from "next/link"; import Link from "next/link";
import useCustomerListPresenter from "./useCustomerListPresenter"; import useCustomerListPresenter from "./useCustomerListPresenter";
@@ -18,8 +18,8 @@ import Modal from "@/components/ui/modal";
import Status from "@/components/ui/Status"; import Status from "@/components/ui/Status";
import TableSkeleton from "@/components/ui/TableSkeleton"; import TableSkeleton from "@/components/ui/TableSkeleton";
import { unixToDate } from "@/utils/shared"; import { unixToDate } from "@/utils/shared";
import { Tooltip } from "react-tooltip";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
import { Tooltip } from "react-tooltip";
import AssignToCompanyModalContent from "./AssignToCompanyModalContent"; import AssignToCompanyModalContent from "./AssignToCompanyModalContent";
const CustomersTable = () => { const CustomersTable = () => {
@@ -67,7 +67,7 @@ const CustomersTable = () => {
<TableCell colSpan={100}>{customer.full_name}</TableCell> <TableCell colSpan={100}>{customer.full_name}</TableCell>
<TableCell colSpan={100}>{customer.email}</TableCell> <TableCell colSpan={100}>{customer.email}</TableCell>
<TableCell colSpan={100}> <TableCell colSpan={100}>
{unixToDate(customer.created_at)} {unixToDate({ unix: customer.created_at, hasTime: true })}
</TableCell> </TableCell>
<TableCell colSpan={100} className="uppercase"> <TableCell colSpan={100} className="uppercase">
@@ -67,11 +67,11 @@ const FeedbackTable = ({ id, paramKey }: IProps) => {
{item.feedback_type} {item.feedback_type}
</TableCell> </TableCell>
<TableCell className="uppercase" colSpan={100}> <TableCell className="uppercase" colSpan={100}>
{unixToDate(item.updated_at)} {unixToDate({ unix: item.updated_at, hasTime: true })}
</TableCell> </TableCell>
<TableCell className="uppercase" colSpan={100}> <TableCell className="uppercase" colSpan={100}>
{unixToDate(item.created_at)} {unixToDate({ unix: item.created_at, hasTime: true })}
</TableCell> </TableCell>
<TableCell <TableCell
className={cn(`text flex gap-2 capitalize`)} className={cn(`text flex gap-2 capitalize`)}
+8 -2
View File
@@ -1,6 +1,12 @@
import * as moment from "moment"; import * as moment from "moment";
export const unixToDate = (unix: number) => { export const unixToDate = ({
return moment.unix(unix).format("YYYY/MM/DD HH:MM"); hasTime = false,
unix,
}: {
unix: number;
hasTime?: boolean;
}) => {
return moment.unix(unix).format(`YYYY/MM/DD ${hasTime && "HH:MM"}`);
}; };
export const msToDate = (ms: number) => { export const msToDate = (ms: number) => {
return moment.default(ms).format("YYYY/MM/DD"); return moment.default(ms).format("YYYY/MM/DD");