feat(frontend): remote actor profile page with bio, fields, and posts

thoughts-frontend/app/users/[username]/page.tsx

@@ -5,8 +5,11 @@ import {
   getTopFriends,
   getUserProfile,
   getUserThoughts,
+  lookupRemoteActor,
+  getRemoteActorPosts,
   Me,
 } from "@/lib/api";
+import { RemoteUserProfile } from "@/components/remote-user-profile";
 import { UserAvatar } from "@/components/user-avatar";
 import { Calendar, Settings } from "lucide-react";
 import { Card } from "@/components/ui/card";
@@ -27,6 +30,28 @@ export default async function ProfilePage({ params }: ProfilePageProps) {
   const { username } = await params;
   const token = (await cookies()).get("auth_token")?.value ?? null;
 
+  const HANDLE_RE = /^@[\w.-]+@[\w.-]+\.\w+$/;
+
+  if (HANDLE_RE.test(username)) {
+    const [actorResult, postsResult, meResult] = await Promise.allSettled([
+      lookupRemoteActor(username, token),
+      getRemoteActorPosts(username, 1, token),
+      token ? getMe(token) : Promise.resolve(null),
+    ]);
+
+    if (actorResult.status === "rejected") {
+      notFound();
+    }
+
+    const actor = actorResult.value as Awaited<ReturnType<typeof lookupRemoteActor>>;
+    const posts =
+      postsResult.status === "fulfilled" ? postsResult.value.items : [];
+    const me =
+      meResult.status === "fulfilled" ? (meResult.value as Me | null) : null;
+
+    return <RemoteUserProfile actor={actor} initialPosts={posts} me={me} />;
+  }
+
   const userProfilePromise = getUserProfile(username, token);
   const thoughtsPromise = getUserThoughts(username, token);
   const mePromise = token ? getMe(token) : Promise.resolve(null);