Files panel drag and drop support

[sudomf]

Check for existing issues

• Completed

Describe the feature

Add support to drop a file from Finder to the project's file panel and vice-versa.

If applicable, add mockups / screenshots to help present your vision of the feature

No response

[SomeoneToIgnore]

We can enable external file drag and drop with

diff --git a/crates/project_panel/src/project_panel.rs b/crates/project_panel/src/project_panel.rs
index 413d42255..bdeb2780e 100644
--- a/crates/project_panel/src/project_panel.rs
+++ b/crates/project_panel/src/project_panel.rs
@@ -11,10 +11,10 @@ use anyhow::{anyhow, Result};
 use collections::{hash_map, HashMap};
 use gpui::{
     actions, div, overlay, px, uniform_list, Action, AppContext, AssetSource, AsyncWindowContext,
-    ClipboardItem, DismissEvent, Div, EventEmitter, FocusHandle, FocusableView, InteractiveElement,
-    KeyContext, Model, MouseButton, MouseDownEvent, ParentElement, Pixels, Point, PromptLevel,
-    Render, Stateful, Styled, Subscription, Task, UniformListScrollHandle, View, ViewContext,
-    VisualContext as _, WeakView, WindowContext,
+    ClipboardItem, DismissEvent, Div, EventEmitter, ExternalPaths, FocusHandle, FocusableView,
+    InteractiveElement, KeyContext, Model, MouseButton, MouseDownEvent, ParentElement, Pixels,
+    Point, PromptLevel, Render, Stateful, Styled, Subscription, Task, UniformListScrollHandle,
+    View, ViewContext, VisualContext as _, WeakView, WindowContext,
 };
 use menu::{Confirm, SelectNext, SelectPrev};
 use project::{
@@ -1556,6 +1556,15 @@ impl ProjectPanel {
         let depth = details.depth;
         div()
             .id(entry_id.to_proto() as usize)
+            .drag_over(|style, _: &ExternalPaths, cx| {
+                style.bg(cx.theme().colors().drop_target_background)
+            })
+            .on_drop(
+                cx.listener(move |project_panel, external_paths: &ExternalPaths, cx| {
+                    dbg!("Dropped on entry", external_paths, entry_id);
+                    cx.stop_propagation();
+                }),
+            )
             .on_drag(entry_id, move |entry_id, cx| {
                 cx.new_view(|_| DraggedProjectEntryView {
                     details: details.clone(),
@@ -1748,6 +1757,15 @@ impl Render for ProjectPanel {
                         })),
                 )
         }
+        .drag_over(|style, _: &ExternalPaths, cx| {
+            style.bg(cx.theme().colors().drop_target_background)
+        })
+        .on_drop(
+            cx.listener(move |project_panel, external_paths: &ExternalPaths, cx| {
+                dbg!("Empty panel space drop", external_paths);
+            }),
+        )
     }
 }
 

change, note cx.stop_propagation(); on the top level: this way, we catch the even on the item level and do not allow the underlying panel to react on that one too.
Also, style changes inside new drag_over additions seem to need more contrast between each other.

After that, we have to decide what to do with the file or directory: the code should be similar to move_entry except the fact that it does not move but recursively copies.

We might want to open files dropped this way in the editor.

[dwt]

This should also enable drag'dropping a file to either the internal or an external terminal to reference the file path there.

[JosephTLyons]

Bennet just landed a PR to address allow for dragging and dropping into the project panel, which feels like the bigger feature here. Let's close this issue out - if there is interest in dragging out of the project panel and into the system, let's open a new issue for users to vote on.