2
0
Fork 0
mirror of https://github.com/koel/koel synced 2024-12-26 12:33:06 +00:00
koel/resources/assets/js/stores/favoriteStore.ts
2024-10-14 00:37:01 +07:00

49 lines
1.6 KiB
TypeScript

import { reactive } from 'vue'
import { differenceBy, unionBy } from 'lodash'
import { http } from '@/services'
import { arrayify } from '@/utils'
import { songStore } from '@/stores'
export const favoriteStore = {
state: reactive<{ playables: Playable[] }>({
playables: [],
}),
async toggleOne (playable: Playable) {
// Don't wait for the HTTP response to update the status, just toggle right away.
// This may cause a minor problem if the request fails somehow, but do we care?
playable.liked = !playable.liked
playable.liked ? this.add(playable) : this.remove(playable)
await http.post<Playable>('interaction/like', { song: playable.id })
},
add (songs: MaybeArray<Playable>) {
this.state.playables = unionBy(this.state.playables, arrayify(songs), 'id')
},
remove (songs: MaybeArray<Playable>) {
this.state.playables = differenceBy(this.state.playables, arrayify(songs), 'id')
},
async like (songs: Playable[]) {
// Don't wait for the HTTP response to update the status, just set them to Liked right away.
// This may cause a minor problem if the request fails somehow, but do we care?
songs.forEach(song => (song.liked = true))
this.add(songs)
await http.post('interaction/batch/like', { songs: songs.map(song => song.id) })
},
async unlike (songs: Playable[]) {
songs.forEach(song => (song.liked = false))
this.remove(songs)
await http.post('interaction/batch/unlike', { songs: songs.map(song => song.id) })
},
async fetch () {
this.state.playables = songStore.syncWithVault(await http.get<Playable[]>('songs/favorite'))
return this.state.playables
},
}