feat: Add date formatting utility functions and integrate them across components

src/app/contracts/[id]/page.js

@@ -9,6 +9,7 @@ import Badge from "@/components/ui/Badge";
 import PageContainer from "@/components/ui/PageContainer";
 import PageHeader from "@/components/ui/PageHeader";
 import { LoadingState } from "@/components/ui/States";
+import { formatDate } from "@/lib/utils";
 
 export default function ContractDetailsPage() {
 	const params = useParams();
@@ -135,7 +136,6 @@ export default function ContractDetailsPage() {
 										{contract.contract_number}
 									</p>
 								</div>
-
 								{contract.contract_name && (
 									<div>
 										<span className="text-sm font-medium text-gray-500 block mb-1">
@@ -146,7 +146,6 @@ export default function ContractDetailsPage() {
 										</p>
 									</div>
 								)}
-
 								{contract.customer_contract_number && (
 									<div>
 										<span className="text-sm font-medium text-gray-500 block mb-1">
@@ -157,7 +156,6 @@ export default function ContractDetailsPage() {
 										</p>
 									</div>
 								)}
-
 								{contract.customer && (
 									<div>
 										<span className="text-sm font-medium text-gray-500 block mb-1">
@@ -168,7 +166,6 @@ export default function ContractDetailsPage() {
 										</p>
 									</div>
 								)}
-
 								{contract.investor && (
 									<div>
 										<span className="text-sm font-medium text-gray-500 block mb-1">
@@ -178,30 +175,24 @@ export default function ContractDetailsPage() {
 											{contract.investor}
 										</p>
 									</div>
-								)}
-
+								)}{" "}
 								{contract.date_signed && (
 									<div>
 										<span className="text-sm font-medium text-gray-500 block mb-1">
 											Date Signed
 										</span>
 										<p className="text-gray-900 font-medium">
-											{new Date(contract.date_signed).toLocaleDateString(
-												"en-US"
-											)}
+											{formatDate(contract.date_signed)}
 										</p>
 									</div>
 								)}
-
 								{contract.finish_date && (
 									<div>
 										<span className="text-sm font-medium text-gray-500 block mb-1">
 											Finish Date
 										</span>
 										<p className="text-gray-900 font-medium">
-											{new Date(contract.finish_date).toLocaleDateString(
-												"en-US"
-											)}
+											{formatDate(contract.finish_date)}
 										</p>
 									</div>
 								)}
@@ -350,10 +341,8 @@ export default function ContractDetailsPage() {
 																d="M6 2a1 1 0 00-1 1v1H4a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V6a2 2 0 00-2-2h-1V3a1 1 0 10-2 0v1H7V3a1 1 0 00-1-1zm0 5a1 1 0 000 2h8a1 1 0 100-2H6z"
 																clipRule="evenodd"
 															/>
-														</svg>
-														{new Date(project.finish_date).toLocaleDateString(
-															"en-US"
-														)}
+														</svg>{" "}
+														{formatDate(project.finish_date)}
 													</div>
 												)}
 												<div className="flex items-center">

src/app/contracts/page.js

@@ -10,6 +10,7 @@ import PageHeader from "@/components/ui/PageHeader";
 import SearchBar from "@/components/ui/SearchBar";
 import FilterBar from "@/components/ui/FilterBar";
 import { LoadingState } from "@/components/ui/States";
+import { formatDate } from "@/lib/utils";
 
 export default function ContractsMainPage() {
 	const [contracts, setContracts] = useState([]);
@@ -485,11 +486,9 @@ export default function ContractsMainPage() {
 														</svg>
 														<span className="font-medium text-gray-700">
 															Zawarcie:
-														</span>
+														</span>{" "}
 														<span className="text-gray-600">
-															{new Date(
-																contract.date_signed
-															).toLocaleDateString("pl-PL")}
+															{formatDate(contract.date_signed)}
 														</span>
 													</div>
 												)}
@@ -510,11 +509,9 @@ export default function ContractsMainPage() {
 														</svg>
 														<span className="font-medium text-gray-700">
 															Zakończenie:
-														</span>
+														</span>{" "}
 														<span className="text-gray-600">
-															{new Date(
-																contract.finish_date
-															).toLocaleDateString("pl-PL")}
+															{formatDate(contract.finish_date)}
 														</span>
 													</div>
 												)}

src/app/page.js

@@ -20,6 +20,7 @@ import {
 	endOfWeek,
 	format,
 } from "date-fns";
+import { formatDate } from "@/lib/utils";
 
 export default function Home() {
 	const [stats, setStats] = useState({
@@ -767,7 +768,7 @@ export default function Home() {
 														{deadline.type === "project"
 															? deadline.city
 															: deadline.customer}{" "}
-														• {deadline.date}
+														• {formatDate(deadline.date)}
 													</p>
 												</div>
 											</div>
@@ -839,7 +840,7 @@ export default function Home() {
 													</div>
 													{project.finish_date && (
 														<p className="text-xs text-gray-500 mt-1">
-															Due: {project.finish_date}
+															Due: {formatDate(project.finish_date)}
 														</p>
 													)}
 												</div>

src/app/projects/[id]/page.js

@@ -9,6 +9,7 @@ import Button from "@/components/ui/Button";
 import Badge from "@/components/ui/Badge";
 import Link from "next/link";
 import { differenceInCalendarDays, parseISO } from "date-fns";
+import { formatDate } from "@/lib/utils";
 import PageContainer from "@/components/ui/PageContainer";
 import PageHeader from "@/components/ui/PageHeader";
 import ProjectStatusDropdown from "@/components/ProjectStatusDropdown";
@@ -172,13 +173,15 @@ export default async function ProjectViewPage({ params }) {
 									<p className="text-gray-900 font-medium">
 										{project.unit || "N/A"}
 									</p>
-								</div>
+								</div>{" "}
 								<div>
 									<span className="text-sm font-medium text-gray-500 block mb-1">
 										Deadline
 									</span>
 									<p className="text-gray-900 font-medium">
-										{project.finish_date || "N/A"}
+										{project.finish_date
+											? formatDate(project.finish_date)
+											: "N/A"}
 									</p>
 								</div>
 								<div>

src/app/projects/page.js

@@ -10,6 +10,7 @@ import PageContainer from "@/components/ui/PageContainer";
 import PageHeader from "@/components/ui/PageHeader";
 import SearchBar from "@/components/ui/SearchBar";
 import { LoadingState } from "@/components/ui/States";
+import { formatDate } from "@/lib/utils";
 
 export default function ProjectListPage() {
 	const [projects, setProjects] = useState([]);
@@ -245,12 +246,14 @@ export default function ProjectListPage() {
 										title={project.plot}
 									>
 										{project.plot || "N/A"}
-									</td>
+									</td>{" "}
 									<td
 										className="px-2 py-3 text-xs text-gray-600 truncate"
 										title={project.finish_date}
 									>
-										{project.finish_date || "N/A"}
+										{project.finish_date
+											? formatDate(project.finish_date)
+											: "N/A"}
 									</td>
 									<td className="px-2 py-3 text-xs text-gray-600 text-center font-semibold">
 										{project.project_type === "design"

src/app/tasks/page.js

@@ -8,6 +8,7 @@ import Badge from "@/components/ui/Badge";
 import TaskStatusDropdownSimple from "@/components/TaskStatusDropdownSimple";
 import { Input } from "@/components/ui/Input";
 import { formatDistanceToNow, parseISO } from "date-fns";
+import { formatDate } from "@/lib/utils";
 import PageContainer from "@/components/ui/PageContainer";
 import PageHeader from "@/components/ui/PageHeader";
 import SearchBar from "@/components/ui/SearchBar";