feat(tasks): update due date text every minute

Related discussion: https://community.vikunja.io/t/text-describing-time-past-due-date-is-never-refreshed/1376/3

src/components/tasks/partials/singleTaskInProject.vue

@@ -70,7 +70,7 @@
 					class="is-italic"
 					:aria-expanded="showDefer ? 'true' : 'false'"
 				>
-					– {{ $t('task.detail.due', {at: formatDateSince(task.dueDate)}) }}
+					– {{ $t('task.detail.due', {at: dueDateFormatted}) }}
 				</time>
 			</BaseButton>
 			<CustomTransition name="fade">
@@ -150,6 +150,7 @@ import {useProjectStore} from '@/stores/projects'
 import {useBaseStore} from '@/stores/base'
 import {useTaskStore} from '@/stores/tasks'
 import AssigneeList from '@/components/tasks/partials/assigneeList.vue'
+import {useIntervalFn} from '@vueuse/core'
 
 const {
 	theTask,
@@ -212,6 +213,20 @@ const taskDetailRoute = computed(() => ({
 	// state: { backdropView: router.currentRoute.value.fullPath },
 }))
 
+function updateDueDate() {
+	if (!task.value.dueDate) {
+		return
+	}
+
+	dueDateFormatted.value = formatDateSince(task.value.dueDate)
+}
+
+const dueDateFormatted = ref('')
+useIntervalFn(updateDueDate, 60_000, {
+	immediateCallback: true,
+})
+onMounted(updateDueDate)
+
 
 async function markAsDone(checked: boolean) {
 	const updateFunc = async () => {
@@ -246,6 +261,7 @@ async function toggleFavorite() {
 }
 
 const deferDueDate = ref<typeof DeferTask | null>(null)
+
 function hideDeferDueDatePopup(e) {
 	if (!showDefer.value) {
 		return
@@ -391,7 +407,7 @@ function hideDeferDueDatePopup(e) {
 		color: var(--danger);
 	}
 
-	input[type="checkbox"] {
+	input[type='checkbox'] {
 		vertical-align: middle;
 	}