feat(frontend): remote actor lookup and follow from search page

thoughts-frontend/app/search/page.tsx

@@ -1,9 +1,12 @@
 import { cookies } from "next/headers";
-import { getMe, search, User } from "@/lib/api";
+import { getMe, search, lookupRemoteActor, User } from "@/lib/api";
 import { UserListCard } from "@/components/user-list-card";
+import { RemoteUserCard } from "@/components/remote-user-card";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { ThoughtList } from "@/components/thought-list";
 
+const HANDLE_RE = /^@[\w.-]+@[\w.-]+\.\w+$/;
+
 interface SearchPageProps {
   searchParams: Promise<{ q?: string }>;
 }
@@ -24,8 +27,11 @@ export default async function SearchPage({ searchParams }: SearchPageProps) {
     );
   }
 
-  const [results, me] = await Promise.all([
-    search(query, token).catch(() => null),
+  const isHandle = HANDLE_RE.test(query);
+
+  const [results, remoteActor, me] = await Promise.all([
+    isHandle ? null : search(query, token).catch(() => null),
+    isHandle ? lookupRemoteActor(query, token).catch(() => null) : null,
     token ? getMe(token).catch(() => null) : null,
   ]);
 
@@ -45,7 +51,18 @@ export default async function SearchPage({ searchParams }: SearchPageProps) {
         </p>
       </header>
       <main>
-        {results ? (
+        {isHandle ? (
+          remoteActor ? (
+            <div className="space-y-4">
+              <h2 className="text-lg font-semibold">Remote user</h2>
+              <RemoteUserCard actor={remoteActor} />
+            </div>
+          ) : (
+            <p className="text-center text-muted-foreground pt-8">
+              No user found at {query}
+            </p>
+          )
+        ) : results ? (
           <Tabs defaultValue="thoughts" className="w-full">
             <TabsList>
               <TabsTrigger value="thoughts">