feat(apps/pano): use relay in post more options

apps/kampus/app/pano/PanoFeed.tsx

@@ -1,9 +1,10 @@
 import { Suspense, useCallback } from "react";
-import { graphql, usePaginationFragment } from "react-relay";
+import { graphql, useFragment, usePaginationFragment } from "react-relay";
 
 import { Button } from "@kampus/ui-next";
 
 import { PostItem } from "~/app/pano/features/post-list/PostItem";
+import { PanoFeed_viewer$key } from "./__generated__/PanoFeed_viewer.graphql";
 import { type PanoFeedFragment$key } from "./__generated__/PanoFeedFragment.graphql";
 
 const fragment = graphql`
@@ -28,15 +29,24 @@ const fragment = graphql`
   }
 `;
 
+const viewerFragment = graphql`
+  fragment PanoFeed_viewer on Actor {
+    displayName
+  }
+`;
+
 interface Props {
   panoFeed: PanoFeedFragment$key;
+  panoViewer: PanoFeed_viewer$key | null;
 }
 
 export function PanoFeed(props: Props) {
   const { data, hasNext, hasPrevious, loadNext, loadPrevious } = usePaginationFragment(
     fragment,
     props.panoFeed
   );
+  const viewer = useFragment(viewerFragment, props.panoViewer);
+  console.log(viewer, "-------------------viewer");
 
   const feed = data.panoFeed;
 

apps/kampus/app/pano/PostListContainer.tsx

@@ -16,17 +16,21 @@ const query = graphql`
   query PostListContainerQuery {
     viewer {
       ...PanoFeedFragment
+      actor {
+        ...PanoFeed_viewer
+      }
     }
   }
 `;
 
 export const PostListContainer = (props: Props) => {
   const queryRef = useSerializablePreloadedQuery(props.preloadedQuery);
   const data = usePreloadedQuery(query, queryRef);
+  console.log(data);
 
   if (!data.viewer) {
     return null;
   }
 
-  return <PanoFeed panoFeed={data.viewer} />;
+  return <PanoFeed panoFeed={data.viewer} panoViewer={data.viewer.actor} />;
 };