feat: provide listId prop via router

src/views/tasks/TaskDetailView.vue

@@ -475,6 +475,14 @@ export default {
 		description,
 		heading,
 	},
+
+	props: {
+		taskId: {
+			type: Number,
+			required: true,
+		},
+	},
+
 	data() {
 		return {
 			taskService: new TaskService(),
@@ -525,10 +533,6 @@ export default {
 		},
 	},
 	computed: {
-		taskId() {
-			const {id} = this.$route.params
-			return id === undefined ? id : Number(id)
-		},
 		currentList() {
 			return this.$store.state[CURRENT_LIST]
 		},

src/views/tasks/TaskDetailViewModal.vue

@@ -7,15 +7,22 @@
 		<a @click="close()" class="close">
 			<icon icon="times"/>
 		</a>
-		<task-detail-view/>
+		<task-detail-view :task-id="props.taskId"/>
 	</modal>
 </template>
 
-<script setup>
+<script setup lang="ts">
 import {computed} from 'vue'
 import {useRouter, useRoute} from 'vue-router'
 
-import TaskDetailView from './TaskDetailView'
+import TaskDetailView from './TaskDetailView.vue'
+
+const props = defineProps({
+	taskId: {
+		type: Number,
+		required: true,
+	},
+})
 
 const route = useRoute()
 const historyState = computed(() => route.fullPath && window.history.state)