Replace moment.js with luxon.js

Makefile

@@ -71,7 +71,7 @@ frontend_build: frontend_clean
 	docker run --rm \
 		-v `pwd`/src/frontend:/src/frontend \
 		-v recordexpungpdx_node_modules:/src/frontend/node_modules \
-		node:13.13.0-alpine /bin/sh -c 'cd /src/frontend && npm i && npm run build'
+		node:18.13-bullseye /bin/sh -c 'cd /src/frontend && npm i && npm run build'
 
 # delete react built files
 frontend_clean:

src/frontend/package.json

@@ -24,7 +24,7 @@
     "js-file-download": "^0.4.12",
     "lint-staged": "^13.1.0",
     "lodash": "^4.17.20",
-    "moment": "^2.24.0",
+    "luxon": "^3.3.0",
     "prettier": "^2.0.5",
     "react": "^18.2.0",
     "react-dev-utils": "12.0.1",
@@ -67,5 +67,8 @@
     "coverageReporters": [
       "text"
     ]
+  },
+  "devDependencies": {
+    "@types/luxon": "^3.3.0"
   }
 }

src/frontend/src/components/RecordSearch/Record/DispositionQuestion.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from "react";
 import { QuestionData } from "./types";
 import store from "../../../redux/store";
-import moment from "moment";
+import { isDate } from "../../../service/validators";
 import { DispositionAnswer } from "./DispositionAnswer";
 
 interface Props {
@@ -75,13 +75,9 @@ export function DispositionQuestion(props: Props) {
       ((questionState.dispositionAnswer === "Convicted" ||
         questionState.dispositionAnswer === "Probation Revoked") &&
         questionState.conviction_date.length !== 0 &&
-        !moment(questionState.conviction_date, "M/D/YYYY", true).isValid()) ||
+        !isDate(questionState.conviction_date)) ||
       (questionState.probation_revoked_date.length !== 0 &&
-        !moment(
-          questionState.probation_revoked_date,
-          "M/D/YYYY",
-          true
-        ).isValid());
+        !isDate(questionState.probation_revoked_date));
     return [missingFields, invalidDate];
   }
 

src/frontend/src/components/RecordSearch/Record/EditCasePanel.tsx

@@ -1,6 +1,6 @@
 import React from "react";
-import moment from "moment";
 import { CaseData } from "./types";
+import { isDate } from "../../../service/validators";
 import {
   editCase,
   deleteCase,
@@ -180,7 +180,7 @@ export default class EditCasePanel extends React.Component<Props, State> {
           invalidBirthYear:
             this.state.birth_year !== "" &&
             this.state.birth_year !== "0" &&
-            !moment(this.state.birth_year, "YYYY", true).isValid(),
+            !isDate(this.state.birth_year, "yyyy"),
         },
         resolve
       );

src/frontend/src/components/RecordSearch/Record/EditChargePanel.tsx

@@ -1,4 +1,3 @@
-import moment from "moment";
 import React from "react";
 import { HashLink as Link } from "react-router-hash-link";
 import {
@@ -8,6 +7,7 @@ import {
   CHARGE_TYPES_DISMISSED_ONLY,
   SEVERITY_LEVELS,
 } from "./types";
+import { isDate } from "../../../service/validators";
 import InvalidInputs from "../../InvalidInputs";
 import { editCharge, deleteCharge } from "../../../redux/search/actions";
 import DateField from "./DateField";
@@ -199,26 +199,20 @@ export default class EditChargePanel extends React.Component<Props, State> {
           missingType: this.state.type_name === "",
           missingLevel: this.state.level === "",
           missingDate: this.state.date === "",
-          invalidDate:
-            this.state.date !== "" &&
-            !moment(this.state.date, "M/D/YYYY", true).isValid(),
+          invalidDate: this.state.date !== "" && !isDate(this.state.date),
           missingDispositionDate:
             (this.state.disposition_status === "Convicted" ||
               this.state.disposition_status === "Probation Revoked") &&
             this.state.disposition_date === "",
           invalidDispositionDate:
             this.state.disposition_date !== "" &&
-            !moment(this.state.disposition_date, "M/D/YYYY", true).isValid(),
+            !isDate(this.state.disposition_date),
           missingProbationRevoked:
             this.state.disposition_status === "Probation Revoked" &&
             this.state.probation_revoked_date === "",
           invalidProbationRevoked:
             this.state.probation_revoked_date !== "" &&
-            !moment(
-              this.state.probation_revoked_date,
-              "M/D/YYYY",
-              true
-            ).isValid(),
+            !isDate(this.state.probation_revoked_date),
         },
         resolve
       );

