chore: add tabs

src/action.rs

@@ -0,0 +1,72 @@
+/// Defines unit structs that can be used as actions.
+/// To use more complex data types as actions, use `impl_actions!`
+#[macro_export]
+macro_rules! actions {
+    ($namespace:path, [ $($name:ident),* $(,)? ]) => {
+        $(
+            /// The `$name` action see [`gpui::actions!`]
+            #[derive(::std::cmp::PartialEq, ::std::clone::Clone, ::std::default::Default, ::std::fmt::Debug, gpui::private::serde_derive::Deserialize)]
+            #[serde(crate = "gpui::private::serde")]
+            pub struct $name;
+
+            gpui::__impl_action!($namespace, $name,
+                fn build(_: gpui::private::serde_json::Value) -> gpui::Result<::std::boxed::Box<dyn gpui::Action>> {
+                    Ok(Box::new(Self))
+                }
+            );
+
+            gpui::register_action!($name);
+        )*
+    };
+}
+
+#[doc(hidden)]
+#[macro_export]
+macro_rules! __impl_action {
+    ($namespace:path, $name:ident, $build:item) => {
+        impl gpui::Action for $name {
+            fn name(&self) -> &'static str
+            {
+                concat!(
+                    stringify!($namespace),
+                    "::",
+                    stringify!($name),
+                )
+            }
+
+            fn debug_name() -> &'static str
+            where
+                Self: ::std::marker::Sized
+            {
+                concat!(
+                    stringify!($namespace),
+                    "::",
+                    stringify!($name),
+                )
+            }
+
+            $build
+
+            fn partial_eq(&self, action: &dyn gpui::Action) -> bool {
+                action
+                    .as_any()
+                    .downcast_ref::<Self>()
+                    .map_or(false, |a| self == a)
+            }
+
+            fn boxed_clone(&self) ->  std::boxed::Box<dyn gpui::Action> {
+                ::std::boxed::Box::new(self.clone())
+            }
+
+            fn as_any(&self) -> &dyn ::std::any::Any {
+                self
+            }
+        }
+    };
+}
+
+mod no_action {
+    use crate as gpui;
+
+    actions!(zed, [NoAction]);
+}

src/components/add_card.rs

