diff --git a/crates/collab_ui/src/contact_list.rs b/crates/collab_ui/src/contact_list.rs index ba7083d604..c2736ea9d3 100644 --- a/crates/collab_ui/src/contact_list.rs +++ b/crates/collab_ui/src/contact_list.rs @@ -8,9 +8,8 @@ use fuzzy::{match_strings, StringMatchCandidate}; use gpui::{ elements::*, geometry::{rect::RectF, vector::vec2f}, - impl_actions, impl_internal_actions, keymap, AppContext, ClipboardItem, CursorStyle, Entity, - ModelHandle, MouseButton, MutableAppContext, RenderContext, Subscription, View, ViewContext, - ViewHandle, + impl_actions, impl_internal_actions, keymap, AppContext, CursorStyle, Entity, ModelHandle, + MouseButton, MutableAppContext, RenderContext, Subscription, View, ViewContext, ViewHandle, }; use menu::{Confirm, SelectNext, SelectPrev}; use project::Project; @@ -1104,55 +1103,6 @@ impl View for ContactList { .boxed(), ) .with_child(List::new(self.list_state.clone()).flex(1., false).boxed()) - .with_children( - self.user_store - .read(cx) - .invite_info() - .cloned() - .and_then(|info| { - enum InviteLink {} - - if info.count > 0 { - Some( - MouseEventHandler::::new(0, cx, |state, cx| { - let style = theme - .contact_list - .invite_row - .style_for(state, false) - .clone(); - - let copied = cx.read_from_clipboard().map_or(false, |item| { - item.text().as_str() == info.url.as_ref() - }); - - Label::new( - format!( - "{} invite link ({} left)", - if copied { "Copied" } else { "Copy" }, - info.count - ), - style.label.clone(), - ) - .aligned() - .left() - .constrained() - .with_height(theme.contact_list.row_height) - .contained() - .with_style(style.container) - .boxed() - }) - .with_cursor_style(CursorStyle::PointingHand) - .on_click(MouseButton::Left, move |_, cx| { - cx.write_to_clipboard(ClipboardItem::new(info.url.to_string())); - cx.notify(); - }) - .boxed(), - ) - } else { - None - } - }), - ) .boxed() } diff --git a/crates/collab_ui/src/contacts_popover.rs b/crates/collab_ui/src/contacts_popover.rs index 0758cf735d..deedac9f98 100644 --- a/crates/collab_ui/src/contacts_popover.rs +++ b/crates/collab_ui/src/contacts_popover.rs @@ -1,8 +1,8 @@ use crate::{contact_finder::ContactFinder, contact_list::ContactList}; use client::UserStore; use gpui::{ - actions, elements::*, Entity, ModelHandle, MutableAppContext, RenderContext, View, ViewContext, - ViewHandle, + actions, elements::*, ClipboardItem, CursorStyle, Entity, ModelHandle, MouseButton, + MutableAppContext, RenderContext, View, ViewContext, ViewHandle, }; use project::Project; use settings::Settings; @@ -92,7 +92,57 @@ impl View for ContactsPopover { Child::ContactFinder(child) => ChildView::new(child), }; - child + Flex::column() + .with_child(child.flex(1., true).boxed()) + .with_children( + self.user_store + .read(cx) + .invite_info() + .cloned() + .and_then(|info| { + enum InviteLink {} + + if info.count > 0 { + Some( + MouseEventHandler::::new(0, cx, |state, cx| { + let style = theme + .contacts_popover + .invite_row + .style_for(state, false) + .clone(); + + let copied = cx.read_from_clipboard().map_or(false, |item| { + item.text().as_str() == info.url.as_ref() + }); + + Label::new( + format!( + "{} invite link ({} left)", + if copied { "Copied" } else { "Copy" }, + info.count + ), + style.label.clone(), + ) + .aligned() + .left() + .constrained() + .with_height(theme.contacts_popover.invite_row_height) + .contained() + .with_style(style.container) + .boxed() + }) + .with_cursor_style(CursorStyle::PointingHand) + .on_click(MouseButton::Left, move |_, cx| { + cx.write_to_clipboard(ClipboardItem::new(info.url.to_string())); + cx.notify(); + }) + .boxed(), + ) + } else { + None + } + }), + ) .contained() .with_style(theme.contacts_popover.container) .constrained() diff --git a/crates/theme/src/theme.rs b/crates/theme/src/theme.rs index 503645d6bc..37ec279d02 100644 --- a/crates/theme/src/theme.rs +++ b/crates/theme/src/theme.rs @@ -89,6 +89,8 @@ pub struct ContactsPopover { pub container: ContainerStyle, pub height: f32, pub width: f32, + pub invite_row_height: f32, + pub invite_row: Interactive, } #[derive(Deserialize, Default)] @@ -110,7 +112,6 @@ pub struct ContactList { pub contact_button_spacing: f32, pub disabled_button: IconButton, pub section_icon_size: f32, - pub invite_row: Interactive, pub calling_indicator: ContainedText, } diff --git a/styles/src/styleTree/contactList.ts b/styles/src/styleTree/contactList.ts index 52d5a25c44..ecf0eaa0c7 100644 --- a/styles/src/styleTree/contactList.ts +++ b/styles/src/styleTree/contactList.ts @@ -139,17 +139,6 @@ export default function contactList(theme: Theme) { background: backgroundColor(theme, 100), color: iconColor(theme, "muted"), }, - inviteRow: { - padding: { - left: sidePadding, - right: sidePadding, - }, - border: { top: true, width: 1, color: borderColor(theme, "primary") }, - text: text(theme, "sans", "secondary", { size: "sm" }), - hover: { - text: text(theme, "sans", "active", { size: "sm" }), - }, - }, callingIndicator: { ...text(theme, "mono", "muted", { size: "xs" }) }, diff --git a/styles/src/styleTree/contactsPopover.ts b/styles/src/styleTree/contactsPopover.ts index 2e70b3daea..0f82c7c175 100644 --- a/styles/src/styleTree/contactsPopover.ts +++ b/styles/src/styleTree/contactsPopover.ts @@ -1,7 +1,8 @@ import Theme from "../themes/common/theme"; -import { backgroundColor, border, popoverShadow } from "./components"; +import { backgroundColor, border, borderColor, popoverShadow, text } from "./components"; export default function contactsPopover(theme: Theme) { + const sidePadding = 12; return { background: backgroundColor(theme, 300, "base"), cornerRadius: 6, @@ -11,5 +12,17 @@ export default function contactsPopover(theme: Theme) { border: border(theme, "primary"), width: 300, height: 400, + inviteRowHeight: 28, + inviteRow: { + padding: { + left: sidePadding, + right: sidePadding, + }, + border: { top: true, width: 1, color: borderColor(theme, "primary") }, + text: text(theme, "sans", "secondary", { size: "sm" }), + hover: { + text: text(theme, "sans", "active", { size: "sm" }), + }, + }, } }