a tool for shared writing and social publishing
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

use static post content for rss

+146 -24
+2 -3
app/lish/[did]/[publication]/[rkey]/PostContent.tsx
··· 11 11 import { TextBlock } from "./TextBlock"; 12 12 import { Popover } from "components/Popover"; 13 13 import { theme } from "tailwind.config"; 14 - import { ServerSafePopover } from "./ServerSafePopover"; 15 14 import { ImageAltSmall } from "components/Icons/ImageAlt"; 16 15 17 16 export function PostContent({ ··· 134 133 /> 135 134 {b.block.alt && ( 136 135 <div className="absolute bottom-1.5 right-2 h-max"> 137 - <ServerSafePopover 136 + <Popover 138 137 className="text-sm max-w-xs min-w-0" 139 138 side="left" 140 139 trigger={<ImageAltSmall fillColor={theme.colors["bg-page"]} />} ··· 142 141 <div className="text-sm text-secondary w-full"> 143 142 {b.block.alt} 144 143 </div> 145 - </ServerSafePopover> 144 + </Popover> 146 145 </div> 147 146 )} 148 147 </div>
-19
app/lish/[did]/[publication]/[rkey]/ServerSafePopover.tsx
··· 1 - import { Popover } from "components/Popover"; 2 - 3 - export const ServerSafePopover = (props: { 4 - trigger: React.ReactNode; 5 - disabled?: boolean; 6 - children: React.ReactNode; 7 - align?: "start" | "end" | "center"; 8 - side?: "top" | "bottom" | "left" | "right"; 9 - background?: string; 10 - border?: string; 11 - className?: string; 12 - open?: boolean; 13 - onOpenChange?: (open: boolean) => void; 14 - asChild?: boolean; 15 - arrowFill?: string; 16 - }) => { 17 - if (typeof window === "undefined") return props.trigger; 18 - return <Popover {...props} />; 19 - };
+142
app/lish/[did]/[publication]/[rkey]/StaticPostContent.tsx
··· 1 + import { 2 + PubLeafletBlocksHeader, 3 + PubLeafletBlocksImage, 4 + PubLeafletBlocksText, 5 + PubLeafletBlocksUnorderedList, 6 + PubLeafletBlocksWebsite, 7 + PubLeafletDocument, 8 + PubLeafletPagesLinearDocument, 9 + } from "lexicons/api"; 10 + import { blobRefToSrc } from "src/utils/blobRefToSrc"; 11 + import { TextBlock } from "./TextBlock"; 12 + 13 + export function StaticPostContent({ 14 + blocks, 15 + did, 16 + }: { 17 + blocks: PubLeafletPagesLinearDocument.Block[]; 18 + did: string; 19 + }) { 20 + return ( 21 + <div className="postContent flex flex-col"> 22 + {blocks.map((b, index) => { 23 + return <Block block={b} did={did} key={index} />; 24 + })} 25 + </div> 26 + ); 27 + } 28 + 29 + let Block = ({ 30 + block, 31 + did, 32 + isList, 33 + }: { 34 + block: PubLeafletPagesLinearDocument.Block; 35 + did: string; 36 + isList?: boolean; 37 + }) => { 38 + let b = block; 39 + 40 + switch (true) { 41 + case PubLeafletBlocksUnorderedList.isMain(b.block): { 42 + return ( 43 + <ul> 44 + {b.block.children.map((child, index) => ( 45 + <ListItem item={child} did={did} key={index} /> 46 + ))} 47 + </ul> 48 + ); 49 + } 50 + case PubLeafletBlocksWebsite.isMain(b.block): { 51 + return ( 52 + <a href={b.block.src} target="_blank"> 53 + <h3>{b.block.title}</h3> 54 + <p>{b.block.description}</p> 55 + {b.block.previewImage && ( 56 + <div 57 + className={`imagePreview w-[120px] m-2 -mb-2 bg-cover shrink-0 rounded-t-md border border-border rotate-[4deg] origin-center relative`} 58 + style={{ 59 + backgroundImage: `url(${blobRefToSrc(b.block.previewImage?.ref, did)})`, 60 + backgroundPosition: "center", 61 + }} 62 + /> 63 + )} 64 + </a> 65 + ); 66 + } 67 + case PubLeafletBlocksImage.isMain(b.block): { 68 + return ( 69 + <img 70 + alt={b.block.alt} 71 + height={b.block.aspectRatio?.height} 72 + width={b.block.aspectRatio?.width} 73 + src={blobRefToSrc(b.block.image.ref, did)} 74 + /> 75 + ); 76 + } 77 + case PubLeafletBlocksText.isMain(b.block): 78 + return ( 79 + <p> 80 + <TextBlock facets={b.block.facets} plaintext={b.block.plaintext} /> 81 + </p> 82 + ); 83 + case PubLeafletBlocksHeader.isMain(b.block): { 84 + if (b.block.level === 1) 85 + return ( 86 + <h1> 87 + <TextBlock {...b.block} /> 88 + </h1> 89 + ); 90 + if (b.block.level === 2) 91 + return ( 92 + <h2> 93 + <TextBlock {...b.block} /> 94 + </h2> 95 + ); 96 + if (b.block.level === 3) 97 + return ( 98 + <h3> 99 + <TextBlock {...b.block} /> 100 + </h3> 101 + ); 102 + // if (b.block.level === 4) return <h4>{b.block.plaintext}</h4>; 103 + // if (b.block.level === 5) return <h5>{b.block.plaintext}</h5>; 104 + return ( 105 + <h6> 106 + <TextBlock {...b.block} /> 107 + </h6> 108 + ); 109 + } 110 + default: 111 + return null; 112 + } 113 + }; 114 + 115 + function ListItem(props: { 116 + item: PubLeafletBlocksUnorderedList.ListItem; 117 + did: string; 118 + className?: string; 119 + }) { 120 + return ( 121 + <li className={`!pb-0 flex flex-row gap-2`}> 122 + <div 123 + className={`listMarker shrink-0 mx-2 z-[1] mt-[14px] h-[5px] w-[5px] rounded-full bg-secondary`} 124 + /> 125 + <div className="flex flex-col"> 126 + <Block block={{ block: props.item.content }} did={props.did} isList /> 127 + {props.item.children?.length ? ( 128 + <ul className="-ml-[7px] sm:ml-[7px]"> 129 + {props.item.children.map((child, index) => ( 130 + <ListItem 131 + item={child} 132 + did={props.did} 133 + key={index} 134 + className={props.className} 135 + /> 136 + ))} 137 + </ul> 138 + ) : null} 139 + </div> 140 + </li> 141 + ); 142 + }
+2 -2
app/lish/[did]/[publication]/rss/route.ts
··· 10 10 import { NextRequest, NextResponse } from "next/server"; 11 11 import { createElement } from "react"; 12 12 import { supabaseServerClient } from "supabase/serverClient"; 13 - import { PostContent } from "../[rkey]/PostContent"; 13 + import { StaticPostContent } from "../[rkey]/StaticPostContent"; 14 14 15 15 export async function GET( 16 16 req: Request, ··· 64 64 id: `https://${pubRecord.base_path}/${rkey}`, 65 65 link: `https://${pubRecord.base_path}/${rkey}`, 66 66 content: renderToStaticMarkup( 67 - createElement(PostContent, { blocks, did: uri.host }), 67 + createElement(StaticPostContent, { blocks, did: uri.host }), 68 68 ), 69 69 }); 70 70 });