From f951468f26e119b47bc8c80253f9a5fb28ba5905 Mon Sep 17 00:00:00 2001
From: Julien Calixte <julienc@bam.tech>
Date: Sat, 27 May 2023 23:32:47 +0200
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20(production=20flow)=20add=20the=20p?=
 =?UTF-8?q?ossibility=20to=20remove=20teams?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/flow/ProductionFlow.vue            |  5 +++--
 src/modules/flow/store/useProductionFlow.store.ts | 12 ++++++++++--
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/components/flow/ProductionFlow.vue b/src/components/flow/ProductionFlow.vue
index f686ed2..e99e0dc 100644
--- a/src/components/flow/ProductionFlow.vue
+++ b/src/components/flow/ProductionFlow.vue
@@ -9,8 +9,9 @@ const store = useProductionFlow()
   <section class="production-flow">
     <add-step />
     <ul>
-      <li :key="step.name" v-for="step in store.$state.steps">
-        {{ step.name }}
+      <li :key="team.name" v-for="team in store.$state.teams">
+        {{ team.name }}
+        <button @click="store.removeTeam(team.id)">❌</button>
       </li>
     </ul>
   </section>
diff --git a/src/modules/flow/store/useProductionFlow.store.ts b/src/modules/flow/store/useProductionFlow.store.ts
index abf52c0..1464d30 100644
--- a/src/modules/flow/store/useProductionFlow.store.ts
+++ b/src/modules/flow/store/useProductionFlow.store.ts
@@ -1,7 +1,9 @@
 import { pinia } from "@/store/store"
 import { defineStore } from "pinia"
+import { nanoid } from "nanoid"
 
 interface Team {
+  id: string
   name: string
   intention: string
   responsible: string
@@ -9,6 +11,8 @@ interface Team {
   outputs: string[]
 }
 
+type NewTeam = Omit<Team, "id">
+
 interface State {
   teams: Team[]
 }
@@ -16,6 +20,7 @@ interface State {
 const initialState: State = {
   teams: [
     {
+      id: nanoid(),
       name: "In production",
       intention: "Deliver feature to the user",
       responsible: "Product owner",
@@ -28,8 +33,11 @@ const initialState: State = {
 const useStore = defineStore("production-flow", {
   state: () => ({ ...initialState }),
   actions: {
-    addTeam(team: Team) {
-      this.$state.teams = [team, ...this.$state.teams]
+    addTeam(newTeam: NewTeam) {
+      this.$state.teams = [{ id: nanoid(), ...newTeam }, ...this.$state.teams]
+    },
+    removeTeam(id: string) {
+      this.$state.teams = this.$state.teams.filter((team) => team.id !== id)
     },
   },
 })