Ryan/docmost
1
0
Fork 0
mirror of https://github.com/docmost/docmost.git synced 2025-11-13 02:22:37 +10:00
Code Issues Packages Projects Releases Wiki Activity

Tiptap v3 upgrade - WIP

Browse Source
This commit is contained in:
Philipinho
2025-06-13 15:48:52 -07:00
parent 1c674efddd
commit 7a9be34811
24 changed files with 4299 additions and 5371 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/client/package.json
View File

@ -16,6 +16,7 @@
"@emoji-mart/data": "^1.2.1",
"@emoji-mart/react": "^1.1.1",
"@excalidraw/excalidraw": "0.18.0-864353b",
"@floating-ui/dom": "^1.6.0",
"@mantine/core": "^7.17.0",
"@mantine/form": "^7.17.0",
"@mantine/hooks": "^7.17.0",
@ -24,7 +25,6 @@
"@mantine/spotlight": "^7.17.0",
"@tabler/icons-react": "^3.34.0",
"@tanstack/react-query": "^5.80.6",
"@tiptap/extension-character-count": "^2.10.3",
"axios": "^1.9.0",
"clsx": "^2.1.1",
"emoji-mart": "^5.6.0",

2
apps/client/src/components/settings/settings-sidebar.tsx
View File

@ -36,7 +36,7 @@ import { useSettingsNavigation } from "@/hooks/use-settings-navigation";
interface DataItem {
label: string;
icon: React.ElementType;
icon: any;
path: string;
isCloud?: boolean;
isEnterprise?: boolean;

2
apps/client/src/features/comment/components/comment-editor.tsx
View File

@ -1,5 +1,5 @@
import { Placeholder } from "@tiptap/extensions";
import { EditorContent, useEditor } from "@tiptap/react";
import { Placeholder } from "@tiptap/extension-placeholder";
import { Underline } from "@tiptap/extension-underline";
import { Link } from "@tiptap/extension-link";
import { StarterKit } from "@tiptap/starter-kit";

8
apps/client/src/features/editor/components/bubble-menu/bubble-menu.tsx
View File

@ -1,9 +1,5 @@
import {
BubbleMenu,
BubbleMenuProps,
isNodeSelection,
useEditor,
} from "@tiptap/react";
import { isNodeSelection, useEditor } from "@tiptap/react";
import { BubbleMenu, BubbleMenuProps } from "@tiptap/react/menus";
import { FC, useEffect, useRef, useState } from "react";
import {
IconBold,

7
apps/client/src/features/editor/components/callout/callout-menu.tsx
View File

@ -1,8 +1,5 @@
import {
BubbleMenu as BaseBubbleMenu,
findParentNode,
posToDOMRect,
} from "@tiptap/react";
import { findParentNode, posToDOMRect } from "@tiptap/react";
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react/menus";
import React, { useCallback } from "react";
import { Node as PMNode } from "prosemirror-model";
import {

7
apps/client/src/features/editor/components/drawio/drawio-menu.tsx
View File

@ -1,8 +1,5 @@
import {
BubbleMenu as BaseBubbleMenu,
findParentNode,
posToDOMRect,
} from '@tiptap/react';
import { findParentNode, posToDOMRect } from '@tiptap/react';
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react/menus";
import { useCallback } from 'react';
import { sticky } from 'tippy.js';
import { Node as PMNode } from 'prosemirror-model';

7
apps/client/src/features/editor/components/excalidraw/excalidraw-menu.tsx
View File

@ -1,8 +1,5 @@
import {
BubbleMenu as BaseBubbleMenu,
findParentNode,
posToDOMRect,
} from '@tiptap/react';
import { findParentNode, posToDOMRect } from '@tiptap/react';
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react/menus";
import { useCallback } from 'react';
import { sticky } from 'tippy.js';
import { Node as PMNode } from 'prosemirror-model';

7
apps/client/src/features/editor/components/image/image-menu.tsx
View File

@ -1,8 +1,5 @@
import {
BubbleMenu as BaseBubbleMenu,
findParentNode,
posToDOMRect,
} from "@tiptap/react";
import { findParentNode, posToDOMRect } from "@tiptap/react";
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react/menus";
import React, { useCallback } from "react";
import { sticky } from "tippy.js";
import { Node as PMNode } from "prosemirror-model";

2
apps/client/src/features/editor/components/link/link-menu.tsx
View File

@ -1,4 +1,4 @@
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react";
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react/menus";
import React, { useCallback, useState } from "react";
import { EditorMenuProps } from "@/features/editor/components/table/types/types.ts";
import { LinkEditorPanel } from "@/features/editor/components/link/link-editor-panel.tsx";

2
apps/client/src/features/editor/components/table/table-cell-menu.tsx
View File

@ -1,4 +1,4 @@
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react";
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react/menus";
import React, { useCallback } from "react";
import {

7
apps/client/src/features/editor/components/table/table-menu.tsx
View File

@ -1,8 +1,5 @@
import {
BubbleMenu as BaseBubbleMenu,
posToDOMRect,
findParentNode,
} from "@tiptap/react";
import { posToDOMRect, findParentNode } from "@tiptap/react";
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react/menus";
import { Node as PMNode } from "@tiptap/pm/model";
import React, { useCallback } from "react";

7
apps/client/src/features/editor/components/video/video-menu.tsx
View File

@ -1,8 +1,5 @@
import {
BubbleMenu as BaseBubbleMenu,
findParentNode,
posToDOMRect,
} from "@tiptap/react";
import { findParentNode, posToDOMRect } from "@tiptap/react";
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react/menus";
import React, { useCallback } from "react";
import { sticky } from "tippy.js";
import { Node as PMNode } from "prosemirror-model";

26
apps/client/src/features/editor/extensions/extensions.ts
View File

@ -1,20 +1,17 @@
import { StarterKit } from "@tiptap/starter-kit";
import { Placeholder } from "@tiptap/extension-placeholder";
import { Table, TableHeader } from "@tiptap/extension-table";
import { TextStyle, Color } from "@tiptap/extension-text-style";
import { TaskList, TaskItem } from "@tiptap/extension-list";
import { Placeholder, CharacterCount } from "@tiptap/extensions";
import StarterKit from "@tiptap/starter-kit";
import { TextAlign } from "@tiptap/extension-text-align";
import { TaskList } from "@tiptap/extension-task-list";
import { TaskItem } from "@tiptap/extension-task-item";
import { Underline } from "@tiptap/extension-underline";
import { Superscript } from "@tiptap/extension-superscript";
import SubScript from "@tiptap/extension-subscript";
import { Highlight } from "@tiptap/extension-highlight";
import { Typography } from "@tiptap/extension-typography";
import { TextStyle } from "@tiptap/extension-text-style";
import { Color } from "@tiptap/extension-color";
import Table from "@tiptap/extension-table";
import TableHeader from "@tiptap/extension-table-header";
import SlashCommand from "@/features/editor/extensions/slash-command";
import { Collaboration } from "@tiptap/extension-collaboration";
import { CollaborationCursor } from "@tiptap/extension-collaboration-cursor";
import Collaboration from "@tiptap/extension-collaboration";
import CollaborationCaret from "@tiptap/extension-collaboration-caret";
import { HocuspocusProvider } from "@hocuspocus/provider";
import {
Comment,
@ -72,7 +69,6 @@ import MentionView from "@/features/editor/components/mention/mention-view.tsx";
import i18n from "@/i18n.ts";
import { MarkdownClipboard } from "@/features/editor/extensions/markdown-clipboard.ts";
import EmojiCommand from "./emoji-command";
import { CharacterCount } from "@tiptap/extension-character-count";
const lowlight = createLowlight(common);
lowlight.register("mermaid", plaintext);
@ -88,7 +84,7 @@ lowlight.register("scala", scala);
export const mainExtensions = [
StarterKit.configure({
history: false,
undoRedo: false,
dropcursor: {
width: 3,
color: "#70CFF8",
@ -213,7 +209,7 @@ export const mainExtensions = [
MarkdownClipboard.configure({
transformPastedText: true,
}),
CharacterCount
CharacterCount,
] as any;
type CollabExtensions = (provider: HocuspocusProvider, user: IUser) => any[];
@ -222,11 +218,11 @@ export const collabExtensions: CollabExtensions = (provider, user) => [
Collaboration.configure({
document: provider.document,
}),
CollaborationCursor.configure({
CollaborationCaret.configure({
provider,
user: {
name: user.name,
color: randomElement(userColors),
},
}),
];
];

14
apps/client/src/features/editor/page-editor.tsx
View File

@ -102,8 +102,8 @@ export default function PageEditor({
url: collaborationURL,
document: ydoc,
token: collabQuery?.token,
connect: false,
preserveConnection: false,
//connect: false,
// preserveConnection: false,
onAuthenticationFailed: (auth: onAuthenticationFailedParameters) => {
const payload = jwtDecode(collabQuery?.token);
const now = Date.now().valueOf() / 1000;
@ -112,11 +112,11 @@ export default function PageEditor({
refetchCollabToken();
}
},
onStatus: (status) => {
if (status.status === "connected") {
setYjsConnectionStatus(status.status);
}
},
// onStatus: (status) => {
// if (status.status === "connected") {
// setYjsConnectionStatus(status.status);
// }
//},
});
provider.on("synced", () => {

2
apps/client/src/features/editor/readonly-page-editor.tsx
View File

@ -1,3 +1,4 @@
import { Placeholder } from "@tiptap/extensions";
import "@/features/editor/styles/index.css";
import React, { useMemo } from "react";
import { EditorProvider } from "@tiptap/react";
@ -5,7 +6,6 @@ import { mainExtensions } from "@/features/editor/extensions/extensions";
import { Document } from "@tiptap/extension-document";
import { Heading } from "@tiptap/extension-heading";
import { Text } from "@tiptap/extension-text";
import { Placeholder } from "@tiptap/extension-placeholder";
import { useAtom } from "jotai/index";
import {
pageEditorAtom,

3
apps/client/src/features/editor/title-editor.tsx
View File

@ -1,10 +1,10 @@
import { Placeholder, History } from "@tiptap/extensions";
import "@/features/editor/styles/index.css";
import React, { useCallback, useEffect, useState } from "react";
import { EditorContent, useEditor } from "@tiptap/react";
import { Document } from "@tiptap/extension-document";
import { Heading } from "@tiptap/extension-heading";
import { Text } from "@tiptap/extension-text";
import { Placeholder } from "@tiptap/extension-placeholder";
import { useAtomValue } from "jotai";
import {
pageEditorAtom,
@ -14,7 +14,6 @@ import { updatePageData, useUpdateTitlePageMutation } from "@/features/page/quer
import { useDebouncedCallback } from "@mantine/hooks";
import { useAtom } from "jotai";
import { useQueryEmit } from "@/features/websocket/use-query-emit.ts";
import { History } from "@tiptap/extension-history";
import { buildPageUrl } from "@/features/page/page.utils.ts";
import { useNavigate } from "react-router-dom";
import { useTranslation } from "react-i18next";