diff --git a/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx b/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx
index 50e5c21e..ce5c5cd6 100644
--- a/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx
+++ b/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx
@@ -46,6 +46,7 @@ export const ProfileHeader = (props: {
             {/*<div className="spacer "/>*/}
             {props.publications.map((p) => (
               <PublicationCard
+                key={p.uri}
                 record={p.record as PubLeafletPublication.Record}
                 uri={p.uri}
               />
diff --git a/app/api/rpc/[command]/get_profile_data.ts b/app/api/rpc/[command]/get_profile_data.ts
new file mode 100644
index 00000000..1e3dceb6
--- /dev/null
+++ b/app/api/rpc/[command]/get_profile_data.ts
@@ -0,0 +1,61 @@
+import { z } from "zod";
+import { makeRoute } from "../lib";
+import type { Env } from "./route";
+import { idResolver } from "app/(home-pages)/reader/idResolver";
+
+export type GetProfileDataReturnType = Awaited<
+  ReturnType<(typeof get_profile_data)["handler"]>
+>;
+
+export const get_profile_data = makeRoute({
+  route: "get_profile_data",
+  input: z.object({
+    didOrHandle: z.string(),
+  }),
+  handler: async ({ didOrHandle }, { supabase }: Pick<Env, "supabase">) => {
+    // Resolve handle to DID if necessary
+    let did = didOrHandle;
+
+    if (!didOrHandle.startsWith("did:")) {
+      const resolved = await idResolver.handle.resolve(didOrHandle);
+      if (!resolved) {
+        throw new Error("Could not resolve handle to DID");
+      }
+      did = resolved;
+    }
+
+    // Fetch profile
+    const { data: profile, error: profileError } = await supabase
+      .from("bsky_profiles")
+      .select("*")
+      .eq("did", did)
+      .single();
+
+    if (profileError) {
+      throw new Error(`Failed to fetch profile: ${profileError.message}`);
+    }
+
+    if (!profile) {
+      throw new Error("Profile not found");
+    }
+
+    // Fetch publications for the DID
+    const { data: publications, error: publicationsError } = await supabase
+      .from("publications")
+      .select("*")
+      .eq("identity_did", did);
+
+    if (publicationsError) {
+      throw new Error(
+        `Failed to fetch publications: ${publicationsError.message}`,
+      );
+    }
+
+    return {
+      result: {
+        profile,
+        publications: publications || [],
+      },
+    };
+  },
+});
diff --git a/app/api/rpc/[command]/route.ts b/app/api/rpc/[command]/route.ts
index 4767ffb4..df7a865b 100644
--- a/app/api/rpc/[command]/route.ts
+++ b/app/api/rpc/[command]/route.ts
@@ -13,6 +13,7 @@ import { get_leaflet_data } from "./get_leaflet_data";
 import { get_publication_data } from "./get_publication_data";
 import { search_publication_names } from "./search_publication_names";
 import { search_publication_documents } from "./search_publication_documents";
+import { get_profile_data } from "./get_profile_data";
 
 let supabase = createClient<Database>(
   process.env.NEXT_PUBLIC_SUPABASE_API_URL as string,
@@ -39,6 +40,7 @@ let Routes = [
   get_publication_data,
   search_publication_names,
   search_publication_documents,
+  get_profile_data,
 ];
 export async function POST(
   req: Request,
diff --git a/app/lish/[did]/[publication]/[rkey]/Interactions/Comments/index.tsx b/app/lish/[did]/[publication]/[rkey]/Interactions/Comments/index.tsx
index d82aeea4..b848aa3f 100644
--- a/app/lish/[did]/[publication]/[rkey]/Interactions/Comments/index.tsx
+++ b/app/lish/[did]/[publication]/[rkey]/Interactions/Comments/index.tsx
@@ -18,11 +18,12 @@ import { usePathname } from "next/navigation";
 import { QuoteContent } from "../Quotes";
 import { timeAgo } from "src/utils/timeAgo";
 import { useLocalizedDate } from "src/hooks/useLocalizedDate";
+import { ProfilePopover } from "components/ProfilePopover";
 
 export type Comment = {
   record: Json;
   uri: string;
-  bsky_profiles: { record: Json } | null;
+  bsky_profiles: { record: Json; did: string } | null;
 };
 export function Comments(props: {
   document_uri: string;
@@ -109,17 +110,25 @@ const Comment = (props: {
   document: string;
   comment: Comment;
   comments: Comment[];
-  profile?: AppBskyActorProfile.Record;
+  profile: AppBskyActorProfile.Record;
   record: PubLeafletComment.Record;
   pageId?: string;
 }) => {
+  const did = props.comment.bsky_profiles?.did;
+
   return (
     <div id={props.comment.uri} className="comment">
       <div className="flex gap-2">
-        {props.profile && (
-          <ProfilePopover profile={props.profile} comment={props.comment.uri} />
+        {did && (
+          <ProfilePopover
+            didOrHandle={did}
+            trigger={
+              <div className="text-sm text-tertiary font-bold hover:underline">
+                {props.profile.displayName}
+              </div>
+            }
+          />
         )}
-        <DatePopover date={props.record.createdAt} />
       </div>
       {props.record.attachment &&
         PubLeafletComment.isLinearDocumentQuote(props.record.attachment) && (
@@ -291,96 +300,3 @@ const DatePopover = (props: { date: string }) => {
     </Popover>
   );
 };
-
-const ProfilePopover = (props: {
-  profile: AppBskyActorProfile.Record;
-  comment: string;
-}) => {
-  let commenterId = new AtUri(props.comment).host;
-
-  return (
-    <>
-      <a
-        className="font-bold  text-tertiary text-sm hover:underline"
-        href={`https://bsky.app/profile/${commenterId}`}
-      >
-        {props.profile.displayName}
-      </a>
-      {/*<Media mobile={false}>
-        <Popover
-          align="start"
-          trigger={
-            <div
-              onMouseOver={() => {
-                setHovering(true);
-                hoverTimeout.current = window.setTimeout(() => {
-                  setLoadProfile(true);
-                }, 500);
-              }}
-              onMouseOut={() => {
-                setHovering(false);
-                clearTimeout(hoverTimeout.current);
-              }}
-              className="font-bold  text-tertiary text-sm hover:underline"
-            >
-              {props.profile.displayName}
-            </div>
-          }
-          className="max-w-sm"
-        >
-          {profile && (
-            <>
-              <div className="profilePopover text-sm flex gap-2">
-                <div className="w-5 h-5 bg-test rounded-full shrink-0 mt-[2px]" />
-                <div className="flex flex-col">
-                  <div className="flex justify-between">
-                    <div className="profileHeader flex gap-2 items-center">
-                      <div className="font-bold">celine</div>
-                      <a className="text-tertiary" href="/">
-                        @{profile.handle}
-                      </a>
-                    </div>
-                  </div>
-
-                  <div className="profileBio text-secondary ">
-                    {profile.description}
-                  </div>
-                  <div className="flex flex-row gap-2 items-center pt-2 font-bold">
-                    {!profile.viewer?.following ? (
-                      <div className="text-tertiary bg-border-light rounded-md px-1 py-0">
-                        Following
-                      </div>
-                    ) : (
-                      <ButtonPrimary compact className="text-sm">
-                        Follow <BlueskyTiny />
-                      </ButtonPrimary>
-                    )}
-                    {profile.viewer?.followedBy && (
-                      <div className="text-tertiary">Follows You</div>
-                    )}
-                  </div>
-                </div>
-              </div>
-
-              <hr className="my-2 border-border-light" />
-              <div className="flex gap-2 leading-tight items-center text-tertiary text-sm">
-                <div className="flex flex-col w-6 justify-center">
-                  {profile.viewer?.knownFollowers?.followers.map((follower) => {
-                    return (
-                      <div
-                        className="w-[18px] h-[18px] bg-test rounded-full border-2 border-bg-page"
-                        key={follower.did}
-                      />
-                    );
-                  })}
-                  <div className="w-[18px] h-[18px] bg-test rounded-full -mt-2 border-2 border-bg-page" />
-                  <div className="w-[18px] h-[18px] bg-test rounded-full -mt-2 border-2 border-bg-page" />
-                </div>
-              </div>
-            </>
-          )}
-        </Popover>
-      </Media>*/}
-    </>
-  );
-};
diff --git a/components/ProfilePopover.tsx b/components/ProfilePopover.tsx
new file mode 100644
index 00000000..1a890cc5
--- /dev/null
+++ b/components/ProfilePopover.tsx
@@ -0,0 +1,42 @@
+"use client";
+import { ProfileHeader } from "app/p/[didOrHandle]/(profile)/ProfileHeader";
+import { Popover } from "./Popover";
+import useSWR from "swr";
+import { callRPC } from "app/api/rpc/client";
+import { useState } from "react";
+
+export const ProfilePopover = (props: {
+  trigger: React.ReactNode;
+  didOrHandle: string;
+}) => {
+  const [isOpen, setIsOpen] = useState(false);
+
+  const { data, isLoading } = useSWR(
+    isOpen ? ["profile-data", props.didOrHandle] : null,
+    async () => {
+      const response = await callRPC("get_profile_data", {
+        didOrHandle: props.didOrHandle,
+      });
+      return response.result;
+    },
+  );
+
+  return (
+    <Popover
+      className="max-w-sm p-0! text-center"
+      trigger={props.trigger}
+      onOpenChange={setIsOpen}
+    >
+      {isLoading ? (
+        <div className="text-secondary p-4">Loading...</div>
+      ) : data ? (
+        <ProfileHeader
+          profile={data.profile}
+          publications={data.publications}
+        />
+      ) : (
+        <div className="text-secondary p-4">Profile not found</div>
+      )}
+    </Popover>
+  );
+};