Remove unique on wishlist and collection ids. Only show add to buttons for now.

This commit is contained in:
Bradley Shellnut 2023-08-14 11:48:07 -07:00
parent 78f5bba669
commit 1a8ec5b905
4 changed files with 87 additions and 107 deletions

View file

@ -26,7 +26,7 @@
"@playwright/test": "^1.37.0", "@playwright/test": "^1.37.0",
"@sveltejs/adapter-auto": "^1.0.3", "@sveltejs/adapter-auto": "^1.0.3",
"@sveltejs/adapter-vercel": "^1.0.6", "@sveltejs/adapter-vercel": "^1.0.6",
"@sveltejs/kit": "^1.22.5", "@sveltejs/kit": "^1.22.6",
"@types/cookie": "^0.5.1", "@types/cookie": "^0.5.1",
"@types/node": "^18.17.5", "@types/node": "^18.17.5",
"@typescript-eslint/eslint-plugin": "^5.62.0", "@typescript-eslint/eslint-plugin": "^5.62.0",

View file

@ -99,13 +99,13 @@ devDependencies:
version: 1.37.0 version: 1.37.0
'@sveltejs/adapter-auto': '@sveltejs/adapter-auto':
specifier: ^1.0.3 specifier: ^1.0.3
version: 1.0.3(@sveltejs/kit@1.22.5) version: 1.0.3(@sveltejs/kit@1.22.6)
'@sveltejs/adapter-vercel': '@sveltejs/adapter-vercel':
specifier: ^1.0.6 specifier: ^1.0.6
version: 1.0.6(@sveltejs/kit@1.22.5) version: 1.0.6(@sveltejs/kit@1.22.6)
'@sveltejs/kit': '@sveltejs/kit':
specifier: ^1.22.5 specifier: ^1.22.6
version: 1.22.5(svelte@4.2.0)(vite@4.4.9) version: 1.22.6(svelte@4.2.0)(vite@4.4.9)
'@types/cookie': '@types/cookie':
specifier: ^0.5.1 specifier: ^0.5.1
version: 0.5.1 version: 0.5.1
@ -174,10 +174,10 @@ devDependencies:
version: 2.0.1 version: 2.0.1
sveltekit-flash-message: sveltekit-flash-message:
specifier: ^2.1.3 specifier: ^2.1.3
version: 2.1.3(@sveltejs/kit@1.22.5)(svelte@4.2.0) version: 2.1.3(@sveltejs/kit@1.22.6)(svelte@4.2.0)
sveltekit-superforms: sveltekit-superforms:
specifier: ^1.5.1 specifier: ^1.5.1
version: 1.5.1(@sveltejs/kit@1.22.5)(svelte@4.2.0)(zod@3.21.4) version: 1.5.1(@sveltejs/kit@1.22.6)(svelte@4.2.0)(zod@3.21.4)
tailwindcss: tailwindcss:
specifier: ^3.3.3 specifier: ^3.3.3
version: 3.3.3(ts-node@10.9.1) version: 3.3.3(ts-node@10.9.1)
@ -1308,21 +1308,21 @@ packages:
picomatch: 2.3.1 picomatch: 2.3.1
dev: true dev: true
/@sveltejs/adapter-auto@1.0.3(@sveltejs/kit@1.22.5): /@sveltejs/adapter-auto@1.0.3(@sveltejs/kit@1.22.6):
resolution: {integrity: sha512-hc7O12YQqvZ1CD4fo1gMJuPzBZvuoG5kwxb2RRoz4fVoB8B2vuPO2cY751Ln0G6T/HMrAf8kCqw6Pg+wbxcstw==} resolution: {integrity: sha512-hc7O12YQqvZ1CD4fo1gMJuPzBZvuoG5kwxb2RRoz4fVoB8B2vuPO2cY751Ln0G6T/HMrAf8kCqw6Pg+wbxcstw==}
peerDependencies: peerDependencies:
'@sveltejs/kit': ^1.0.0 '@sveltejs/kit': ^1.0.0
dependencies: dependencies:
'@sveltejs/kit': 1.22.5(svelte@4.2.0)(vite@4.4.9) '@sveltejs/kit': 1.22.6(svelte@4.2.0)(vite@4.4.9)
import-meta-resolve: 2.2.0 import-meta-resolve: 2.2.0
dev: true dev: true
/@sveltejs/adapter-vercel@1.0.6(@sveltejs/kit@1.22.5): /@sveltejs/adapter-vercel@1.0.6(@sveltejs/kit@1.22.6):
resolution: {integrity: sha512-fo6aaEygPd/6B5Jms4Ff7R4jbADnppuLvKOWBNTGe5MGB7ZRUkl+gxHWMQx2av2knyEZkA6V8y5M6R3ML5yN4g==} resolution: {integrity: sha512-fo6aaEygPd/6B5Jms4Ff7R4jbADnppuLvKOWBNTGe5MGB7ZRUkl+gxHWMQx2av2knyEZkA6V8y5M6R3ML5yN4g==}
peerDependencies: peerDependencies:
'@sveltejs/kit': ^1.0.0 '@sveltejs/kit': ^1.0.0
dependencies: dependencies:
'@sveltejs/kit': 1.22.5(svelte@4.2.0)(vite@4.4.9) '@sveltejs/kit': 1.22.6(svelte@4.2.0)(vite@4.4.9)
'@vercel/nft': 0.22.6 '@vercel/nft': 0.22.6
esbuild: 0.16.8 esbuild: 0.16.8
transitivePeerDependencies: transitivePeerDependencies:
@ -1330,8 +1330,8 @@ packages:
- supports-color - supports-color
dev: true dev: true
/@sveltejs/kit@1.22.5(svelte@4.2.0)(vite@4.4.9): /@sveltejs/kit@1.22.6(svelte@4.2.0)(vite@4.4.9):
resolution: {integrity: sha512-LHq+ECucoT6c6/tkrxIQtD8KVNhPFV4QQ+xOKTwBAs/Qdtff8P5gAzsIZiwEaaO6J6sYZoy5RP2VR6m8PSCgLA==} resolution: {integrity: sha512-SDKxI/QpsReCwIn5czjT53fKlPBybbmMk67d317gUqfeORroBAFN1Z6s/x0E1JYi+04i7kKllS+Sz9wVfmUkAQ==}
engines: {node: ^16.14 || >=18} engines: {node: ^16.14 || >=18}
hasBin: true hasBin: true
requiresBuild: true requiresBuild: true
@ -3992,24 +3992,24 @@ packages:
magic-string: 0.30.0 magic-string: 0.30.0
periscopic: 3.1.0 periscopic: 3.1.0
/sveltekit-flash-message@2.1.3(@sveltejs/kit@1.22.5)(svelte@4.2.0): /sveltekit-flash-message@2.1.3(@sveltejs/kit@1.22.6)(svelte@4.2.0):
resolution: {integrity: sha512-NFhQ3t2101AM9JO5Mgj38r69ykF4BOs1Ap3567DaM1RoAaNtXRXpAuEc/DQV78HZN/Fxzw8dxyTMdIC1HztUvA==} resolution: {integrity: sha512-NFhQ3t2101AM9JO5Mgj38r69ykF4BOs1Ap3567DaM1RoAaNtXRXpAuEc/DQV78HZN/Fxzw8dxyTMdIC1HztUvA==}
peerDependencies: peerDependencies:
'@sveltejs/kit': 1.x '@sveltejs/kit': 1.x
svelte: 3.x || 4.x svelte: 3.x || 4.x
dependencies: dependencies:
'@sveltejs/kit': 1.22.5(svelte@4.2.0)(vite@4.4.9) '@sveltejs/kit': 1.22.6(svelte@4.2.0)(vite@4.4.9)
svelte: 4.2.0 svelte: 4.2.0
dev: true dev: true
/sveltekit-superforms@1.5.1(@sveltejs/kit@1.22.5)(svelte@4.2.0)(zod@3.21.4): /sveltekit-superforms@1.5.1(@sveltejs/kit@1.22.6)(svelte@4.2.0)(zod@3.21.4):
resolution: {integrity: sha512-OqKzxuL1P29CFiK1CD00JRsvEsRPedvrR0qXmB4uqzXAIjOS+DpLjoEaa6Cnkd4H00fRa2161GcZNeEBue/D3A==} resolution: {integrity: sha512-OqKzxuL1P29CFiK1CD00JRsvEsRPedvrR0qXmB4uqzXAIjOS+DpLjoEaa6Cnkd4H00fRa2161GcZNeEBue/D3A==}
peerDependencies: peerDependencies:
'@sveltejs/kit': 1.x '@sveltejs/kit': 1.x
svelte: 3.x || 4.x svelte: 3.x || 4.x
zod: 3.x zod: 3.x
dependencies: dependencies:
'@sveltejs/kit': 1.22.5(svelte@4.2.0)(vite@4.4.9) '@sveltejs/kit': 1.22.6(svelte@4.2.0)(vite@4.4.9)
svelte: 4.2.0 svelte: 4.2.0
zod: 3.21.4 zod: 3.21.4
dev: true dev: true

