Add new Button and IconButton components (#3448)

This PR adds new `Button` and `IconButton` components built on top of
our new button abstractions.

Both of these buttons are built from the common `ButtonLike` base, and
implement the `ButtonCommon` (name TBD) trait in order to provide a
common interface.

There are still some visual tweaks that we'll need to make to the new
buttons, but those should be straightforward to make after we land this.

Release Notes:

- N/A
This commit is contained in:
Marshall Bowers 2023-11-29 17:41:44 -05:00 committed by GitHub
parent df5de47a78
commit b357ae4dc3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
23 changed files with 324 additions and 682 deletions

View file

@ -178,6 +178,7 @@ use gpui::{
use project::Fs;
use serde_derive::{Deserialize, Serialize};
use settings::{Settings, SettingsStore};
use ui::prelude::*;
use ui::{
h_stack, v_stack, Avatar, Button, Color, ContextMenu, Icon, IconButton, IconElement, IconSize,
Label, List, ListHeader, ListItem, Tooltip,
@ -2338,18 +2339,20 @@ impl CollabPanel {
}
fn render_signed_out(&mut self, cx: &mut ViewContext<Self>) -> Div {
v_stack().child(Button::new("Sign in to collaborate").on_click(cx.listener(
|this, _, cx| {
let client = this.client.clone();
cx.spawn(|_, mut cx| async move {
client
.authenticate_and_connect(true, &cx)
.await
.notify_async_err(&mut cx);
})
.detach()
},
)))
v_stack().child(
Button::new("sign_in", "Sign in to collaborate").on_click(cx.listener(
|this, _, cx| {
let client = this.client.clone();
cx.spawn(|_, mut cx| async move {
client
.authenticate_and_connect(true, &cx)
.await
.notify_async_err(&mut cx);
})
.detach()
},
)),
)
}
fn render_signed_in(&mut self, cx: &mut ViewContext<Self>) -> List {
@ -2564,7 +2567,7 @@ impl CollabPanel {
.group_hover("", |style| style.visible())
.child(
IconButton::new("remove_contact", Icon::Close)
.color(Color::Muted)
.icon_color(Color::Muted)
.tooltip(|cx| Tooltip::text("Remove Contact", cx))
.on_click(cx.listener(move |this, _, cx| {
this.remove_contact(user_id, &github_login, cx);
@ -2688,13 +2691,13 @@ impl CollabPanel {
.on_click(cx.listener(move |this, _, cx| {
this.respond_to_contact_request(user_id, false, cx);
}))
.color(color)
.icon_color(color)
.tooltip(|cx| Tooltip::text("Decline invite", cx)),
IconButton::new("remove_contact", Icon::Check)
.on_click(cx.listener(move |this, _, cx| {
this.respond_to_contact_request(user_id, true, cx);
}))
.color(color)
.icon_color(color)
.tooltip(|cx| Tooltip::text("Accept invite", cx)),
]
} else {
@ -2703,7 +2706,7 @@ impl CollabPanel {
.on_click(cx.listener(move |this, _, cx| {
this.remove_contact(user_id, &github_login, cx);
}))
.color(color)
.icon_color(color)
.tooltip(|cx| Tooltip::text("Cancel invite", cx))]
};
@ -2846,7 +2849,7 @@ impl CollabPanel {
"channel_chat",
Icon::MessageBubbles,
)
.color(if has_messages_notification {
.icon_color(if has_messages_notification {
Color::Default
} else {
Color::Muted
@ -2861,7 +2864,7 @@ impl CollabPanel {
.group_hover("", |style| style.visible())
.child(
IconButton::new("channel_notes", Icon::File)
.color(if has_notes_notification {
.icon_color(if has_notes_notification {
Color::Default
} else {
Color::Muted