Correct the date-time component.

Author: gjong

src/components/format/date-time.component.tsx

@@ -1,22 +1,23 @@
-import useLocalStorage from "../../hooks/local-storage.hook";
+import { useLocalStorage } from "primereact/hooks";
+import { SupportedLocales } from "../../config/prime-locale";
 
 const _ = ({ date }: { date?: string }) => {
-    const [language] = useLocalStorage('language', 'en');
+  const [language] = useLocalStorage<SupportedLocales>('en', 'language');
 
-    if (date) {
-        const formatted = new Intl.DateTimeFormat(language as string, {
-            year: 'numeric',
-            month: 'numeric',
-            day: 'numeric',
-            hour: 'numeric',
-            minute: 'numeric'
-        }).format(new Date(date))
-        return (
-            <span className='FormattedDate'>{ formatted }</span>
-        )
-    }
+  if (date) {
+    const formatted = new Intl.DateTimeFormat(language as string, {
+      year: 'numeric',
+      month: 'numeric',
+      day: 'numeric',
+      hour: 'numeric',
+      minute: 'numeric'
+    }).format(new Date(date))
+    return (
+      <span className='FormattedDate'>{ formatted }</span>
+    )
+  }
 
-    return <></>
+  return <></>
 }
 
 export default _

src/components/format/date-time.spec.tsx

@@ -0,0 +1,39 @@
+// date-time.spec.tsx
+import { render, screen } from '@testing-library/react';
+import { describe, expect, it, vi } from 'vitest';
+import _ from './date-time.component';
+
+describe('date-time.component', () => {
+    it('renders formatted date when date and language are provided', () => {
+        const date = '2025-09-15T12:34:56Z';
+
+        render(<_ date={ date }/>);
+
+        const formattedDate = new Intl.DateTimeFormat('en', {
+            year: 'numeric',
+            month: 'numeric',
+            day: 'numeric',
+            hour: 'numeric',
+            minute: 'numeric'
+        }).format(new Date(date));
+
+        expect(screen.getByText(formattedDate)).toBeInTheDocument();
+    });
+
+    it('formats date based on different language setting', () => {
+      localStorage.setItem("language", '"nl"')
+      const date = '2025-09-15T12:34:56Z';
+
+        render(<_ date={ date }/>);
+
+        const formattedDate = new Intl.DateTimeFormat('nl', {
+            year: 'numeric',
+            month: 'numeric',
+            day: 'numeric',
+            hour: 'numeric',
+            minute: 'numeric'
+        }).format(new Date(date));
+
+        expect(screen.getByText(formattedDate)).toBeInTheDocument();
+    });
+});