From d0e304e43b391e102a3c04ab28bcc7fd5dabfa6a Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Sat, 28 Nov 2020 15:30:34 +0100
Subject: [PATCH] Add disabled state for task titles

---
 src/components/tasks/partials/heading.vue | 9 +++++++--
 src/styles/theme/form.scss                | 8 ++++++++
 src/views/tasks/TaskDetailView.vue        | 2 +-
 3 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/components/tasks/partials/heading.vue b/src/components/tasks/partials/heading.vue
index c808e5ab..cf79f902 100644
--- a/src/components/tasks/partials/heading.vue
+++ b/src/components/tasks/partials/heading.vue
@@ -8,10 +8,11 @@
 		</h1>
 		<div class="is-done" v-if="task.done">Done</div>
 		<h1
+			class="title input"
+			:class="{'disabled': !canWrite}"
 			@focusout="save()"
 			@keyup.ctrl.enter="save()"
-			class="title input"
-			contenteditable="true"
+			:contenteditable="canWrite ? 'true' : 'false'"
 			ref="taskTitle">
 			{{ task.title }}
 		</h1>
@@ -49,6 +50,10 @@ export default {
 		value: {
 			required: true,
 		},
+		canWrite: {
+			type: Boolean,
+			default: false,
+		},
 	},
 	watch: {
 		value(newVal) {
diff --git a/src/styles/theme/form.scss b/src/styles/theme/form.scss
index bf8be685..2643b7fd 100644
--- a/src/styles/theme/form.scss
+++ b/src/styles/theme/form.scss
@@ -179,6 +179,14 @@
     background: $input-background-color;
     border-color: $input-focus-border-color;
   }
+
+  &.disabled {
+    &:focus, &:hover {
+      background: transparent !important;
+      border-color: transparent !important;
+      cursor: default !important;
+    }
+  }
 }
 
 h1, h2, h3 {
diff --git a/src/views/tasks/TaskDetailView.vue b/src/views/tasks/TaskDetailView.vue
index 4eb54fc0..ece1681a 100644
--- a/src/views/tasks/TaskDetailView.vue
+++ b/src/views/tasks/TaskDetailView.vue
@@ -1,7 +1,7 @@
 <template>
 	<div :class="{ 'is-loading': taskService.loading}" class="loader-container task-view-container">
 		<div class="task-view">
-			<heading v-model="task"/>
+			<heading v-model="task" :can-write="canWrite"/>
 			<h6 class="subtitle" v-if="parent && parent.namespace && parent.list">
 				{{ parent.namespace.title }} >
 				<router-link :to="{ name: listViewName, params: { listId: parent.list.id } }">