From 81cfab485e7d84b037cb9faaa158cca2f201c8b7 Mon Sep 17 00:00:00 2001
From: Julien Calixte <julienc@bam.tech>
Date: Sun, 16 Apr 2023 09:36:25 +0200
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20(eta)=20using=20eta=20comp?=
 =?UTF-8?q?onent?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/modules/record/components/TaskRecord.vue | 6 ++----
 src/modules/task/components/NewTaskForm.vue  | 8 +++-----
 src/views/task/TaskView.vue                  | 6 ++----
 3 files changed, 7 insertions(+), 13 deletions(-)

diff --git a/src/modules/record/components/TaskRecord.vue b/src/modules/record/components/TaskRecord.vue
index 9f77ca4..31f1eef 100644
--- a/src/modules/record/components/TaskRecord.vue
+++ b/src/modules/record/components/TaskRecord.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import EstimationTimeArrival from '@/components/EstimationTimeArrival.vue'
 import { useTaskStore } from '@/modules/task/stores/useTask.store'
 import { formatLongDate } from '@/shared/format-date'
 import { useLoopyTitle } from '@/shared/useLoopyTitle'
@@ -43,10 +44,7 @@ const isSuperiorToEstimation = computed(() => {
     </h1>
     <h2 class="subtitle" v-if="record">
       {{ formatLongDate(record.start) }}
-      <div class="tags has-addons">
-        <div class="tag">ETA</div>
-        <div class="tag is-primary">{{ task.totalEstimation }} minutes</div>
-      </div>
+      <estimation-time-arrival :estimation="task.totalEstimation" />
     </h2>
     <record-controls :task-id="taskId" />
     <record-progress :task-id="taskId" />
diff --git a/src/modules/task/components/NewTaskForm.vue b/src/modules/task/components/NewTaskForm.vue
index 8d0bb06..c4bcdbe 100644
--- a/src/modules/task/components/NewTaskForm.vue
+++ b/src/modules/task/components/NewTaskForm.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import EstimationTimeArrival from '@/components/EstimationTimeArrival.vue'
 import { createUuid } from '@/shared/create-uuid'
 import { computed, ref } from 'vue'
 import { useRouter } from 'vue-router'
@@ -47,10 +48,7 @@ const saveTask = () => {
     <div class="column is-half">
       <h1 class="title">Create a task</h1>
       <h2 class="subtitle">
-        <div class="tags has-addons">
-          <div class="tag">ETA</div>
-          <div class="tag is-primary">{{ totalEstimation }} minutes</div>
-        </div>
+        <estimation-time-arrival :estimation="totalEstimation" />
       </h2>
       <form @submit.prevent="saveTask">
         <div class="field">
@@ -65,7 +63,7 @@ const saveTask = () => {
             <input class="input" type="text" id="link" v-model="link" />
           </div>
         </div>
-        <StepInput v-model="steps" />
+        <step-input v-model="steps" />
         <button class="button is-primary is-fullwidth" type="submit">
           save
         </button>
diff --git a/src/views/task/TaskView.vue b/src/views/task/TaskView.vue
index 7d261db..0f122e5 100644
--- a/src/views/task/TaskView.vue
+++ b/src/views/task/TaskView.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import EstimationTimeArrival from '@/components/EstimationTimeArrival.vue'
 import TaskRecordPreview from '@/modules/record/components/TaskRecordPreview.vue'
 import { useTaskStore } from '@/modules/task/stores/useTask.store'
 import { computed } from 'vue'
@@ -16,10 +17,7 @@ const task = computed(() => taskStore.getTask(props.id))
   <div class="task-view" v-if="task">
     <h1 class="title">{{ task.title }}</h1>
     <h2 class="subtitle">
-      <div class="tags has-addons">
-        <div class="tag">ETA</div>
-        <div class="tag is-primary">{{ task.totalEstimation }} minutes</div>
-      </div>
+      <estimation-time-arrival :estimation="task.totalEstimation" />
     </h2>
     <a
       v-if="task.link"