@@ -83,6 +83,7 @@ impl AddCardView {
         match card.save(&collection.storage.conn) {
             Ok(_) => {
                 StackableViewState::update(|state, cx| state.pop(cx), cx);
+                cx.notify();
             }
             Err(e) => {
                 log::error!("Error saving card: {:?}", e);

src/components/deck/deck_detail.rs

@@ -62,6 +62,10 @@ impl DeckDetail {
 
                 cx.notify();
             }
+            "backspace" => {
+                StackableViewState::update(|state, cx| state.pop(cx), cx);
+                cx.notify();
+            }
             _ => {}
         };
     }

src/components/deck/deck_list.rs

@@ -185,6 +185,10 @@ impl DeckListView {
 
 impl Render for DeckListView {
     fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> impl gpui::prelude::IntoElement {
+        cx.focus(&self.focus_handle);
+
+        self.items = Self::get_all_decks_and_stats(cx.global::<Collection>());
+
         let theme = cx.global::<Theme>();
         let collection = cx.global::<crate::Collection>();
         let selected = self.selected.read(cx);
@@ -285,7 +289,7 @@ impl RenderOnce for HocListItem {
 
         div()
             .flex()
-            .p_2()
+            .py_2()
             .border_1()
             .rounded_xl()
             .child(inner)
@@ -314,7 +318,7 @@ impl ListItem {
 impl Render for ListItem {
     fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> impl IntoElement {
         let theme = cx.global::<Theme>();
-        let mut bg_hover = theme.mantle;
+        let mut bg_hover = theme.overlay0;
         bg_hover.fade_out(0.5);
 
         let deck_id = self.deck.id.unwrap();
@@ -330,9 +334,9 @@ impl Render for ListItem {
         };
 
         if self.selected {
-            div().border_color(theme.crust).bg(theme.mantle)
+            div().border_color(theme.crust).bg(bg_hover).rounded_md()
         } else {
-            div().hover(|s| s.bg(bg_hover))
+            div().hover(|s| s.px_2().rounded_lg().bg(bg_hover))
         }
         .flex()
         .w_full()
@@ -344,7 +348,13 @@ impl Render for ListItem {
                 cx,
             );
         })
-        .child(div().min_w_80().text_sm().child(self.deck.name.clone()))
+        .child(
+            div()
+                .min_w_80()
+                .text_sm()
+                .pl_2()
+                .child(self.deck.name.clone()),
+        )
         .child(
             div()
                 .min_w_20()

src/components/deck/new_deck_form.rs

@@ -1,6 +1,6 @@
 use gpui::{
-    div, AnyView, ClickEvent, FontWeight, ParentElement, Pixels, Render, Styled, View, ViewContext,
-    VisualContext, WindowContext,
+    div, AnyView, ClickEvent, FocusHandle, FontWeight, InteractiveElement, ParentElement, Pixels,
+    Render, Styled, View, ViewContext, VisualContext, WindowContext,
 };
 
 use crate::{
@@ -12,16 +12,35 @@ use crate::{
 
 struct NewDeckForm {
     text_input: TextField,
+    focused_at: usize,
+    focus_handle: FocusHandle,
 }
 
 impl NewDeckForm {
     pub fn view(cx: &mut WindowContext) -> View<Self> {
-        cx.new_view(|cx: &mut gpui::ViewContext<'_, NewDeckForm>| Self {
-            text_input: TextField::new(cx, "Deck Name".to_string(), false),
+        cx.new_view(|cx: &mut gpui::ViewContext<'_, NewDeckForm>| {
+            let text_input = TextField::new(cx, "Input deck name".to_string(), false);
+            text_input.focus(cx);
+
+            let focus_handle = cx.focus_handle();
+
+            Self {
+                text_input,
+                focused_at: 0,
+                focus_handle,
+            }
         })
     }
 
     fn save_click(&mut self, _event: &ClickEvent, cx: &mut ViewContext<Self>) {
+        self.save(cx);
+    }
+
+    fn save_keydown(&mut self, cx: &mut ViewContext<Self>) {
+        self.save(cx);
+    }
+
+    fn save(&mut self, cx: &mut ViewContext<Self>) {
         let collection = cx.global::<crate::Collection>();
         let text = &self.text_input.view.read(&cx).text;
 
@@ -38,18 +57,54 @@ impl NewDeckForm {
     }
 }
 
+const TABBALE_FIELDS: [&str; 2] = ["name", "submit"];
+
 impl Render for NewDeckForm {
     fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> impl gpui::prelude::IntoElement {
+        let view = cx.view().clone();
         let theme = cx.global::<Theme>();
 
+        let focused_at = self.focused_at;
+        let name_input = self.text_input.clone();
+
+        let mut submit_btn =
+            Button::new("btn-save", "Create", None).on_click(cx.listener(Self::save_click));
+
+        if self.focused_at == 1 {
+            submit_btn.focus();
+        }
+
         div().flex().size_full().justify_center().child(
             div().mt_20().child(
                 div()
+                    .track_focus(&self.focus_handle)
                     .flex()
                     .w_full()
                     .flex_col()
                     .text_color(theme.text)
                     .relative()
+                    .on_key_down(move |event, wc| {
+                        view.update(wc, |add_view, vc| {
+                            let keystroke = &event.keystroke.key;
+
+                            match keystroke.as_str() {
+                                "tab" => {
+                                    let next = (focused_at + 1) % TABBALE_FIELDS.len();
+
+                                    match TABBALE_FIELDS[next] {
+                                        "name" => name_input.focus(vc),
+                                        "submit" => vc.focus(&add_view.focus_handle),
+                                        _ => {}
+                                    }
+                                    add_view.focused_at = next;
+                                }
+                                "enter" => {
+                                    add_view.save_keydown(vc);
+                                }
+                                _ => {}
+                            }
+                        })
+                    })
                     .h_full()
                     .child(
                         div()
@@ -64,12 +119,7 @@ impl Render for NewDeckForm {
                                     .child("New Deck"),
                             )
                             .child(div().mt_6().child(self.text_input.clone()))
-                            .child(
-                                div().mt_6().justify_end().flex().child(
-                                    Button::new("btn-save", "Create", None)
-                                        .on_click(cx.listener(Self::save_click)),
-                                ),
-                            ),
+                            .child(div().mt_6().justify_end().flex().child(submit_btn)),
                     ),
             ),
         )

src/components/tab_bar_container.rs

@@ -48,23 +48,23 @@ impl RenderOnce for TabBarContainer {
         let theme = cx.global::<Theme>();
 
         let view_clone1 = Rc::clone(&self.view);
-        let view_clone2 = Rc::clone(&self.view);
 
         let bg_hover = theme.overlay0;
         let selected_deck_clone = Rc::clone(&self.selected);
-        let selected_add_clone = Rc::clone(&self.selected);
 
         div()
             .bg(theme.mantle)
             .border_t_1()
             .flex()
             .flex_col()
-            .p_1()
+            .p_2()
             .child(
                 div()
                     .group("tab_bar")
                     .px_2()
                     .py_2()
+                    .bg(bg_hover)
+                    .rounded_md()
                     .hover(|s| s.rounded_md().bg(bg_hover))
                     .text_color(theme.text)
                     .child(Icon::BookText)

src/main.rs

@@ -1,3 +1,4 @@
+mod action;
 mod assets;
 mod components;
 mod db;
@@ -27,7 +28,6 @@ use crate::{
         builder::Builder,
         collection::{Collection, CollectionBuilder},
     },
-    ngurra::init,
     theme::Theme,
 };
 
@@ -55,14 +55,15 @@ fn main() {
                         y: 100.0.into(),
                     },
                     size: Size {
-                        width: 820.0.into(),
+                        width: 840.0.into(),
                         height: 600.0.into(),
                     },
                 }),
                 titlebar: Some(TitlebarOptions {
-                    title: Default::default(),
-                    appears_transparent: Default::default(),
-                    traffic_light_position: Default::default(),
+                    // title: SharedString::from("Ngurra Flash Card").into(),
+                    title: None,
+                    appears_transparent: true,
+                    traffic_light_position: Some(point(px(12.0), px(12.0))),
                 }),
                 center: true,
                 focus: true,

src/models/deck.rs

@@ -1,13 +1,13 @@
 use rusqlite::Connection;
 
-use crate::{Deck, FlashCard};
+use crate::Deck;
 
-pub fn get_decks(conn: &Connection) -> Vec<Deck> {
+pub fn get_decks(_conn: &Connection) -> Vec<Deck> {
     let conn = Connection::open("anki-rs.db").unwrap();
     let decks_res = Deck::get_all_decks(&conn);
 
     match decks_res {
-        Ok(mut decks) => decks,
+        Ok(decks) => decks,
         Err(e) => {
             eprintln!("Error getting decks: {}", e);
             vec![]