steven-tey / novel

Notion-style WYSIWYG editor with AI-powered autocompletion.
https://novel.sh
Apache License 2.0
11.8k stars 980 forks source link

⚠ TS Errors need to be fixed on null of editor for lastest version of Novel #382

Open lumpinif opened 2 months ago

lumpinif commented 2 months ago

In the ai-selector.tsx and generative-menu-switch.tsx, the const { editor } = useEditor() object destructuring returns const editor: Editor | null in the new version of tiptap/core + /react + /pm @2.2.4 which was included in the latest version of novel.

image

The null of editor can lead to ⚠ TS Errors on null.

image image image

Screenshots from novel repo clone demo:

image image

We can see the useEditor() returns just editor from tiptap/core + /react + /pm @2.2.2

Another⚠ TS Error in the advanced-editor.tsx from line 95. It means that we are trying to call a function on an object that might not exist at runtime. It seems like EditorCommandItem might be undefined.

image

This issue is also coming from the latest version of novel.

akdeb commented 2 months ago

I've added a null check to resolve a lot of these


    if (!editor) return null;

And something like:

        {
            name: "bold",
            isActive: (editor) => editor!.isActive("bold"),
            command: (editor) => editor!.chain().focus().toggleBold().run(),
            icon: BoldIcon,
        },
        {
            name: "italic",
            isActive: (editor) => editor!.isActive("italic"),
            command: (editor) => editor!.chain().focus().toggleItalic().run(),
            icon: ItalicIcon,
        },

in text-buttons.tsx

lumpinif commented 2 months ago

@akdeb I also had to add a bunch of null checks to address the ts errors. However, the wired thing is useEditor() from original package doesn't return null but only Editor