feat: reload quotes after change during collect phase

client/src/components/CollectQuotes.vue

@@ -8,7 +8,8 @@
 <script setup lang="ts">
 import useEngine from '@/composables/useEngine'
 const engine = useEngine()
-const quotes = await engine.getQuotes()
+const quotes = engine.getQuotesRef()
+await engine.loadQuotes()
 </script>
 
 <style lang="scss">

client/src/composables/engine/quotes.ts

@@ -1,13 +1,21 @@
+import { Ref, ref } from 'vue'
 import type { Quotes } from '@/composables/engine.d'
 import { useUserinfoStore } from "@/stores/UserinfoStore"
 
-export async function getQuotes(): Promise<Quotes> {
+
+const quotes = ref([]) as Ref<Quotes>
+
+export async function loadQuotes(): Promise<void> {
   const userInfoStore = useUserinfoStore()
   const response = await this.callApi('/api/getQuotes', {
     g: userInfoStore.gameId,
   })
 
-  return response.quotes
+  quotes.value.splice(0, quotes.value.length, ...response.quotes)
+}
+
+export function getQuotesRef(): Ref<Quotes> {
+  return quotes
 }
 
 export async function deleteQuote(id: string): Promise<void> {
@@ -16,6 +24,8 @@ export async function deleteQuote(id: string): Promise<void> {
     g: userInfoStore.gameId,
     id,
   })
+
+  await this.loadQuotes()
 }
 
 export async function saveQuote(id: string, quote: string): Promise<void> {
@@ -25,4 +35,6 @@ export async function saveQuote(id: string, quote: string): Promise<void> {
     id,
     quote,
   })
+
+  await this.loadQuotes()
 }

client/src/composables/useEngine.ts

@@ -2,7 +2,7 @@ import { Ref, ref } from 'vue'
 import { callApi, QueryParams } from '@/composables/engine/callApi'
 import { start, stop } from '@/composables/engine/startStop'
 import { fetchUpdate } from '@/composables/engine/fetchUpdate'
-import { getQuotes, deleteQuote, saveQuote } from '@/composables/engine/quotes'
+import { loadQuotes, getQuotesRef, deleteQuote, saveQuote } from '@/composables/engine/quotes'
 import type { Quotes } from '@/composables/engine.d'
 
 interface EngineContext {
@@ -12,8 +12,9 @@ interface EngineContext {
     lastFetched: Array<Date>
     isConnected: Ref<boolean>
     retry: Ref<number>
-    fetchUpdate: () => void
     callApi: (url: string, queryParams?: QueryParams) => Promise<unknown>
+    fetchUpdate: () => Promise<void>
+    loadQuotes: () => Promise<void>
 }
 
 export interface useEngine {
@@ -22,7 +23,8 @@ export interface useEngine {
     start(): void
     stop(): void
     fetchUpdate(): void
-    getQuotes(): Promise<Quotes>
+    loadQuotes(): Promise<void>
+    getQuotesRef(): Ref<Quotes>
     createQuote(quote: string): Promise<void>
     saveQuote(id: string, quote: string): Promise<void>
     deleteQuote(id: string): Promise<void>
@@ -39,6 +41,7 @@ export default (): useEngine => {
         retry: ref(0),
         callApi,
         fetchUpdate,
+        loadQuotes,
     }
 
     return {
@@ -47,7 +50,8 @@ export default (): useEngine => {
         start: () => start.apply(context),
         stop: () => stop.apply(context),
         fetchUpdate: () => fetchUpdate.apply(context),
-        getQuotes: () => getQuotes.apply(context),
+        loadQuotes: () => loadQuotes.apply(context),
+        getQuotesRef: () => getQuotesRef.apply(context),
         createQuote: (quote: string) => saveQuote.apply(context, [':new:', quote]),
         saveQuote: (id: string, quote: string) => saveQuote.apply(context, [id, quote]),
         deleteQuote: (id) => deleteQuote.apply(context, [id]),