From 20e296cb9bc4505d430da5b6e9840858273163bd Mon Sep 17 00:00:00 2001 From: Philip Molares Date: Fri, 2 Oct 2020 14:00:29 +0200 Subject: [PATCH] replaces moment with luxon (#621) --- package.json | 3 +- .../application-loader/initializers/i18n.ts | 31 ++----------------- .../document-info/document-info-button.tsx | 6 ++-- .../document-info/document-info-time-line.tsx | 4 +-- .../document-info/time-from-now.tsx | 7 +++-- .../revisions/revision-modal-list-entry.tsx | 4 +-- .../autocompletion/link-and-extra-tag.ts | 4 +-- .../history-card/history-card.tsx | 4 +-- src/components/history-page/history-page.tsx | 2 +- src/components/history-page/utils.ts | 8 ++--- .../landing-layout/footer/language-picker.tsx | 4 +-- yarn.lock | 15 ++++++--- 12 files changed, 36 insertions(+), 56 deletions(-) diff --git a/package.json b/package.json index 9ba806657..cf954c874 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "@types/highlight.js": "9.12.4", "@types/jest": "26.0.14", "@types/js-yaml": "3.12.5", + "@types/luxon": "1.25.0", "@types/markdown-it": "10.0.2", "@types/markdown-it-anchor": "4.0.4", "@types/markdown-it-container": "2.0.3", @@ -58,6 +59,7 @@ "i18next-http-backend": "1.0.21", "js-yaml": "3.14.0", "katex": "0.12.0", + "luxon": "1.25.0", "markdown-it": "11.0.1", "markdown-it-abbr": "1.0.4", "markdown-it-anchor": "5.3.0", @@ -78,7 +80,6 @@ "markdown-it-toc-done-right": "4.1.0", "markmap-lib": "0.8.1", "mermaid": "8.8.0", - "moment": "2.29.0", "node-sass": "4.14.1", "react": "16.13.1", "react-bootstrap": "1.3.0", diff --git a/src/components/application-loader/initializers/i18n.ts b/src/components/application-loader/initializers/i18n.ts index 2e7df0dde..40488ea6d 100644 --- a/src/components/application-loader/initializers/i18n.ts +++ b/src/components/application-loader/initializers/i18n.ts @@ -1,34 +1,7 @@ import i18n from 'i18next' import LanguageDetector from 'i18next-browser-languagedetector' import Backend from 'i18next-http-backend' -import moment from 'moment' -import 'moment/locale/ar' -import 'moment/locale/ca' -import 'moment/locale/cs' -import 'moment/locale/da' -import 'moment/locale/de' -import 'moment/locale/el' -import 'moment/locale/eo' -import 'moment/locale/es' -import 'moment/locale/fr' -import 'moment/locale/hi' -import 'moment/locale/hr' -import 'moment/locale/id' -import 'moment/locale/it' -import 'moment/locale/ja' -import 'moment/locale/ko' -import 'moment/locale/nl' -import 'moment/locale/pl' -import 'moment/locale/pt' -import 'moment/locale/ru' -import 'moment/locale/sk' -import 'moment/locale/sr' -import 'moment/locale/sv' -import 'moment/locale/tr' -import 'moment/locale/uk' -import 'moment/locale/vi' -import 'moment/locale/zh-cn' -import 'moment/locale/zh-tw' +import { Settings } from 'luxon' import { initReactI18next } from 'react-i18next' export const setUpI18n = async (): Promise => { @@ -48,5 +21,5 @@ export const setUpI18n = async (): Promise => { } }) - moment.locale(i18n.language) + Settings.defaultLocale = i18n.language } diff --git a/src/components/editor/document-bar/document-info/document-info-button.tsx b/src/components/editor/document-bar/document-info/document-info-button.tsx index 0c5132d6f..f7a584acf 100644 --- a/src/components/editor/document-bar/document-info/document-info-button.tsx +++ b/src/components/editor/document-bar/document-info/document-info-button.tsx @@ -1,5 +1,5 @@ -import moment from 'moment' import React, { Fragment, useState } from 'react' +import { DateTime } from 'luxon' import { ListGroup, Modal } from 'react-bootstrap' import { Trans, useTranslation } from 'react-i18next' import { CommonModal } from '../../../common/modals/common-modal' @@ -25,14 +25,14 @@ export const DocumentInfoButton: React.FC = () => { diff --git a/src/components/editor/document-bar/document-info/document-info-time-line.tsx b/src/components/editor/document-bar/document-info/document-info-time-line.tsx index d3da4e46b..081abdb84 100644 --- a/src/components/editor/document-bar/document-info/document-info-time-line.tsx +++ b/src/components/editor/document-bar/document-info/document-info-time-line.tsx @@ -1,4 +1,4 @@ -import { Moment } from 'moment' +import { DateTime } from 'luxon' import React from 'react' import { Trans, useTranslation } from 'react-i18next' import { IconName } from '../../../common/fork-awesome/types' @@ -8,7 +8,7 @@ import { TimeFromNow } from './time-from-now' import { UserAvatar } from '../../../common/user-avatar/user-avatar' export interface DocumentInfoLineWithTimeProps { - time: Moment, + time: DateTime, mode: DocumentInfoLineWithTimeMode userName: string profileImageSrc: string diff --git a/src/components/editor/document-bar/document-info/time-from-now.tsx b/src/components/editor/document-bar/document-info/time-from-now.tsx index fef7e334e..09cb63a34 100644 --- a/src/components/editor/document-bar/document-info/time-from-now.tsx +++ b/src/components/editor/document-bar/document-info/time-from-now.tsx @@ -1,12 +1,13 @@ -import { Moment } from 'moment' +import { DateTime } from 'luxon' + import React from 'react' export interface TimeFromNowProps { - time: Moment + time: DateTime } export const TimeFromNow: React.FC = ({ time }) => { return ( - + ) } diff --git a/src/components/editor/document-bar/revisions/revision-modal-list-entry.tsx b/src/components/editor/document-bar/revisions/revision-modal-list-entry.tsx index ddc540704..918363e36 100644 --- a/src/components/editor/document-bar/revisions/revision-modal-list-entry.tsx +++ b/src/components/editor/document-bar/revisions/revision-modal-list-entry.tsx @@ -1,5 +1,5 @@ -import moment from 'moment' import React from 'react' +import { DateTime } from 'luxon' import { ListGroup } from 'react-bootstrap' import { Trans } from 'react-i18next' import { RevisionListEntry } from '../../../../api/revisions/types' @@ -23,7 +23,7 @@ export const RevisionModalListEntry: React.FC = ({ > - {moment(revision.timestamp * 1000).format('LLLL')} + {DateTime.fromMillis(revision.timestamp * 1000).toFormat('DDDD T')} diff --git a/src/components/editor/editor-pane/autocompletion/link-and-extra-tag.ts b/src/components/editor/editor-pane/autocompletion/link-and-extra-tag.ts index e516fb2bd..1d67df4dd 100644 --- a/src/components/editor/editor-pane/autocompletion/link-and-extra-tag.ts +++ b/src/components/editor/editor-pane/autocompletion/link-and-extra-tag.ts @@ -1,5 +1,5 @@ import { Editor, Hint, Hints, Pos } from 'codemirror' -import moment from 'moment' +import { DateTime } from 'luxon' import { getUser } from '../../../../redux/user/methods' import { findWordAtCursor, Hinter } from './index' @@ -45,7 +45,7 @@ const linkAndExtraTagHint = (editor: Editor): Promise< Hints| null > => { case 'time': // show the current time when the autocompletion is opened and not when the function is loaded return { - text: `[time=${moment(new Date()).format('llll')}]` + text: `[time=${DateTime.local().toFormat('DDDD T')}]` } default: return { diff --git a/src/components/history-page/history-card/history-card.tsx b/src/components/history-page/history-card/history-card.tsx index 38c3376f7..c139469d2 100644 --- a/src/components/history-page/history-card/history-card.tsx +++ b/src/components/history-page/history-card/history-card.tsx @@ -1,5 +1,5 @@ -import moment from 'moment' import React from 'react' +import { DateTime } from 'luxon' import { Badge, Card } from 'react-bootstrap' import { Link } from 'react-router-dom' import { formatHistoryDate } from '../utils' @@ -22,7 +22,7 @@ export const HistoryCard: React.FC = ({ entry, onPinClick, on {entry.title}
- {moment(entry.lastVisited).fromNow()}
+ {DateTime.fromISO(entry.lastVisited).toRelative()}
{formatHistoryDate(entry.lastVisited)}
diff --git a/src/components/history-page/history-page.tsx b/src/components/history-page/history-page.tsx index 07f90b243..1d31972aa 100644 --- a/src/components/history-page/history-page.tsx +++ b/src/components/history-page/history-page.tsx @@ -21,7 +21,7 @@ import { HistoryToolbar, HistoryToolbarState, initState as toolbarInitState } fr export interface HistoryEntry { id: string, title: string, - lastVisited: Date, + lastVisited: string, tags: string[], pinned: boolean } diff --git a/src/components/history-page/utils.ts b/src/components/history-page/utils.ts index 14a8f7f25..7e09724ec 100644 --- a/src/components/history-page/utils.ts +++ b/src/components/history-page/utils.ts @@ -1,4 +1,4 @@ -import moment from 'moment' +import { DateTime } from 'luxon' import { SortModeEnum } from './sort-button/sort-button' import { HistoryEntry, @@ -85,8 +85,8 @@ function sortEntries (entries: LocatedHistoryEntry[], viewState: HistoryToolbarS }) } -export function formatHistoryDate (date: Date): string { - return moment(date).format('llll') +export function formatHistoryDate (date: string): string { + return DateTime.fromISO(date).toFormat('DDDD T') } export interface V1HistoryEntry { @@ -102,7 +102,7 @@ export function convertV1History (oldHistory: V1HistoryEntry[]): HistoryEntry[] return { id: entry.id, title: entry.text, - lastVisited: moment(entry.time).toDate(), + lastVisited: DateTime.fromMillis(entry.time).toISO(), tags: entry.tags, pinned: entry.pinned } diff --git a/src/components/landing-layout/footer/language-picker.tsx b/src/components/landing-layout/footer/language-picker.tsx index af8fedf09..01a761ce2 100644 --- a/src/components/landing-layout/footer/language-picker.tsx +++ b/src/components/landing-layout/footer/language-picker.tsx @@ -1,4 +1,4 @@ -import moment from 'moment' +import { Settings } from 'luxon' import React, { useCallback } from 'react' import { Form } from 'react-bootstrap' import { useTranslation } from 'react-i18next' @@ -47,7 +47,7 @@ const LanguagePicker: React.FC = () => { const onChangeLang = useCallback(() => async (event: React.ChangeEvent) => { const language = event.currentTarget.value - moment.locale(language) + Settings.defaultLocale = language await i18n.changeLanguage(language) }, [i18n]) diff --git a/yarn.lock b/yarn.lock index cce6985fb..c2af0b4bb 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2169,6 +2169,11 @@ resolved "https://registry.yarnpkg.com/@types/linkify-it/-/linkify-it-2.1.0.tgz#ea3dd64c4805597311790b61e872cbd1ed2cd806" integrity sha512-Q7DYAOi9O/+cLLhdaSvKdaumWyHbm7HAk/bFwwyTuU0arR5yyCeW5GOoqt4tJTpDRxhpx9Q8kQL6vMpuw9hDSw== +"@types/luxon@1.25.0": + version "1.25.0" + resolved "https://registry.yarnpkg.com/@types/luxon/-/luxon-1.25.0.tgz#3d6fe591fac874f48dd225cb5660b2b785a21a05" + integrity sha512-iIJp2CP6C32gVqI08HIYnzqj55tlLnodIBMCcMf28q9ckqMfMzocCmIzd9JWI/ALLPMUiTkCu1JGv3FFtu6t3g== + "@types/markdown-it-anchor@4.0.4": version "4.0.4" resolved "https://registry.yarnpkg.com/@types/markdown-it-anchor/-/markdown-it-anchor-4.0.4.tgz#f36b67608d238d15024fb6508efd7ad3990209f6" @@ -9209,6 +9214,11 @@ lru-cache@^6.0.0: dependencies: yallist "^4.0.0" +luxon@1.25.0: + version "1.25.0" + resolved "https://registry.yarnpkg.com/luxon/-/luxon-1.25.0.tgz#d86219e90bc0102c0eb299d65b2f5e95efe1fe72" + integrity sha512-hEgLurSH8kQRjY6i4YLey+mcKVAWXbDNlZRmM6AgWDJ1cY3atl8Ztf5wEY7VBReFbmGnwQPz7KYJblL8B2k0jQ== + make-dir@^2.0.0, make-dir@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-2.1.0.tgz#5f0310e18b8be898cc07009295a30ae41e91e6f5" @@ -9696,11 +9706,6 @@ moment-mini@^2.22.1: resolved "https://registry.yarnpkg.com/moment-mini/-/moment-mini-2.24.0.tgz#fa68d98f7fe93ae65bf1262f6abb5fb6983d8d18" integrity sha512-9ARkWHBs+6YJIvrIp0Ik5tyTTtP9PoV0Ssu2Ocq5y9v8+NOOpWiRshAp8c4rZVWTOe+157on/5G+zj5pwIQFEQ== -moment@2.29.0: - version "2.29.0" - resolved "https://registry.yarnpkg.com/moment/-/moment-2.29.0.tgz#fcbef955844d91deb55438613ddcec56e86a3425" - integrity sha512-z6IJ5HXYiuxvFTI6eiQ9dm77uE0gyy1yXNApVHqTcnIKfY9tIwEjlzsZ6u1LQXvVgKeTnv9Xm7NDvJ7lso3MtA== - moment@^2.27.0: version "2.28.0" resolved "https://registry.yarnpkg.com/moment/-/moment-2.28.0.tgz#cdfe73ce01327cee6537b0fafac2e0f21a237d75"