Merge pull request #2622 from Amsterdam/improvement/remove-moment

Removed moment and added dayjs

cypress/e2e/020_visit/visit.plan.authorization.spec.js

@@ -70,7 +70,7 @@ describe('Plan "huisbezoek"', () => {
 
  it("Schedule visit from date", () => {
  cy.get('[data-testid="visit_from_datetime"]')
- .type(moment().format("YYYY-MM-DD"))
+ .type(dayjs().format("YYYY-MM-DD"))
  })
 
  it("Schedule priority", () => {

cypress/e2e/020_visit/visit.plan.spec.js

@@ -1,4 +1,4 @@
-import moment from "moment";
+import dayjs from "dayjs";
 import address from "../../fixtures/address.json";
 import visit from "../../fixtures/visit.json";
 
@@ -67,7 +67,7 @@ describe('Test visit.plan.spec', () => {
  cy.get('[data-testid="visit_from"]').select(visit.visitFrom);
 
  cy.get('[data-testid="visit_from_datetime"]').type(
- moment().format("YYYY-MM-DD")
+ dayjs().format("YYYY-MM-DD")
  );
 
  cy.get('[data-testid="priority"]').select(visit.priority);

package.json

@@ -45,7 +45,7 @@
  "@types/styled-components": "^5.1.26",
  "@vitejs/plugin-react": "^4.3.1",
  "axios": "^1.7.3",
- "dayjs": "^1.11.11",
+ "dayjs": "^1.11.13",
  "env-cmd": "^10.1.0",
  "eslint-config-react-app": "^7.0.1",
  "final-form": "^4.20.10",
@@ -55,7 +55,6 @@
  "lodash.debounce": "^4.0.8",
  "lodash.isempty": "^4.4.0",
  "lodash.merge": "^4.6.2",
- "moment": "^2.29.4",
  "qs": "^6.13.0",
  "react": "^17.0.2",
  "react-dom": "^17.0.2",

src/app/components/case/Documents/DocumentsTable/columns.tsx

@@ -1,4 +1,4 @@
-import moment from "moment"
+import dayjs from "dayjs"
 import styled from "styled-components"
 import formatBytes from "../utils/formatBytes"
 import TableActions from "./TableActions/TableActions"
@@ -42,7 +42,7 @@ const getColumns = (getDocuments: () => Promise<unknown>, documentTypes?: Compon
  header: "Aangemaakt",
  dataIndex: "creatiedatum",
  minWidth: 100,
- render: (text: any) => text ? moment(text).format("DD-MM-YYYY") : "-"
+ render: (text: any) => text ? dayjs(text).format("DD-MM-YYYY") : "-"
  }, {
  header: "Media type",
  dataIndex: "formaat",

src/app/components/case/forms/ScheduleForm/ScheduleForm.tsx

@@ -1,5 +1,5 @@
 import { FormTitle } from "@amsterdam/asc-ui"
-import moment from "moment"
+import dayjs from "dayjs"
 import { useCase, useScheduleTypes, useScheduleCreate } from "app/state/rest"
 import WorkflowForm from "app/components/case/WorkflowForm/WorkflowForm"
 import scaffold from "./scaffold"
@@ -22,7 +22,7 @@ const mapData = (data: ScheduleTypeFormData) => ({
  week_segment: data.week_segment.id,
  day_segment: data.day_segment.id,
  priority: data.priority.id,
- visit_from_datetime: data.visit_from_datetime ? moment(data.visit_from_datetime).format() : null
+ visit_from_datetime: data.visit_from_datetime ? dayjs(data.visit_from_datetime).format() : null
 })
 
 const visitFromOptions: { id: number, name: string }[] = [{

src/app/components/case/forms/ScheduleForm/scaffold.tsx

@@ -1,5 +1,5 @@
 import { FormPositioner } from "@amsterdam/amsterdam-react-final-form"
-import moment from "moment"
+import dayjs from "dayjs"
 import { Fields } from "app/components/shared/Form/ScaffoldFields"
 import InfoButton from "app/components/shared/InfoHeading/InfoButton"
 import type { NavigateToFunction } from "app/routing/useNavigation"
@@ -56,8 +56,8 @@ export default (
  name: "visit_from_datetime",
  isRequired: true,
  validate: (value: string | undefined) => {
- const now = moment()
- const valueDate = moment(value)
+ const now = dayjs()
+ const valueDate = dayjs(value)
  const isInvalidDate = valueDate.isBefore(now, "day") // Date cannot be in the past.
  return isInvalidDate ? "Selecteer vandaag of een dag in de toekomst!" : false
  }

src/app/components/cases/CasesFilter/scaffoldDate.ts

@@ -1,14 +1,14 @@
-import moment from "moment"
+import dayjs from "dayjs"
 import { FormPositioner } from "@amsterdam/amsterdam-react-final-form"
 import { Fields } from "app/components/shared/Form/ScaffoldFields"
 
 const DATE_FORMAT = "YYYY-MM-DD"
 
 const getOptions = () => {
- const today = moment().format(DATE_FORMAT)
- const yesterday = moment().subtract(1, "days").format(DATE_FORMAT)
- const sevenDaysAgo = moment().subtract(7, "days").format(DATE_FORMAT)
- const thirtyDaysAgo = moment().subtract(30, "days").format(DATE_FORMAT)
+ const today = dayjs().format(DATE_FORMAT)
+ const yesterday = dayjs().subtract(1, "days").format(DATE_FORMAT)
+ const sevenDaysAgo = dayjs().subtract(7, "days").format(DATE_FORMAT)
+ const thirtyDaysAgo = dayjs().subtract(30, "days").format(DATE_FORMAT)
  return {
  "": "Alle zaken",
  [today]: "Vandaag",

src/app/components/shared/ConfirmScaffoldForm/utils/createValuesObject.tsx

@@ -1,4 +1,4 @@
-import moment from "moment"
+import dayjs from "dayjs"
 import ArrayFieldList from "../components/ArrayFieldList"
 import type { RequestBody, NamedFields } from "../ConfirmScaffoldFields"
 import { Field } from "../../Form/ScaffoldField"
@@ -26,7 +26,7 @@ const mapField = <T extends RequestBody>(field: Field, key: string, data: T) =>
  const typeResult: Record<string, string> = data["type_result"] as {}
  return Object.values(typeResult)
  } else if (type === "DateField") {
- return typeof v === "string" ? moment(v).format("DD-MM-YYYY") : v
+ return typeof v === "string" ? dayjs(v).format("DD-MM-YYYY") : v
  } else {
  return v
  }

src/app/state/rest/addresses.ts

@@ -1,6 +1,6 @@
 
 import qs from "qs"
-import moment from "moment"
+import dayjs from "dayjs"
 import type { Options } from "./"
 import { useErrorHandler, useSuppressErrorHandler } from "./hooks/utils/errorHandler"
 import { makeApiUrl } from "./hooks/utils/apiUrl"
@@ -39,7 +39,7 @@ export const usePermitsPowerBrowser = (bagId: string) => {
 
 export const useMeldingen = (bagId: string) => {
  const queryString = qs.stringify({
- start_date: moment().subtract(1, "years").startOf("year").format()
+ start_date: dayjs().subtract(1, "years").startOf("year").format()
  }, {
  addQueryPrefix: true
  })