fix: Document hover preview should not show for the same document

app/components/Editor.tsx

@@ -350,6 +350,7 @@ function Editor(props: Props, ref: React.RefObject<SharedEditor> | null) {
         )}
         {activeLinkElement && !shareId && (
           <HoverPreview
+            id={props.id}
             element={activeLinkElement}
             onClose={handleLinkInactive}
           />

app/components/HoverPreview.tsx

@@ -14,11 +14,15 @@ const DELAY_OPEN = 300;
 const DELAY_CLOSE = 300;
 
 type Props = {
+  /* The document associated with the editor, if any */
+  id?: string;
+  /* The HTML element that is being hovered over */
   element: HTMLAnchorElement;
+  /* A callback on close of the hover preview */
   onClose: () => void;
 };
 
-function HoverPreviewInternal({ element, onClose }: Props) {
+function HoverPreviewInternal({ element, id, onClose }: Props) {
   const { documents } = useStores();
   const slug = parseDocumentSlug(element.href);
   const [isVisible, setVisible] = React.useState(false);
@@ -104,7 +108,7 @@ function HoverPreviewInternal({ element, onClose }: Props) {
         aria-hidden
       >
         <div ref={cardRef}>
-          <HoverPreviewDocument url={element.href}>
+          <HoverPreviewDocument url={element.href} id={id}>
             {(content: React.ReactNode) =>
               isVisible ? (
                 <Animate>

app/components/HoverPreviewDocument.tsx

@@ -9,11 +9,14 @@ import Editor from "~/components/Editor";
 import useStores from "~/hooks/useStores";
 
 type Props = {
+  /* The document associated with the editor, if any */
+  id?: string;
+  /* The URL we want a preview for */
   url: string;
   children: (content: React.ReactNode) => React.ReactNode;
 };
 
-function HoverPreviewDocument({ url, children }: Props) {
+function HoverPreviewDocument({ url, id, children }: Props) {
   const { documents } = useStores();
   const slug = parseDocumentSlug(url);
 
@@ -22,7 +25,7 @@ function HoverPreviewDocument({ url, children }: Props) {
   }
 
   const document = slug ? documents.getByUrl(slug) : undefined;
-  if (!document) {
+  if (!document || document.id === id) {
     return null;
   }