[WEB-1610] chore: re-implement reload confirmation hook. (#4880)

* [WEB-1610] chore: re-implement reload confirmation hook.

* chore: attach anchor event listner to window instead of body.

packages/editor/core/src/ui/mentions/mention-node-view.tsx

@@ -2,14 +2,12 @@
 // @ts-nocheck
 import { NodeViewWrapper } from "@tiptap/react";
 import { cn } from "src/lib/utils";
-import { useRouter } from "next/navigation";
 import { IMentionHighlight } from "src/types/mention-suggestion";
 import { useEffect, useState } from "react";
 
 // eslint-disable-next-line import/no-anonymous-default-export
 export const MentionNodeView = (props) => {
   // TODO: move it to web app
-  const router = useRouter();
   const [highlightsState, setHighlightsState] = useState<IMentionHighlight[]>();
 
   useEffect(() => {
@@ -21,25 +19,20 @@ export const MentionNodeView = (props) => {
     hightlights();
   }, [props.extension.options]);
 
-  const handleClick = () => {
-    if (!props.extension.options.readonly) {
-      router.push(props.node.attrs.redirect_uri);
-    }
-  };
-
   return (
     <NodeViewWrapper className="mention-component inline w-fit">
-      <span
+      <a
+        href={props.node.attrs.redirect_uri}
+        target="_blank"
         className={cn("mention rounded bg-custom-primary-100/20 px-1 py-0.5 font-medium text-custom-primary-100", {
           "bg-yellow-500/20 text-yellow-500": highlightsState
             ? highlightsState.includes(props.node.attrs.entity_identifier)
             : false,
           "cursor-pointer": !props.extension.options.readonly,
         })}
-        onClick={handleClick}
       >
         @{props.node.attrs.label}
-      </span>
+      </a>
     </NodeViewWrapper>
   );
 };