Merge pull request #13728 from strapi/chore/replace-moment-js

Replace remaining moment-js calls with date-fns
2025-12-28 07:33:17 +00:00 · 2022-07-14 09:54:12 +02:00 · 2022-07-14 09:54:12 +02:00 · b3d6e8ab87
commit b3d6e8ab87
parent 2a9f721ac8 562c73a00d
12 changed files with 15 additions and 72 deletions
--- a/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/utils/cleanData.js
+++ b/packages/core/admin/admin/src/content-manager/components/EditViewDataManagerProvider/utils/cleanData.js
@ -20,14 +20,6 @@ const cleanData = (retrievedData, currentSchema, componentsSchema) => {
        case 'json':
          cleanedData = JSON.parse(value);
          break;
-        // TODO
-        // case 'date':
-        //   cleanedData =
-        //     value && value._isAMomentObject === true ? value.format('YYYY-MM-DD') : value;
-        //   break;
-        // case 'datetime':
-        //   cleanedData = value && value._isAMomentObject === true ? value.toISOString() : value;
-        //   break;
        case 'time': {
          cleanedData = value;

--- a/packages/core/admin/admin/src/content-manager/utils/removeKeyInObject.js
+++ b/packages/core/admin/admin/src/content-manager/utils/removeKeyInObject.js
@ -21,10 +21,6 @@ const removeKeyInObject = (obj, keyToRemove) => {
    }

    if (typeof value === 'object') {
-      if (value._isAMomentObject === true) {
-        return { ...acc, [current]: value };
-      }
-
      if (Array.isArray(acc)) {
        acc[current] = removeKeyInObject(value, keyToRemove);

--- a/packages/core/admin/admin/src/content-manager/utils/tests/removeKeyInObject.test.js
+++ b/packages/core/admin/admin/src/content-manager/utils/tests/removeKeyInObject.test.js
@ -1,4 +1,3 @@
-import moment from 'moment';
 import removeKeyInObject from '../removeKeyInObject';

 const testGeoJson = {
@ -171,24 +170,4 @@ describe('CONTENT MANAGER | utils | removeKeyInObject', () => {

    expect(removeKeyInObject(data, '__temp_key__')).toEqual(expected);
  });
-
-  it('should not corrupt moment objects', () => {
-    const momentObject = moment();
-
-    const data = {
-      id: 1,
-      comment_date_time: momentObject,
-      __temp_key__: 0,
-    };
-
-    const expected = {
-      id: 1,
-      comment_date_time: momentObject,
-    };
-
-    const result = removeKeyInObject(data, '__temp_key__');
-
-    expect(result).toEqual(expected);
-    expect(result.comment_date_time instanceof moment).toBeTruthy();
-  });
 });
--- a/packages/core/admin/admin/src/pages/SettingsPage/pages/Roles/EditPage/tests/index.test.js
+++ b/packages/core/admin/admin/src/pages/SettingsPage/pages/Roles/EditPage/tests/index.test.js
@ -9,22 +9,12 @@ import { render } from '@testing-library/react';
 import { IntlProvider } from 'react-intl';
 import { Router, Switch, Route } from 'react-router-dom';
 import { createMemoryHistory } from 'history';
-import moment from 'moment';
 import { lightTheme, darkTheme } from '@strapi/design-system';
 import Theme from '../../../../../../components/Theme';
 import ThemeToggleProvider from '../../../../../../components/ThemeToggleProvider';

 import EditPage from '../index';

-jest.mock('moment', () => {
-  const mMoment = {
-    format: jest.fn().mockReturnThis(),
-    valueOf: jest.fn(),
-  };
-
-  return jest.fn(() => mMoment);
-});
-
 jest.mock('@strapi/helper-plugin', () => ({
  ...jest.requireActual('@strapi/helper-plugin'),
  useNotification: jest.fn(() => jest.fn()),
@ -55,9 +45,6 @@ const makeApp = history => (

 describe('<EditPage />', () => {
  it('renders and matches the snapshot', () => {
-    moment()
-      .format.mockReturnValueOnce('2021–01–30T12:34:56+00:00')
-      .mockReturnValueOnce('01–30-2021');
    const history = createMemoryHistory();
    const App = makeApp(history);
    const { container } = render(App);
--- a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Roles/CreatePage/index.js
+++ b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Roles/CreatePage/index.js
@ -1,5 +1,5 @@
 import React, { useRef, useState } from 'react';
-import moment from 'moment';
+import { format } from 'date-fns';
 import {
  CheckPagePermissions,
  Form,
@ -40,7 +40,7 @@ const UsersRoleNumber = styled.div`
  color: ${({ theme }) => theme.colors.primary600};
  border-radius: ${({ theme }) => theme.borderRadius};
  font-size: ${12 / 16}rem;
-  font-width: bold;
+  font-weight: bold;
 `;

 const CreatePage = () => {
@ -114,7 +114,7 @@ const CreatePage = () => {
  const defaultDescription = `${formatMessage({
    id: 'Settings.roles.form.created',
    defaultMessage: 'Created',
-  })} ${moment().format('LL')}`;
+  })} ${format(new Date(), 'PPP')}`;

  return (
    <Main>
--- a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Roles/CreatePage/tests/snapshots/index.test.js.snap
+++ b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Roles/CreatePage/tests/snapshots/index.test.js.snap
@ -774,7 +774,7 @@ exports[`<CreatePage /> renders and matches the snapshot 1`] = `
  color: #4945ff;
  border-radius: 4px;
  font-size: 0.75rem;
-  font-width: bold;
+  font-weight: bold;
 }

@media (max-width:68.75rem) {
@ -1008,7 +1008,7 @@ exports[`<CreatePage /> renders and matches the snapshot 1`] = `
                              id="textarea-1"
                              name="description"
                            >
-                              Created 2021–01–30T12:34:56+00:00
+                              Created April 1st, 2020
                            </textarea>
                          </div>
                        </div>
--- a/packages/core/admin/ee/admin/pages/SettingsPage/pages/Roles/CreatePage/tests/index.test.js
+++ b/packages/core/admin/ee/admin/pages/SettingsPage/pages/Roles/CreatePage/tests/index.test.js
@ -9,22 +9,12 @@ import { render } from '@testing-library/react';
 import { IntlProvider } from 'react-intl';
 import { Router, Switch, Route } from 'react-router-dom';
 import { createMemoryHistory } from 'history';
-import moment from 'moment';
 import { lightTheme, darkTheme } from '@strapi/design-system';
 import Theme from '../../../../../../../../admin/src/components/Theme';
 import ThemeToggleProvider from '../../../../../../../../admin/src/components/ThemeToggleProvider';

 import { CreatePage } from '../index';

-jest.mock('moment', () => {
-  const mMoment = {
-    format: jest.fn().mockReturnThis(),
-    valueOf: jest.fn(),
-  };
-
-  return jest.fn(() => mMoment);
-});
-
 jest.mock('@strapi/helper-plugin', () => ({
  ...jest.requireActual('@strapi/helper-plugin'),
  useNotification: jest.fn(() => jest.fn()),
@ -57,10 +47,16 @@ const makeApp = history => (
 );

 describe('<CreatePage />', () => {
+  beforeAll(() => {
+    jest.useFakeTimers('modern');
+    jest.setSystemTime(new Date(2020, 3, 1));
+  });
+
+  afterAll(() => {
+    jest.useRealTimers();
+  });
+
  it('renders and matches the snapshot', () => {
-    moment()
-      .format.mockReturnValueOnce('2021–01–30T12:34:56+00:00')
-      .mockReturnValueOnce('01–30-2021');
    const history = createMemoryHistory();
    const App = makeApp(history);
    const { container } = render(App);
--- a/packages/core/admin/package.json
+++ b/packages/core/admin/package.json
@ -97,7 +97,6 @@
    "markdown-it-sup": "1.0.0",
    "match-sorter": "^4.0.2",
    "mini-css-extract-plugin": "2.4.4",
-    "moment": "^2.29.4",
    "node-polyfill-webpack-plugin": "1.1.4",
    "p-map": "4.0.0",
    "passport-local": "1.0.0",
--- a/packages/core/admin/webpack.alias.js
+++ b/packages/core/admin/webpack.alias.js
@ -14,7 +14,6 @@ const aliasExactMatch = [
  'immer',
  'qs',
  'lodash',
-  'moment',
  'react',
  'react-copy-to-clipboard',
  'react-dnd',
--- a/packages/core/admin/webpack.config.js
+++ b/packages/core/admin/webpack.config.js
@ -38,10 +38,6 @@ module.exports = ({

  const webpackPlugins = isProduction
    ? [
-        new webpack.IgnorePlugin({
-          resourceRegExp: /^\.\/locale$/,
-          contextRegExp: /moment$/,
-        }),
        new MiniCssExtractPlugin({
          filename: '[name].[chunkhash].css',
          chunkFilename: '[name].[chunkhash].chunkhash.css',
--- a/packages/core/helper-plugin/package.json
+++ b/packages/core/helper-plugin/package.json
@ -49,7 +49,6 @@
    "invariant": "^2.2.1",
    "lodash": "4.17.21",
    "match-sorter": "^4.0.2",
-    "moment": "^2.29.4",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-helmet": "^6.1.0",
--- a/yarn.lock
+++ b/yarn.lock
@ -17055,7 +17055,7 @@ moment-timezone@^0.5.21:
  dependencies:
    moment ">= 2.9.0"

-"moment@>= 2.9.0", moment@^2.24.0, moment@^2.29.4:
+"moment@>= 2.9.0", moment@^2.24.0:
  version "2.29.4"
  resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.4.tgz#3dbe052889fe7c1b2ed966fcb3a77328964ef108"
  integrity sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==