refac: change from string type to accurate DateISO type

Author: hoon2hooni

components/events/Timetable.tsx

@@ -248,7 +248,7 @@ const AvailableDate = styled.div`
 `;
 
 const NotAvailableDate = styled.div`
-  background-color: ${(props) => props.theme.colors.block}};
+  background-color: ${(props) => props.theme.colors.block};
 `;
 
 const TimeUnit = styled.div`

lib/dataTransformer.ts

@@ -2,6 +2,7 @@
  * 생성
  */
 
+import type { DateISO } from "@dateTypes";
 import type { Attendees } from "@eventsTypes";
 import { Timestamp } from "firebase/firestore";
 
@@ -72,6 +73,8 @@ export const transformObjToValueLengthArray = <T>(obj: Record<string, T[]>) => {
   return Object.values(obj).map((obj) => obj.length);
 };
 
-export const getMaxNumberOfAttendees = (attendees: Record<string, string[]>) => {
+export const getMaxNumberOfAttendees = (
+  attendees: Record<DateISO, string[]>
+) => {
   return Math.max(...transformObjToValueLengthArray(attendees));
 };

tsconfig.json

@@ -27,6 +27,7 @@
       "@hooks/*": ["lib/hooks/*"],
       "@eventsTypes": ["types/events"],
       "@newTypes": ["types/new"],
+      "@dateTypes": ["types/date"],
       "@firebase/*": ["firebase/*"]
     }
   },

types/date/index.ts

@@ -0,0 +1,41 @@
+/**
+ * we use number instead of Digit because of ts2590 error
+ * "Expression produces a union type that is too complex to represent. ts(2590)
+ *
+ * type Digit = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
+ */
+type FourNumbers = `${number}${number}${number}${number}`;
+type ThreeNumbers = `${number}${number}${number}`;
+type TwoNumbers = `${number}${number}`;
+
+type Time =
+  | "year"
+  | "month"
+  | "hour"
+  | "day"
+  | "minutes"
+  | "seconds"
+  | "milliseconds";
+
+type getTimeFormat<T extends Time> = T extends "year"
+  ? FourNumbers
+  : T extends "milliseconds"
+  ? ThreeNumbers
+  : TwoNumbers;
+
+/**
+ * `2021-01-08`
+ */
+export type DateISODate =
+  `${getTimeFormat<"year">}-${getTimeFormat<"month">}-${getTimeFormat<"day">}`;
+
+/**
+ * `14:42:34.678`
+ */
+export type DateISOTime =
+  `${getTimeFormat<"hour">}:${getTimeFormat<"minutes">}:${getTimeFormat<"seconds">}.${getTimeFormat<"milliseconds">}`;
+
+/**
+ *  `2021-01-08T14:42:34.678Z` (format: ISO 8601).
+ */
+export type DateISO = `${DateISODate}T${DateISOTime}Z`;

types/env.d.ts

@@ -6,9 +6,6 @@ declare global {
       NEXT_PUBLIC_DOMAIN_URL: string;
     }
   }
-  interface Window {
-    Kakao: any;
-  }
 }
 
 export {};

types/global.d.ts

@@ -0,0 +1,11 @@
+import type { DateISO } from "@dateTypes";
+declare global {
+  interface Window {
+    Kakao: any;
+  }
+  interface Date {
+    toISOString(): DateISO;
+  }
+}
+
+export {};