View file

@ -90,13 +90,15 @@ model Collection {
model CollectionItem { model CollectionItem {
id String @id @default(cuid()) id String @id @default(cuid())
collection_id String @unique collection_id String
collection Collection @relation(references: [id], fields: [collection_id], onDelete: Cascade) collection Collection @relation(references: [id], fields: [collection_id], onDelete: Cascade)
game_id String @unique game_id String @unique
game Game @relation(references: [id], fields: [game_id]) game Game @relation(references: [id], fields: [game_id])
times_played Int times_played Int
@@index([game_id, collection_id]) @@index([game_id, collection_id])
@@index([game_id])
@@index([collection_id])
@@map("collection_items") @@map("collection_items")
} }
@ -112,7 +114,7 @@ model Wishlist {
model WishlistItem { model WishlistItem {
id String @id @default(cuid()) id String @id @default(cuid())
wishlist_id String @unique wishlist_id String
wishlist Wishlist @relation(references: [id], fields: [wishlist_id], onDelete: Cascade) wishlist Wishlist @relation(references: [id], fields: [wishlist_id], onDelete: Cascade)
game_id String @unique game_id String @unique
game Game @relation(references: [id], fields: [game_id]) game Game @relation(references: [id], fields: [game_id])
@ -120,6 +122,8 @@ model WishlistItem {
updated_at DateTime @updatedAt @db.Timestamp(6) updated_at DateTime @updatedAt @db.Timestamp(6)
@@index([game_id, wishlist_id]) @@index([game_id, wishlist_id])
@@index([game_id])
@@index([wishlist_id])
@@map("wishlist_items") @@map("wishlist_items")
} }
@ -136,7 +140,7 @@ model List {
model ListItem { model ListItem {
id String @id @default(cuid()) id String @id @default(cuid())
list_id String @unique list_id String
list List @relation(references: [id], fields: [list_id], onDelete: Cascade) list List @relation(references: [id], fields: [list_id], onDelete: Cascade)
game_id String @unique game_id String @unique
game Game @relation(references: [id], fields: [game_id]) game Game @relation(references: [id], fields: [game_id])
@ -144,6 +148,8 @@ model ListItem {
updated_at DateTime @updatedAt @db.Timestamp(6) updated_at DateTime @updatedAt @db.Timestamp(6)
@@index([game_id, list_id]) @@index([game_id, list_id])
@@index([game_id])
@@index([list_id])
@@map("list_items") @@map("list_items")
} }

View file

@ -13,72 +13,74 @@
export let in_collection = false; export let in_collection = false;
export let lists = []; export let lists = [];
const handleChange = ({ curr, next }) => { // const handleChange = ({ curr, next }) => {
console.log({ curr, next }); // console.log({ curr, next });
return next; // return next;
} // }
const { // const {
elements: { trigger, menu, option, label, group, groupLabel }, // elements: { trigger, menu, option, label, group, groupLabel },
states: { valueLabel, open }, // states: { valueLabel, open },
helpers: { isSelected }, // helpers: { isSelected },
} = createSelect({ // } = createSelect({
forceVisible: true, // forceVisible: true,
onValueChange: handleChange // onValueChange: handleChange
}); // });
console.log({ in_collection, in_wishlist }); // console.log({ in_collection, in_wishlist });
let options: Record<string, string> = {}; // let options: Record<string, string> = {};
let list_of_lists = []; // let list_of_lists = [];
if (!in_collection) { // if (!in_collection) {
options[collection.id] = 'Add to collection'; // options[collection.id] = 'Add to collection';
} // }
if (!in_wishlist) { // if (!in_wishlist) {
options[wishlist.id] = 'Add to wishlist'; // options[wishlist.id] = 'Add to wishlist';
} // }
lists.forEach((list) => { // lists.forEach((list) => {
if (!list?.in_list) { // if (!list?.in_list) {
options[list.id] = list.name; // options[list.id] = list.name;
} // }
}); // });
</script> </script>
{#if in_wishlist} <div class="flex gap-1">
<form method="POST" action={`/wishlist?/remove`} use:enhance> {#if in_wishlist}
<input type="hidden" name="id" value={game_id} /> <form method="POST" action={`/wishlist?/remove`} use:enhance>
<Button variant="destructive" type="submit"> <input type="hidden" name="id" value={game_id} />
<MinusCircle class="square-5" /> Remove from wishlist <Button class="flex gap-1" variant="destructive" type="submit">
</Button> <MinusCircle class="square-5" /> Remove from wishlist
</form> </Button>
{:else} </form>
<form method="POST" action='/wishlist?/add' use:enhance> {:else}
<input type="hidden" name="id" value={game_id} /> <form method="POST" action='/wishlist?/add' use:enhance>
<Button variant="destructive" type="submit"> <input type="hidden" name="id" value={game_id} />
<PlusCircle class="square-5" /> Add to wishlist <Button class="flex gap-1" type="submit">
</Button> <PlusCircle class="square-5" /> Add to wishlist
</form> </Button>
{/if} </form>
{/if}
{#if in_collection} {#if in_collection}
<form method="POST" action='/collection?/remove' use:enhance> <form method="POST" action='/collection?/remove' use:enhance>
<input type="hidden" name="id" value={game_id} /> <input type="hidden" name="id" value={game_id} />
<Button variant="destructive" type="submit"> <Button class="flex gap-1" type="submit" variant="destructive">
<MinusCircle class="square-5" /> Remove from collection <MinusCircle class="square-5" /> Remove from collection
</Button> </Button>
</form> </form>
{:else} {:else}
<form method="POST" action='/collection?/add' use:enhance> <form method="POST" action='/collection?/add' use:enhance>
<input type="hidden" name="id" value={game_id} /> <input type="hidden" name="id" value={game_id} />
<Button variant="destructive" type="submit"> <Button class="flex gap-1" type="submit">
<PlusCircle class="square-5" /> Add to collection <PlusCircle class="square-5" /> Add to collection
</Button> </Button>
</form> </form>
{/if} {/if}
</div>
<div class="flex flex-col gap-1"> <!-- <div class="flex flex-col gap-1"> -->
<!-- svelte-ignore a11y-label-has-associated-control - $label contains the 'for' attribute --> <!-- svelte-ignore a11y-label-has-associated-control - $label contains the 'for' attribute -->
<button <!-- <button
class="flex h-10 min-w-[220px] items-center justify-between rounded-md bg-white px-3 py-2 text-black-500 transition-opacity hover:opacity-90" class="flex h-10 min-w-[220px] items-center justify-between rounded-md bg-white px-3 py-2 text-black-500 transition-opacity hover:opacity-90"
use:melt={$trigger} use:melt={$trigger}
aria-label="Wishlist" aria-label="Wishlist"
@ -107,32 +109,4 @@
{/each} {/each}
</div> </div>
{/if} {/if}
</div> </div> -->
<!-- <CardFooter>
<div class="grid gap-2 place-items-center">
<form method="POST" action={`/collection?/${existsInCollection ? 'remove' : 'add'}`}>
<input type="hidden" name="id" value={game.id} />
<Button variant={existsInCollection ? 'destructive' : 'default'}>
{collectionText}
{#if existsInCollection}
<iconify-icon class="ml-2" icon={minusCircle} width="24" height="24" />
{:else}
<iconify-icon class="ml-2" icon={plusCircle} width="24" height="24" />
{/if}
</Button>
</form>
<!-- Add dropdown for wishlist add -->
<!--- <form method="POST" action={`/wishlist?/${existsInWishlist ? 'remove' : 'add'}`}>
<input type="hidden" name="id" value={game.id} />
<Button variant={existsInWishlist ? 'destructive' : 'default'}>
{wishlistText}
{#if existsInWishlist}
<iconify-icon class="ml-2" icon={minusCircle} width="24" height="24" />
{:else}
<iconify-icon class="ml-2" icon={plusCircle} width="24" height="24" />
{/if}
</Button>
</form>
</div>
</CardFooter> -->