From f500cbb17cb0954ea9fb138ca2a84b0ae789e363 Mon Sep 17 00:00:00 2001
From: PolariTOON <36267812+PolariTOON@users.noreply.github.com>
Date: Thu, 8 Dec 2022 15:50:35 +0100
Subject: [PATCH 1/3] feat: Update `date-fns` to 2.29.3
BREAKING CHANGE: This change expectations on arguments
passed to the `f` function returned by the `useI18n` hook.
The first one now should be a `Date` object instead of a string and
the second one now needs to conform to Unicode Technical Report 35.
---
package.json | 2 +-
react/BarContextProvider/index.spec.jsx | 2 +-
react/DateMonthPicker/index.jsx | 4 ++--
react/FilePicker/FilePickerBodyItem.jsx | 2 +-
react/I18n/format.jsx | 6 +++---
react/I18n/format.spec.jsx | 2 +-
react/I18n/index.spec.jsx | 2 +-
react/Viewer/helpers.js | 4 ++--
yarn.lock | 4 ++--
9 files changed, 14 insertions(+), 14 deletions(-)
diff --git a/package.json b/package.json
index 386c612e61..c4e6f39136 100644
--- a/package.json
+++ b/package.json
@@ -160,7 +160,7 @@
"chart.js": "3.7.1",
"classnames": "^2.2.5",
"cozy-interapp": "^0.5.4",
- "date-fns": "^1.28.5",
+ "date-fns": "^2.29.3",
"filesize": "8.0.7",
"hammerjs": "^2.0.8",
"intersection-observer": "0.11.0",
diff --git a/react/BarContextProvider/index.spec.jsx b/react/BarContextProvider/index.spec.jsx
index 82517d1694..e390a90093 100644
--- a/react/BarContextProvider/index.spec.jsx
+++ b/react/BarContextProvider/index.spec.jsx
@@ -22,7 +22,7 @@ const DumbHelloWorld = translate()(({ t, f, lang }) => (
@@ -94,7 +94,7 @@ const dateMonthProp = function(props, propName, componentName) {
'` supplied to' +
' `' +
componentName +
- '`. Should be in the form YYYY-MM.'
+ '`. Should be in the form yyyy-MM.'
)
}
}
diff --git a/react/FilePicker/FilePickerBodyItem.jsx b/react/FilePicker/FilePickerBodyItem.jsx
index 08c6d511c9..826f18049b 100644
--- a/react/FilePicker/FilePickerBodyItem.jsx
+++ b/react/FilePicker/FilePickerBodyItem.jsx
@@ -56,7 +56,7 @@ const FilePickerBodyItem = ({
const Input = multiple ? Checkbox : Radio
const listItemSecondaryContent = isFile(item)
- ? `${f(item.updated_at, 'DD MMM YYYY')} - ${filesize(item.size, {
+ ? `${f(item.updated_at, 'dd MMM yyyy')} - ${filesize(item.size, {
base: 10
})}`
: null
diff --git a/react/I18n/format.jsx b/react/I18n/format.jsx
index 6aafba1ad2..ac67179478 100644
--- a/react/I18n/format.jsx
+++ b/react/I18n/format.jsx
@@ -1,7 +1,7 @@
import format from 'date-fns/format'
import { DEFAULT_LANG } from '.'
-import formatDistanceToNow from 'date-fns/distance_in_words_to_now'
-import formatDistanceStrict from 'date-fns/distance_in_words_strict'
+import formatDistanceToNow from 'date-fns/formatDistanceToNow'
+import formatDistanceToNowStrict from 'date-fns/formatDistanceToNowStrict'
const locales = {}
let lang = DEFAULT_LANG
@@ -39,4 +39,4 @@ export const formatLocallyDistanceToNow = date =>
formatDistanceToNow(date, { locale: locales[lang] })
export const formatLocallyDistanceToNowStrict = date =>
- formatDistanceStrict(Date.now(), date, { locale: locales[lang] })
+ formatDistanceToNowStrict(date, { locale: locales[lang] })
diff --git a/react/I18n/format.spec.jsx b/react/I18n/format.spec.jsx
index dae8b9f31d..45c075cc28 100644
--- a/react/I18n/format.spec.jsx
+++ b/react/I18n/format.spec.jsx
@@ -64,7 +64,7 @@ describe('formatLocallyDistanceToNowStrict', () => {
const result = formatLocallyDistanceToNowStrict(date)
- expect(result).toEqual('44 minutes')
+ expect(result).toEqual('45 minutes')
})
it('should formatDistanceToNowStrict with high value', () => {
diff --git a/react/I18n/index.spec.jsx b/react/I18n/index.spec.jsx
index 4a2a7d2bbf..37d3793306 100644
--- a/react/I18n/index.spec.jsx
+++ b/react/I18n/index.spec.jsx
@@ -9,7 +9,7 @@ const DumbI18nHelloWorld = ({ t, f, lang }) => (
{t('helloworld')}
- {f('2020-01-06', 'DDD MMM')}
+ {f(new Date('2020-01-06'), 'd MMM')}
{lang}
diff --git a/react/Viewer/helpers.js b/react/Viewer/helpers.js
index 5257d93dd1..5dc0b68140 100644
--- a/react/Viewer/helpers.js
+++ b/react/Viewer/helpers.js
@@ -131,9 +131,9 @@ export const formatMetadataQualification = metadata => {
export const formatDate = ({ f, lang, date }) => {
if (lang === 'en') {
- return f(date, 'MM/DD/YYYY')
+ return f(new Date(date), 'MM/dd/yyyy')
}
- return f(date, 'DD/MM/YYYY')
+ return f(new Date(date), 'dd/MM/yyyy')
}
/**
diff --git a/yarn.lock b/yarn.lock
index 0edaf527b7..1307a08049 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6460,12 +6460,12 @@ data-urls@^2.0.0:
whatwg-mimetype "^2.3.0"
whatwg-url "^8.0.0"
-date-fns@2.29.3:
+date-fns@2.29.3, date-fns@^2.29.3:
version "2.29.3"
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.29.3.tgz#27402d2fc67eb442b511b70bbdf98e6411cd68a8"
integrity sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA==
-date-fns@^1.28.5, date-fns@^1.30.1:
+date-fns@^1.30.1:
version "1.30.1"
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-1.30.1.tgz#2e71bf0b119153dbb4cc4e88d9ea5acfb50dc05c"
integrity sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==
From 959617debe296ff9d83091bb4fa1c39e380c425f Mon Sep 17 00:00:00 2001
From: PolariTOON <36267812+PolariTOON@users.noreply.github.com>
Date: Thu, 8 Dec 2022 16:41:01 +0100
Subject: [PATCH 2/3] fix: Resolve `en` locale as `en-US`
`date-fns` does not export any `en` folder anymore, but apps
still rely on it via the `I18n` component.
We allow them to use either `en` or `en-US` as a locale identifier.
This should help consuming libs and apps to migrate.
---
react/I18n/format.jsx | 21 +++++++++++++--------
1 file changed, 13 insertions(+), 8 deletions(-)
diff --git a/react/I18n/format.jsx b/react/I18n/format.jsx
index ac67179478..49190da1d6 100644
--- a/react/I18n/format.jsx
+++ b/react/I18n/format.jsx
@@ -4,26 +4,31 @@ import formatDistanceToNow from 'date-fns/formatDistanceToNow'
import formatDistanceToNowStrict from 'date-fns/formatDistanceToNowStrict'
const locales = {}
-let lang = DEFAULT_LANG
+let lang = DEFAULT_LANG === 'en' ? 'en-US' : DEFAULT_LANG
const getWarningMessage = lang =>
`The "${lang}" locale isn't supported by date-fns. or has not been included in the build. Check if you have configured a ContextReplacementPlugin that is too restrictive.`
export const provideDateFnsLocale = (userLang, defaultLang = DEFAULT_LANG) => {
- lang = userLang
+ const resolvedDefaultLang = defaultLang === 'en' ? 'en-US' : defaultLang
+ const resolvedUserLang = userLang === 'en' ? 'en-US' : userLang
try {
- locales[defaultLang] = require(`date-fns/locale/${defaultLang}/index.js`)
+ locales[
+ resolvedDefaultLang
+ ] = require(`date-fns/locale/${resolvedDefaultLang}/index.js`)
} catch (err) {
- console.warn(getWarningMessage(defaultLang))
+ console.warn(getWarningMessage(resolvedDefaultLang))
}
-
- if (lang && lang !== defaultLang) {
+ if (resolvedUserLang && resolvedUserLang !== resolvedDefaultLang) {
try {
- locales[lang] = require(`date-fns/locale/${lang}/index.js`)
+ locales[
+ resolvedUserLang
+ ] = require(`date-fns/locale/${resolvedUserLang}/index.js`)
} catch (e) {
- console.warn(getWarningMessage(lang))
+ console.warn(getWarningMessage(resolvedUserLang))
}
}
+ lang = resolvedUserLang
return locales[lang]
}
From 0abfcc7fbc58f9196de55d4fae29349d4d75e3ad Mon Sep 17 00:00:00 2001
From: PolariTOON <36267812+PolariTOON@users.noreply.github.com>
Date: Tue, 13 Dec 2022 10:15:56 +0100
Subject: [PATCH 3/3] fix: Accept any type of date in the `f` function
`date-fns` functions do not accept dates formatted as strings anymore, but only date objects.
We make it so the `f` function returned by the `useI18n` hook still accepts other types of values, strings in particular.
This should help consuming libs and apps to migrate.
---
react/I18n/format.jsx | 15 ++++++++++-----
1 file changed, 10 insertions(+), 5 deletions(-)
diff --git a/react/I18n/format.jsx b/react/I18n/format.jsx
index 49190da1d6..a1e67ba330 100644
--- a/react/I18n/format.jsx
+++ b/react/I18n/format.jsx
@@ -36,12 +36,17 @@ export const initFormat = (userLang, defaultLang = DEFAULT_LANG) => (
date,
formatStr
) => {
+ const dateObject = new Date(date)
const locale = provideDateFnsLocale(userLang, defaultLang)
- return format(date, formatStr, { locale })
+ return format(dateObject, formatStr, { locale })
}
-export const formatLocallyDistanceToNow = date =>
- formatDistanceToNow(date, { locale: locales[lang] })
+export const formatLocallyDistanceToNow = date => {
+ const dateObject = new Date(date)
+ return formatDistanceToNow(dateObject, { locale: locales[lang] })
+}
-export const formatLocallyDistanceToNowStrict = date =>
- formatDistanceToNowStrict(date, { locale: locales[lang] })
+export const formatLocallyDistanceToNowStrict = date => {
+ const dateObject = new Date(date)
+ return formatDistanceToNowStrict(dateObject, { locale: locales[lang] })
+}