fix link

package.json

@@ -78,7 +78,7 @@
     "@tiptap/extension-gapcursor": "^2.4.0",
     "@tiptap/extension-heading": "^2.4.0",
     "@tiptap/extension-image": "^2.5.6",
-    "@tiptap/extension-link": "^2.4.0",
+    "@tiptap/extension-link": "^2.5.7",
     "@tiptap/extension-mention": "^2.4.0",
     "@tiptap/extension-placeholder": "^2.4.0",
     "@tiptap/extension-table": "^2.4.0",

src/components/Toolbar.tsx

@@ -5,11 +5,10 @@ import { Editor } from "@tiptap/react";
 import { useState, MouseEvent, useMemo, useCallback, Fragment } from "react";
 
 import TableMenuDialog from "./TableMenuDialog";
-import LinkDialog from "./LinkDialog";
 import Heading from "./Heading";
 import ColorPicker from "./ColorPicker";
 import { IEditorToolbar, ILabels, TextEditorProps } from "../types.d";
-import { defaultEditorToolbar, getBorderColor, showTextEditorToolbarMenu } from "../utils/app.utils";
+import { checkIsValidUrl, defaultEditorToolbar, getBorderColor, showTextEditorToolbarMenu } from "../utils/app.utils";
 import YoutubeDialog from "./YoutubeDialog";
 import Bold from "../icons/Bold";
 import Italic from "../icons/Italic";
@@ -128,6 +127,30 @@ const Toolbar = ({
     setTableAnchorEl(null);
   };
 
+  // set link
+  const setLink = useCallback(() => {
+    const previousUrl = editor.getAttributes('link').href
+    const url = window.prompt('URL', previousUrl)
+
+    // cancelled
+    if (url === null) return;
+
+    // empty
+    if (url === '') {
+      editor.chain().focus().extendMarkRange('link').unsetLink().run()
+      return
+    }
+
+    const isValidUrl = checkIsValidUrl(url);
+    if (!isValidUrl) {
+      window.alert(labels?.link?.invalid || 'Invalid URL');
+      return;
+    }
+
+    // update link
+    editor.chain().focus().extendMarkRange('link').setLink({ href: url }).run()
+  }, [editor])
+
   const menus = useMemo(() => {
     const toolbarLabels = labels?.toolbar;
     return [
@@ -230,11 +253,12 @@ const Toolbar = ({
         tooltip: toolbarLabels?.orderedList || 'Ordered list',
         iconSize: 14
       },
+      // link
       {
         name: "link",
         icon: Link,
-        onClick: toggleLinkDialog,
-        disabled: !editor.isActive('link'),
+        onClick: setLink,
+        disabled: !false,
         tooltip: toolbarLabels?.link || 'Link'
       },
       {
@@ -358,16 +382,6 @@ const Toolbar = ({
         );
       })}
 
-      {/* link dialog */}
-      {showTextEditorToolbarMenu(toolbar, "link") && (
-        <LinkDialog
-          editor={editor}
-          open={openLinkDialog}
-          onClose={toggleLinkDialog}
-          labels={labels?.link}
-        />
-      )}
-
       {/* youtube dialog */}
       {showTextEditorToolbarMenu(toolbar, "youtube") && (
         <YoutubeDialog

src/types.d.ts

@@ -144,9 +144,7 @@ export type IRequiredLabels = {
   };
   link: {
     link: string;
-    insert: string;
     invalid: string;
-    enter: string;
   };
   youtube: {
     link: string;

yarn.lock

@@ -2410,15 +2410,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@tiptap/extension-link@npm:^2.4.0":
-  version: 2.4.0
-  resolution: "@tiptap/extension-link@npm:2.4.0"
+"@tiptap/extension-link@npm:^2.5.7":
+  version: 2.5.7
+  resolution: "@tiptap/extension-link@npm:2.5.7"
   dependencies:
     linkifyjs: "npm:^4.1.0"
   peerDependencies:
-    "@tiptap/core": ^2.0.0
-    "@tiptap/pm": ^2.0.0
-  checksum: 10c0/260d89b349d59728a948ac098b38fbb96ed8472a923ee56ff78e3f3486662abca777d1c19a7ec85120723eaabe97f08dae85fcae09e0c040714ca85e5deb4780
+    "@tiptap/core": ^2.5.7
+    "@tiptap/pm": ^2.5.7
+  checksum: 10c0/c27e3c624092234f151faad404fd931a0dceba9a1bceb4df1e05b037c5d8d80f636b62e998dbe6e549ead07bde00ab3adb80287c3f8f129d37d50f9f5c9dc656
   languageName: node
   linkType: hard
 
@@ -7453,7 +7453,7 @@ __metadata:
     "@tiptap/extension-gapcursor": "npm:^2.4.0"
     "@tiptap/extension-heading": "npm:^2.4.0"
     "@tiptap/extension-image": "npm:^2.5.6"
-    "@tiptap/extension-link": "npm:^2.4.0"
+    "@tiptap/extension-link": "npm:^2.5.7"
     "@tiptap/extension-mention": "npm:^2.4.0"
     "@tiptap/extension-placeholder": "npm:^2.4.0"
     "@tiptap/extension-table": "npm:^2.4.0"