tangled
alpha
login
or
join now
leaflet.pub
/
leaflet
289
fork
atom
a tool for shared writing and social publishing
289
fork
atom
overview
issues
28
pulls
pipelines
moves PostBlocks into a single folder
cozylittle.house
2 months ago
fb63d13f
80f07d1c
+56
-44
16 changed files
expand all
collapse all
unified
split
app
(home-pages)
notifications
CommentNotication.tsx
Notification.tsx
ReplyNotification.tsx
p
[didOrHandle]
comments
CommentsContent.tsx
lish
[did]
[publication]
[rkey]
Blocks
BaseTextBlock.tsx
PubCodeBlock.tsx
PublishBskyPostBlock.tsx
PublishedPageBlock.tsx
PublishedPollBlock.tsx
StaticMathBlock.tsx
TextBlock.tsx
TextBlockCore.tsx
Interactions
Comments
index.tsx
PostContent.tsx
StaticPostContent.tsx
components
Toolbar
TextBlockTypeToolbar.tsx
+1
-1
app/(home-pages)/notifications/CommentNotication.tsx
···
1
1
-
import { BaseTextBlock } from "app/lish/[did]/[publication]/[rkey]/BaseTextBlock";
1
1
+
import { BaseTextBlock } from "app/lish/[did]/[publication]/[rkey]/Blocks/BaseTextBlock";
2
2
import {
3
3
AppBskyActorProfile,
4
4
PubLeafletComment,
+1
-1
app/(home-pages)/notifications/Notification.tsx
···
1
1
"use client";
2
2
import { Avatar } from "components/Avatar";
3
3
-
import { BaseTextBlock } from "app/lish/[did]/[publication]/[rkey]/BaseTextBlock";
3
3
+
import { BaseTextBlock } from "app/lish/[did]/[publication]/[rkey]/Blocks/BaseTextBlock";
4
4
import { PubLeafletPublication, PubLeafletRichtextFacet } from "lexicons/api";
5
5
import { timeAgo } from "src/utils/timeAgo";
6
6
import { useReplicache, useEntity } from "src/replicache";
+1
-1
app/(home-pages)/notifications/ReplyNotification.tsx
···
1
1
import { Avatar } from "components/Avatar";
2
2
-
import { BaseTextBlock } from "app/lish/[did]/[publication]/[rkey]/BaseTextBlock";
2
2
+
import { BaseTextBlock } from "app/lish/[did]/[publication]/[rkey]/Blocks/BaseTextBlock";
3
3
import { ReplyTiny } from "components/Icons/ReplyTiny";
4
4
import {
5
5
CommentInNotification,
+1
-1
app/(home-pages)/p/[didOrHandle]/comments/CommentsContent.tsx
···
6
6
import { PubLeafletComment, PubLeafletDocument } from "lexicons/api";
7
7
import { ReplyTiny } from "components/Icons/ReplyTiny";
8
8
import { Avatar } from "components/Avatar";
9
9
-
import { BaseTextBlock } from "app/lish/[did]/[publication]/[rkey]/BaseTextBlock";
9
9
+
import { BaseTextBlock } from "app/lish/[did]/[publication]/[rkey]/Blocks/BaseTextBlock";
10
10
import { blobRefToSrc } from "src/utils/blobRefToSrc";
11
11
import {
12
12
getProfileComments,
+6
-7
app/lish/[did]/[publication]/[rkey]/BaseTextBlock.tsx
app/lish/[did]/[publication]/[rkey]/Blocks/BaseTextBlock.tsx
···
1
1
import { ProfilePopover } from "components/ProfilePopover";
2
2
-
import { TextBlockCore, TextBlockCoreProps, RichText } from "./TextBlockCore";
2
2
+
import {
3
3
+
TextBlockCore,
4
4
+
TextBlockCoreProps,
5
5
+
RichText,
6
6
+
} from "../Blocks/TextBlockCore";
3
7
import { ReactNode } from "react";
4
8
5
9
// Re-export RichText for backwards compatibility
6
10
export { RichText };
7
11
8
12
function DidMentionWithPopover(props: { did: string; children: ReactNode }) {
9
9
-
return (
10
10
-
<ProfilePopover
11
11
-
didOrHandle={props.did}
12
12
-
trigger={props.children}
13
13
-
/>
14
14
-
);
13
13
+
return <ProfilePopover didOrHandle={props.did} trigger={props.children} />;
15
14
}
16
15
17
16
export function BaseTextBlock(props: Omit<TextBlockCoreProps, "renderers">) {
+1
-1
app/lish/[did]/[publication]/[rkey]/Interactions/Comments/index.tsx
···
5
5
import { CommentBox } from "./CommentBox";
6
6
import { Json } from "supabase/database.types";
7
7
import { PubLeafletComment } from "lexicons/api";
8
8
-
import { BaseTextBlock } from "../../BaseTextBlock";
8
8
+
import { BaseTextBlock } from "../../Blocks/BaseTextBlock";
9
9
import { useMemo, useState } from "react";
10
10
import { CommentTiny } from "components/Icons/CommentTiny";
11
11
import { Separator } from "components/Layout";
+13
-7
app/lish/[did]/[publication]/[rkey]/PostContent.tsx
···
20
20
} from "lexicons/api";
21
21
22
22
import { blobRefToSrc } from "src/utils/blobRefToSrc";
23
23
-
import { TextBlock } from "./TextBlock";
23
23
+
import { TextBlock } from "./Blocks/TextBlock";
24
24
import { Popover } from "components/Popover";
25
25
import { theme } from "tailwind.config";
26
26
import { ImageAltSmall } from "components/Icons/ImageAlt";
27
27
-
import { StaticMathBlock } from "./StaticMathBlock";
28
28
-
import { PubCodeBlock } from "./PubCodeBlock";
27
27
+
import { StaticMathBlock } from "./Blocks/StaticMathBlock";
28
28
+
import { PubCodeBlock } from "./Blocks/PubCodeBlock";
29
29
import { AppBskyFeedDefs } from "@atproto/api";
30
30
-
import { PubBlueskyPostBlock } from "./PublishBskyPostBlock";
30
30
+
import { PubBlueskyPostBlock } from "./Blocks/PublishBskyPostBlock";
31
31
import { openPage } from "./PostPages";
32
32
import { PageLinkBlock } from "components/Blocks/PageLinkBlock";
33
33
-
import { PublishedPageLinkBlock } from "./PublishedPageBlock";
34
34
-
import { PublishedPollBlock } from "./PublishedPollBlock";
33
33
+
import { PublishedPageLinkBlock } from "./Blocks/PublishedPageBlock";
34
34
+
import { PublishedPollBlock } from "./Blocks/PublishedPollBlock";
35
35
import { PollData } from "./fetchPollData";
36
36
import { ButtonPrimary } from "components/Buttons";
37
37
···
173
173
let uri = b.block.postRef.uri;
174
174
let post = bskyPostData.find((p) => p.uri === uri);
175
175
if (!post) return <div>no prefetched post rip</div>;
176
176
-
return <PubBlueskyPostBlock post={post} className={className} pageId={pageId} />;
176
176
+
return (
177
177
+
<PubBlueskyPostBlock
178
178
+
post={post}
179
179
+
className={className}
180
180
+
pageId={pageId}
181
181
+
/>
182
182
+
);
177
183
}
178
184
case PubLeafletBlocksIframe.isMain(b.block): {
179
185
return (
app/lish/[did]/[publication]/[rkey]/PubCodeBlock.tsx
app/lish/[did]/[publication]/[rkey]/Blocks/PubCodeBlock.tsx
+9
-7
app/lish/[did]/[publication]/[rkey]/PublishBskyPostBlock.tsx
app/lish/[did]/[publication]/[rkey]/Blocks/PublishBskyPostBlock.tsx
···
5
5
import { BlueskyTiny } from "components/Icons/BlueskyTiny";
6
6
import { CommentTiny } from "components/Icons/CommentTiny";
7
7
import { QuoteTiny } from "components/Icons/QuoteTiny";
8
8
-
import { ThreadLink, QuotesLink } from "./PostLinks";
8
8
+
import { ThreadLink, QuotesLink } from "../PostLinks";
9
9
import { useLocalizedDate } from "src/hooks/useLocalizedDate";
10
10
import {
11
11
BlueskyEmbed,
12
12
PostNotAvailable,
13
13
} from "components/Blocks/BlueskyPostBlock/BlueskyEmbed";
14
14
import { BlueskyRichText } from "components/Blocks/BlueskyPostBlock/BlueskyRichText";
15
15
-
import { openPage } from "./PostPages";
15
15
+
import { openPage } from "../PostPages";
16
16
17
17
export const PubBlueskyPostBlock = (props: {
18
18
post: PostView;
···
22
22
let post = props.post;
23
23
24
24
const handleOpenThread = () => {
25
25
-
openPage(
26
26
-
props.pageId ? { type: "doc", id: props.pageId } : undefined,
27
27
-
{ type: "thread", uri: post.uri },
28
28
-
);
25
25
+
openPage(props.pageId ? { type: "doc", id: props.pageId } : undefined, {
26
26
+
type: "thread",
27
27
+
uri: post.uri,
28
28
+
});
29
29
};
30
30
31
31
switch (true) {
···
51
51
let postId = post.uri.split("/")[4];
52
52
let url = `https://bsky.app/profile/${post.author.handle}/post/${postId}`;
53
53
54
54
-
const parent = props.pageId ? { type: "doc" as const, id: props.pageId } : undefined;
54
54
+
const parent = props.pageId
55
55
+
? { type: "doc" as const, id: props.pageId }
56
56
+
: undefined;
55
57
56
58
return (
57
59
<div
+14
-10
app/lish/[did]/[publication]/[rkey]/PublishedPageBlock.tsx
app/lish/[did]/[publication]/[rkey]/Blocks/PublishedPageBlock.tsx
···
4
4
import { useUIState } from "src/useUIState";
5
5
import { CSSProperties, useContext, useRef } from "react";
6
6
import { useCardBorderHidden } from "components/Pages/useCardBorderHidden";
7
7
-
import { PostContent, Block } from "./PostContent";
7
7
+
import { PostContent, Block } from "../PostContent";
8
8
import {
9
9
PubLeafletBlocksHeader,
10
10
PubLeafletBlocksText,
···
15
15
} from "lexicons/api";
16
16
import { AppBskyFeedDefs } from "@atproto/api";
17
17
import { TextBlock } from "./TextBlock";
18
18
-
import { PostPageContext } from "./PostPageContext";
19
19
-
import { openPage, useOpenPages } from "./PostPages";
18
18
+
import { PostPageContext } from "../PostPageContext";
19
19
+
import { openPage, useOpenPages } from "../PostPages";
20
20
import {
21
21
openInteractionDrawer,
22
22
setInteractionState,
23
23
useInteractionState,
24
24
-
} from "./Interactions/Interactions";
24
24
+
} from "../Interactions/Interactions";
25
25
import { CommentTiny } from "components/Icons/CommentTiny";
26
26
import { QuoteTiny } from "components/Icons/QuoteTiny";
27
27
import { CanvasBackgroundPattern } from "components/Canvas";
···
40
40
}) {
41
41
//switch to use actually state
42
42
let openPages = useOpenPages();
43
43
-
let isOpen = openPages.some(
44
44
-
(p) => p.type === "doc" && p.id === props.pageId,
45
45
-
);
43
43
+
let isOpen = openPages.some((p) => p.type === "doc" && p.id === props.pageId);
46
44
return (
47
45
<div
48
46
className={`w-full cursor-pointer
···
60
58
e.stopPropagation();
61
59
62
60
openPage(
63
63
-
props.parentPageId ? { type: "doc", id: props.parentPageId } : undefined,
61
61
+
props.parentPageId
62
62
+
? { type: "doc", id: props.parentPageId }
63
63
+
: undefined,
64
64
{ type: "doc", id: props.pageId },
65
65
);
66
66
}}
···
219
219
e.preventDefault();
220
220
e.stopPropagation();
221
221
openPage(
222
222
-
props.parentPageId ? { type: "doc", id: props.parentPageId } : undefined,
222
222
+
props.parentPageId
223
223
+
? { type: "doc", id: props.parentPageId }
224
224
+
: undefined,
223
225
{ type: "doc", id: props.pageId },
224
226
{ scrollIntoView: false },
225
227
);
···
239
241
e.preventDefault();
240
242
e.stopPropagation();
241
243
openPage(
242
242
-
props.parentPageId ? { type: "doc", id: props.parentPageId } : undefined,
244
244
+
props.parentPageId
245
245
+
? { type: "doc", id: props.parentPageId }
246
246
+
: undefined,
243
247
{ type: "doc", id: props.pageId },
244
248
{ scrollIntoView: false },
245
249
);
+3
-3
app/lish/[did]/[publication]/[rkey]/PublishedPollBlock.tsx
app/lish/[did]/[publication]/[rkey]/Blocks/PublishedPollBlock.tsx
···
9
9
import { ButtonPrimary, ButtonSecondary } from "components/Buttons";
10
10
import { useIdentityData } from "components/IdentityProvider";
11
11
import { AtpAgent } from "@atproto/api";
12
12
-
import { voteOnPublishedPoll } from "./voteOnPublishedPoll";
13
13
-
import { PollData } from "./fetchPollData";
12
12
+
import { voteOnPublishedPoll } from "../voteOnPublishedPoll";
13
13
+
import { PollData } from "../fetchPollData";
14
14
import { Popover } from "components/Popover";
15
15
import LoginForm from "app/login/LoginForm";
16
16
import { BlueskyTiny } from "components/Icons/BlueskyTiny";
17
17
-
import { getVoterIdentities, VoterIdentity } from "./getVoterIdentities";
17
17
+
import { getVoterIdentities, VoterIdentity } from "../getVoterIdentities";
18
18
import { Json } from "supabase/database.types";
19
19
import { InfoSmall } from "components/Icons/InfoSmall";
20
20
app/lish/[did]/[publication]/[rkey]/StaticMathBlock.tsx
app/lish/[did]/[publication]/[rkey]/Blocks/StaticMathBlock.tsx
+2
-2
app/lish/[did]/[publication]/[rkey]/StaticPostContent.tsx
···
12
12
PubLeafletPagesLinearDocument,
13
13
} from "lexicons/api";
14
14
import { blobRefToSrc } from "src/utils/blobRefToSrc";
15
15
-
import { TextBlockCore, TextBlockCoreProps } from "./TextBlockCore";
16
16
-
import { StaticMathBlock } from "./StaticMathBlock";
15
15
+
import { TextBlockCore, TextBlockCoreProps } from "./Blocks/TextBlockCore";
16
16
+
import { StaticMathBlock } from "./Blocks/StaticMathBlock";
17
17
import { codeToHtml, bundledLanguagesInfo, bundledThemesInfo } from "shiki";
18
18
19
19
function StaticBaseTextBlock(props: Omit<TextBlockCoreProps, "renderers">) {
+3
-2
app/lish/[did]/[publication]/[rkey]/TextBlock.tsx
app/lish/[did]/[publication]/[rkey]/Blocks/TextBlock.tsx
···
1
1
"use client";
2
2
import { UnicodeString } from "@atproto/api";
3
3
-
import { PubLeafletRichtextFacet } from "lexicons/api";
3
3
+
import { PubLeafletRichtextFacet, PubLeafletBlocksText } from "lexicons/api";
4
4
import { useMemo } from "react";
5
5
-
import { useHighlight } from "./useHighlight";
5
5
+
import { useHighlight } from "../useHighlight";
6
6
import { BaseTextBlock } from "./BaseTextBlock";
7
7
8
8
type Facet = PubLeafletRichtextFacet.Main;
9
9
export function TextBlock(props: {
10
10
plaintext: string;
11
11
+
textSize?: PubLeafletBlocksText.Main["textSize"];
11
12
facets?: Facet[];
12
13
index: number[];
13
14
preview?: boolean;
app/lish/[did]/[publication]/[rkey]/TextBlockCore.tsx
app/lish/[did]/[publication]/[rkey]/Blocks/TextBlockCore.tsx
+1
-1
components/Toolbar/TextBlockTypeToolbar.tsx
···
114
114
>
115
115
<Header3Small />
116
116
</ToolbarButton>
117
117
-
<Separator classname="h-6!!" />
117
117
+
<Separator classname="h-6!" />
118
118
<ToolbarButton
119
119
className={`px-[6px] ${props.className}`}
120
120
onClick={async () => {