diff --git a/src/stores/sessionStore.ts b/src/stores/sessionStore.ts index 129bdc1..f169bf4 100644 --- a/src/stores/sessionStore.ts +++ b/src/stores/sessionStore.ts @@ -1,4 +1,5 @@ import {acceptHMRUpdate, defineStore} from 'pinia' +import { useUserStore } from '@/stores/userStore' export interface User { @@ -35,6 +36,8 @@ export const useSessionStore = defineStore('session', { sticker_ids: json.sticker_ids, username: json.username, }; + const userStore= useUserStore(); + userStore.addUser(this.user); }, logout() { console.log('logout'); diff --git a/src/stores/stickerStore.ts b/src/stores/stickerStore.ts deleted file mode 100644 index a965a4a..0000000 --- a/src/stores/stickerStore.ts +++ /dev/null @@ -1,64 +0,0 @@ -import { acceptHMRUpdate, defineStore } from 'pinia' - -import { useUserStore } from "@/stores/userStore"; -import { type User } from '@/stores/types'; - - -export interface Sticker { - color: string, - owner: string | null, - uuid: string, -} - -export interface State { - sticker: Sticker | null; -} - -export const useStickerStore = defineStore('sticker', { - actions: { - async fetch(uuid: string) { - if (this.sticker) { - return; - } - // TODO: Check if we have it already and if it's stale. - const response = await fetch( - `/api/sticker/${uuid}`, - ); - this.sticker = await response.json(); - }, - async put(uuid: string) { - const response = await fetch( - `/api/sticker/${uuid}`, - { - body: JSON.stringify(this.sticker), - method: 'PUT', - }, - ); - const json = await response.json(); - // Disable this for now so we don't clobber the new owner. - // this.sticker = json; - }, - setOwner(user: User) { - if (!this.sticker) { - return; - } -// this.sticker.owner = user.username; does not work - this.sticker = { - ...this.sticker, - owner: user.username, - } - this.put(this.sticker.uuid); - const userStore= useUserStore(); - userStore.addSticker(user.username, this.sticker.uuid); - }, - }, - state: (): State => { - return { - sticker: null, - }; - }, -}) - -if (import.meta.hot) { - import.meta.hot.accept(acceptHMRUpdate(useStickerStore, import.meta.hot)) -} diff --git a/src/stores/stickersStore.ts b/src/stores/stickersStore.ts index cd50f4e..9f675e6 100644 --- a/src/stores/stickersStore.ts +++ b/src/stores/stickersStore.ts @@ -1,8 +1,15 @@ import {acceptHMRUpdate, defineStore} from 'pinia' -import type {Sticker} from "@/stores/stickerStore"; +import type { User } from '@/stores/types' +import { useUserStore } from '@/stores/userStore' +export interface Sticker { + color: string, + owner: string | null, + uuid: string, +} + export interface State { stickers: Sticker[]; } @@ -20,6 +27,28 @@ export const useStickersStore = defineStore('stickers', { const json = await response.json(); this.stickers.push(json); }, + async put(uuid: string) { + const sticker = this.getSticker(uuid) + if (!sticker) { + return; + } + const response = await fetch( + `/api/sticker/${uuid}`, + { + body: JSON.stringify(sticker), + method: 'PUT', + }, + ); + const json = await response.json(); + // Disable this for now so we don't clobber the new owner. + // this.sticker = json; + }, + setOwner(sticker: Sticker, user: User) { + sticker.owner = user.username; + this.put(sticker.uuid); + const userStore= useUserStore(); + userStore.addSticker(user.username, sticker.uuid); + }, }, getters: { getSticker: (state: State) => { diff --git a/src/stores/userStore.ts b/src/stores/userStore.ts index 5402cfc..f3f1ccd 100644 --- a/src/stores/userStore.ts +++ b/src/stores/userStore.ts @@ -16,6 +16,9 @@ export const useUserStore = defineStore('user', { user.sticker_ids.push(uuid); } }, + addUser(user: User) { + this.users.push(user); + }, async fetch(username: string) { let user = this.getUser(username); if (user) { diff --git a/src/views/StickerView.vue b/src/views/StickerView.vue index e3ac590..f7d3ce0 100644 --- a/src/views/StickerView.vue +++ b/src/views/StickerView.vue @@ -8,18 +8,23 @@ import Panel from 'primevue/panel'; import Sticker from "@/components/Sticker.vue"; import { type User } from "@/stores/types"; import { useSessionStore } from "@/stores/sessionStore"; -import { useStickerStore } from "@/stores/stickerStore"; +import { + type Sticker as StickerType, + useStickersStore +} from "@/stores/stickersStore"; const sessionStore = useSessionStore(); -const stickerStore = useStickerStore(); +const stickersStore = useStickersStore(); const route = useRoute(); const uuid = ref(route.params.uuid as string); -// const uuid = ref(route.params.uuid); +const { getSticker } = stickersStore; +let sticker = ref(); onBeforeMount(async () => { - await stickerStore.fetch(uuid.value); + await stickersStore.fetch(uuid.value); + sticker.value = getSticker(uuid.value); }); const first = computed(() => { @@ -32,7 +37,7 @@ const second = computed(() => { }) function claimSticker() { - stickerStore.setOwner(sessionStore.user as User); + stickersStore.setOwner(sticker.value, sessionStore.user as User); } @@ -56,13 +61,13 @@ function claimSticker() {