From b3febe49adcb02dfca1cf6e5574e6194af3688f9 Mon Sep 17 00:00:00 2001 From: Bill Thornton Date: Thu, 3 Nov 2022 00:52:12 -0400 Subject: [PATCH 1/3] Optimize loading of date-fns --- src/components/activitylog.js | 6 +- src/scripts/dfnshelper.js | 147 ++++++++++++++++++---------------- src/scripts/globalize.js | 3 + webpack.common.js | 15 ++++ 4 files changed, 97 insertions(+), 74 deletions(-) diff --git a/src/components/activitylog.js b/src/components/activitylog.js index 7054726266..4062b7ca1b 100644 --- a/src/components/activitylog.js +++ b/src/components/activitylog.js @@ -2,8 +2,8 @@ import escapeHtml from 'escape-html'; import Events from '../utils/events.ts'; import globalize from '../scripts/globalize'; import dom from '../scripts/dom'; -import * as datefns from 'date-fns'; -import dfnshelper from '../scripts/dfnshelper'; +import { formatRelative } from 'date-fns'; +import { getLocale } from '../scripts/dfnshelper'; import serverNotifications from '../scripts/serverNotifications'; import '../elements/emby-button/emby-button'; import './listview/listview.scss'; @@ -38,7 +38,7 @@ import { toBoolean } from '../utils/string.ts'; html += escapeHtml(entry.Name); html += ''; html += '
'; - html += datefns.formatRelative(Date.parse(entry.Date), Date.parse(new Date()), { locale: dfnshelper.getLocale() }); + html += formatRelative(Date.parse(entry.Date), Date.now(), { locale: getLocale() }); html += '
'; html += '
'; html += escapeHtml(entry.ShortOverview || ''); diff --git a/src/scripts/dfnshelper.js b/src/scripts/dfnshelper.js index 8e3a2516e0..8b9a0d4cd5 100644 --- a/src/scripts/dfnshelper.js +++ b/src/scripts/dfnshelper.js @@ -1,81 +1,86 @@ -import { af, arDZ, be, bg, bn, ca, cs, cy, da, de, el, enGB, enUS, eo, es, et, eu, faIR, fi, fr, frCA, gl, he, hi, hr, hu, id, is, it, ja, kk, ko, lt, lv, ms, nb, - nl, nn, pl, ptBR, pt, ro, ru, sk, sl, sv, ta, th, tr, uk, vi, zhCN, zhTW } from 'date-fns/locale'; -import globalize from './globalize'; +import enUS from 'date-fns/locale/en-US'; -const dateLocales = (locale) => ({ - 'af': af, - 'ar': arDZ, - 'be-by': be, - 'bg-bg': bg, - 'bn': bn, - 'ca': ca, - 'cs': cs, - 'cy': cy, - 'da': da, - 'de': de, - 'el': el, - 'en-gb': enGB, - 'en-us': enUS, - 'eo': eo, - 'es': es, - 'es-ar': es, - 'es-do': es, - 'es-mx': es, - 'et': et, - 'eu': eu, - 'fa': faIR, - 'fi': fi, - 'fr': fr, - 'fr-ca': frCA, - 'gl': gl, - 'gsw': de, - 'he': he, - 'hi-in': hi, - 'hr': hr, - 'hu': hu, - 'id': id, - 'is': is, - 'it': it, - 'ja': ja, - 'kk': kk, - 'ko': ko, - 'lt-lt': lt, - 'lv': lv, - 'ms': ms, - 'nb': nb, - 'nl': nl, - 'nn': nn, - 'pl': pl, - 'pt': pt, - 'pt-br': ptBR, - 'pt-pt': pt, - 'ro': ro, - 'ru': ru, - 'sk': sk, - 'sl-si': sl, - 'sv': sv, - 'ta': ta, - 'th': th, - 'tr': tr, - 'uk': uk, - 'vi': vi, - 'zh-cn': zhCN, - 'zh-hk': zhCN, - 'zh-tw': zhTW -})[locale]; +const LOCALE_MAP = { + 'af': 'af', + 'ar': 'ar-DZ', + 'be-by': 'be', + 'bg-bg': 'bg', + 'bn': 'bn', + 'ca': 'ca', + 'cs': 'cs', + 'cy': 'cy', + 'da': 'da', + 'de': 'de', + 'el': 'el', + 'en-gb': 'en-GB', + 'en-us': 'en-US', + 'eo': 'eo', + 'es': 'es', + 'es-ar': 'es', + 'es-do': 'es', + 'es-mx': 'es', + 'et': 'et', + 'eu': 'eu', + 'fa': 'fa-IR', + 'fi': 'fi', + 'fr': 'fr', + 'fr-ca': 'fr-CA', + 'gl': 'gl', + 'gsw': 'de', + 'he': 'he', + 'hi-in': 'hi', + 'hr': 'hr', + 'hu': 'hu', + 'id': 'id', + 'is': 'is', + 'it': 'it', + 'ja': 'ja', + 'kk': 'kk', + 'ko': 'ko', + 'lt-lt': 'lt', + 'lv': 'lv', + 'ms': 'ms', + 'nb': 'nb', + 'nl': 'nl', + 'nn': 'nn', + 'pl': 'pl', + 'pt': 'pt', + 'pt-br': 'pt-BR', + 'pt-pt': 'pt', + 'ro': 'ro', + 'ru': 'ru', + 'sk': 'sk', + 'sl-si': 'sl', + 'sv': 'sv', + 'ta': 'ta', + 'th': 'th', + 'tr': 'tr', + 'uk': 'uk', + 'vi': 'vi', + 'zh-cn': 'zh-CN', + 'zh-hk': 'zh-HK', + 'zh-tw': 'zh-TW' +}; + +const DEFAULT_LOCALE = 'en-US'; + +let localeString = DEFAULT_LOCALE; +let locale = enUS; + +export async function updateLocale(newLocale) { + console.debug('[dfnshelper] updating date-fns locale', newLocale); + localeString = LOCALE_MAP[newLocale] || LOCALE_MAP[newLocale.replace(/-.*/, '')] || DEFAULT_LOCALE; + console.debug('[dfnshelper] mapped to date-fns locale', localeString); + locale = await import(`date-fns/locale/${localeString}/index.js`); +} export function getLocale() { - return dateLocales(globalize.getCurrentLocale()) || dateLocales(globalize.getCurrentLocale().replace(/-.*/, '')) || enUS; + return locale; } export function getLocaleWithSuffix() { return { addSuffix: true, - locale: getLocale() + locale }; } - -export default { - getLocale: getLocale, - getLocaleWithSuffix -}; diff --git a/src/scripts/globalize.js b/src/scripts/globalize.js index 0cc5523438..7ef28a2789 100644 --- a/src/scripts/globalize.js +++ b/src/scripts/globalize.js @@ -2,6 +2,7 @@ import isEmpty from 'lodash-es/isEmpty'; import { currentSettings as userSettings } from './settings/userSettings'; import Events from '../utils/events.ts'; +import { updateLocale } from './dfnshelper'; const Direction = { rtl: 'rtl', @@ -100,6 +101,8 @@ const Direction = { } else { currentDateTimeCulture = currentCulture; } + updateLocale(currentDateTimeCulture); + ensureTranslations(currentCulture); } diff --git a/webpack.common.js b/webpack.common.js index e820878021..142d1bcec1 100644 --- a/webpack.common.js +++ b/webpack.common.js @@ -113,6 +113,21 @@ const config = { return `node_modules.${parts[0]}.${parts[1]}`; } + if (packageName === 'date-fns') { + const parts = module.context + .substring(module.context.lastIndexOf(packageName)) + .split(/[\\/]/); + + let name = `node_modules.${parts[0]}`; + if (parts[1]) { + name += `.${parts[1]}`; + } + if (parts[1] === 'locale') { + name += `.${parts[2]}`; + } + return name; + } + return `node_modules.${packageName}`; } } From 1473a793e5e459c6465d9722eaa5aa5fe22c76b6 Mon Sep 17 00:00:00 2001 From: Bill Thornton Date: Thu, 3 Nov 2022 01:04:35 -0400 Subject: [PATCH 2/3] Rename and convert dfnshelper to typescript --- src/components/activitylog.js | 2 +- src/components/dashboard/users/UserCardBox.tsx | 2 +- src/controllers/dashboard/dashboard.js | 2 +- src/controllers/dashboard/devices/devices.js | 2 +- .../dashboard/scheduledtasks/scheduledtasks.js | 2 +- src/scripts/globalize.js | 2 +- src/{scripts/dfnshelper.js => utils/dateFnsLocale.ts} | 8 ++++---- 7 files changed, 10 insertions(+), 10 deletions(-) rename src/{scripts/dfnshelper.js => utils/dateFnsLocale.ts} (85%) diff --git a/src/components/activitylog.js b/src/components/activitylog.js index 4062b7ca1b..82f58e1879 100644 --- a/src/components/activitylog.js +++ b/src/components/activitylog.js @@ -3,12 +3,12 @@ import Events from '../utils/events.ts'; import globalize from '../scripts/globalize'; import dom from '../scripts/dom'; import { formatRelative } from 'date-fns'; -import { getLocale } from '../scripts/dfnshelper'; import serverNotifications from '../scripts/serverNotifications'; import '../elements/emby-button/emby-button'; import './listview/listview.scss'; import ServerConnections from './ServerConnections'; import alert from './alert'; +import { getLocale } from '../utils/dateFnsLocale.ts'; import { toBoolean } from '../utils/string.ts'; /* eslint-disable indent */ diff --git a/src/components/dashboard/users/UserCardBox.tsx b/src/components/dashboard/users/UserCardBox.tsx index 05379be5bc..d6940c5d1c 100644 --- a/src/components/dashboard/users/UserCardBox.tsx +++ b/src/components/dashboard/users/UserCardBox.tsx @@ -1,7 +1,7 @@ import type { UserDto } from '@jellyfin/sdk/lib/generated-client'; import React, { FunctionComponent } from 'react'; import { formatDistanceToNow } from 'date-fns'; -import { getLocaleWithSuffix } from '../../../scripts/dfnshelper'; +import { getLocaleWithSuffix } from '../../../utils/dateFnsLocale'; import globalize from '../../../scripts/globalize'; import cardBuilder from '../../cardbuilder/cardBuilder'; import IconButtonElement from '../../../elements/IconButtonElement'; diff --git a/src/controllers/dashboard/dashboard.js b/src/controllers/dashboard/dashboard.js index f2c042b07c..b80ff8abc3 100644 --- a/src/controllers/dashboard/dashboard.js +++ b/src/controllers/dashboard/dashboard.js @@ -6,7 +6,7 @@ import serverNotifications from '../../scripts/serverNotifications'; import dom from '../../scripts/dom'; import globalize from '../../scripts/globalize'; import { formatDistanceToNow } from 'date-fns'; -import { getLocaleWithSuffix } from '../../scripts/dfnshelper'; +import { getLocaleWithSuffix } from '../../utils/dateFnsLocale.ts'; import loading from '../../components/loading/loading'; import playMethodHelper from '../../components/playback/playmethodhelper'; import cardBuilder from '../../components/cardbuilder/cardBuilder'; diff --git a/src/controllers/dashboard/devices/devices.js b/src/controllers/dashboard/devices/devices.js index d3644da467..3c3a039745 100644 --- a/src/controllers/dashboard/devices/devices.js +++ b/src/controllers/dashboard/devices/devices.js @@ -5,7 +5,7 @@ import dom from '../../../scripts/dom'; import globalize from '../../../scripts/globalize'; import imageHelper from '../../../scripts/imagehelper'; import { formatDistanceToNow } from 'date-fns'; -import { getLocaleWithSuffix } from '../../../scripts/dfnshelper'; +import { getLocaleWithSuffix } from '../../../utils/dateFnsLocale.ts'; import '../../../elements/emby-button/emby-button'; import '../../../elements/emby-itemscontainer/emby-itemscontainer'; import '../../../components/cardbuilder/card.scss'; diff --git a/src/controllers/dashboard/scheduledtasks/scheduledtasks.js b/src/controllers/dashboard/scheduledtasks/scheduledtasks.js index d36f330cca..0c8f0dca37 100644 --- a/src/controllers/dashboard/scheduledtasks/scheduledtasks.js +++ b/src/controllers/dashboard/scheduledtasks/scheduledtasks.js @@ -3,7 +3,7 @@ import loading from '../../../components/loading/loading'; import globalize from '../../../scripts/globalize'; import serverNotifications from '../../../scripts/serverNotifications'; import { formatDistance, formatDistanceToNow } from 'date-fns'; -import { getLocale, getLocaleWithSuffix } from '../../../scripts/dfnshelper'; +import { getLocale, getLocaleWithSuffix } from '../../../utils/dateFnsLocale.ts'; import Events from '../../../utils/events.ts'; import '../../../components/listview/listview.scss'; diff --git a/src/scripts/globalize.js b/src/scripts/globalize.js index 7ef28a2789..d95da559c6 100644 --- a/src/scripts/globalize.js +++ b/src/scripts/globalize.js @@ -2,7 +2,7 @@ import isEmpty from 'lodash-es/isEmpty'; import { currentSettings as userSettings } from './settings/userSettings'; import Events from '../utils/events.ts'; -import { updateLocale } from './dfnshelper'; +import { updateLocale } from '../utils/dateFnsLocale.ts'; const Direction = { rtl: 'rtl', diff --git a/src/scripts/dfnshelper.js b/src/utils/dateFnsLocale.ts similarity index 85% rename from src/scripts/dfnshelper.js rename to src/utils/dateFnsLocale.ts index 8b9a0d4cd5..425ac7b25c 100644 --- a/src/scripts/dfnshelper.js +++ b/src/utils/dateFnsLocale.ts @@ -1,6 +1,6 @@ import enUS from 'date-fns/locale/en-US'; -const LOCALE_MAP = { +const LOCALE_MAP: Record = { 'af': 'af', 'ar': 'ar-DZ', 'be-by': 'be', @@ -67,10 +67,10 @@ const DEFAULT_LOCALE = 'en-US'; let localeString = DEFAULT_LOCALE; let locale = enUS; -export async function updateLocale(newLocale) { - console.debug('[dfnshelper] updating date-fns locale', newLocale); +export async function updateLocale(newLocale: string) { + console.debug('[dateFnsLocale] updating date-fns locale', newLocale); localeString = LOCALE_MAP[newLocale] || LOCALE_MAP[newLocale.replace(/-.*/, '')] || DEFAULT_LOCALE; - console.debug('[dfnshelper] mapped to date-fns locale', localeString); + console.debug('[dateFnsLocale] mapped to date-fns locale', localeString); locale = await import(`date-fns/locale/${localeString}/index.js`); } From 968bfb52fbfb5206813d3447c8347b1a0e1ad31f Mon Sep 17 00:00:00 2001 From: Bill Thornton Date: Fri, 4 Nov 2022 02:24:30 -0400 Subject: [PATCH 3/3] Remove dfnshelper global for eslint --- .eslintrc.js | 1 - webpack.common.js | 8 +++++--- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 42afb79449..10366dc746 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -224,7 +224,6 @@ module.exports = { 'Emby': 'readonly', 'Globalize': 'writable', 'Hls': 'writable', - 'dfnshelper': 'writable', 'LibraryMenu': 'writable', 'LinkParser': 'writable', 'LiveTvHelpers': 'writable', diff --git a/webpack.common.js b/webpack.common.js index 142d1bcec1..4c15134b52 100644 --- a/webpack.common.js +++ b/webpack.common.js @@ -121,10 +121,12 @@ const config = { let name = `node_modules.${parts[0]}`; if (parts[1]) { name += `.${parts[1]}`; + + if (parts[1] === 'locale' && parts[2]) { + name += `.${parts[2]}`; + } } - if (parts[1] === 'locale') { - name += `.${parts[2]}`; - } + return name; }