feat & fix: Add status bar with sync button and fix filter bugs

Added a status bar at the bottom with a sync button that updates the task list from the local database.
The button shows different states (idle, syncing, success, error) with colors and icons, and displays status messages.
Fixed the layout shift bug when clearing filters by giving dropdowns a minimum width.
Also fixed sidebar counts not updating when filters change - now the sidebar shows correct project and tag counts based on filtered tasks.

Extracted reusable button and dropdown styles to keep the UI consistent across components.
This commit is contained in:
Ignacio Perez
2025-12-27 20:58:22 -03:00
parent 95b1d62b1c
commit 4cd01954ef
8 changed files with 347 additions and 91 deletions
+53 -1
View File
@@ -1,5 +1,5 @@
use gpui::prelude::*;
use gpui::{px, Pixels};
use gpui::{Pixels, px};
use crate::theme::Theme;
@@ -8,6 +8,8 @@ pub const CARD_PADDING: Pixels = px(8.0);
pub const SECTION_GAP: Pixels = px(12.0);
pub const INSET_GAP: Pixels = px(8.0);
pub const ROOT_PADDING: Pixels = px(12.0);
pub const CONTROL_RADIUS: Pixels = px(6.0);
pub const CONTROL_BORDER: Pixels = px(1.0);
pub fn card_style(div: gpui::Div, theme: &Theme) -> gpui::Div {
div.bg(theme.card)
@@ -80,3 +82,53 @@ pub fn priority_badge(priority: &str, theme: &Theme) -> gpui::Div {
.font_weight(gpui::FontWeight::MEDIUM)
.child(priority.to_string())
}
pub fn control_style(div: gpui::Div, theme: &Theme) -> gpui::Div {
div.flex()
.items_center()
.gap_2()
.px_3()
.py_2()
.rounded(CONTROL_RADIUS)
.border(CONTROL_BORDER)
.border_color(theme.border)
.bg(theme.background)
.text_sm()
.text_color(theme.foreground)
.whitespace_nowrap()
}
pub fn clickable_control_style(div: gpui::Div, theme: &Theme) -> gpui::Div {
control_style(div, theme)
.cursor_pointer()
.hover(|s| s.bg(theme.hover))
}
pub fn disabled_control_style(div: gpui::Div, theme: &Theme) -> gpui::Div {
control_style(div, theme)
.text_color(theme.muted)
.cursor_not_allowed()
}
pub fn ghost_button_style(div: gpui::Div, theme: &Theme) -> gpui::Div {
div.flex()
.items_center()
.gap_2()
.px_2()
.py_1()
.rounded(CONTROL_RADIUS)
.text_sm()
.text_color(theme.foreground)
.cursor_pointer()
.hover(|s| s.bg(theme.hover))
}
pub fn text_button_style(div: gpui::Div, theme: &Theme) -> gpui::Div {
div.flex()
.items_center()
.gap_1()
.text_sm()
.text_color(theme.muted)
.cursor_pointer()
.hover(|s| s.text_color(theme.accent))
}