Removing hopefully that last of prisma, convert the files to use drizzle, and fix shadcn-svelte pagination with newer lucide icon.

This commit is contained in:
Bradley Shellnut 2024-03-10 12:09:37 -07:00
parent a267cb5193
commit e7d1df356e
10 changed files with 49 additions and 74 deletions

View file

@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
import { Button as ButtonPrimitive } from "bits-ui"; import { Button as ButtonPrimitive } from "bits-ui";
import { cn } from "$lib/utils"; import { cn } from "$lib/utils.js";
import { buttonVariants, type Props, type Events } from "."; import { buttonVariants, type Props, type Events } from "./index.js";
type $$Props = Props; type $$Props = Props;
type $$Events = Events; type $$Events = Events;

View file

@ -1,5 +1,5 @@
<script lang="ts"> <script lang="ts">
import { cn } from "$lib/utils"; import { cn } from "$lib/utils.js";
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from "svelte/elements";
type $$Props = HTMLAttributes<HTMLUListElement>; type $$Props = HTMLAttributes<HTMLUListElement>;

View file

@ -1,6 +1,6 @@
<script lang="ts"> <script lang="ts">
import MoreHorizontal from "lucide-svelte/icons/more-horizontal"; import Ellipsis from "lucide-svelte/icons/ellipsis";
import { cn } from "$lib/utils"; import { cn } from "$lib/utils.js";
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from "svelte/elements";
type $$Props = HTMLAttributes<HTMLSpanElement>; type $$Props = HTMLAttributes<HTMLSpanElement>;
@ -14,6 +14,6 @@
class={cn("flex h-9 w-9 items-center justify-center", className)} class={cn("flex h-9 w-9 items-center justify-center", className)}
{...$$restProps} {...$$restProps}
> >
<MoreHorizontal class="h-4 w-4" /> <Ellipsis class="h-4 w-4" />
<span class="sr-only">More pages</span> <span class="sr-only">More pages</span>
</span> </span>

View file

@ -1,5 +1,5 @@
<script lang="ts"> <script lang="ts">
import { cn } from "$lib/utils"; import { cn } from "$lib/utils.js";
import type { HTMLAttributes } from "svelte/elements"; import type { HTMLAttributes } from "svelte/elements";
type $$Props = HTMLAttributes<HTMLLIElement>; type $$Props = HTMLAttributes<HTMLLIElement>;

View file

