feat: displaying episode publication as "dd mmm yyyy" instead of xyz ago (close #48)

src/components/Discover/Search.vue

@@ -4,7 +4,7 @@
 		<ul v-if="!loading">
 			<NcListItem v-for="feed in feeds"
 				:key="feed.link"
-				:details="moment(feed.fetchedAtUnix*1000).fromNow()"
+				:details="formatLocaleDate(new Date(feed.fetchedAtUnix*1000))"
 				: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 { formatLocaleDate } from '../../utils/time.js'
 import { generateUrl } from '@nextcloud/router'
-import moment from '@nextcloud/moment'
 import { showError } from '@nextcloud/dialogs'
 import { toUrl } from '../../utils/url.js'
 
@@ -55,7 +55,7 @@ export default {
 		},
 	},
 	methods: {
-		moment,
+		formatLocaleDate,
 		toUrl,
 		search: debounce(async function value() {
 			try {

src/components/Feed/Episodes.vue

@@ -6,7 +6,7 @@
 				:key="episode.guid"
 				:active="isCurrentEpisode(episode)"
 				:class="hasEnded(episode) ? 'ended': ''"
-				:details="moment(episode.pubDate.date).fromNow()"
+				:details="formatLocaleDate(new Date(episode.pubDate.date))"
 				:force-display-actions="true"
 				:name="episode.name"
 				:title="episode.description"
@@ -55,8 +55,8 @@ import PlayButton from 'vue-material-design-icons/Play.vue'
 import StopButton from 'vue-material-design-icons/Stop.vue'
 import axios from '@nextcloud/axios'
 import { decodeUrl } from '../../utils/url.js'
+import { formatLocaleDate } from '../../utils/time.js'
 import { generateUrl } from '@nextcloud/router'
-import moment from '@nextcloud/moment'
 import { showError } from '@nextcloud/dialogs'
 
 export default {
@@ -99,7 +99,7 @@ export default {
 		}
 	},
 	methods: {
-		moment,
+		formatLocaleDate,
 		hasEnded(episode) {
 			return episode.action && (episode.action.action === 'DELETE' || (
 				episode.action.position > 0

src/store/player.js

@@ -1,7 +1,7 @@
 import axios from '@nextcloud/axios'
 import { decodeUrl } from '../utils/url.js'
+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'
 
@@ -108,7 +108,7 @@ export const player = {
 			episode: context.state.episode.url,
 			guid: context.state.episode.guid,
 			action: 'play',
-			timestamp: moment().format('YYYY-MM-DD[T]HH:mm:ss'),
+			timestamp: formatEpisodeTimestamp(new Date()),
 			started: Math.round(context.state.started),
 			position: Math.round(audio.currentTime),
 			total: Math.round(audio.duration),

src/utils/time.js

@@ -1,3 +1,8 @@
+/**
+ * Format a date to a timer
+ * @param {Date} date The date
+ * @return {string}
+ */
 export const formatTimer = (date) => {
 	const minutes = date.getUTCMinutes().toString().padStart(2, 0)
 	const seconds = date.getUTCSeconds().toString().padStart(2, 0)
@@ -9,3 +14,26 @@ export const formatTimer = (date) => {
 
 	return timer
 }
+
+/**
+ * Format a date to a usefull timestamp string for the gPodder API
+ * @param {Date} date The date
+ * @return {string}
+ */
+export const formatEpisodeTimestamp = (date) => {
+	const year = date.getFullYear()
+	const month = (date.getMonth() + 1).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}`
+}
+
+/**
+ * Format a date to a localized date string
+ * @param {Date} date The date
+ * @return {string}
+ */
+export const formatLocaleDate = (date) => date.toLocaleDateString(undefined, { dateStyle: 'medium' })