Implement moment

.gitea/workflows/repod.yml

@@ -2,7 +2,17 @@ name: repod
 on: [push]
 
 jobs:
-  nextcloud:
+  xml:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - run: wget https://raw.githubusercontent.com/nextcloud/appstore/master/nextcloudappstore/api/v1/release/info.xsd
+      - uses: ChristophWurst/xmllint-action@v1
+        with:
+          xml-file: ./appinfo/info.xml
+          xml-schema-file: ./info.xsd
+
+  php:
     runs-on: ubuntu-latest
     container: nextcloud:26
     steps:
@@ -16,16 +26,6 @@ jobs:
       - run: composer run cs:check
       - run: composer run psalm:check
 
-  xml:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v3
-      - run: wget https://raw.githubusercontent.com/nextcloud/appstore/master/nextcloudappstore/api/v1/release/info.xsd
-      - uses: ChristophWurst/xmllint-action@v1
-        with:
-          xml-file: ./appinfo/info.xml
-          xml-schema-file: ./info.xsd
-
   nodejs:
     runs-on: ubuntu-latest
     steps:

package-lock.json

@@ -12,6 +12,7 @@
         "@nextcloud/axios": "^2.4.0",
         "@nextcloud/dialogs": "^5.0.3",
         "@nextcloud/l10n": "^2.2.0",
+        "@nextcloud/moment": "^1.2.2",
         "@nextcloud/router": "^2.2.0",
         "@nextcloud/vue": "8.3.0",
         "vue": "^2",
@@ -3189,6 +3190,22 @@
         "npm": "^9.0.0"
       }
     },
+    "node_modules/@nextcloud/moment": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/@nextcloud/moment/-/moment-1.2.2.tgz",
+      "integrity": "sha512-66jJJurd4JdqqlGIpqfxMWOvpG7i6dMibkNCPcpe8i+C+bGSFRMxMe74m1abehcaysj164is4juiT2ikVbZ4yg==",
+      "dependencies": {
+        "@nextcloud/l10n": "^2.2.0",
+        "core-js": "^3.21.1",
+        "jed": "^1.1.1",
+        "moment": "^2.29.2",
+        "node-gettext": "^3.0.0"
+      },
+      "engines": {
+        "node": "^20.0.0",
+        "npm": "^9.0.0"
+      }
+    },
     "node_modules/@nextcloud/paths": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/@nextcloud/paths/-/paths-2.1.0.tgz",
@@ -10204,6 +10221,11 @@
         "node": ">=8"
       }
     },
+    "node_modules/jed": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/jed/-/jed-1.1.1.tgz",
+      "integrity": "sha512-z35ZSEcXHxLW4yumw0dF6L464NT36vmx3wxJw8MDpraBcWuNVgUPZgPJKcu1HekNgwlMFNqol7i/IpSbjhqwqA=="
+    },
     "node_modules/jest": {
       "version": "29.7.0",
       "resolved": "https://registry.npmjs.org/jest/-/jest-29.7.0.tgz",
@@ -12841,6 +12863,14 @@
         "node": ">= 6"
       }
     },
