This commit is contained in:
Doar Mihai
2026-05-30 18:56:17 +03:00
parent 17a2211952
commit afc49488a9
5 changed files with 93 additions and 33 deletions
+21 -20
View File
@@ -196,27 +196,28 @@
<div x-show="open" @click.outside="open = false" x-transition
class="mt-1 w-56 bg-[#16161d] border border-white/10 rounded-lg shadow-xl overflow-hidden z-10"
style="display:none;">
@if($userLists->isEmpty())
<div class="px-4 py-3 text-sm text-slate-500">
No lists yet.
<a href="{{ route('lists.index') }}" class="text-purple-400 hover:text-purple-300">Create one</a>
</div>
@else
<template x-for="list in lists" :key="list.id">
<button type="button" @click="toggleList(list.id)"
<template x-if="lists.length === 0">
<div class="px-4 py-3 text-sm text-slate-500">
No lists yet.
<a href="{{ route('lists.index') }}" class="text-purple-400 hover:text-purple-300">Create one</a>
</div>
</template>
<template x-for="list in lists" :key="list.slug">
<button type="button" @click="toggleList(list.slug)"
class="w-full flex items-center gap-2 px-4 py-2.5 text-sm hover:bg-white/5 transition-colors"
:class="added[list.id] ? 'text-purple-400' : 'text-slate-300'">
<svg x-show="added[list.id]" class="w-4 h-4 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
:class="added[list.slug] ? 'text-purple-400' : 'text-slate-300'">
<svg x-show="added[list.slug]" class="w-4 h-4 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clip-rule="evenodd"/>
</svg>
<span x-show="!added[list.id]" class="w-4 h-4 flex-shrink-0"></span>
<span x-show="!added[list.slug]" class="w-4 h-4 flex-shrink-0"></span>
<span x-text="list.title" class="truncate"></span>
</button>
</template>
<div class="border-t border-white/5 px-4 py-2">
<a href="{{ route('lists.index') }}" class="text-xs text-slate-500 hover:text-slate-300 transition-colors">Manage lists →</a>
</div>
@endif
<template x-if="lists.length > 0">
<div class="border-t border-white/5 px-4 py-2">
<a href="{{ route('lists.index') }}" class="text-xs text-slate-500 hover:text-slate-300 transition-colors">Manage lists →</a>
</div>
</template>
</div>
</div>
@else
@@ -799,11 +800,11 @@ function addToListWidget(gameId, lists) {
open: false,
added: {},
async toggleList(listId) {
const isAdded = this.added[listId];
async toggleList(listSlug) {
const isAdded = this.added[listSlug];
const url = isAdded
? `/lists/${listId}/games/${this.gameId}`
: `/lists/${listId}/games`;
? `/lists/${listSlug}/games/${this.gameId}`
: `/lists/${listSlug}/games`;
const method = isAdded ? 'DELETE' : 'POST';
const res = await fetch(url, {
@@ -817,7 +818,7 @@ function addToListWidget(gameId, lists) {
});
if (res.ok) {
this.added[listId] = !isAdded;
this.added[listSlug] = !isAdded;
}
},
};