feat: adds hover to expand functionality on sidebar (#1761)

* feat: adds hover to expand functionality on sidebar

* clear hover intent timeout on drag leave

app/components/Sidebar/components/DocumentLink.js

@@ -134,6 +134,17 @@ function DocumentLink({
     },
   });
 
+  const hoverExpanding = React.useRef(null);
+
+  // We set a timeout when the user first starts hovering over the document link,
+  // to trigger expansion of children. Clear this timeout when they stop hovering.
+  const resetHoverExpanding = React.useCallback(() => {
+    if (hoverExpanding.current) {
+      clearTimeout(hoverExpanding.current);
+      hoverExpanding.current = null;
+    }
+  }, []);
+
   // Drop to re-parent
   const [{ isOverReparent, canDropToReparent }, dropToReparent] = useDrop({
     accept: "document",
@@ -142,8 +153,29 @@ function DocumentLink({
       if (!collection) return;
       documents.move(item.id, collection.id, node.id);
     },
+
     canDrop: (item, monitor) =>
       pathToNode && !pathToNode.includes(monitor.getItem().id),
+
+    hover: (item, monitor) => {
+      // Enables expansion of document children when hovering over the document
+      // for more than half a second.
+      if (
+        hasChildDocuments &&
+        monitor.canDrop() &&
+        monitor.isOver({ shallow: true })
+      ) {
+        if (!hoverExpanding.current) {
+          hoverExpanding.current = setTimeout(() => {
+            hoverExpanding.current = null;
+            if (monitor.isOver({ shallow: true })) {
+              setExpanded(true);
+            }
+          }, 500);
+        }
+      }
+    },
+
     collect: (monitor) => ({
       isOverReparent: !!monitor.isOver({ shallow: true }),
       canDropToReparent: monitor.canDrop(),
@@ -171,7 +203,7 @@ function DocumentLink({
 
   return (
     <>
-      <div style={{ position: "relative" }}>
+      <div style={{ position: "relative" }} onDragLeave={resetHoverExpanding}>
         <Draggable
           key={node.id}
           ref={drag}

shared/i18n/locales/en_US/translation.json

@@ -8,6 +8,11 @@
   "Drafts": "Drafts",
   "Templates": "Templates",
   "Deleted Collection": "Deleted Collection",
+  "New": "New",
+  "Only visible to you": "Only visible to you",
+  "Draft": "Draft",
+  "Template": "Template",
+  "New doc": "New doc",
   "deleted": "deleted",
   "archived": "archived",
   "created": "created",
@@ -17,11 +22,6 @@
   "Never viewed": "Never viewed",
   "Viewed": "Viewed",
   "in": "in",
-  "New": "New",
-  "Only visible to you": "Only visible to you",
-  "Draft": "Draft",
-  "Template": "Template",
-  "New doc": "New doc",
   "More options": "More options",
   "Insert column after": "Insert column after",
   "Insert column before": "Insert column before",