Timestamp and registration checking

src/components/admin/admin-panel.tsx

@@ -1,9 +1,10 @@
 "use client";
 
 import { useState, useEffect, useCallback } from "react";
-import { useTranslations } from "next-intl";
+import { useTranslations, useFormatter } from "next-intl";
 import type { PiecedTenant, TenantRequest } from "@/types";
 import { StatusBadge } from "@/components/ui/status-badge";
+import { formatDateTime, formatRelative } from "@/lib/format";
 import Link from "next/link";
 
 type Tab = "requests" | "tenants" | "health";
@@ -24,6 +25,7 @@ interface AdminPanelProps {
 
 export function AdminPanel({ initialTenants }: AdminPanelProps) {
   const t = useTranslations("admin");
+  const f = useFormatter();
   const [tab, setTab] = useState<Tab>("requests");
 
   // Requests state
@@ -369,7 +371,19 @@ export function AdminPanel({ initialTenants }: AdminPanelProps) {
                           <RequestStatusBadge status={req.status} />
                         </td>
                         <td className="px-4 py-3 text-xs text-text-muted tabular-nums hidden md:table-cell">
-                          {new Date(req.createdAt).toLocaleDateString()}
+                          <div
+                            title={`${t("submitted")}: ${formatDateTime(req.createdAt, f)}${
+                              req.updatedAt && req.updatedAt !== req.createdAt
+                                ? `\n${t("updated")}: ${formatDateTime(req.updatedAt, f)}`
+                                : ""
+                            }`}
+                            className="leading-tight"
+                          >
+                            <div>{formatDateTime(req.createdAt, f)}</div>
+                            <div className="text-[10px] text-text-muted/70">
+                              {formatRelative(req.createdAt, f)}
+                            </div>
+                          </div>
                         </td>
                         <td className="px-4 py-3">
                           <div className="flex gap-1.5">
@@ -536,11 +550,26 @@ export function AdminPanel({ initialTenants }: AdminPanelProps) {
                               : "—"}
                           </td>
                           <td className="px-4 py-3 text-xs text-text-muted tabular-nums hidden md:table-cell">
-                            {tenant.metadata.creationTimestamp
-                              ? new Date(
-                                  tenant.metadata.creationTimestamp
-                                ).toLocaleDateString()
-                              : "—"}
+                            <div
+                              title={formatDateTime(
+                                tenant.metadata.creationTimestamp,
+                                f
+                              )}
+                              className="leading-tight"
+                            >
+                              <div>
+                                {formatDateTime(
+                                  tenant.metadata.creationTimestamp,
+                                  f
+                                )}
+                              </div>
+                              <div className="text-[10px] text-text-muted/70">
+                                {formatRelative(
+                                  tenant.metadata.creationTimestamp,
+                                  f
+                                )}
+                              </div>
+                            </div>
                           </td>
                           <td className="px-4 py-3">
                             <div className="flex gap-1.5 flex-wrap">