recent projects: cleanup ui (#7528)

As the ui for the file finder was recently changed in #7364, I think it
makes sense to also update the ui of the recent projects overlay.

Before:

![image](https://github.com/zed-industries/zed/assets/53836821/8a0f5bef-9b37-40f3-a974-9dfd7833cc71)

After:

![image](https://github.com/zed-industries/zed/assets/53836821/7e9f934a-1ac3-4716-b7b6-67a7435f3bde)


Release Notes:

- Improved UI of recent project overlay

crates/recent_projects/src/highlighted_workspace_location.rs

@@ -5,7 +5,7 @@ use ui::{prelude::*, HighlightedLabel};
 use util::paths::PathExt;
 use workspace::WorkspaceLocation;
 
-#[derive(IntoElement)]
+#[derive(Clone, IntoElement)]
 pub struct HighlightedText {
     pub text: String,
     pub highlight_positions: Vec<usize>,
@@ -48,6 +48,7 @@ impl RenderOnce for HighlightedText {
     }
 }
 
+#[derive(Clone)]
 pub struct HighlightedWorkspaceLocation {
     pub names: HighlightedText,
     pub paths: Vec<HighlightedText>,

crates/recent_projects/src/recent_projects.rs

@@ -10,7 +10,7 @@ use highlighted_workspace_location::HighlightedWorkspaceLocation;
 use ordered_float::OrderedFloat;
 use picker::{Picker, PickerDelegate};
 use std::sync::Arc;
-use ui::{prelude::*, ListItem, ListItemSpacing};
+use ui::{prelude::*, tooltip_container, HighlightedLabel, ListItem, ListItemSpacing};
 use util::paths::PathExt;
 use workspace::{ModalView, Workspace, WorkspaceLocation, WORKSPACE_DB};
 
@@ -30,7 +30,14 @@ impl ModalView for RecentProjects {}
 
 impl RecentProjects {
     fn new(delegate: RecentProjectsDelegate, rem_width: f32, cx: &mut ViewContext<Self>) -> Self {
-        let picker = cx.new_view(|cx| Picker::new(delegate, cx));
+        let picker = cx.new_view(|cx| {
+            // We want to use a list when we render paths, because the items can have different heights (multiple paths).
+            if delegate.render_paths {
+                Picker::list(delegate, cx)
+            } else {
+                Picker::uniform_list(delegate, cx)
+            }
+        });
         let _subscription = cx.subscribe(&picker, |_, _, _, cx| cx.emit(DismissEvent));
         // We do not want to block the UI on a potentially lengthy call to DB, so we're gonna swap
         // out workspace locations once the future runs to completion.
@@ -82,7 +89,7 @@ impl RecentProjects {
                 workspace.toggle_modal(cx, |cx| {
                     let delegate = RecentProjectsDelegate::new(weak_workspace, true);
 
-                    let modal = RecentProjects::new(delegate, 34., cx);
+                    let modal = Self::new(delegate, 34., cx);
                     modal
                 });
             })?;
@@ -139,7 +146,7 @@ impl PickerDelegate for RecentProjectsDelegate {
     type ListItem = ListItem;
 
     fn placeholder_text(&self) -> Arc<str> {
-        "Recent Projects...".into()
+        "Search recent projects...".into()
     }
 
     fn match_count(&self) -> usize {
@@ -230,6 +237,8 @@ impl PickerDelegate for RecentProjectsDelegate {
             &self.workspace_locations[r#match.candidate_id],
         );
 
+        let tooltip_highlighted_location = highlighted_location.clone();
+
         Some(
             ListItem::new(ix)
                 .inset(true)
@@ -239,9 +248,42 @@ impl PickerDelegate for RecentProjectsDelegate {
                     v_flex()
                         .child(highlighted_location.names)
                         .when(self.render_paths, |this| {
-                            this.children(highlighted_location.paths)
+                            this.children(highlighted_location.paths.into_iter().map(|path| {
+                                HighlightedLabel::new(path.text, path.highlight_positions)
+                                    .size(LabelSize::Small)
+                                    .color(Color::Muted)
+                            }))
                         }),
-                ),
+                )
+                .tooltip(move |cx| {
+                    let tooltip_highlighted_location = tooltip_highlighted_location.clone();
+                    cx.new_view(move |_| MatchTooltip {
+                        highlighted_location: tooltip_highlighted_location,
+                    })
+                    .into()
+                }),
         )
     }
 }
+
+struct MatchTooltip {
+    highlighted_location: HighlightedWorkspaceLocation,
+}
+
+impl Render for MatchTooltip {
+    fn render(&mut self, cx: &mut ViewContext<Self>) -> impl IntoElement {
+        tooltip_container(cx, |div, _| {
+            div.children(
+                self.highlighted_location
+                    .paths
+                    .clone()
+                    .into_iter()
+                    .map(|path| {
+                        HighlightedLabel::new(path.text, path.highlight_positions)
+                            .size(LabelSize::Small)
+                            .color(Color::Muted)
+                    }),
+            )
+        })
+    }
+}