diff --git a/src/components/tasks/partials/heading.vue b/src/components/tasks/partials/heading.vue
index f6a2b6d61..53829db0e 100644
--- a/src/components/tasks/partials/heading.vue
+++ b/src/components/tasks/partials/heading.vue
@@ -51,7 +51,7 @@ import {useCopyToClipboard} from '@/composables/useCopyToClipboard'
 import {useTaskStore} from '@/stores/tasks'
 
 import type {ITask} from '@/modelTypes/ITask'
-import {getHexColor} from '@/models/task'
+import {getHexColor, getTaskIdentifier} from '@/models/task'
 
 const props = defineProps({
 	task: {
@@ -79,7 +79,7 @@ async function copyUrl() {
 const taskStore = useTaskStore()
 const loading = computed(() => taskStore.isLoading)
 
-const textIdentifier = computed(() => props.task?.getTextIdentifier() || '')
+const textIdentifier = computed(() => getTaskIdentifier(props.task))
 
 // Since loading is global state, this variable ensures we're only showing the saving icon when saving the description.
 const saving = ref(false)
diff --git a/src/models/task.ts b/src/models/task.ts
index 3e097acb1..ab57dd2ee 100644
--- a/src/models/task.ts
+++ b/src/models/task.ts
@@ -46,6 +46,18 @@ export function parseRepeatAfter(repeatAfterSeconds: number): IRepeatAfter {
 	}
 }
 
+export function getTaskIdentifier(task: ITask | null | undefined): string {
+	if (task === null || typeof task === 'undefined') {
+		return ''
+	}
+	
+	if (task.identifier === '') {
+		return `#${task.identifier}`
+	}
+
+	return task.identifier
+}
+
 export default class TaskModel extends AbstractModel<ITask> implements ITask {
 	id = 0
 	title = ''
@@ -142,11 +154,7 @@ export default class TaskModel extends AbstractModel<ITask> implements ITask {
 	}
 
 	getTextIdentifier() {
-		if (this.identifier === '') {
-			return `#${this.index}`
-		}
-
-		return this.identifier
+		return getTaskIdentifier(this)
 	}
 
 	getHexColor() {