From 39dd6617dec72fff2a023b9558151544b12c8760 Mon Sep 17 00:00:00 2001
From: Manuel Stahl <manuel.stahl@awesome-technologies.de>
Date: Mon, 22 Apr 2024 13:42:53 +0200
Subject: [PATCH] Extract date formatting into separate file

Change-Id: I0004617349253450c6c706e4334d63924203a804
---
 src/components/EventReports.tsx       | 10 +--------
 src/components/RegistrationTokens.tsx | 31 +--------------------------
 src/components/date.ts                |  2 +-
 src/components/destinations.tsx       | 10 ++++-----
 src/components/media.tsx              |  7 +-----
 src/components/rooms.tsx              | 10 +--------
 src/components/users.tsx              | 10 +--------
 7 files changed, 11 insertions(+), 69 deletions(-)

diff --git a/src/components/EventReports.tsx b/src/components/EventReports.tsx
index d444ce8..810cce8 100644
--- a/src/components/EventReports.tsx
+++ b/src/components/EventReports.tsx
@@ -21,15 +21,7 @@ import { MXCField } from "./media";
 import PageviewIcon from "@mui/icons-material/Pageview";
 import ReportIcon from "@mui/icons-material/Warning";
 import ViewListIcon from "@mui/icons-material/ViewList";
