reposted by indicators

src/components/InfiniteCustomFeed.tsx

···
 //import { useInView } from "react-intersection-observer";
 import { UniversalPostRendererATURILoader } from "~/components/UniversalPostRenderer";
 import { useAuth } from "~/providers/PassAuthProvider";
-import { useQueryArbitrary, useQueryIdentity, useInfiniteQueryFeedSkeleton } from "~/utils/useQuery";
+import {
+  useQueryArbitrary,
+  useQueryIdentity,
+  useInfiniteQueryFeedSkeleton,
+} from "~/utils/useQuery";
 
 interface InfiniteCustomFeedProps {
   feedUri: string;
···
   feedServiceDid?: string;
 }
 
-export function InfiniteCustomFeed({ feedUri, pdsUrl, feedServiceDid }: InfiniteCustomFeedProps) {
+export function InfiniteCustomFeed({
+  feedUri,
+  pdsUrl,
+  feedServiceDid,
+}: InfiniteCustomFeedProps) {
   const { agent, authed } = useAuth();
-  
+
   // const identityresultmaybe = useQueryIdentity(agent?.did);
   // const identity = identityresultmaybe?.data;
   // const feedGenGetRecordQuery = useQueryArbitrary(feedUri);
···
   }
 
   if (isError) {
-    return <div className="p-4 text-center text-red-500">Error: {error.message}</div>;
+    return (
+      <div className="p-4 text-center text-red-500">Error: {error.message}</div>
+    );
   }
 
-  const allPosts = data?.pages.flatMap((page) => {if (page) return page.feed}) ?? [];
+  const allPosts =
+    data?.pages.flatMap((page) => {
+      if (page) return page.feed;
+    }) ?? [];
 
   if (!allPosts || typeof allPosts !== "object" || allPosts.length === 0) {
-    return <div className="p-4 text-center text-gray-500">No posts in this feed.</div>;
+    return (
+      <div className="p-4 text-center text-gray-500">
+        No posts in this feed.
+      </div>
+    );
   }
 
   return (
     <>
       {allPosts.map((item, i) => {
-        if (item) return (
-        <UniversalPostRendererATURILoader key={item.post || i} atUri={item.post} />
-      )})}
+        if (item)
+          return (
+            <UniversalPostRendererATURILoader
+              key={item.post || i}
+              atUri={item.post}
+              feedviewpost={true}
+              repostedby={!!item.reason?.$type && (item.reason as any)?.repost}
+            />
+          );
+      })}
       {/* allPosts?: {allPosts ? "true" : "false"}
       hasNextPage?: {hasNextPage ? "true" : "false"}
       isFetchingNextPage?: {isFetchingNextPage ? "true" : "false"} */}

src/components/UniversalPostRenderer.tsx

···
   topReplyLine?: boolean;
   bottomBorder?: boolean;
   feedviewpost?: boolean;
+  repostedby?: string;
 }
 
 // export async function cachedGetRecord({
···
   topReplyLine,
   bottomBorder = true,
   feedviewpost = false,
+  repostedby,
 }: UniversalPostRendererATURILoaderProps) {
   console.log("atUri", atUri);
   //const { get, set } = usePersistentStore();
···
   //     });
   //   }
   // };
+  if (!postQuery?.value) {
+    // deleted post more often than a non-resolvable post
+    return (<></>)
+  }
 
   return (
     <UniversalPostRendererRawRecordShim
···
       topReplyLine={topReplyLine}
       bottomBorder={bottomBorder}
       feedviewpost={feedviewpost}
+      repostedby={repostedby}
     />
   );
 }
···
   topReplyLine = false,
   bottomBorder = true,
   feedviewpost = false,
+  repostedby,
 }: {
   postRecord: any;
   profileRecord: any;
···
   topReplyLine?: boolean;
   bottomBorder?: boolean;
   feedviewpost?: boolean;
+  repostedby?: string;
 }) {
   console.log(`received aturi: ${aturi} of post content: ${postRecord}`);
   const navigate = useNavigate();
···
     feedviewpost ? feedviewpostreplydid : undefined
   );
   const feedviewpostreplyhandle = replyhookvalue?.data?.handle;
+
+
+  const aturirepostbydid = repostedby ? new AtUri(repostedby).host : undefined
+  const repostedbyhookvalue = useQueryIdentity(
+    repostedby ? aturirepostbydid : undefined
+  );
+  const feedviewpostrepostedbyhandle = repostedbyhookvalue?.data?.handle;
   return (
     <>
       {/* <p>
···
         bottomBorder={bottomBorder}
         //extraOptionalItemInfo={{reply: postRecord?.value?.reply as AppBskyFeedDefs.ReplyRef, post: fakepost}}
         feedviewpostreplyhandle={feedviewpostreplyhandle}
+        repostedby={feedviewpostrepostedbyhandle}
       />
     </>
   );
···
   bottomBorder = true,
   feedviewpostreplyhandle,
   depth = 0,
+  repostedby,
 }: {
   post: PostView;
   // optional for now because i havent ported every use to this yet
···
   bottomBorder?: boolean;
   feedviewpostreplyhandle?: string;
   depth?: number;
+  repostedby?: string;
 }) {
   const navigate = useNavigate();
   const [hasRetweeted, setHasRetweeted] = useState<Boolean>(
···
     }
   };
 
-  const isRepost = extraOptionalItemInfo
+  const isRepost = repostedby ? repostedby : extraOptionalItemInfo
     ? AppBskyFeedDefs.isReasonRepost(extraOptionalItemInfo.reason)
       ? extraOptionalItemInfo.reason?.by.displayName
       : undefined
···
           }}
           className="text-gray-500 dark:text-gray-400"
         >
-          <MdiRepost /> Reposted by {isRepost}{" "}
+          <MdiRepost /> Reposted by @{isRepost}{" "}
         </div>
       )}
       {!isQuote && (
···
               maxWidth: `calc(100% - ${!expanded ? (isQuote ? 26 : 0) : 54}px)`,
               width: `calc(100% - ${!expanded ? (isQuote ? 26 : 0) : 54}px)`,
               marginLeft: !expanded ? (isQuote ? 26 : 0) : 54,
-              marginBottom: !expanded ? 4 : 0,
+              marginBottom: !expanded ? 4 : 6,
             }}
           >
             <div
···
                 gap: expanded ? 0 : 6,
                 alignItems: expanded ? "flex-start" : "center",
                 flexDirection: expanded ? "column" : "row",
-                height: expanded ? 48 : "1rem",
+                height: expanded ? 42 : "1rem",
               }}
             >
               <span
···
               }}
               className="text-gray-500 dark:text-gray-400"
             >
-              <MdiReply /> Reply to {feedviewpostreplyhandle}
+              <MdiReply /> Reply to @{feedviewpostreplyhandle}
             </div>
           )}
           <div
···
           ) : null}
           {post.embed && depth > 0 && (
             <>
-              <div className="border-gray-300 dark:border-gray-600 p-3 rounded-xl border italic text-gray-400">
+              <div className="border-gray-300 dark:border-gray-600 p-3 rounded-xl border italic text-gray-400 text-[14px]">
                 (there is an embed here thats too deep to render)
               </div>
             </>