mp3-composer/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement reordering with optimistic updates

Browse Source
This commit is contained in:
bivashy
2025-11-24 01:03:46 +05:00
parent 133558c4ab
commit 05814a100a
11 changed files with 271 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
app/components/internal/PlaylistSelect.vue
View File

@ -14,6 +14,7 @@ import { usePlaylists } from '@/composeables/api/playlist-controller/playlist-co
import { ChevronsUpDown, Music4, Plus } from 'lucide-vue-next';
import Button from '../ui/button/Button.vue';
import PlaylistCreateDialog from './playlists/select/PlaylistCreateDialog.vue';
import { useCurrentPlaylistStore } from '~/stores/use-current-playlist-store';
const {
open: sidebarOpen,
@ -21,18 +22,18 @@ const {
const { isLoading, isError, error, data } = usePlaylists();
const selectedPlaylist = ref(-1);
const currentPlaylistStore = useCurrentPlaylistStore();
watch(data, (value) => {
const newValue = value?.data[0]?.id || -1;
if (selectedPlaylist.value === -1) {
selectedPlaylist.value = newValue;
const newValue = value?.data[0];
if (currentPlaylistStore.id === -1 && newValue) {
currentPlaylistStore.load(newValue);
}
});
</script>
<template>
<Select v-model="selectedPlaylist">
<Select v-model="currentPlaylistStore.id">
<div v-if="sidebarOpen" class="hover:bg-sidebar-muted cursor-pointer rounded-md select-none">
<SelectCustomTrigger class="w-full flex p-2 gap-2 items-center">
<Frame borderRadius="round" background="primary" padding="dense" margin="none">
@ -42,7 +43,7 @@ watch(data, (value) => {
<Skeleton v-if="isLoading" class="w-32 h-5 rounded-full" />
<h4 v-else-if="data" class="text-xl font-semibold tracking-tight truncate">
<!-- TODO: i18n -->
{{data.data.find(playlist => playlist.id === selectedPlaylist)?.title ||
{{data.data.find(playlist => playlist.id === currentPlaylistStore.id)?.title ||
'No playlist selected'}}
</h4>
<p class="text-sm text-muted-foreground">