fixed hydration error by removing date

next.config.js

@@ -9,6 +9,7 @@ const nextConfig = {
     ],
   },
   allowedDevOrigins: ['local-origin.dev', '*.local-origin.dev'],
+  reactStrictMode: true,
 };
 
 // use next-axiom for full stack monitoring

src/app/portfolio/[slug]/building-passport/[propertyId]/documents/DocumentSection.tsx

@@ -17,27 +17,47 @@ export const DocumentSection: React.FC<Props> = ({ reportType, uprn, files }) =>
   const [showUploadModal, setShowUploadModal] = React.useState(false);
   const router = useRouter();
 
-  const latestFile = React.useMemo<getUploadedFile | null>(() => {
-    if (!files?.length) return null;
-    return files.reduce((acc, cur) => {
-      const accTime = new Date(acc.s3FileUploadTimestamp as any).getTime();
-      const curTime = new Date(cur.s3FileUploadTimestamp as any).getTime();
-      return curTime > accTime ? cur : acc;
-    }, files[0]);
-  }, [files]);
+  console.log("files", files)
+
+  // const latestFile = React.useMemo<getUploadedFile | null>(() => {
+  //   if (!files?.length) return null;
+  //   return files.reduce((acc, cur) => {
+  //     const accTime = new Date(acc.s3FileUploadTimestamp as any).getTime();
+  //     const curTime = new Date(cur.s3FileUploadTimestamp as any).getTime();
+  //     return curTime > accTime ? cur : acc;
+  //   }, files[0]);
+  // }, [files]);
+
+//   const latestFile = React.useMemo(() => {
+//   console.log("Recomputing latestFile from", files);
+//   if (!Array.isArray(files) || files.length === 0) return null;
+
+//   return files.reduce((acc, cur) => {
+//     const accTime = new Date(acc.s3FileUploadTimestamp).getTime();
+//     const curTime = new Date(cur.s3FileUploadTimestamp).getTime();
+//     return curTime > accTime ? cur : acc;
+//   }, files[0]);
+// }, [JSON.stringify(files)]);
+
+const latestFile = files.length > 0 ? files.reduce((acc, cur) => {
+  return new Date(cur.s3FileUploadTimestamp).getTime() > new Date(acc.s3FileUploadTimestamp).getTime() ? cur : acc;
+}) : null;
 
   const formatWhen = (d: string | Date) =>
-    new Intl.DateTimeFormat(undefined, {
-      year: "numeric",
-      month: "short",
-      day: "2-digit",
-      hour: "2-digit",
-      minute: "2-digit",
-    }).format(new Date(d));
+  new Intl.DateTimeFormat(undefined, {
+    year: "numeric",
+    month: "short",
+    day: "2-digit",
+    hour: "2-digit",
+    minute: "2-digit",
+    timeZone: "UTC"
+  }).format(new Date(d));
 
   const title = documentTypeTitles[reportType];
   const count = files.length;
-
+  
+  const latestUpload = latestFile ? String(formatWhen(latestFile.s3FileUploadTimestamp)) : "";
+  // console.log("latestFile", latestFile)
   return (
     <>
       <TableRow className="bg-gray-50">
@@ -57,9 +77,9 @@ export const DocumentSection: React.FC<Props> = ({ reportType, uprn, files }) =>
                 >
                   View latest file
                 </a>
-                <span className="text-xs text-gray-400">
-                  uploaded {formatWhen(latestFile.s3FileUploadTimestamp)}
-                </span>
+                {/* <div className="text-xs text-gray-400">
+                  uploaded {latestUpload}
+                </div> */}
               </div>
               <span className="text-xs text-gray-500">
                 {count} file{count !== 1 && "s"} on record

src/app/portfolio/[slug]/building-passport/[propertyId]/documents/DocumentsTable.tsx

@@ -42,6 +42,7 @@ export const DocumentsTable: React.FC<Props> = ({ uprn, uploadedFilesData }) =>
       <TableBody className="bg-white divide-y divide-gray-200">
         {REPORT_TYPES.map((reportType) => {
           const filesForType = filesByType[reportType] ?? [];
+          console.log("reportType", reportType)
           return (
             <React.Fragment key={reportType}>
               <DocumentSection

src/app/portfolio/[slug]/components/RemoteAssessmentModal.tsx

@@ -535,7 +535,6 @@ export default function RemoteAssessmentModal({
   };
 
   const onSubmit = form.handleSubmit(async (data) => {
-    console.log("Triggered");
     await triggerAssessment(data);
     form.reset();
     setIsOpen(false);