mirror of
https://github.com/zed-industries/zed.git
synced 2024-12-28 01:21:47 +03:00
Render a user query editor in the contacts panel
This commit is contained in:
parent
6050e0ead7
commit
342bdfc7e0
1
Cargo.lock
generated
1
Cargo.lock
generated
@ -930,6 +930,7 @@ name = "contacts_panel"
|
||||
version = "0.1.0"
|
||||
dependencies = [
|
||||
"client",
|
||||
"editor",
|
||||
"gpui",
|
||||
"postage",
|
||||
"settings",
|
||||
|
@ -1212,6 +1212,34 @@
|
||||
"bottom": 12,
|
||||
"right": 12
|
||||
},
|
||||
"user_query_editor": {
|
||||
"background": "#19171c",
|
||||
"corner_radius": 6,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#e2dfe7",
|
||||
"size": 14
|
||||
},
|
||||
"placeholder_text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#7e7887",
|
||||
"size": 14
|
||||
},
|
||||
"selection": {
|
||||
"cursor": "#576ddb",
|
||||
"selection": "#576ddb3d"
|
||||
},
|
||||
"border": {
|
||||
"color": "#26232a",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 7,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 7
|
||||
}
|
||||
},
|
||||
"host_row_height": 28,
|
||||
"tree_branch_color": "#655f6d",
|
||||
"tree_branch_width": 1,
|
||||
|
@ -1212,6 +1212,34 @@
|
||||
"bottom": 12,
|
||||
"right": 12
|
||||
},
|
||||
"user_query_editor": {
|
||||
"background": "#efecf4",
|
||||
"corner_radius": 6,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#26232a",
|
||||
"size": 14
|
||||
},
|
||||
"placeholder_text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#655f6d",
|
||||
"size": 14
|
||||
},
|
||||
"selection": {
|
||||
"cursor": "#576ddb",
|
||||
"selection": "#576ddb3d"
|
||||
},
|
||||
"border": {
|
||||
"color": "#e2dfe7",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 7,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 7
|
||||
}
|
||||
},
|
||||
"host_row_height": 28,
|
||||
"tree_branch_color": "#7e7887",
|
||||
"tree_branch_width": 1,
|
||||
|
@ -1212,6 +1212,34 @@
|
||||
"bottom": 12,
|
||||
"right": 12
|
||||
},
|
||||
"user_query_editor": {
|
||||
"background": "#000000",
|
||||
"corner_radius": 6,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#f1f1f1",
|
||||
"size": 14
|
||||
},
|
||||
"placeholder_text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#474747",
|
||||
"size": 14
|
||||
},
|
||||
"selection": {
|
||||
"cursor": "#2472f2",
|
||||
"selection": "#2472f23d"
|
||||
},
|
||||
"border": {
|
||||
"color": "#232323",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 7,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 7
|
||||
}
|
||||
},
|
||||
"host_row_height": 28,
|
||||
"tree_branch_color": "#404040",
|
||||
"tree_branch_width": 1,
|
||||
|
@ -1212,6 +1212,34 @@
|
||||
"bottom": 12,
|
||||
"right": 12
|
||||
},
|
||||
"user_query_editor": {
|
||||
"background": "#ffffff",
|
||||
"corner_radius": 6,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#2b2b2b",
|
||||
"size": 14
|
||||
},
|
||||
"placeholder_text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#808080",
|
||||
"size": 14
|
||||
},
|
||||
"selection": {
|
||||
"cursor": "#2472f2",
|
||||
"selection": "#2472f23d"
|
||||
},
|
||||
"border": {
|
||||
"color": "#d5d5d5",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 7,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 7
|
||||
}
|
||||
},
|
||||
"host_row_height": 28,
|
||||
"tree_branch_color": "#e3e3e3",
|
||||
"tree_branch_width": 1,
|
||||
|
@ -1212,6 +1212,34 @@
|
||||
"bottom": 12,
|
||||
"right": 12
|
||||
},
|
||||
"user_query_editor": {
|
||||
"background": "#002b36",
|
||||
"corner_radius": 6,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#eee8d5",
|
||||
"size": 14
|
||||
},
|
||||
"placeholder_text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#839496",
|
||||
"size": 14
|
||||
},
|
||||
"selection": {
|
||||
"cursor": "#268bd2",
|
||||
"selection": "#268bd23d"
|
||||
},
|
||||
"border": {
|
||||
"color": "#073642",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 7,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 7
|
||||
}
|
||||
},
|
||||
"host_row_height": 28,
|
||||
"tree_branch_color": "#657b83",
|
||||
"tree_branch_width": 1,
|
||||
|
@ -1212,6 +1212,34 @@
|
||||
"bottom": 12,
|
||||
"right": 12
|
||||
},
|
||||
"user_query_editor": {
|
||||
"background": "#fdf6e3",
|
||||
"corner_radius": 6,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#073642",
|
||||
"size": 14
|
||||
},
|
||||
"placeholder_text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#657b83",
|
||||
"size": 14
|
||||
},
|
||||
"selection": {
|
||||
"cursor": "#268bd2",
|
||||
"selection": "#268bd23d"
|
||||
},
|
||||
"border": {
|
||||
"color": "#eee8d5",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 7,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 7
|
||||
}
|
||||
},
|
||||
"host_row_height": 28,
|
||||
"tree_branch_color": "#839496",
|
||||
"tree_branch_width": 1,
|
||||
|
@ -1212,6 +1212,34 @@
|
||||
"bottom": 12,
|
||||
"right": 12
|
||||
},
|
||||
"user_query_editor": {
|
||||
"background": "#202746",
|
||||
"corner_radius": 6,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#dfe2f1",
|
||||
"size": 14
|
||||
},
|
||||
"placeholder_text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#898ea4",
|
||||
"size": 14
|
||||
},
|
||||
"selection": {
|
||||
"cursor": "#3d8fd1",
|
||||
"selection": "#3d8fd13d"
|
||||
},
|
||||
"border": {
|
||||
"color": "#293256",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 7,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 7
|
||||
}
|
||||
},
|
||||
"host_row_height": 28,
|
||||
"tree_branch_color": "#6b7394",
|
||||
"tree_branch_width": 1,
|
||||
|
@ -1212,6 +1212,34 @@
|
||||
"bottom": 12,
|
||||
"right": 12
|
||||
},
|
||||
"user_query_editor": {
|
||||
"background": "#f5f7ff",
|
||||
"corner_radius": 6,
|
||||
"text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#293256",
|
||||
"size": 14
|
||||
},
|
||||
"placeholder_text": {
|
||||
"family": "Zed Mono",
|
||||
"color": "#6b7394",
|
||||
"size": 14
|
||||
},
|
||||
"selection": {
|
||||
"cursor": "#3d8fd1",
|
||||
"selection": "#3d8fd13d"
|
||||
},
|
||||
"border": {
|
||||
"color": "#dfe2f1",
|
||||
"width": 1
|
||||
},
|
||||
"padding": {
|
||||
"bottom": 7,
|
||||
"left": 8,
|
||||
"right": 8,
|
||||
"top": 7
|
||||
}
|
||||
},
|
||||
"host_row_height": 28,
|
||||
"tree_branch_color": "#898ea4",
|
||||
"tree_branch_width": 1,
|
||||
|
@ -9,6 +9,7 @@ doctest = false
|
||||
|
||||
[dependencies]
|
||||
client = { path = "../client" }
|
||||
editor = { path = "../editor" }
|
||||
gpui = { path = "../gpui" }
|
||||
settings = { path = "../settings" }
|
||||
theme = { path = "../theme" }
|
||||
|
@ -1,10 +1,11 @@
|
||||
use client::{Contact, UserStore};
|
||||
use editor::Editor;
|
||||
use gpui::{
|
||||
elements::*,
|
||||
geometry::{rect::RectF, vector::vec2f},
|
||||
platform::CursorStyle,
|
||||
Element, ElementBox, Entity, LayoutContext, ModelHandle, RenderContext, Subscription, View,
|
||||
ViewContext,
|
||||
ViewContext, ViewHandle,
|
||||
};
|
||||
use settings::Settings;
|
||||
use std::sync::Arc;
|
||||
@ -13,6 +14,7 @@ use workspace::{AppState, JoinProject};
|
||||
pub struct ContactsPanel {
|
||||
contacts: ListState,
|
||||
user_store: ModelHandle<UserStore>,
|
||||
user_query_editor: ViewHandle<Editor>,
|
||||
_maintain_contacts: Subscription,
|
||||
}
|
||||
|
||||
@ -38,6 +40,12 @@ impl ContactsPanel {
|
||||
}
|
||||
},
|
||||
),
|
||||
user_query_editor: cx.add_view(|cx| {
|
||||
Editor::single_line(
|
||||
Some(|theme| theme.contacts_panel.user_query_editor.clone()),
|
||||
cx,
|
||||
)
|
||||
}),
|
||||
_maintain_contacts: cx.observe(&app_state.user_store, Self::update_contacts),
|
||||
user_store: app_state.user_store.clone(),
|
||||
}
|
||||
@ -237,8 +245,17 @@ impl View for ContactsPanel {
|
||||
|
||||
fn render(&mut self, cx: &mut RenderContext<Self>) -> ElementBox {
|
||||
let theme = &cx.global::<Settings>().theme.contacts_panel;
|
||||
Container::new(List::new(self.contacts.clone()).boxed())
|
||||
.with_style(theme.container)
|
||||
.boxed()
|
||||
Container::new(
|
||||
Flex::column()
|
||||
.with_child(
|
||||
Container::new(ChildView::new(self.user_query_editor.clone()).boxed())
|
||||
.with_style(theme.user_query_editor.container)
|
||||
.boxed(),
|
||||
)
|
||||
.with_child(List::new(self.contacts.clone()).flex(1., false).boxed())
|
||||
.boxed(),
|
||||
)
|
||||
.with_style(theme.container)
|
||||
.boxed()
|
||||
}
|
||||
}
|
||||
|
@ -234,6 +234,7 @@ pub struct CommandPalette {
|
||||
pub struct ContactsPanel {
|
||||
#[serde(flatten)]
|
||||
pub container: ContainerStyle,
|
||||
pub user_query_editor: FieldEditor,
|
||||
pub host_row_height: f32,
|
||||
pub host_avatar: ImageStyle,
|
||||
pub host_username: ContainedText,
|
||||
|
@ -1,6 +1,6 @@
|
||||
import Theme from "../themes/theme";
|
||||
import { panel } from "./app";
|
||||
import { backgroundColor, borderColor, text } from "./components";
|
||||
import { backgroundColor, border, borderColor, player, text } from "./components";
|
||||
|
||||
export default function(theme: Theme) {
|
||||
const project = {
|
||||
@ -33,6 +33,20 @@ export default function(theme: Theme) {
|
||||
|
||||
return {
|
||||
...panel,
|
||||
userQueryEditor: {
|
||||
background: backgroundColor(theme, 500),
|
||||
cornerRadius: 6,
|
||||
text: text(theme, "mono", "primary"),
|
||||
placeholderText: text(theme, "mono", "placeholder", { size: "sm" }),
|
||||
selection: player(theme, 1).selection,
|
||||
border: border(theme, "secondary"),
|
||||
padding: {
|
||||
bottom: 7,
|
||||
left: 8,
|
||||
right: 8,
|
||||
top: 7,
|
||||
},
|
||||
},
|
||||
hostRowHeight: 28,
|
||||
treeBranchColor: borderColor(theme, "muted"),
|
||||
treeBranchWidth: 1,
|
||||
|
Loading…
Reference in New Issue
Block a user