77 lines
2.4 KiB
TypeScript
77 lines
2.4 KiB
TypeScript
import { cookies } from "next/headers";
|
|
import { getMe, search, User } from "@/lib/api";
|
|
import { UserListCard } from "@/components/user-list-card";
|
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
|
import { ThoughtList } from "@/components/thought-list";
|
|
|
|
interface SearchPageProps {
|
|
searchParams: { q?: string };
|
|
}
|
|
|
|
export default async function SearchPage({ searchParams }: SearchPageProps) {
|
|
const query = searchParams.q || "";
|
|
const token = (await cookies()).get("auth_token")?.value ?? null;
|
|
|
|
if (!query) {
|
|
return (
|
|
<div className="container mx-auto max-w-2xl p-4 sm:p-6 text-center">
|
|
<h1 className="text-2xl font-bold mt-8">Search Thoughts</h1>
|
|
<p className="text-muted-foreground">
|
|
Find users and thoughts across the platform.
|
|
</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
const [results, me] = await Promise.all([
|
|
search(query, token).catch(() => null),
|
|
token ? getMe(token).catch(() => null) : null,
|
|
]);
|
|
|
|
const authorDetails = new Map<string, { avatarUrl?: string | null }>();
|
|
if (results) {
|
|
results.users.users.forEach((user: User) => {
|
|
authorDetails.set(user.username, { avatarUrl: user.avatarUrl });
|
|
});
|
|
}
|
|
|
|
return (
|
|
<div className="container mx-auto max-w-2xl p-4 sm:p-6">
|
|
<header className="my-6">
|
|
<h1 className="text-3xl font-bold">Search Results</h1>
|
|
<p className="text-muted-foreground">
|
|
Showing results for: "{query}"
|
|
</p>
|
|
</header>
|
|
<main>
|
|
{results ? (
|
|
<Tabs defaultValue="thoughts" className="w-full">
|
|
<TabsList>
|
|
<TabsTrigger value="thoughts">
|
|
Thoughts ({results.thoughts.thoughts.length})
|
|
</TabsTrigger>
|
|
<TabsTrigger value="users">
|
|
Users ({results.users.users.length})
|
|
</TabsTrigger>
|
|
</TabsList>
|
|
<TabsContent value="thoughts">
|
|
<ThoughtList
|
|
thoughts={results.thoughts.thoughts}
|
|
authorDetails={authorDetails}
|
|
currentUser={me}
|
|
/>
|
|
</TabsContent>
|
|
<TabsContent value="users">
|
|
<UserListCard users={results.users.users} />
|
|
</TabsContent>
|
|
</Tabs>
|
|
) : (
|
|
<p className="text-center text-muted-foreground pt-8">
|
|
No results found or an error occurred.
|
|
</p>
|
|
)}
|
|
</main>
|
|
</div>
|
|
);
|
|
}
|