From 11a06ce81a053fc67d98159a483a19288f383390 Mon Sep 17 00:00:00 2001
From: Johannes Millan <johannes.millan@gmail.com>
Date: Wed, 18 Sep 2019 19:08:53 +0200
Subject: [PATCH] feat: allow updating task title in task summary table

---
 .../task-summary-table.component.html         |  6 ++-
 .../task-summary-table.component.scss         | 44 ++++++++++++++++---
 .../task-summary-table.component.ts           |  6 +++
 3 files changed, 48 insertions(+), 8 deletions(-)

diff --git a/src/app/features/tasks/task-summary-table/task-summary-table.component.html b/src/app/features/tasks/task-summary-table/task-summary-table.component.html
index 86ef502c194..8a51f47fac6 100644
--- a/src/app/features/tasks/task-summary-table/task-summary-table.component.html
+++ b/src/app/features/tasks/task-summary-table/task-summary-table.component.html
@@ -14,7 +14,11 @@
           <mat-icon *ngIf="task.repeatCfgId"
                     class="repeat-task-icon">repeat
           </mat-icon>
-          <span *ngIf="task.parentId">–</span> {{task.title}}
+          <span *ngIf="task.parentId">–</span>
+          <inline-input style="display: inline-block"
+                        (changed)="updateTaskTitle(task, $event)"
+                        [value]="task.title">
+          </inline-input>
         </div>
       </td>
     </ng-container>
diff --git a/src/app/features/tasks/task-summary-table/task-summary-table.component.scss b/src/app/features/tasks/task-summary-table/task-summary-table.component.scss
index 13b9f993fd2..69ab6c55daa 100644
--- a/src/app/features/tasks/task-summary-table/task-summary-table.component.scss
+++ b/src/app/features/tasks/task-summary-table/task-summary-table.component.scss
@@ -8,13 +8,6 @@
   }
 
   td {
-    .isDone {
-      text-decoration: line-through;
-    }
-
-    .isSubTask {
-      font-style: italic;
-    }
   }
 
   th {
@@ -92,3 +85,40 @@
   transform: rotate(45deg);
   opacity: 0.7;
 }
+
+.task-title {
+  display: flex;
+  //border: 1px solid orange;
+  text-align: left;
+  align-items: center;
+
+  &.isDone ::ng-deep .value-wrapper {
+    text-decoration: line-through;
+  }
+
+  &.isSubTask {
+    font-style: italic;
+  }
+
+
+  > span {
+    text-decoration: none !important;
+    display: block;
+    padding-left: $s*1;
+  }
+
+  inline-input {
+    flex-grow: 1;
+    text-align: left;
+    display: block;
+  }
+
+  ::ng-deep .inline-input-wrapper {
+    padding: $s;
+
+    input {
+      width: 100%;
+      text-align: left;
+    }
+  }
+}
diff --git a/src/app/features/tasks/task-summary-table/task-summary-table.component.ts b/src/app/features/tasks/task-summary-table/task-summary-table.component.ts
index a6b777b27db..93cd692ecc4 100644
--- a/src/app/features/tasks/task-summary-table/task-summary-table.component.ts
+++ b/src/app/features/tasks/task-summary-table/task-summary-table.component.ts
@@ -30,6 +30,12 @@ export class TaskSummaryTableComponent {
     });
   }
 
+  updateTaskTitle(task: Task, newVal: string) {
+    this._taskService.update(task.id, {
+      title: newVal
+    });
+  }
+
   toggleTaskDone(task: Task) {
     task.isDone
       ? this._taskService.setUnDone(task.id)