+    "node_modules/moment": {
+      "version": "2.29.4",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz",
+      "integrity": "sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==",
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",

package.json

@@ -21,6 +21,7 @@
     "@nextcloud/axios": "^2.4.0",
     "@nextcloud/dialogs": "^5.0.3",
     "@nextcloud/l10n": "^2.2.0",
+    "@nextcloud/moment": "^1.2.2",
     "@nextcloud/router": "^2.2.0",
     "@nextcloud/vue": "8.3.0",
     "vue": "^2",

src/components/Discover/Search.vue

@@ -4,7 +4,7 @@
 		<ul v-if="!loading">
 			<NcListItem v-for="feed in feeds"
 				:key="feed.link"
-				:details="formatTimeAgo(new Date(feed.fetchedAtUnix*1000))"
+				:details="moment(feed.fetchedAtUnix*1000).fromNow()"
 				:name="feed.title"
 				:to="toUrl(feed.link)">
 				<template #icon>
@@ -25,8 +25,8 @@ import { NcAvatar, NcListItem } from '@nextcloud/vue'
 import Loading from '../Atoms/Loading.vue'
 import axios from '@nextcloud/axios'
 import { debounce } from '../../utils/debounce.js'
-import { formatTimeAgo } from '../../utils/time.js'
 import { generateUrl } from '@nextcloud/router'
+import moment from '@nextcloud/moment'
 import { showError } from '@nextcloud/dialogs'
 
 export default {
@@ -54,7 +54,7 @@ export default {
 		},
 	},
 	methods: {
-		formatTimeAgo,
+		moment,
 		search: debounce(async function value() {
 			try {
 				this.loading = true

src/components/Feed/Episodes.vue

@@ -6,7 +6,7 @@
 				:key="episode.episodeGuid"
 				:active="isCurrentEpisode(episode)"
 				:class="episode.episodeAction && episode.episodeAction.position >= episode.episodeAction.total ? 'ended': ''"
-				:details="formatTimeAgo(new Date(episode.episodePubDate.date))"
+				:details="moment(episode.episodePubDate.date).fromNow()"
 				:force-display-actions="true"
 				:name="episode.episodeName"
 				:title="episode.episodeDescription">
@@ -39,12 +39,13 @@
 
 <script>
 import { NcActionButton, NcAvatar, NcListItem } from '@nextcloud/vue'
-import { formatTimeAgo, formatTimer } from '../../utils/time.js'
 import Loading from '../Atoms/Loading.vue'
 import PlayButton from 'vue-material-design-icons/Play.vue'
 import StopButton from 'vue-material-design-icons/Stop.vue'
 import axios from '@nextcloud/axios'
+import { formatTimer } from '../../utils/time.js'
 import { generateUrl } from '@nextcloud/router'
+import moment from '@nextcloud/moment'
 import { showError } from '@nextcloud/dialogs'
 
 export default {
@@ -85,7 +86,7 @@ export default {
 	},
 	methods: {
 		formatTimer,
-		formatTimeAgo,
+		moment,
 		isCurrentEpisode(episode) {
 			return this.currentEpisode && this.currentEpisode.episodeUrl === episode.episodeUrl
 		},

src/store/player.js

@@ -1,6 +1,6 @@
 import axios from '@nextcloud/axios'
-import { formatEpisodeTimestamp } from '../utils/time.js'
 import { generateUrl } from '@nextcloud/router'
+import moment from '@nextcloud/moment'
 import router from '../router.js'
 import store from './main.js'
 
@@ -82,7 +82,7 @@ export const player = {
 				episode: context.state.episode.episodeUrl,
 				guid: context.state.episode.episodeGuid,
 				action: 'play',
-				timestamp: formatEpisodeTimestamp(new Date()),
+				timestamp: moment().format('YYYY-MM-DD[T]HH:mm:ss'),
 				started: Math.round(context.state.action ? context.state.action.started : 0),
 				position: Math.round(audio.currentTime),
 				total: Math.round(audio.duration),

src/utils/time.js

@@ -1,31 +1,3 @@
-// https://blog.webdevsimplified.com/2020-07/relative-time-format/
-
-const formatter = new Intl.RelativeTimeFormat(undefined, {
-	numeric: 'auto',
-})
-
-const DIVISIONS = [
-	{ amount: 60, name: 'seconds' },
-	{ amount: 60, name: 'minutes' },
-	{ amount: 24, name: 'hours' },
-	{ amount: 7, name: 'days' },
-	{ amount: 4.34524, name: 'weeks' },
-	{ amount: 12, name: 'months' },
-	{ amount: Number.POSITIVE_INFINITY, name: 'years' },
-]
-
-export const formatTimeAgo = (date) => {
-	let duration = (date - new Date()) / 1000
-
-	for (let i = 0; i < DIVISIONS.length; i++) {
-		const division = DIVISIONS[i]
-		if (Math.abs(duration) < division.amount) {
-			return formatter.format(Math.round(duration), division.name)
-		}
-		duration /= division.amount
-	}
-}
-
 export const formatTimer = (date) => {
 	const minutes = date.getUTCMinutes().toString().padStart(2, 0)
 	const seconds = date.getUTCSeconds().toString().padStart(2, 0)
@@ -37,14 +9,3 @@ export const formatTimer = (date) => {
 
 	return timer
 }
-
-export const formatEpisodeTimestamp = (date) => {
-	const year = date.getFullYear()
-	const month = date.getMonth().toString().padStart(2, '0')
-	const day = date.getDate().toString().padStart(2, '0')
-	const hours = date.getHours().toString().padStart(2, '0')
-	const mins = date.getMinutes().toString().padStart(2, '0')
-	const secs = date.getSeconds().toString().padStart(2, '0')
-
-	return `${year}-${month}-${day}T${hours}:${mins}:${secs}`
-}