refactor: drop moment from new bundles

On the Vue 3 side lets remove the dependency on Moment as this is a
pretty huge dependency. Instead use something tiny like dayjs for
date computation (end of week / end of day) and use plain Intl API for
formatting.

This reduces the bundle size by ~1.5MiB.

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>

Author: susnux

apps/files_versions/src/components/VersionEntry.vue

@@ -139,8 +139,7 @@ import type { Version } from '../utils/versions.ts'
 import { getCurrentUser } from '@nextcloud/auth'
 import { formatFileSize, Permission } from '@nextcloud/files'
 import { loadState } from '@nextcloud/initial-state'
-import { t } from '@nextcloud/l10n'
-import moment from '@nextcloud/moment'
+import { getCanonicalLocale, t } from '@nextcloud/l10n'
 import { getRootUrl } from '@nextcloud/router'
 import { computed, nextTick, ref } from 'vue'
 import NcActionButton from '@nextcloud/vue/components/NcActionButton'
@@ -233,7 +232,13 @@ const versionAuthor = computed(() => {
 })
 
 const versionHumanExplicitDate = computed(() => {
-	return moment(props.version.mtime).format('LLLL')
+	return new Date(props.version.mtime).toLocaleString(
+		[getCanonicalLocale(), getCanonicalLocale().split('-')[0]!],
+		{
+			timeStyle: 'long',
+			dateStyle: 'long',
+		},
+	)
 })
 
 const downloadURL = computed(() => {

apps/files_versions/src/utils/versions.ts

@@ -9,7 +9,7 @@ import type { FileStat, ResponseDataDetailed } from 'webdav'
 import { getCurrentUser } from '@nextcloud/auth'
 import axios from '@nextcloud/axios'
 import { getClient } from '@nextcloud/files/dav'
-import moment from '@nextcloud/moment'
+import { getCanonicalLocale } from '@nextcloud/l10n'
 import { encodePath, join } from '@nextcloud/paths'
 import { generateRemoteUrl, generateUrl } from '@nextcloud/router'
 import davRequest from '../utils/davRequest.ts'
@@ -97,7 +97,7 @@ export async function restoreVersion(version: Version) {
  * @param node - The original node
  */
 function formatVersion(version: Required<FileStat>, node: INode): Version {
-	const mtime = moment(version.lastmod).unix() * 1000
+	const mtime = Date.parse(version.lastmod)
 	let previewUrl = ''
 
 	if (mtime === node.mtime?.getTime()) { // Version is the current one
@@ -119,7 +119,13 @@ function formatVersion(version: Required<FileStat>, node: INode): Version {
 		author: version.props['version-author'] ? String(version.props['version-author']) : null,
 		authorName: null,
 		filename: version.filename,
-		basename: moment(mtime).format('LLL'),
+		basename: new Date(mtime).toLocaleString(
+			[getCanonicalLocale(), getCanonicalLocale().split('-')[0]!],
+			{
+				timeStyle: 'long',
+				dateStyle: 'medium',
+			},
+		),
 		mime: version.mime,
 		etag: `${version.props.getetag}`,
 		size: version.size,

apps/user_status/src/services/clearAtService.js

@@ -3,9 +3,9 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
-import { t } from '@nextcloud/l10n'
-import moment from '@nextcloud/moment'
+import { formatRelativeTime, t } from '@nextcloud/l10n'
 import { dateFactory } from './dateService.js'
+import dayjs from 'dayjs'
 
 /**
  * Calculates the actual clearAt timestamp
@@ -18,6 +18,8 @@ function getTimestampForClearAt(clearAt) {
 		return null
 	}
 
+	const formatter = new Intl.DateTimeFormat()
+	formatter.formatRange(new Date(), )
 	const date = dateFactory()
 
 	if (clearAt.type === 'period') {
@@ -28,7 +30,7 @@ function getTimestampForClearAt(clearAt) {
 		switch (clearAt.time) {
 			case 'day':
 			case 'week':
-				return Number(moment(date).endOf(clearAt.time).format('X'))
+				dayjs(date).endOf(clearAt.time).unix()
 		}
 	}
 	// This is not an officially supported type
@@ -65,17 +67,14 @@ function clearAtFormat(clearAt) {
 	}
 
 	if (clearAt.type === 'period') {
-		return moment.duration(clearAt.time * 1000).humanize()
+		return formatRelativeTime(Date.now() + clearAt.time * 1000)
 	}
 
 	// This is not an officially supported type
 	// but only used internally to show the remaining time
 	// in the Set Status Modal
 	if (clearAt.type === '_time') {
-		const momentNow = moment(dateFactory())
-		const momentClearAt = moment(clearAt.time, 'X')
-
-		return moment.duration(momentNow.diff(momentClearAt)).humanize()
+		return formatRelativeTime(clearAt.time * 1000)
 	}
 
 	return null

package-lock.json

@@ -51,14 +51,14 @@
     "@nextcloud/initial-state": "^3.0.0",
     "@nextcloud/l10n": "^3.4.1",
     "@nextcloud/logger": "^3.0.3",
-    "@nextcloud/moment": "^1.3.5",
     "@nextcloud/password-confirmation": "^6.0.2",
     "@nextcloud/paths": "^3.0.0",
     "@nextcloud/router": "^3.1.0",
     "@nextcloud/sharing": "^0.3.0",
     "@nextcloud/vue": "^9.3.1",
     "@vueuse/core": "^14.1.0",
     "@vueuse/integrations": "^14.1.0",
+    "dayjs": "^1.11.19",
     "debounce": "^3.0.0",
     "pinia": "^3.0.4",
     "sortablejs": "^1.15.6",