From 7e8cdd4b78774c2e23575facfc35e16d809fdb20 Mon Sep 17 00:00:00 2001
From: Julien Calixte <julienc@bam.tech>
Date: Sun, 9 Apr 2023 22:55:55 +0200
Subject: [PATCH] add link to User Story

---
 src/modules/task/components/NewTaskForm.vue | 19 +++++++++++++++++--
 src/views/task/TaskView.vue                 |  9 ++++++++-
 2 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/src/modules/task/components/NewTaskForm.vue b/src/modules/task/components/NewTaskForm.vue
index 3507ef0..ca195a5 100644
--- a/src/modules/task/components/NewTaskForm.vue
+++ b/src/modules/task/components/NewTaskForm.vue
@@ -14,19 +14,30 @@ const router = useRouter()
 const id = createUuid()
 
 const title = ref(faker.animal.bird())
-const steps = ref([createStepFixture(), createStepFixture()])
+const link = ref(faker.internet.url())
+const steps = ref(
+  Array.from({ length: Math.floor(Math.random() * 10) }, () =>
+    createStepFixture()
+  )
+)
 const totalEstimation = computed(() =>
   steps.value.map((step) => step.estimation).reduce((a, b) => a + b, 0)
 )
 
 const saveTask = () => {
   const task = new Task(id, title.value)
+  if (link.value) {
+    task.link = link.value
+  }
   task.addSteps(...steps.value)
 
   if (Task.validate(task)) {
     store.saveTask(task)
     router.push({
-      name: 'home'
+      name: 'task-view',
+      params: {
+        id
+      }
     })
   }
 
@@ -44,6 +55,10 @@ const saveTask = () => {
         <label for="title">Title</label>
         <input type="text" id="title" v-model="title" />
       </div>
+      <div>
+        <label for="link">User story link</label>
+        <input type="text" id="link" v-model="link" />
+      </div>
       <StepInput v-model="steps" />
     </form>
   </div>
diff --git a/src/views/task/TaskView.vue b/src/views/task/TaskView.vue
index 4ff2a97..a60e768 100644
--- a/src/views/task/TaskView.vue
+++ b/src/views/task/TaskView.vue
@@ -15,9 +15,16 @@ const task = computed(() => taskStore.getTask(props.id))
   <div class="task-view" v-if="task">
     <h1>{{ task.title }}</h1>
     <h2>{{ task.totalEstimation }} minutes</h2>
+    <a
+      v-if="task.link"
+      :href="task.link"
+      target="_blank"
+      rel="noopener noreferrer"
+      >User Story link</a
+    >
     <ul>
       <li v-for="step in task.steps" :key="step.id">
-        {{ step.title }} | {{ step.estimation }}
+        <div>{{ step.title }} | {{ step.estimation }}</div>
       </li>
     </ul>
   </div>