extract to a new store: dashboardStore

src/modules/dashboard/dashboard-store.ts

@@ -0,0 +1,22 @@
+import { Dashboard } from '@/store-type'
+import { defineStore } from 'pinia'
+
+type State = {
+  dashboards: Dashboard[]
+}
+
+export const useDashboardStore = defineStore('dashboard', {
+  state: (): State => {
+    return {
+      dashboards: []
+    }
+  },
+  actions: {
+    newDashboard(dashboard: Dashboard) {
+      this.dashboards.push(dashboard)
+    },
+    clearDashboard() {
+      this.dashboards = []
+    }
+  }
+})

src/modules/feature/FeatureDashboard.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { useFeatureStore } from '@/modules/feature/store'
+import { useFeatureStore } from '@/modules/feature/feature-store'
 
 const featureStore = useFeatureStore()
 </script>

src/modules/feature/FeatureSteps.vue

@@ -1,11 +1,13 @@
 <script setup lang="ts">
+import { useDashboardStore } from '@/modules/dashboard/dashboard-store'
 import FeatureDashboard from '@/modules/feature/FeatureDashboard.vue'
 import FeatureStep from '@/modules/feature/FeatureStep.vue'
 import { featureSteps } from '@/modules/feature/feature-steps'
-import { useFeatureStore } from '@/modules/feature/store'
+import { useFeatureStore } from '@/modules/feature/feature-store'
 import { onMounted } from 'vue'
 
 const featureStore = useFeatureStore()
+const dashboardStore = useDashboardStore()
 
 onMounted(() => featureStore.initBoard())
 
@@ -51,10 +53,13 @@ const pushAndProblemSolving20Percent = () => {
       <button @click="featureStore.simulate('pull')">
         simulate pull system
       </button>
+      <button @click="featureStore.simulate100('pull')">
+        simulate 100 pull system
+      </button>
       <button @click="featureStore.simulate('problem-solving')">
         simulate pull and problem solving
       </button>
-      <button @click="featureStore.clearDashboard()">clear dashboard</button>
+      <button @click="dashboardStore.clearDashboard()">clear dashboard</button>
     </div>
   </div>
   <ul class="features-steps">

src/modules/feature/feature-board.ts

@@ -1,8 +1,8 @@
 import { Feature } from '@/modules/feature/feature'
 import { FeatureStep } from '@/modules/feature/feature-steps'
 import { features as initialFeatures } from '@/modules/feature/feature.fixture'
-import { State } from '@/modules/feature/store-type'
 import { Strategy } from '@/modules/lean/strategy'
+import { FeatureState } from '@/store-type'
 import {
   pickRandomElement,
   popNElement,
@@ -213,9 +213,9 @@ const getQualityProbability = (
 }
 
 export const nextDay = (
-  state: Omit<State, 'dashboards'>,
+  state: FeatureState,
   strategy: Strategy
-): Omit<State, 'dashboards'> => {
+): FeatureState => {
   state.meta.totalDays++
   state.meta.strategy[strategy]++
 
@@ -272,9 +272,9 @@ export const meanQualityIssue = (features: Feature[]) => {
 }
 
 export const simulate = (
-  state: Omit<State, 'dashboards'>,
+  state: FeatureState,
   strategy: Strategy
-): Omit<State, 'dashboards'> => {
+): FeatureState => {
   let i = 0
 
   while (!isProjectFinished(state.features) && i++ < HARD_STOP) {

src/modules/feature/feature-store.ts

@@ -1,3 +1,4 @@
+import { useDashboardStore } from '@/modules/dashboard/dashboard-store'
 import { Feature } from '@/modules/feature/feature'
 import {
   meanComplexity,
@@ -5,11 +6,12 @@ import {
   meanQualityIssue
 } from '@/modules/feature/feature-board'
 import { featureSteps } from '@/modules/feature/feature-steps'
-import { Meta, State } from '@/modules/feature/store-type'
 import { Strategy } from '@/modules/lean/strategy'
+import { FeatureState, Meta } from '@/store-type'
+import { clone } from '@/utils'
 import { defineStore } from 'pinia'
 
-const clone = (data: any) => JSON.parse(JSON.stringify(data))
+const dashboardStore = useDashboardStore()
 
 const instance = new ComlinkWorker<typeof import('./feature-board')>(
   new URL('./feature-board', import.meta.url)
@@ -26,12 +28,11 @@ const resetMeta = (): Meta => ({
 })
 
 export const useFeatureStore = defineStore('feature', {
-  state: (): State => ({
+  state: (): FeatureState => ({
     steps: [],
     features: [],
     backlog: [],
-    meta: resetMeta(),
-    dashboards: []
+    meta: resetMeta()
   }),
   actions: {
     async initBoard() {
@@ -74,7 +75,7 @@ export const useFeatureStore = defineStore('feature', {
         a.qualityIssue > b.qualityIssue ? -1 : 1
       )
 
-      this.dashboards.push({
+      dashboardStore.newDashboard({
         uuid: new Date().getTime().toString(),
         meta: newState.meta,
         analysis: {
@@ -88,8 +89,10 @@ export const useFeatureStore = defineStore('feature', {
         }
       })
     },
-    clearDashboard() {
-      this.dashboards = []
+    async simulate100(strategy: Strategy) {
+      for (let i = 0; i < 100; i++) {
+        await this.simulate(strategy)
+      }
     }
   },
   getters: {

src/store-type.ts

@@ -16,16 +16,15 @@ export type Analysis = {
   mainStrategy: Strategy | string
 }
 
-export type Dashboard = Array<{
+export type Dashboard = {
   uuid: string
   meta: Meta
   analysis: Analysis
-}>
+}
 
-export type State = {
+export type FeatureState = {
   steps: FeatureStep[]
   features: Feature[]
   backlog: Feature[]
   meta: Meta
-  dashboards: Dashboard
 }

src/utils.ts

@@ -1,3 +1,5 @@
+export const clone = (data: any) => JSON.parse(JSON.stringify(data))
+
 export const shuffleArray = <T>(array: T[]) => {
   let currentIndex = array.length,
     randomIndex