From f2021c8b9b1f8e94f68c3d141e9c8141d4d1200e Mon Sep 17 00:00:00 2001
From: Harman-singh-waraich <Waraichharman68@gmail.com>
Date: Wed, 19 Jun 2024 18:06:33 +0530
Subject: [PATCH] refactor(web): refactor-date-and-file-viewer-styles

---
 web/src/components/EvidenceCard.tsx     |  4 ++--
 web/src/components/FileViewer/index.tsx |  2 +-
 web/src/utils/date.ts                   | 14 ++++++++++++--
 3 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/web/src/components/EvidenceCard.tsx b/web/src/components/EvidenceCard.tsx
index bf302e1e0..1d86607ea 100644
--- a/web/src/components/EvidenceCard.tsx
+++ b/web/src/components/EvidenceCard.tsx
@@ -102,7 +102,7 @@ const DesktopText = styled.span`
   )}
 `;
 
-const Timestamp = styled.p`
+const Timestamp = styled.label`
   color: ${({ theme }) => theme.secondaryText};
 `;
 
@@ -164,7 +164,7 @@ const EvidenceCard: React.FC<IEvidenceCard> = ({ evidence, sender, index, timest
           <Identicon size="24" string={sender} />
           <p>{shortenAddress(sender)}</p>
         </AccountContainer>
-        <Timestamp>{formatDate(Number(timestamp))}</Timestamp>
+        <Timestamp>{formatDate(Number(timestamp), true)}</Timestamp>
         {data && typeof data.fileURI !== "undefined" && (
           <StyledLink to={`attachment/?url=${getIpfsUrl(data.fileURI)}`}>
             <AttachmentIcon />
diff --git a/web/src/components/FileViewer/index.tsx b/web/src/components/FileViewer/index.tsx
index a9fed5278..74b8438a3 100644
--- a/web/src/components/FileViewer/index.tsx
+++ b/web/src/components/FileViewer/index.tsx
@@ -12,7 +12,7 @@ const Wrapper = styled.div`
   background-color: ${({ theme }) => theme.whiteBackground};
   border-radius: 3px;
   box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.06);
-  max-height: 750px;
+  max-height: 1050px;
   overflow: scroll;
 
   ${customScrollbar}
diff --git a/web/src/utils/date.ts b/web/src/utils/date.ts
index 148ac085b..7571fe8cc 100644
--- a/web/src/utils/date.ts
+++ b/web/src/utils/date.ts
@@ -20,8 +20,18 @@ export function getOneYearAgoTimestamp(): number {
   return currentTime - 31536000; // One year in seconds
 }
 
-export function formatDate(unixTimestamp: number): string {
+export function formatDate(unixTimestamp: number, withTime = false): string {
   const date = new Date(unixTimestamp * 1000);
-  const options: Intl.DateTimeFormatOptions = { month: "long", day: "2-digit", year: "numeric" };
+  const options: Intl.DateTimeFormatOptions = withTime
+    ? {
+        month: "long",
+        day: "2-digit",
+        year: "numeric",
+        hour: "numeric",
+        minute: "numeric",
+        timeZone: "GMT",
+        timeZoneName: "short",
+      }
+    : { month: "long", day: "2-digit", year: "numeric" };
   return date.toLocaleDateString("en-US", options);
 }