src/frontend/src/components/RecordSearch/Record/RecordSummary/ChargesList.tsx

@@ -1,5 +1,4 @@
 import React from "react";
-import { getEligibilityColor } from "./utils";
 
 interface ChargeProps {
   id: string;
@@ -22,6 +21,17 @@ interface ChargeListProps {
   totalCharges: number;
 }
 
+function getEligibilityColor(eligibility: string) {
+  return (
+    {
+      "Eligible Now": "green",
+      Ineligible: "red",
+      "Eligible on case with Ineligible charge": "red",
+      "Needs More Analysis": "purple",
+    }[eligibility] ?? "dark-blue"
+  );
+}
+
 function Charge({ id, name, hasBalance }: ChargeProps) {
   return (
     <li className="f6 bb b--light-gray pv2">

src/frontend/src/components/RecordSearch/Record/util.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import moment from "moment";
+import { DateTime } from "luxon";
 import { ExpungementResultData, ChargeEligibilityStatus } from "./types";
 
 type EligibilityColor = "green" | "dark-blue" | "purple" | "red";
@@ -45,15 +45,15 @@ export function getShortLabel(
   dateStr?: string | null,
   caseBalance?: number
 ) {
-  const date = moment(dateStr, "MMM/D/YY");
+  const date = dateStr && DateTime.fromFormat(dateStr, "MMM d, yyyy");
 
   switch (status) {
     case "Eligible Now":
       if (caseBalance && caseBalance > 0) return "Eligible";
       return status;
     case "Will Be Eligible":
-      if (!dateStr || !date.isValid()) return "Eligible Future";
-      return "Eligible " + date.format("M/D/YY");
+      if (!date || !date.isValid) return "Eligible Future";
+      return "Eligible " + date.toFormat("M/d/yy");
     case "Needs More Analysis":
       return "Needs Analysis";
     case "Possibly Eligible":

src/frontend/src/redux/searchFormSlice.ts

@@ -1,4 +1,4 @@
-import moment from "moment";
+import { DateTime } from "luxon";
 import { createSlice } from "@reduxjs/toolkit";
 import { RootState } from "./store";
 import {
@@ -20,7 +20,7 @@ export const initialState: SearchFormState = {
       birth_date: "",
     },
   ],
-  date: moment().format("M/D/YYYY"),
+  date: DateTime.now().toFormat("M/d/yyyy"),
 };
 
 interface UpdateAliasPayload {

src/frontend/src/service/validators.test.ts

@@ -0,0 +1,16 @@
+import { isDate } from "./validators";
+
+describe("isDate", () => {
+  test.each`
+    input            | format           | expected
+    ${"2/3/2002"}    | ${undefined}     | ${true}
+    ${"1999"}        | ${"yyyy"}        | ${true}
+    ${"Mar 3, 1977"} | ${undefined}     | ${false}
+    ${"Mar 3, 1977"} | ${"MMM d, yyyy"} | ${true}
+  `(
+    'returns $expected for input "$input" with format "$format"',
+    ({ input, format, expected }) => {
+      expect(isDate(input, format)).toBe(expected);
+    }
+  );
+});

src/frontend/src/service/validators.ts

@@ -1,4 +1,4 @@
-import moment from "moment";
+import { DateTime } from "luxon";
 
 export type Validator<T> = (alias: T, index: number, array: T[]) => boolean;
 
@@ -8,8 +8,8 @@ export function isBlank(str: string) {
   return str.trim().length === 0;
 }
 
-export function isDate(str: string, format = "M/D/YYYY") {
-  return moment(str, format, true).isValid();
+export function isDate(str: string, format = "M/d/yyyy") {
+  return DateTime.fromFormat(str, format).isValid;
 }
 
 export function isValidWildcard(str: string, minLength = 2): boolean {
@@ -26,7 +26,7 @@ export function isPresent<T extends Record<string, any>>(
 export function isValidOptionalDate<T extends Record<string, any>>(
   attribute: keyof T,
   message: string,
-  opts = { format: "M/D/YYYY", indexes: undefined } as {
+  opts = { format: "M/d/yyyy", indexes: undefined } as {
     format?: string;
     indexes?: number[];
   }