thoughts-frontend/components/remote-user-card.tsx

@@ -2,6 +2,7 @@
 
 import { useState } from "react";
 import { useAuth } from "@/hooks/use-auth";
+import Link from "next/link";
 import { followUser, RemoteActor } from "@/lib/api";
 import { Button } from "@/components/ui/button";
 import { UserAvatar } from "@/components/user-avatar";
@@ -36,13 +37,16 @@ export function RemoteUserCard({ actor }: RemoteUserCardProps) {
 
   return (
     <div className="flex items-center justify-between p-4 border rounded-lg">
-      <div className="flex items-center gap-3">
+      <Link
+        href={`/users/${actor.handle}`}
+        className="flex items-center gap-3 hover:opacity-80"
+      >
         <UserAvatar src={actor.avatarUrl} alt={actor.displayName ?? actor.handle} />
         <div>
           <p className="font-medium">{actor.displayName ?? actor.handle}</p>
           <p className="text-sm text-muted-foreground">{actor.handle}</p>
         </div>
-      </div>
+      </Link>
       <Button
         onClick={handleFollow}
         disabled={loading || followed}