leaflet.pub
a tool for shared writing and social publishing
awarm.space
1import { BaseTextBlock } from "app/lish/[did]/[publication]/[rkey]/BaseTextBlock";
2import {
3 AppBskyActorProfile,
4 PubLeafletComment,
5 PubLeafletDocument,
6 PubLeafletPublication,
7} from "lexicons/api";
8import { HydratedCommentNotification } from "src/notifications";
9import { blobRefToSrc } from "src/utils/blobRefToSrc";
10import { Avatar } from "components/Avatar";
11import { CommentTiny } from "components/Icons/CommentTiny";
12import {
13 CommentInNotification,
14 ContentLayout,
15 Notification,
16} from "./Notification";
17import { AtUri } from "@atproto/api";
18
19export const CommentNotification = (props: HydratedCommentNotification) => {
20 let docRecord = props.commentData.documents
21 ?.data as PubLeafletDocument.Record;
22 let commentRecord = props.commentData.record as PubLeafletComment.Record;
23 let profileRecord = props.commentData.bsky_profiles
24 ?.record as AppBskyActorProfile.Record;
25 const displayName =
26 profileRecord.displayName ||
27 props.commentData.bsky_profiles?.handle ||
28 "Someone";
29 const pubRecord = props.commentData.documents?.documents_in_publications[0]
30 ?.publications?.record as PubLeafletPublication.Record;
31 let rkey = new AtUri(props.commentData.documents?.uri!).rkey;
32
33 return (
34 <Notification
35 timestamp={props.commentData.indexed_at}
36 href={`https://${pubRecord.base_path}/${rkey}?interactionDrawer=comments`}
37 icon={<CommentTiny />}
38 actionText={<>{displayName} commented on your post</>}
39 content={
40 <ContentLayout postTitle={docRecord.title} pubRecord={pubRecord}>
41 <CommentInNotification
42 className=""
43 avatar={
44 profileRecord?.avatar?.ref &&
45 blobRefToSrc(
46 profileRecord?.avatar?.ref,
47 props.commentData.bsky_profiles?.did || "",
48 )
49 }
50 displayName={displayName}
51 index={[]}
52 plaintext={commentRecord.plaintext}
53 facets={commentRecord.facets}
54 />
55 </ContentLayout>
56 }
57 />
58 );
59};