diff --git a/.DS_Store b/.DS_Store
index ca558bf..4de7a02 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/assets/.DS_Store b/assets/.DS_Store
new file mode 100644
index 0000000..7d1d964
Binary files /dev/null and b/assets/.DS_Store differ
diff --git a/assets/icons/explore.svg b/assets/icons/explore.svg
new file mode 100644
index 0000000..69bcd9b
--- /dev/null
+++ b/assets/icons/explore.svg
@@ -0,0 +1,3 @@
+
diff --git a/assets/icons/messages.svg b/assets/icons/messages.svg
new file mode 100644
index 0000000..fe6207c
--- /dev/null
+++ b/assets/icons/messages.svg
@@ -0,0 +1,4 @@
+
diff --git a/assets/icons/notifications.svg b/assets/icons/notifications.svg
new file mode 100644
index 0000000..8e48c04
--- /dev/null
+++ b/assets/icons/notifications.svg
@@ -0,0 +1,3 @@
+
diff --git a/assets/icons/search.svg b/assets/icons/search.svg
new file mode 100644
index 0000000..2ad28af
--- /dev/null
+++ b/assets/icons/search.svg
@@ -0,0 +1,3 @@
+
diff --git a/crates/ui/Cargo.toml b/crates/ui/Cargo.toml
index 7418574..7f8d2aa 100644
--- a/crates/ui/Cargo.toml
+++ b/crates/ui/Cargo.toml
@@ -22,3 +22,4 @@ reqwest_client.workspace = true
client = { version = "0.1.0", path = "../client" }
rust-embed = "8.5.0"
+env_logger = "0.11.5"
diff --git a/crates/ui/src/main.rs b/crates/ui/src/main.rs
index 32d13b6..297fb22 100644
--- a/crates/ui/src/main.rs
+++ b/crates/ui/src/main.rs
@@ -15,6 +15,8 @@ actions!(main_menu, [Quit]);
#[tokio::main]
async fn main() {
+ env_logger::init();
+
// Initialize nostr client
let nostr = NostrClient::init().await;
// Initializ app state
diff --git a/crates/ui/src/views/chat_space/mod.rs b/crates/ui/src/views/chat_space/mod.rs
index 2592517..3d36288 100644
--- a/crates/ui/src/views/chat_space/mod.rs
+++ b/crates/ui/src/views/chat_space/mod.rs
@@ -4,8 +4,10 @@ use components::{
theme::ActiveTheme,
};
use gpui::*;
+use navigation::Navigation;
pub mod bottom_bar;
+pub mod navigation;
pub struct ChatSpace {
layout: View,
@@ -13,8 +15,8 @@ pub struct ChatSpace {
impl ChatSpace {
pub fn new(cx: &mut ViewContext<'_, Self>) -> Self {
+ let navigation = cx.new_view(Navigation::new);
let bottom_bar = cx.new_view(BottomBar::new);
- // TODO: add chat list view
let layout = cx.new_view(|cx| {
h_resizable(cx)
@@ -25,15 +27,7 @@ impl ChatSpace {
.bg(cx.theme().secondary)
.flex()
.flex_col()
- .child(
- div()
- .flex_1()
- .flex()
- .items_center()
- .justify_center()
- .w_full()
- .child("Chat List"),
- )
+ .child(navigation.clone())
.child(bottom_bar.clone())
.into_any_element()
}),
diff --git a/crates/ui/src/views/chat_space/navigation.rs b/crates/ui/src/views/chat_space/navigation.rs
new file mode 100644
index 0000000..9ad2abd
--- /dev/null
+++ b/crates/ui/src/views/chat_space/navigation.rs
@@ -0,0 +1,83 @@
+use components::{theme::ActiveTheme, Icon, IconName};
+use gpui::*;
+
+#[derive(IntoElement)]
+struct NavItem {
+ text: SharedString,
+ icon: Icon,
+}
+
+impl NavItem {
+ pub fn new(text: SharedString, icon: Icon) -> Self {
+ Self { text, icon }
+ }
+}
+
+impl RenderOnce for NavItem {
+ fn render(self, cx: &mut WindowContext) -> impl IntoElement {
+ div()
+ .hover(|this| this.bg(cx.theme().background))
+ .rounded_md()
+ .flex()
+ .items_center()
+ .h_7()
+ .px_2()
+ .gap_2()
+ .child(self.icon)
+ .child(div().pt(px(2.)).child(self.text))
+ }
+}
+
+pub struct Navigation {}
+
+impl Navigation {
+ pub fn new(cx: &mut ViewContext<'_, Self>) -> Self {
+ Self {}
+ }
+}
+
+impl Render for Navigation {
+ fn render(&mut self, cx: &mut ViewContext) -> impl IntoElement {
+ div().flex_1().w_full().px_2().child(div().h_11()).child(
+ div().flex().flex_col().gap_4().child(
+ div()
+ .flex()
+ .flex_col()
+ .gap_1()
+ .text_sm()
+ .child(NavItem::new(
+ "Find".into(),
+ Icon::new(IconName::Search)
+ .path("icons/search.svg")
+ .size_4()
+ .flex_shrink_0()
+ .text_color(cx.theme().foreground),
+ ))
+ .child(NavItem::new(
+ "Messages".into(),
+ Icon::new(IconName::Search)
+ .path("icons/messages.svg")
+ .size_4()
+ .flex_shrink_0()
+ .text_color(cx.theme().foreground),
+ ))
+ .child(NavItem::new(
+ "Notifications".into(),
+ Icon::new(IconName::Search)
+ .path("icons/notifications.svg")
+ .size_4()
+ .flex_shrink_0()
+ .text_color(cx.theme().foreground),
+ ))
+ .child(NavItem::new(
+ "explore".into(),
+ Icon::new(IconName::Search)
+ .path("icons/explore.svg")
+ .size_4()
+ .flex_shrink_0()
+ .text_color(cx.theme().foreground),
+ )),
+ ),
+ )
+ }
+}