-
-const date_format: Intl.DateTimeFormatOptions = {
-  year: "numeric",
-  month: "2-digit",
-  day: "2-digit",
-  hour: "2-digit",
-  minute: "2-digit",
-  second: "2-digit",
-};
+import { date_format } from "./date";
 
 const ReportPagination = () => (
   <Pagination rowsPerPageOptions={[10, 25, 50, 100, 500, 1000]} />
diff --git a/src/components/RegistrationTokens.tsx b/src/components/RegistrationTokens.tsx
index 9564d95..c737fb8 100644
--- a/src/components/RegistrationTokens.tsx
+++ b/src/components/RegistrationTokens.tsx
@@ -22,41 +22,12 @@ import {
   Toolbar,
 } from "react-admin";
 import RegistrationTokenIcon from "@mui/icons-material/ConfirmationNumber";
-
-const date_format = {
-  year: "numeric",
-  month: "2-digit",
-  day: "2-digit",
-  hour: "2-digit",
-  minute: "2-digit",
-  second: "2-digit",
-};
+import { date_format, dateFormatter, dateParser } from "./date";
 
 const validateToken = [regex(/^[A-Za-z0-9._~-]{0,64}$/)];
 const validateUsesAllowed = [number()];
 const validateLength = [number(), maxValue(64)];
 
-const dateParser = v => {
-  const d = new Date(v);
-  if (isNaN(d)) return 0;
-  return d.getTime();
-};
-
-const dateFormatter = v => {
-  if (v === undefined || v === null) return;
-  const d = new Date(v);
-
-  const pad = "00";
-  const year = d.getFullYear().toString();
-  const month = (pad + (d.getMonth() + 1).toString()).slice(-2);
-  const day = (pad + d.getDate().toString()).slice(-2);
-  const hour = (pad + d.getHours().toString()).slice(-2);
-  const minute = (pad + d.getMinutes().toString()).slice(-2);
-
-  // target format yyyy-MM-ddThh:mm
-  return `${year}-${month}-${day}T${hour}:${minute}`;
-};
-
 const registrationTokenFilters = [<BooleanInput source="valid" alwaysOn />];
 
 export const RegistrationTokenList = (props: ListProps) => (
diff --git a/src/components/date.ts b/src/components/date.ts
index 91aa096..3f8094d 100644
--- a/src/components/date.ts
+++ b/src/components/date.ts
@@ -1,4 +1,4 @@
-export const DATE_FORMAT: Intl.DateTimeFormatOptions = {
+export const date_format: Intl.DateTimeFormatOptions = {
   year: "numeric",
   month: "2-digit",
   day: "2-digit",
diff --git a/src/components/destinations.tsx b/src/components/destinations.tsx
index 90681be..a574181 100644
--- a/src/components/destinations.tsx
+++ b/src/components/destinations.tsx
@@ -29,7 +29,7 @@ import {
   useTranslate,
 } from "react-admin";
 
-import { DATE_FORMAT } from "./date";
+import { date_format } from "./date";
 
 const DestinationPagination = () => (
   <Pagination rowsPerPageOptions={[10, 25, 50, 100, 500, 1000]} />
@@ -112,8 +112,8 @@ export const DestinationList = (props: ListProps) => {
         bulkActionButtons={false}
       >
         <TextField source="destination" />
-        <DateField source="failure_ts" showTime options={DATE_FORMAT} />
-        <DateField source="retry_last_ts" showTime options={DATE_FORMAT} />
+        <DateField source="failure_ts" showTime options={date_format} />
+        <DateField source="retry_last_ts" showTime options={date_format} />
         <TextField source="retry_interval" />
         <TextField source="last_successful_stream_ordering" />
         <DestinationReconnectButton />
@@ -133,8 +133,8 @@ export const DestinationShow = (props: ShowProps) => {
       <TabbedShowLayout>
         <Tab label="status" icon={<ViewListIcon />}>
           <TextField source="destination" />
-          <DateField source="failure_ts" showTime options={DATE_FORMAT} />
-          <DateField source="retry_last_ts" showTime options={DATE_FORMAT} />
+          <DateField source="failure_ts" showTime options={date_format} />
+          <DateField source="retry_last_ts" showTime options={date_format} />
           <TextField source="retry_interval" />
           <TextField source="last_successful_stream_ordering" />
         </Tab>
diff --git a/src/components/media.tsx b/src/components/media.tsx
index 21d480f..279a512 100644
--- a/src/components/media.tsx
+++ b/src/components/media.tsx
@@ -34,17 +34,12 @@ import LockIcon from "@mui/icons-material/Lock";
 import LockOpenIcon from "@mui/icons-material/LockOpen";
 import FileOpenIcon from "@mui/icons-material/FileOpen";
 import { alpha, useTheme } from "@mui/material/styles";
+import { dateParser } from "./date";
 import { getMediaUrl } from "../synapse/synapse";
 
 const DeleteMediaDialog = ({ open, onClose, onSubmit }) => {
   const translate = useTranslate();
 
-  const dateParser = v => {
-    const d = new Date(v);
-    if (isNaN(d)) return 0;
-    return d.getTime();
-  };
-
   const DeleteMediaToolbar = (props: ToolbarProps) => (
     <Toolbar {...props}>
       <SaveButton
diff --git a/src/components/rooms.tsx b/src/components/rooms.tsx
index 813a8cf..cfa4e46 100644
--- a/src/components/rooms.tsx
+++ b/src/components/rooms.tsx
@@ -43,15 +43,7 @@ import {
   RoomDirectoryUnpublishButton,
   RoomDirectoryPublishButton,
 } from "./RoomDirectory";
-
-const date_format = {
-  year: "numeric",
-  month: "2-digit",
-  day: "2-digit",
-  hour: "2-digit",
-  minute: "2-digit",
-  second: "2-digit",
-};
+import { date_format } from "./date";
 
 const RoomPagination = () => (
   <Pagination rowsPerPageOptions={[10, 25, 50, 100, 500, 1000]} />
diff --git a/src/components/users.tsx b/src/components/users.tsx
index 8ecacfa..8fb7a9a 100644
--- a/src/components/users.tsx
+++ b/src/components/users.tsx
@@ -57,6 +57,7 @@ import {
   ProtectMediaButton,
   QuarantineMediaButton,
 } from "./media";
+import { date_format } from "./date";
 
 const choices_medium = [
   { id: "email", name: "resources.users.email" },
@@ -68,15 +69,6 @@ const choices_type = [
   { id: "support", name: "support" },
 ];
 
-const date_format: Intl.DateTimeFormatOptions = {
-  year: "numeric",
-  month: "2-digit",
-  day: "2-digit",
-  hour: "2-digit",
-  minute: "2-digit",
-  second: "2-digit",
-};
-
 const UserListActions = () => {
   const { isLoading, total } = useListContext();
   return (