From 0e194d648ec69121b62dad68b410c37eccb7c126 Mon Sep 17 00:00:00 2001 From: celine Date: Fri, 10 Oct 2025 17:52:56 -0400 Subject: [PATCH] added comment and quote counts to post listing, cleaned up some other stuff --- app/reader/ReaderContent.tsx | 139 +++++++++++++++++---- app/reader/SubscriptionsContent.tsx | 1 - app/reader/page.tsx | 16 ++- components/ActionBar/Publications.tsx | 8 +- components/PageLayouts/DashboardLayout.tsx | 18 +-- 5 files changed, 131 insertions(+), 51 deletions(-) diff --git a/app/reader/ReaderContent.tsx b/app/reader/ReaderContent.tsx index 3aaf3975..5693731b 100644 --- a/app/reader/ReaderContent.tsx +++ b/app/reader/ReaderContent.tsx @@ -1,17 +1,16 @@ "use client"; import { AtUri } from "@atproto/api"; -import { getPublicationURL } from "app/lish/createPub/getPublicationURL"; +import { Interactions } from "app/lish/[did]/[publication]/[rkey]/Interactions/Interactions"; import { PubIcon } from "components/ActionBar/Publications"; import { ButtonPrimary } from "components/Buttons"; +import { CommentTiny } from "components/Icons/CommentTiny"; import { DiscoverSmall } from "components/Icons/DiscoverSmall"; -import { ShareSmall } from "components/Icons/ShareSmall"; +import { QuoteTiny } from "components/Icons/QuoteTiny"; import { Separator } from "components/Layout"; -import { useCardBorderHidden } from "components/Pages/useCardBorderHidden"; import { SpeedyLink } from "components/SpeedyLink"; import { usePubTheme } from "components/ThemeManager/PublicationThemeProvider"; import { BaseThemeProvider } from "components/ThemeManager/ThemeProvider"; import { PubLeafletDocument, PubLeafletPublication } from "lexicons/api"; -import Link from "next/link"; import { blobRefToSrc } from "src/utils/blobRefToSrc"; import { Json } from "supabase/database.types"; @@ -23,7 +22,21 @@ export const ReaderContent = (props: { pubRecord: Json; uri: string; }; - documents: { data: Json; uri: string; indexed_at: string }; + documents: { + data: Json; + uri: string; + indexed_at: string; + comments_on_documents: + | { + count: number; + }[] + | undefined; + document_mentions_in_bsky: + | { + count: number; + }[] + | undefined; + }; }[]; }) => { if (props.posts.length === 0) return ; @@ -40,7 +53,21 @@ const Post = (props: { uri: string; href: string; }; - documents: { data: Json | undefined; uri: string; indexed_at: string }; + documents: { + data: Json; + uri: string; + indexed_at: string; + comments_on_documents: + | { + count: number; + }[] + | undefined; + document_mentions_in_bsky: + | { + count: number; + }[] + | undefined; + }; }) => { let pubRecord = props.publication.pubRecord as PubLeafletPublication.Record; @@ -60,6 +87,12 @@ const Post = (props: { let showPageBackground = pubRecord.theme?.showPageBackground; + let quotes = props.documents.document_mentions_in_bsky?.[0]?.count || 0; + let comments = + pubRecord.preferences?.showComments === false + ? 0 + : props.documents.comments_on_documents?.[0]?.count || 0; + return (
{postRecord.title}

{postRecord.description}

+
+
+ + + +
-
- - - {pubRecord.name} - - - NAME HERE - - {postRecord.publishedAt && - new Date(postRecord.publishedAt).toLocaleDateString("en-US", { - year: "numeric", - month: "short", - day: "numeric", - })} +
@@ -118,6 +152,65 @@ const Post = (props: { ); }; +const PubInfo = (props: { + href: string; + pubRecord: PubLeafletPublication.Record; + uri: string; +}) => { + return ( + + + {props.pubRecord.name} + + ); +}; + +const PostInfo = (props: { + author: string; + publishedAt: string | undefined; +}) => { + return ( +
+ NAME HERE + {props.publishedAt && ( + <> + + {new Date(props.publishedAt).toLocaleDateString("en-US", { + year: "numeric", + month: "short", + day: "numeric", + })}{" "} + + )} +
+ ); +}; + +const PostInterations = (props: { + quotesCount: number; + commentsCount: number; + showComments: boolean | undefined; +}) => { + return ( +
+ {props.quotesCount === 0 ? null : ( +
+ Post quotes + {props.quotesCount} +
+ )} + {props.showComments === false ? null : ( +
+ Post comments + {props.commentsCount} +
+ )} +
+ ); +}; const ReaderEmpty = () => { return (
diff --git a/app/reader/SubscriptionsContent.tsx b/app/reader/SubscriptionsContent.tsx index 8ab81907..7da17035 100644 --- a/app/reader/SubscriptionsContent.tsx +++ b/app/reader/SubscriptionsContent.tsx @@ -1,5 +1,4 @@ import { PubListing } from "app/discover/PubListing"; -import { PublicationsList } from "app/discover/page"; import { ButtonPrimary } from "components/Buttons"; import { DiscoverSmall } from "components/Icons/DiscoverSmall"; import { Json } from "supabase/database.types"; diff --git a/app/reader/page.tsx b/app/reader/page.tsx index dc233693..e261c420 100644 --- a/app/reader/page.tsx +++ b/app/reader/page.tsx @@ -92,7 +92,13 @@ export default async function Reader(props: {}) { if (!auth_res?.atp_did) return; let { data: publications } = await supabaseServerClient .from("publication_subscriptions") - .select(`publications(*, documents_in_publications(documents(*)))`) + .select( + `publications(*, documents_in_publications(documents( + *, + comments_on_documents(count), + document_mentions_in_bsky(count) + )))`, + ) .eq("identity", auth_res?.atp_did); // get publications to fit PublicationList type @@ -127,6 +133,9 @@ export default async function Reader(props: {}) { data: postInPub.documents!.data, uri: postInPub.documents!.uri, indexed_at: postInPub.documents!.indexed_at, + comments_on_documents: postInPub.documents?.comments_on_documents, + document_mentions_in_bsky: + postInPub.documents?.document_mentions_in_bsky, }, })); }) || []; @@ -173,11 +182,6 @@ export default async function Reader(props: {}) { ), }, - discover: { - controls: null, - content: <>, - href: "/discover", - }, }} /> diff --git a/components/ActionBar/Publications.tsx b/components/ActionBar/Publications.tsx index d436717d..816bea6c 100644 --- a/components/ActionBar/Publications.tsx +++ b/components/ActionBar/Publications.tsx @@ -99,6 +99,8 @@ export const PubIcon = (props: { }) => { if (!props.record) return; + let iconSizeClassName = `${props.small ? "w-4 h-4" : props.large ? "w-12 h-12" : "w-6 h-6"} rounded-full`; + return props.record.icon ? (
) : ( -
+
diff --git a/components/PageLayouts/DashboardLayout.tsx b/components/PageLayouts/DashboardLayout.tsx index b67f148b..8a4baa75 100644 --- a/components/PageLayouts/DashboardLayout.tsx +++ b/components/PageLayouts/DashboardLayout.tsx @@ -122,7 +122,6 @@ export function DashboardLayout< [name: string]: { content: React.ReactNode; controls: React.ReactNode; - href?: string; }; }, >(props: { @@ -135,7 +134,7 @@ export function DashboardLayout< actions: React.ReactNode; }) { let [tab, setTab] = useState(props.defaultTab); - let { content, controls, href } = props.tabs[tab]; + let { content, controls } = props.tabs[tab]; let [headerState, setHeaderState] = useState<"default" | "controls">( "default", @@ -166,21 +165,6 @@ export function DashboardLayout< {Object.keys(props.tabs).length > 1 && (
{Object.keys(props.tabs).map((t) => { - if (props.tabs[t].href) - return ( - - setTab(t)} - /> - - ); return (