a tool for shared writing and social publishing
move block components to blocks folder
+24
-108
+1
-1
app/[doc_id]/Doc.tsx
+1
-1
app/[doc_id]/Doc.tsx
···
7
7
import { ThemeProvider } from "components/ThemeManager/ThemeProvider";
8
8
import { MobileFooter } from "components/MobileFooter";
9
9
import { PopUpProvider } from "components/Toast";
10
-
import { YJSFragmentToString } from "components/TextBlock/RenderYJSFragment";
10
+
import { YJSFragmentToString } from "components/Blocks/TextBlock/RenderYJSFragment";
11
11
import {
12
12
EntitySetContext,
13
13
EntitySetProvider,
+1
-1
app/[doc_id]/page.tsx
+1
-1
app/[doc_id]/page.tsx
···
11
11
import { ThemeProvider } from "components/ThemeManager/ThemeProvider";
12
12
import { MobileFooter } from "components/MobileFooter";
13
13
import { PopUpProvider } from "components/Toast";
14
-
import { YJSFragmentToString } from "components/TextBlock/RenderYJSFragment";
14
+
import { YJSFragmentToString } from "components/Blocks/TextBlock/RenderYJSFragment";
15
15
import { Doc } from "./Doc";
16
16
17
17
export const preferredRegion = ["sfo1"];
+5
-5
components/BlockOptions.tsx
components/Blocks/BlockOptions.tsx
+5
-5
components/BlockOptions.tsx
components/Blocks/BlockOptions.tsx
···
6
6
BlockLinkSmall,
7
7
CheckTiny,
8
8
CloseTiny,
9
-
} from "./Icons";
9
+
} from "components/Icons";
10
10
import { generateKeyBetween } from "fractional-indexing";
11
11
import { addImage } from "src/utils/addImage";
12
-
import { focusCard } from "./Cards";
12
+
import { focusCard } from "components/Cards";
13
13
import { useState } from "react";
14
-
import { Separator } from "./Layout";
14
+
import { Separator } from "components/Layout";
15
15
import { addLinkBlock } from "src/utils/addLinkBlock";
16
-
import { useEntitySetContext } from "./EntitySetProvider";
16
+
import { useEntitySetContext } from "components/EntitySetProvider";
17
17
import { v7 } from "uuid";
18
-
import { Input } from "./Input";
18
+
import { Input } from "components/Input";
19
19
20
20
type Props = {
21
21
parent: string;
+2
-2
components/Blocks.tsx
components/Blocks/index.tsx
+2
-2
components/Blocks.tsx
components/Blocks/index.tsx
···
1
1
"use client";
2
2
import { Fact, useEntity, useReplicache } from "src/replicache";
3
-
import { TextBlock } from "components/TextBlock";
3
+
import { TextBlock } from "components/Blocks/TextBlock";
4
4
import { generateKeyBetween } from "fractional-indexing";
5
5
import { useEffect } from "react";
6
6
import { elementId } from "src/utils/elementId";
···
13
13
import { BlockOptions } from "./BlockOptions";
14
14
import { useBlocks } from "src/hooks/queries/useBlocks";
15
15
import { setEditorState, useEditorStates } from "src/state/useEditorState";
16
-
import { useEntitySetContext } from "./EntitySetProvider";
16
+
import { useEntitySetContext } from "components/EntitySetProvider";
17
17
import { scanIndex } from "src/replicache/utils";
18
18
import { v7 } from "uuid";
19
19
+1
-1
components/CardBlock.tsx
components/Blocks/CardBlock.tsx
+1
-1
components/CardBlock.tsx
components/Blocks/CardBlock.tsx
···
2
2
import { focusCard } from "components/Cards";
3
3
import { useEntity, useReplicache } from "src/replicache";
4
4
import { useUIState } from "src/useUIState";
5
-
import { RenderedTextBlock } from "./TextBlock";
5
+
import { RenderedTextBlock } from "components/Blocks/TextBlock";
6
6
import { useDocMetadata } from "src/hooks/queries/useDocMetadata";
7
7
8
8
export function CardBlock(props: BlockProps) {
+1
-1
components/Cards.tsx
+1
-1
components/Cards.tsx
···
1
1
"use client";
2
2
import { useUIState } from "src/useUIState";
3
-
import { Blocks, focusBlock } from "./Blocks";
3
+
import { Blocks, focusBlock } from "components/Blocks";
4
4
import useMeasure from "react-use-measure";
5
5
import { elementId } from "src/utils/elementId";
6
6
import { ThemePopover } from "./ThemeManager/ThemeSetter";
+1
-1
components/ExternalLinkBlock.tsx
components/Blocks/ExternalLinkBlock.tsx
+1
-1
components/ExternalLinkBlock.tsx
components/Blocks/ExternalLinkBlock.tsx
+3
-3
components/ImageBlock.tsx
components/Blocks/ImageBlock.tsx
+3
-3
components/ImageBlock.tsx
components/Blocks/ImageBlock.tsx
···
1
1
"use client";
2
2
3
3
import { useEntity, useReplicache } from "src/replicache";
4
-
import { BlockProps } from "./Blocks";
4
+
import { BlockProps } from "components/Blocks";
5
5
import { useUIState } from "src/useUIState";
6
6
import { theme } from "tailwind.config";
7
-
import { CloseContrastSmall } from "./Icons";
7
+
import { CloseContrastSmall } from "components/Icons";
8
8
import useMeasure from "react-use-measure";
9
-
import { useEntitySetContext } from "./EntitySetProvider";
9
+
import { useEntitySetContext } from "components/EntitySetProvider";
10
10
11
11
export function ImageBlock(props: BlockProps) {
12
12
let { rep, permission_token } = useReplicache();
-84
components/LinkBlock.tsx
-84
components/LinkBlock.tsx
···
1
-
import { useState } from "react";
2
-
import { CloseContrastSmall, CloseTiny } from "./Icons";
3
-
import { theme } from "tailwind.config";
4
-
5
-
type linkType = {
6
-
url: string;
7
-
title?: string | null;
8
-
description?: string | null;
9
-
image?: {
10
-
url: string;
11
-
width: number;
12
-
height: number;
13
-
} | null;
14
-
logo?: {
15
-
url: string;
16
-
width?: number;
17
-
height?: number;
18
-
} | null;
19
-
author?: string | null;
20
-
};
21
-
22
-
export const ExternalLinkBlock = () => {
23
-
let [title, setTitle] = useState("Title");
24
-
let [description, setDescription] = useState(
25
-
"hello, this is a little description. I want it to be a little bit long so that I can see if it wrapping around but it thought it was long enought and it wasn't actually so im adding a little more on",
26
-
);
27
-
let [link, setLink] = useState<linkType>({
28
-
url: "www.hello.com",
29
-
title: "Title",
30
-
description: "hi I'm a description",
31
-
image: {
32
-
url: "/",
33
-
width: 64,
34
-
height: 64,
35
-
},
36
-
logo: {
37
-
url: "/",
38
-
width: 64,
39
-
height: 64,
40
-
},
41
-
author: "me",
42
-
});
43
-
44
-
return (
45
-
<a
46
-
href={link.url}
47
-
target="_blank"
48
-
className="externalLinkBlock relative group h-[104px] mb-3 flex border border-border hover:border-accent outline outline-1 outline-transparent hover:outline-accent rounded-lg overflow-hidden"
49
-
>
50
-
<div className="flex flex-col grow pt-2 pb-2 px-2 min-w-0 h-full">
51
-
<button
52
-
onClick={(e) => {
53
-
e.preventDefault();
54
-
}}
55
-
className="absolute top-0.5 right-0.5 group-hover:block hidden text-accent"
56
-
>
57
-
<CloseContrastSmall
58
-
fill={theme.colors.accentText}
59
-
stroke={theme.colors.accent}
60
-
/>
61
-
</button>
62
-
<div className="flex flex-col w-full min-w-0 grow ">
63
-
<div
64
-
className={`linkBlockTitle bg-transparent -mb-0.5 border-none text-base font-bold outline-none resize-none align-top border line-clamp-1`}
65
-
>
66
-
{link.title}
67
-
</div>
68
-
<div
69
-
className={`linkBlockDescription text-sm bg-transparent border-none outline-none resize-none align-top grow line-clamp-2`}
70
-
>
71
-
{link.description}
72
-
</div>
73
-
</div>
74
-
<div className="inline-block place-self-end w-full text-xs text-tertiary italic line-clamp-3 shrink-0 truncate group-hover:text-accent">
75
-
{link.url}
76
-
</div>
77
-
</div>
78
-
79
-
<div
80
-
className={`linkBlockPreview w-[120px] m-2 -mb-2 shrink-0 rounded-t-md border border-border group-hover:border-accent`}
81
-
/>
82
-
</a>
83
-
);
84
-
};
+1
-1
components/TextBlock/RenderYJSFragment.tsx
components/Blocks/TextBlock/RenderYJSFragment.tsx
+1
-1
components/TextBlock/RenderYJSFragment.tsx
components/Blocks/TextBlock/RenderYJSFragment.tsx
···
1
1
import { XmlElement, XmlHook, XmlText } from "yjs";
2
2
import { nodes, marks } from "prosemirror-schema-basic";
3
3
import { CSSProperties } from "react";
4
-
import { theme } from "../../tailwind.config";
4
+
import { theme } from "tailwind.config";
5
5
6
6
export function RenderYJSFragment({
7
7
node,
+1
-1
components/TextBlock/index.tsx
components/Blocks/TextBlock/index.tsx
+1
-1
components/TextBlock/index.tsx
components/Blocks/TextBlock/index.tsx
···
31
31
import { MarkType, DOMParser as ProsemirrorDOMParser } from "prosemirror-model";
32
32
import { useAppEventListener } from "src/eventBus";
33
33
import { addLinkBlock } from "src/utils/addLinkBlock";
34
-
import { BlockOptions } from "components/BlockOptions";
34
+
import { BlockOptions } from "components/Blocks/BlockOptions";
35
35
import { setEditorState, useEditorStates } from "src/state/useEditorState";
36
36
import { isIOS } from "@react-aria/utils";
37
37
import { useIsMobile } from "src/hooks/isMobile";
components/TextBlock/keymap.ts
components/Blocks/TextBlock/keymap.ts
components/TextBlock/keymap.ts
components/Blocks/TextBlock/keymap.ts
+1
-1
components/TextBlock/schema.ts
components/Blocks/TextBlock/schema.ts
+1
-1
components/TextBlock/schema.ts
components/Blocks/TextBlock/schema.ts
components/TextBlock/useHandlePaste.ts
components/Blocks/TextBlock/useHandlePaste.ts
components/TextBlock/useHandlePaste.ts
components/Blocks/TextBlock/useHandlePaste.ts
+1
-1
components/Toolbar/HighlightButton.tsx
+1
-1
components/Toolbar/HighlightButton.tsx
···
1
1
import { setEditorState, useEditorStates } from "src/state/useEditorState";
2
2
import { useUIState } from "src/useUIState";
3
-
import { schema } from "components/TextBlock/schema";
3
+
import { schema } from "components/Blocks/TextBlock/schema";
4
4
import { TextSelection } from "prosemirror-state";
5
5
import { toggleMarkInFocusedBlock } from "./TextDecorationButton";
6
6
import * as Popover from "@radix-ui/react-popover";
+1
-1
components/Toolbar/LinkButton.tsx
+1
-1
components/Toolbar/LinkButton.tsx
+1
-1
components/Toolbar/index.tsx
+1
-1
components/Toolbar/index.tsx
···
21
21
} from "components/Icons";
22
22
import { create } from "zustand";
23
23
import { combine } from "zustand/middleware";
24
-
import { schema } from "components/TextBlock/schema";
24
+
import { schema } from "components/Blocks/TextBlock/schema";
25
25
import { TextDecorationButton } from "./TextDecorationButton";
26
26
import {
27
27
TextBlockTypeButton,
+1
-1
components/utils/UpdatePageTitle.tsx
+1
-1
components/utils/UpdatePageTitle.tsx
···
5
5
import { useEntity } from "src/replicache";
6
6
import * as Y from "yjs";
7
7
import * as base64 from "base64-js";
8
-
import { YJSFragmentToString } from "components/TextBlock/RenderYJSFragment";
8
+
import { YJSFragmentToString } from "components/Blocks/TextBlock/RenderYJSFragment";
9
9
10
10
export function UpdatePageTitle(props: { entityID: string }) {
11
11
let blocks = useBlocks(props.entityID).filter(
+1
-1
src/utils/getBlocksAsHTML.tsx
+1
-1
src/utils/getBlocksAsHTML.tsx
···
4
4
import { renderToStaticMarkup } from "react-dom/server";
5
5
import * as Y from "yjs";
6
6
import * as base64 from "base64-js";
7
-
import { RenderYJSFragment } from "components/TextBlock/RenderYJSFragment";
7
+
import { RenderYJSFragment } from "components/Blocks/TextBlock/RenderYJSFragment";
8
8
import { Block } from "components/Blocks";
9
9
10
10
export async function getBlocksAsHTML(