Include seconds in dates.

src/components/FormattedDate.vue

@@ -0,0 +1,46 @@
+<!--
+  - @copyright Copyright (c) 2023, struktur AG.
+  -
+  - @author Joachim Bauch <bauch@struktur.de>
+  -
+  - @license AGPL-3.0
+  -
+  - This code is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU Affero General Public License, version 3,
+  - as published by the Free Software Foundation.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+  - GNU Affero General Public License for more details.
+  -
+  - You should have received a copy of the GNU Affero General Public License, version 3,
+  - along with this program. If not, see <http://www.gnu.org/licenses/>
+-->
+
+<template>
+	<span :title="date">
+		{{ formattedDate }}
+	</span>
+</template>
+
+<script>
+import { formatDate } from '../services/formatter.js'
+
+export default {
+	name: 'FormattedDate',
+
+	props: {
+		date: {
+			type: String,
+			required: true,
+		},
+	},
+
+	computed: {
+		formattedDate() {
+			return formatDate(this.date)
+		},
+	},
+}
+</script>

src/components/IncomingSignRequests.vue

@@ -59,10 +59,10 @@
 							<span v-if="request.signed">{{ request.filename }}</span>
 						</td>
 						<td>
-							{{ formatDate(request.created) }}
+							<FormattedDate :date="request.created" />
 						</td>
 						<td>
-							{{ formatDate(request.own_signed) }}
+							<FormattedDate :date="request.own_signed" />
 						</td>
 						<td>
 							<NcAvatar :user="request.user_id"
@@ -115,7 +115,6 @@
 </template>
 
 <script>
-import moment from '@nextcloud/moment'
 import NcAvatar from '@nextcloud/vue/dist/Components/NcAvatar.js'
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
 import NcLoadingIcon from '@nextcloud/vue/dist/Components/NcLoadingIcon.js'
@@ -124,6 +123,7 @@ import FileSign from 'vue-material-design-icons/FileSign.vue'
 import OpenInNew from 'vue-material-design-icons/OpenInNew.vue'
 import { showError } from '@nextcloud/dialogs'
 
+import FormattedDate from './FormattedDate.vue'
 import SignDialogModal from './SignDialogModal.vue'
 import { getIncomingRequests, getOriginalUrl, getSignedUrl } from '../services/apiservice.js'
 import getVinegarApi from '../services/vinegarapi.js'
@@ -139,6 +139,7 @@ export default {
 		FileSign,
 		OpenInNew,
 		SignDialogModal,
+		FormattedDate,
 	},
 
 	data() {
@@ -198,14 +199,6 @@ export default {
 			elem.scrollIntoView()
 		},
 
-		formatDate(d) {
-			if (!d) {
-				return d
-			}
-
-			return moment(d).format('LLL')
-		},
-
 		async fetchRequests() {
 			this.loading = true
 			let response

src/components/OwnSignRequests.vue

@@ -58,10 +58,10 @@
 							{{ request.filename }}
 						</td>
 						<td>
-							{{ formatDate(request.created) }}
+							<FormattedDate :date="request.created" />
 						</td>
 						<td>
-							{{ formatDate(getLastSignature(request)) }}
+							<FormattedDate :date="getLastSignature(request)" />
 						</td>
 						<td>
 							<div v-for="recipient in request.recipients" :key="recipient.type + '-' + recipient.value">
@@ -103,7 +103,6 @@
 </template>
 
 <script>
-import moment from '@nextcloud/moment'
 import { showSuccess, showError } from '@nextcloud/dialogs'
 
 import NcButton from '@nextcloud/vue/dist/Components/NcButton.js'
@@ -112,6 +111,7 @@ import Delete from 'vue-material-design-icons/Delete.vue'
 import Download from 'vue-material-design-icons/Download.vue'
 import OpenInNew from 'vue-material-design-icons/OpenInNew.vue'
 
+import FormattedDate from './FormattedDate.vue'
 import Recipient from './Recipient.vue'
 import { getRequests, deleteRequest, getSignedUrl } from '../services/apiservice.js'
 
@@ -124,6 +124,7 @@ export default {
 		Delete,
 		Download,
 		OpenInNew,
+		FormattedDate,
 		Recipient,
 	},
 
@@ -183,14 +184,6 @@ export default {
 			elem.scrollIntoView()
 		},
 
-		formatDate(d) {
-			if (!d) {
-				return d
-			}
-
-			return moment(d).format('LLL')
-		},
-
 		getLastSignature(request) {
 			if (request.signed) {
 				return request.signed

src/services/formatter.js

@@ -0,0 +1,39 @@
+/**
+ * @copyright Copyright (c) 2023, struktur AG.
+ *
+ * @author Joachim Bauch <bauch@struktur.de>
+ *
+ * @license AGPL-3.0
+ *
+ * This code is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License, version 3,
+ * as published by the Free Software Foundation.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License, version 3,
+ * along with this program. If not, see <http://www.gnu.org/licenses/>
+ */
+
+import moment from '@nextcloud/moment'
+
+/**
+ * Format the given date. Can be a string, Date or moment instance.
+ *
+ * @param {object} d the date to format
+ */
+function formatDate(d) {
+	if (!d) {
+		return d
+	}
+
+	const m = moment(d)
+	return m.format('LL') + ' ' + m.format('LTS')
+}
+
+export {
+	formatDate,
+}

src/views/SignaturesView.vue

@@ -98,12 +98,12 @@
 </template>
 
 <script>
-import moment from '@nextcloud/moment'
-
 import CertificateDetails from '../components/CertificateDetails.vue'
 import SignatureStatus from '../components/SignatureStatus.vue'
 import { getFileSignatures } from '../services/filesIntegrationServices.js'
 
+import { formatDate } from '../services/formatter.js'
+
 export default {
 	name: 'SignaturesView',
 
@@ -154,7 +154,7 @@ export default {
 		},
 
 		formatDate(d) {
-			return moment(d).format('LLL')
+			return formatDate(d)
 		},
 	},