✨ store を mutate できるように

src/pages/ContestEdit.vue

@@ -15,11 +15,13 @@ import FormDuration from '/@/components/UI/FormDuration.vue'
 import { isValidDuration, isValidLength, isValidUrl } from '/@/use/validate'
 import useModal from '/@/components/UI/composables/useModal'
 import ConfirmModal from '/@/components/UI/ConfirmModal.vue'
+import { useContestStore } from '/@/store/contest'
 import { useToast } from 'vue-toastification'
 
 const router = useRouter()
 const toast = useToast()
 const { modalRef, open, close } = useModal()
+const { mutate } = useContestStore()
 
 const contestId = useParam('contestId')
 const contestDetail: ContestDetail = (await apis.getContest(contestId.value))
@@ -56,6 +58,7 @@ const updateContest = async () => {
       }
     }
     await apis.editContest(contestId.value, requestData)
+    mutate()
     toast.success('コンテスト情報を更新しました')
     router.push(`/contests/${contestId.value}`)
   } catch {
@@ -68,6 +71,7 @@ const deleteContest = async () => {
   isDeleting.value = true
   try {
     await apis.deleteContest(contestId.value)
+    mutate()
     toast.success('コンテスト情報を削除しました')
     router.push('/contests')
   } catch {

src/pages/ContestNew.vue

@@ -11,9 +11,11 @@ import FormTextArea from '/@/components/UI/FormTextArea.vue'
 import FormDuration from '/@/components/UI/FormDuration.vue'
 import { isValidDuration, isValidLength, isValidUrl } from '/@/use/validate'
 import { useToast } from 'vue-toastification'
+import { useContestStore } from '/@/store/contest'
 
 const router = useRouter()
 const toast = useToast()
+const { mutate } = useContestStore()
 
 const formValues = reactive<Required<CreateContestRequest>>({
   name: '',
@@ -46,6 +48,7 @@ const createContest = async () => {
       }
     }
     const res = await apis.createContest(requestData)
+    mutate()
     toast.success('コンテストを追加しました')
     router.push(`/contests/${res.data.id}`)
   } catch {

src/pages/Event.vue

@@ -13,9 +13,11 @@ import { useToast } from 'vue-toastification'
 import RadioButton from '/@/components/UI/RadioButton.vue'
 import { eventLevels, getEventLevelFromValue } from '/@/consts/eventLevel'
 import { EventLevelValue } from '/@/consts/eventLevel'
+import { useEventStore } from '/@/store/event'
 
 const router = useRouter()
 const toast = useToast()
+const { mutate } = useEventStore()
 
 const eventId = useParam('id')
 const event: EventDetail = (await apis.getEvent(eventId.value)).data
@@ -32,6 +34,7 @@ const updateEvent = async () => {
       eventLevel: getEventLevelFromValue(eventLevel.value)
     }
     await apis.editEvent(eventId.value, requestData)
+    mutate()
     toast.success('イベント情報を更新しました')
     router.push(`/events/${eventId.value}`)
   } catch {

src/pages/ProjectNew.vue

@@ -10,8 +10,10 @@ import FormInput from '/@/components/UI/FormInput.vue'
 import FormTextArea from '/@/components/UI/FormTextArea.vue'
 import { useToast } from 'vue-toastification'
 import FormProjectDuration from '/@/components/UI/FormProjectDuration.vue'
+import { useProjectStore } from '/@/store/project'
 
 const toast = useToast()
+const { mutate } = useProjectStore()
 
 const formValues = reactive<Required<CreateProjectRequest>>({
   name: '',
@@ -34,6 +36,7 @@ const createProject = async () => {
   isSending.value = true
   try {
     await apis.createProject(formValues)
+    mutate()
     toast.success('プロジェクトを追加しました')
   } catch {
     toast.error('プロジェクトの追加に失敗しました')

src/store/contest.ts

@@ -5,19 +5,28 @@ import apis, { Contest } from '/@/lib/apis'
 
 export const useContestStore = defineStore('contest', () => {
   const contests = ref<Contest[] | null>(null)
+  const isDirty = ref(false)
 
   const fetchContests = async () => {
-    if (contests.value !== null) {
+    if (contests.value !== null && !isDirty.value) {
       return contests.value
     }
 
     const res = await apis.getContests()
     contests.value = res.data
+    isDirty.value = false
     return res.data
   }
 
+  const mutate = () => {
+    isDirty.value = true
+
+    void fetchContests()
+  }
+
   return {
     contests,
-    fetchContests
+    fetchContests,
+    mutate
   }
 })

src/store/event.ts

@@ -5,19 +5,28 @@ import apis, { Event } from '/@/lib/apis'
 
 export const useEventStore = defineStore('event', () => {
   const events = ref<Event[] | null>(null)
+  const isDirty = ref(false)
 
   const fetchEvents = async () => {
-    if (events.value !== null) {
+    if (events.value !== null && !isDirty.value) {
       return events.value
     }
 
     const res = await apis.getEvents()
     events.value = res.data
+    isDirty.value = false
     return res.data
   }
 
+  const mutate = () => {
+    isDirty.value = true
+
+    void fetchEvents()
+  }
+
   return {
     events,
-    fetchEvents
+    fetchEvents,
+    mutate
   }
 })

src/store/project.ts

@@ -5,19 +5,28 @@ import apis, { Project } from '/@/lib/apis'
 
 export const useProjectStore = defineStore('project', () => {
   const projects = ref<Project[] | null>(null)
+  const isDirty = ref(false)
 
   const fetchProjects = async () => {
-    if (projects.value !== null) {
+    if (projects.value !== null && !isDirty.value) {
       return projects.value
     }
 
     const res = await apis.getProjects()
     projects.value = res.data
+    isDirty.value = false
     return res.data
   }
 
+  const mutate = () => {
+    isDirty.value = true
+
+    void fetchProjects()
+  }
+
   return {
     projects,
-    fetchProjects
+    fetchProjects,
+    mutate
   }
 })