@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
import { Pagination as PaginationPrimitive } from "bits-ui"; import { Pagination as PaginationPrimitive } from "bits-ui";
import { cn } from "$lib/utils"; import { cn } from "$lib/utils.js";
import { buttonVariants, type Props } from "$lib/components/ui/button"; import { buttonVariants, type Props } from "$lib/components/ui/button/index.js";
type $$Props = PaginationPrimitive.PageProps & type $$Props = PaginationPrimitive.PageProps &
Props & { Props & {

View file

@ -1,8 +1,8 @@
<script lang="ts"> <script lang="ts">
import { Pagination as PaginationPrimitive } from "bits-ui"; import { Pagination as PaginationPrimitive } from "bits-ui";
import ChevronRight from "lucide-svelte/icons/chevron-right"; import ChevronRight from "lucide-svelte/icons/chevron-right";
import { Button } from "$lib/components/ui/button"; import { Button } from "$lib/components/ui/button/index.js";
import { cn } from "$lib/utils"; import { cn } from "$lib/utils.js";
type $$Props = PaginationPrimitive.NextButtonProps; type $$Props = PaginationPrimitive.NextButtonProps;
type $$Events = PaginationPrimitive.NextButtonEvents; type $$Events = PaginationPrimitive.NextButtonEvents;

View file

@ -1,8 +1,8 @@
<script lang="ts"> <script lang="ts">
import { Pagination as PaginationPrimitive } from "bits-ui"; import { Pagination as PaginationPrimitive } from "bits-ui";
import ChevronLeft from "lucide-svelte/icons/chevron-left"; import ChevronLeft from "lucide-svelte/icons/chevron-left";
import { Button } from "$lib/components/ui/button"; import { Button } from "$lib/components/ui/button/index.js";
import { cn } from "$lib/utils"; import { cn } from "$lib/utils.js";
type $$Props = PaginationPrimitive.PrevButtonProps; type $$Props = PaginationPrimitive.PrevButtonProps;
type $$Events = PaginationPrimitive.PrevButtonEvents; type $$Events = PaginationPrimitive.PrevButtonEvents;

View file

@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
import { Pagination as PaginationPrimitive } from "bits-ui"; import { Pagination as PaginationPrimitive } from "bits-ui";
import { cn } from "$lib/utils"; import { cn } from "$lib/utils.js";
type $$Props = PaginationPrimitive.Props; type $$Props = PaginationPrimitive.Props;
type $$Events = PaginationPrimitive.Events; type $$Events = PaginationPrimitive.Events;

View file

@ -1,7 +1,7 @@
import { error, json } from '@sveltejs/kit'; import { error, json } from '@sveltejs/kit';
import { eq } from 'drizzle-orm'; import { eq } from 'drizzle-orm';
import db from '$lib/drizzle.js'; import db from '$lib/drizzle.js';
import { collection_items, collection_items, users } from '../../../../../schema.js'; import { collection_items, users } from '../../../../../schema.js';
// Search a user's collection // Search a user's collection
export async function GET({ url, locals, params }) { export async function GET({ url, locals, params }) {
@ -12,16 +12,15 @@ export async function GET({ url, locals, params }) {
const order = searchParams?.order || 'asc'; const order = searchParams?.order || 'asc';
const sort = searchParams?.sort || 'name'; const sort = searchParams?.sort || 'name';
const collection_id = params.id; const collection_id = params.id;
const session = await locals.auth.validate();
console.log('url', url); console.log('url', url);
console.log('username', locals?.user?.id); console.log('username', locals?.user?.id);
if (!session) { if (!locals.user) {
error(401, { message: 'Unauthorized' }); error(401, { message: 'Unauthorized' });
} }
const collection = await db.query.collections.findFirst({ const collection = await db.query.collections.findFirst({
where: eq(users.id, locals?.user?.userId) where: eq(users.id, locals?.user?.id)
}); });
console.log('collection', collection); console.log('collection', collection);
@ -31,40 +30,30 @@ export async function GET({ url, locals, params }) {
} }
try { try {
const orderBy = { [sort]: order }; const userCollectionItems = await db.query.collection_items.findMany({
let collection_items = await db.query.collection_items.findMany({
where: eq(collection_items.collection_id, collection_id), where: eq(collection_items.collection_id, collection_id),
AND: [ with: {
{
game: {
name: {
contains: q
}
}
}
]
},
orderBy: [
{
game: {
...orderBy
}
}
],
include: {
game: { game: {
select: { columns: {
id: true, id: true,
name: true, name: true,
thumb_url: true thumb_url: true
} },
} }
}, },
skip, orderBy: (collection_items, { asc, desc }) => {
take: limit const dbSort = sort === 'dateAdded' ? collection_items.created_at : collection_items.times_played;
if (order === 'asc') {
return asc(dbSort);
} else {
return desc(dbSort);
}
},
offset: skip,
limit
}); });
return json(collection_items); return json(userCollectionItems);
} catch (e) { } catch (e) {
console.error(e); console.error(e);
error(500, { message: 'Something went wrong' }); error(500, { message: 'Something went wrong' });

View file

@ -1,18 +1,16 @@
import { error, json } from '@sveltejs/kit'; import { error, json } from '@sveltejs/kit';
import prisma from '$lib/prisma'; import { eq } from 'drizzle-orm';
import { and, eq } from 'drizzle-orm';
import { collection_items } from '../../../../../schema.js';
import db from '$lib/drizzle.js'; import db from '$lib/drizzle.js';
import { wishlist_items, wishlists } from '../../../../../schema.js';
// Search a user's collection // Search a user's collection
export async function GET({ url, locals, params }) { export async function GET({ url, locals, params }) {
const searchParams = Object.fromEntries(url.searchParams); const searchParams = Object.fromEntries(url.searchParams);
const q = searchParams?.q || ''; // const q = searchParams?.q || '';
const limit = parseInt(searchParams?.limit) || 10; const limit = parseInt(searchParams?.limit) || 10;
const skip = parseInt(searchParams?.skip) || 0; const skip = parseInt(searchParams?.skip) || 0;
const order = searchParams?.order || 'asc'; const order = searchParams?.order || 'asc';
const sort = searchParams?.sort || 'name'; const wishlist_id = params.id;
const collection_id = params.id;
console.log('url', url); console.log('url', url);
console.log('username', locals?.user?.id); console.log('username', locals?.user?.id);
@ -22,32 +20,30 @@ export async function GET({ url, locals, params }) {
}); });
} }
const collection = await db.collection.findUnique({ const wishlist = await db.query.wishlists.findFirst({
where: { where: eq(wishlists.user_id, locals?.user?.id)
user_id: locals.user.id
}
}); });
console.log('collection', collection); console.log('wishlist', wishlist);
if (!collection) { if (!wishlist) {
console.log('Collection was not found'); console.log('Wishlist was not found');
error(404, { message: 'Collection was not found' }); error(404, { message: 'Wishlist was not found' });
} }
try { try {
const itemsInCollection = await db.query.collection_items.findMany({ const itemsInWishlist = await db.query.wishlist_items.findMany({
where: eq(collection_items.collection_id, collection_id), where: eq(wishlist_items.wishlist_id, wishlist_id),
with: { with: {
game: { game: {
columns: { columns: {
id: true, id: true,
name: true, name: true,
thumb_url: true, thumb_url: true
}, }
} }
}, },
orderBy: (collection_items, { asc, desc }) => { orderBy: (wishlist_items, { asc, desc }) => {
const dbSort = sort === 'dateAdded' ? collection_items.created_at : collection_items.times_played; const dbSort = wishlist_items.created_at;
if (order === 'asc') { if (order === 'asc') {
return asc(dbSort); return asc(dbSort);
} else { } else {
@ -58,17 +54,7 @@ export async function GET({ url, locals, params }) {
limit limit
}); });
// include: { return json(itemsInWishlist);
// game: {
// select: {
// id: true,
// name: true,
// thumb_url: true
// }
// }
// },
return json(collection_items);
} catch (e) { } catch (e) {
console.error(e); console.error(e);
error(500, { message: 'Something went wrong' }); error(500, { message: 'Something went wrong' });