mirror of
https://github.com/Drop-OSS/drop.git
synced 2025-11-14 08:41:15 +10:00
fix: collection creation & overview hover styles
This commit is contained in:
@ -37,7 +37,9 @@
|
|||||||
>
|
>
|
||||||
Collections
|
Collections
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col gap-y-2 py-1 max-h-[150px] overflow-y-auto">
|
<div
|
||||||
|
class="flex flex-col gap-y-2 py-1 max-h-[150px] overflow-y-auto"
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
v-if="collections.length === 0"
|
v-if="collections.length === 0"
|
||||||
class="px-3 py-2 text-sm text-zinc-500"
|
class="px-3 py-2 text-sm text-zinc-500"
|
||||||
@ -83,7 +85,7 @@
|
|||||||
|
|
||||||
<CreateCollectionModal
|
<CreateCollectionModal
|
||||||
v-model="createCollectionModal"
|
v-model="createCollectionModal"
|
||||||
:game-id="props.gameId"
|
:gameId="props.gameId"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@ -48,6 +48,8 @@
|
|||||||
import { ref } from "vue";
|
import { ref } from "vue";
|
||||||
import { DialogTitle } from "@headlessui/vue";
|
import { DialogTitle } from "@headlessui/vue";
|
||||||
import ModalTemplate from "~/drop-base/components/ModalTemplate.vue";
|
import ModalTemplate from "~/drop-base/components/ModalTemplate.vue";
|
||||||
|
import type { CollectionEntry, Game } from "@prisma/client";
|
||||||
|
import type { SerializeObject } from "nitropack";
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
gameId?: string;
|
gameId?: string;
|
||||||
@ -77,10 +79,13 @@ async function createCollection() {
|
|||||||
|
|
||||||
// Add the game if provided
|
// Add the game if provided
|
||||||
if (props.gameId) {
|
if (props.gameId) {
|
||||||
await $fetch(`/api/v1/collection/${response.id}/entry`, {
|
const entry = await $fetch<
|
||||||
|
CollectionEntry & { game: SerializeObject<Game> }
|
||||||
|
>(`/api/v1/collection/${response.id}/entry`, {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
body: { id: props.gameId },
|
body: { id: props.gameId },
|
||||||
});
|
});
|
||||||
|
response.entries.push(entry);
|
||||||
}
|
}
|
||||||
|
|
||||||
collections.value.push(response);
|
collections.value.push(response);
|
||||||
|
|||||||
@ -64,7 +64,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="min-h-[20vh]" />
|
<div class="min-h-[300px]" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@ -19,7 +19,7 @@
|
|||||||
<div
|
<div
|
||||||
v-for="collection in collections"
|
v-for="collection in collections"
|
||||||
:key="collection.id"
|
:key="collection.id"
|
||||||
class="group flex flex-row rounded-lg overflow-hidden transition-all duration-200 text-left w-full"
|
class="group flex flex-row rounded-lg overflow-hidden transition-all duration-200 text-left w-full hover:scale-105"
|
||||||
>
|
>
|
||||||
<NuxtLink
|
<NuxtLink
|
||||||
class="grow p-4 bg-zinc-800/50 hover:bg-zinc-800"
|
class="grow p-4 bg-zinc-800/50 hover:bg-zinc-800"
|
||||||
@ -36,9 +36,9 @@
|
|||||||
<!-- Delete button (only show for non-default collections) -->
|
<!-- Delete button (only show for non-default collections) -->
|
||||||
<button
|
<button
|
||||||
@click="() => (currentlyDeleting = collection)"
|
@click="() => (currentlyDeleting = collection)"
|
||||||
class="px-3 ml-[2px] bg-zinc-800/50 hover:bg-zinc-800"
|
class="px-3 ml-[2px] bg-zinc-800/50 hover:bg-zinc-800 group"
|
||||||
>
|
>
|
||||||
<TrashIcon class="h-5 w-5 text-zinc-400 hover:text-red-400" />
|
<TrashIcon class="transition-all size-5 text-zinc-400 group-hover:text-red-400 group-hover:rotate-[8deg]" />
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@ -20,6 +20,5 @@ export default defineEventHandler(async (h3) => {
|
|||||||
if (!gameId)
|
if (!gameId)
|
||||||
throw createError({ statusCode: 400, statusMessage: "Game ID required" });
|
throw createError({ statusCode: 400, statusMessage: "Game ID required" });
|
||||||
|
|
||||||
await userLibraryManager.collectionAdd(gameId, id, userId);
|
return await userLibraryManager.collectionAdd(gameId, id, userId);
|
||||||
return;
|
|
||||||
});
|
});
|
||||||
|
|||||||
@ -78,7 +78,7 @@ class UserLibraryManager {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async collectionAdd(gameId: string, collectionId: string, userId: string) {
|
async collectionAdd(gameId: string, collectionId: string, userId: string) {
|
||||||
await prisma.collectionEntry.upsert({
|
return await prisma.collectionEntry.upsert({
|
||||||
where: {
|
where: {
|
||||||
collectionId_gameId: {
|
collectionId_gameId: {
|
||||||
collectionId,
|
collectionId,
|
||||||
@ -93,6 +93,9 @@ class UserLibraryManager {
|
|||||||
gameId,
|
gameId,
|
||||||
},
|
},
|
||||||
update: {},
|
update: {},
|
||||||
|
include: {
|
||||||
|
game: true,
|
||||||
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user