diff --git a/app/(app)/dashboard/client.tsx b/app/(app)/dashboard/client.tsx index ffa29da3..e9b9ac7d 100644 --- a/app/(app)/dashboard/client.tsx +++ b/app/(app)/dashboard/client.tsx @@ -27,8 +27,10 @@ import { SelectTrigger, SelectValue, } from '@/components/ui/select'; -import { useEffect } from 'react'; +import { useEffect, useState } from 'react'; import { FilterStyle, useDashboardStore } from './state'; +import useSwr from 'swr'; +import fetcher from '@/client/fetcher'; const Dashboard = ({ userEntries: originalUserEntries, @@ -45,13 +47,21 @@ const Dashboard = ({ userEntries, setUserEntries, - setUserEntry, } = useDashboardStore(); useEffect(() => { setUserEntries(originalUserEntries); }, [originalUserEntries]); + const { + data: queryResults, + error: queryError, + isLoading: queryIsLoading, + } = useSwr( + `/api/user/entries/search?q=${filterTitle}`, + fetcher + ); + return ( <>
@@ -158,13 +168,23 @@ const Dashboard = ({ } }) .map(userEntry => { - if ( + if (filterTitle !== '' && (queryIsLoading || queryError)) { + if ( + filterTitle !== '' && + !userEntry.entry.originalTitle + .toLowerCase() + .includes(filterTitle.toLowerCase()) + ) { + return; + } + } else if ( filterTitle !== '' && - !userEntry.entry.originalTitle - .toLowerCase() - .includes(filterTitle.toLowerCase()) + !queryIsLoading && + queryResults ) { - return; + if (!queryResults.includes(userEntry.id)) { + return; + } } // if ( diff --git a/app/api/user/entries/search/route.ts b/app/api/user/entries/search/route.ts new file mode 100644 index 00000000..648cee9f --- /dev/null +++ b/app/api/user/entries/search/route.ts @@ -0,0 +1,36 @@ +import { validateSessionToken } from '@/server/auth/validateSession'; +import prisma from '@/server/db'; +import { NextRequest } from 'next/server'; + +export const GET = async (request: NextRequest) => { + const user = await validateSessionToken(); + + if (!user) { + return Response.json({ error: 'You are not logged in' }, { status: 400 }); + } + + const query = request.nextUrl.searchParams.get('q'); + + if (!query) { + return Response.json({ error: 'No query provided' }, { status: 400 }); + } + + return Response.json( + ( + await prisma.userEntry.findMany({ + where: { + userId: user.id, + entry: { + alternativeTitles: { + some: { + title: { + contains: query, + }, + }, + }, + }, + }, + }) + ).map(e => e.id) + ); +}; diff --git a/client/fetcher.ts b/client/fetcher.ts new file mode 100644 index 00000000..7f6961d0 --- /dev/null +++ b/client/fetcher.ts @@ -0,0 +1,7 @@ +export default async function fetcher( + input: RequestInfo, + init?: RequestInit +): Promise { + const res = await fetch(input, init); + return res.json(); +} diff --git a/package.json b/package.json index 8dcb65ca..76bb7429 100644 --- a/package.json +++ b/package.json @@ -52,6 +52,7 @@ "react-dom": "18.2.0", "server-only": "^0.0.1", "sonner": "^1.4.0", + "swr": "^2.2.5", "tailwind-merge": "^2.2.1", "tailwindcss-animate": "^1.0.7", "usehooks-ts": "^2.16.0",