refactor(bar): move widgets to new folder

This commit moves all the widgets to a new folder in order to organize
the code while hoping to make it easier to find and add a widget.

komorebi-bar/src/widgets/battery.rs

@@ -0,0 +1,154 @@
+use crate::config::LabelPrefix;
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::widgets::widget::BarWidget;
+use eframe::egui::text::LayoutJob;
+use eframe::egui::Align;
+use eframe::egui::Context;
+use eframe::egui::Label;
+use eframe::egui::TextFormat;
+use eframe::egui::Ui;
+use serde::Deserialize;
+use serde::Serialize;
+use starship_battery::units::ratio::percent;
+use starship_battery::Manager;
+use starship_battery::State;
+use std::process::Command;
+use std::time::Duration;
+use std::time::Instant;
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct BatteryConfig {
+    /// Enable the Battery widget
+    pub enable: bool,
+    /// Hide the widget if the battery is at full charge
+    pub hide_on_full_charge: Option<bool>,
+    /// Data refresh interval (default: 10 seconds)
+    pub data_refresh_interval: Option<u64>,
+    /// Display label prefix
+    pub label_prefix: Option<LabelPrefix>,
+}
+
+impl From<BatteryConfig> for Battery {
+    fn from(value: BatteryConfig) -> Self {
+        let data_refresh_interval = value.data_refresh_interval.unwrap_or(10);
+
+        Self {
+            enable: value.enable,
+            hide_on_full_charge: value.hide_on_full_charge.unwrap_or(false),
+            manager: Manager::new().unwrap(),
+            last_state: String::new(),
+            data_refresh_interval,
+            label_prefix: value.label_prefix.unwrap_or(LabelPrefix::Icon),
+            state: BatteryState::Discharging,
+            last_updated: Instant::now()
+                .checked_sub(Duration::from_secs(data_refresh_interval))
+                .unwrap(),
+        }
+    }
+}
+
+pub enum BatteryState {
+    Charging,
+    Discharging,
+}
+
+pub struct Battery {
+    pub enable: bool,
+    hide_on_full_charge: bool,
+    manager: Manager,
+    pub state: BatteryState,
+    data_refresh_interval: u64,
+    label_prefix: LabelPrefix,
+    last_state: String,
+    last_updated: Instant,
+}
+
+impl Battery {
+    fn output(&mut self) -> String {
+        let mut output = self.last_state.clone();
+
+        let now = Instant::now();
+        if now.duration_since(self.last_updated) > Duration::from_secs(self.data_refresh_interval) {
+            output.clear();
+
+            if let Ok(mut batteries) = self.manager.batteries() {
+                if let Some(Ok(first)) = batteries.nth(0) {
+                    let percentage = first.state_of_charge().get::<percent>();
+
+                    if percentage == 100.0 && self.hide_on_full_charge {
+                        output = String::new()
+                    } else {
+                        match first.state() {
+                            State::Charging => self.state = BatteryState::Charging,
+                            State::Discharging => self.state = BatteryState::Discharging,
+                            _ => {}
+                        }
+
+                        output = match self.label_prefix {
+                            LabelPrefix::Text | LabelPrefix::IconAndText => {
+                                format!("BAT: {percentage:.0}%")
+                            }
+                            LabelPrefix::None | LabelPrefix::Icon => format!("{percentage:.0}%"),
+                        }
+                    }
+                }
+            }
+
+            self.last_state.clone_from(&output);
+            self.last_updated = now;
+        }
+
+        output
+    }
+}
+
+impl BarWidget for Battery {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        if self.enable {
+            let output = self.output();
+            if !output.is_empty() {
+                let emoji = match self.state {
+                    BatteryState::Charging => egui_phosphor::regular::BATTERY_CHARGING,
+                    BatteryState::Discharging => egui_phosphor::regular::BATTERY_FULL,
+                };
+
+                let mut layout_job = LayoutJob::simple(
+                    match self.label_prefix {
+                        LabelPrefix::Icon | LabelPrefix::IconAndText => emoji.to_string(),
+                        LabelPrefix::None | LabelPrefix::Text => String::new(),
+                    },
+                    config.icon_font_id.clone(),
+                    ctx.style().visuals.selection.stroke.color,
+                    100.0,
+                );
+
+                layout_job.append(
+                    &output,
+                    10.0,
+                    TextFormat {
+                        font_id: config.text_font_id.clone(),
+                        color: ctx.style().visuals.text_color(),
+                        valign: Align::Center,
+                        ..Default::default()
+                    },
+                );
+
+                config.apply_on_widget(false, ui, |ui| {
+                    if SelectableFrame::new(false)
+                        .show(ui, |ui| ui.add(Label::new(layout_job).selectable(false)))
+                        .clicked()
+                    {
+                        if let Err(error) = Command::new("cmd.exe")
+                            .args(["/C", "start", "ms-settings:batterysaver"])
+                            .spawn()
+                        {
+                            eprintln!("{}", error)
+                        }
+                    }
+                });
+            }
+        }
+    }
+}

komorebi-bar/src/widgets/cpu.rs

@@ -0,0 +1,115 @@
+use crate::config::LabelPrefix;
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::widgets::widget::BarWidget;
+use eframe::egui::text::LayoutJob;
+use eframe::egui::Align;
+use eframe::egui::Context;
+use eframe::egui::Label;
+use eframe::egui::TextFormat;
+use eframe::egui::Ui;
+use serde::Deserialize;
+use serde::Serialize;
+use std::process::Command;
+use std::time::Duration;
+use std::time::Instant;
+use sysinfo::RefreshKind;
+use sysinfo::System;
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct CpuConfig {
+    /// Enable the Cpu widget
+    pub enable: bool,
+    /// Data refresh interval (default: 10 seconds)
+    pub data_refresh_interval: Option<u64>,
+    /// Display label prefix
+    pub label_prefix: Option<LabelPrefix>,
+}
+
+impl From<CpuConfig> for Cpu {
+    fn from(value: CpuConfig) -> Self {
+        let data_refresh_interval = value.data_refresh_interval.unwrap_or(10);
+
+        Self {
+            enable: value.enable,
+            system: System::new_with_specifics(
+                RefreshKind::default().without_memory().without_processes(),
+            ),
+            data_refresh_interval,
+            label_prefix: value.label_prefix.unwrap_or(LabelPrefix::IconAndText),
+            last_updated: Instant::now()
+                .checked_sub(Duration::from_secs(data_refresh_interval))
+                .unwrap(),
+        }
+    }
+}
+
+pub struct Cpu {
+    pub enable: bool,
+    system: System,
+    data_refresh_interval: u64,
+    label_prefix: LabelPrefix,
+    last_updated: Instant,
+}
+
+impl Cpu {
+    fn output(&mut self) -> String {
+        let now = Instant::now();
+        if now.duration_since(self.last_updated) > Duration::from_secs(self.data_refresh_interval) {
+            self.system.refresh_cpu_usage();
+            self.last_updated = now;
+        }
+
+        let used = self.system.global_cpu_usage();
+        match self.label_prefix {
+            LabelPrefix::Text | LabelPrefix::IconAndText => format!("CPU: {:.0}%", used),
+            LabelPrefix::None | LabelPrefix::Icon => format!("{:.0}%", used),
+        }
+    }
+}
+
+impl BarWidget for Cpu {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        if self.enable {
+            let output = self.output();
+            if !output.is_empty() {
+                let mut layout_job = LayoutJob::simple(
+                    match self.label_prefix {
+                        LabelPrefix::Icon | LabelPrefix::IconAndText => {
+                            egui_phosphor::regular::CPU.to_string()
+                        }
+                        LabelPrefix::None | LabelPrefix::Text => String::new(),
+                    },
+                    config.icon_font_id.clone(),
+                    ctx.style().visuals.selection.stroke.color,
+                    100.0,
+                );
+
+                layout_job.append(
+                    &output,
+                    10.0,
+                    TextFormat {
+                        font_id: config.text_font_id.clone(),
+                        color: ctx.style().visuals.text_color(),
+                        valign: Align::Center,
+                        ..Default::default()
+                    },
+                );
+
+                config.apply_on_widget(false, ui, |ui| {
+                    if SelectableFrame::new(false)
+                        .show(ui, |ui| ui.add(Label::new(layout_job).selectable(false)))
+                        .clicked()
+                    {
+                        if let Err(error) =
+                            Command::new("cmd.exe").args(["/C", "taskmgr.exe"]).spawn()
+                        {
+                            eprintln!("{}", error)
+                        }
+                    }
+                });
+            }
+        }
+    }
+}

komorebi-bar/src/widgets/date.rs

@@ -0,0 +1,240 @@
+use crate::config::LabelPrefix;
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::widgets::widget::BarWidget;
+use chrono::Local;
+use chrono_tz::Tz;
+use eframe::egui::text::LayoutJob;
+use eframe::egui::Align;
+use eframe::egui::Context;
+use eframe::egui::Label;
+use eframe::egui::TextFormat;
+use eframe::egui::Ui;
+use eframe::egui::WidgetText;
+use serde::Deserialize;
+use serde::Serialize;
+use std::time::Duration;
+use std::time::Instant;
+
+/// Custom format with additive modifiers for integer format specifiers
+#[derive(Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct CustomModifiers {
+    /// Custom format (https://docs.rs/chrono/latest/chrono/format/strftime/index.html)
+    format: String,
+    /// Additive modifiers for integer format specifiers (e.g. { "%U": 1 } to increment the zero-indexed week number by 1)
+    modifiers: std::collections::HashMap<String, i32>,
+}
+
+impl CustomModifiers {
+    fn apply(&self, output: &str) -> String {
+        let int_formatters = vec![
+            "%Y", "%C", "%y", "%m", "%d", "%e", "%w", "%u", "%U", "%W", "%G", "%g", "%V", "%j",
+            "%H", "%k", "%I", "%l", "%M", "%S", "%f",
+        ];
+
+        let mut modified_output = output.to_string();
+
+        for (modifier, value) in &self.modifiers {
+            // check if formatter is integer type
+            if !int_formatters.contains(&modifier.as_str()) {
+                continue;
+            }
+
+            // get the strftime value of modifier
+            let formatted_modifier = Local::now().format(modifier).to_string();
+
+            // find the gotten value in the original output
+            if let Some(pos) = modified_output.find(&formatted_modifier) {
+                let start = pos;
+                let end = start + formatted_modifier.len();
+                // replace that value with the modified value
+                if let Ok(num) = formatted_modifier.parse::<i32>() {
+                    modified_output.replace_range(start..end, &(num + value).to_string());
+                }
+            }
+        }
+
+        modified_output
+    }
+}
+
+#[derive(Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct DateConfig {
+    /// Enable the Date widget
+    pub enable: bool,
+    /// Set the Date format
+    pub format: DateFormat,
+    /// Display label prefix
+    pub label_prefix: Option<LabelPrefix>,
+    /// TimeZone (https://docs.rs/chrono-tz/latest/chrono_tz/enum.Tz.html)
+    ///
+    /// Use a custom format to display additional information, i.e.:
+    /// ```json
+    /// {
+    ///     "Date": {
+    ///         "enable": true,
+    ///         "format": { "Custom": "%D %Z (Tokyo)" },
+    ///         "timezone": "Asia/Tokyo"
+    ///      }
+    ///}
+    /// ```
+    pub timezone: Option<String>,
+}
+
+impl From<DateConfig> for Date {
+    fn from(value: DateConfig) -> Self {
+        let data_refresh_interval = 1;
+
+        Self {
+            enable: value.enable,
+            format: value.format,
+            label_prefix: value.label_prefix.unwrap_or(LabelPrefix::Icon),
+            timezone: value.timezone,
+            data_refresh_interval,
+            last_state: String::new(),
+            last_updated: Instant::now()
+                .checked_sub(Duration::from_secs(data_refresh_interval))
+                .unwrap(),
+        }
+    }
+}
+
+#[derive(Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub enum DateFormat {
+    /// Month/Date/Year format (09/08/24)
+    MonthDateYear,
+    /// Year-Month-Date format (2024-09-08)
+    YearMonthDate,
+    /// Date-Month-Year format (8-Sep-2024)
+    DateMonthYear,
+    /// Day Date Month Year format (8 September 2024)
+    DayDateMonthYear,
+    /// Custom format (https://docs.rs/chrono/latest/chrono/format/strftime/index.html)
+    Custom(String),
+    /// Custom format with modifiers
+    CustomModifiers(CustomModifiers),
+}
+
+impl DateFormat {
+    pub fn next(&mut self) {
+        match self {
+            DateFormat::MonthDateYear => *self = Self::YearMonthDate,
+            DateFormat::YearMonthDate => *self = Self::DateMonthYear,
+            DateFormat::DateMonthYear => *self = Self::DayDateMonthYear,
+            DateFormat::DayDateMonthYear => *self = Self::MonthDateYear,
+            _ => {}
+        };
+    }
+
+    pub fn fmt_string(&self) -> String {
+        match self {
+            DateFormat::MonthDateYear => String::from("%D"),
+            DateFormat::YearMonthDate => String::from("%F"),
+            DateFormat::DateMonthYear => String::from("%v"),
+            DateFormat::DayDateMonthYear => String::from("%A %e %B %Y"),
+            DateFormat::Custom(custom) => custom.to_string(),
+            DateFormat::CustomModifiers(custom) => custom.format.clone(),
+        }
+    }
+}
+
+#[derive(Clone, Debug)]
+pub struct Date {
+    pub enable: bool,
+    pub format: DateFormat,
+    label_prefix: LabelPrefix,
+    timezone: Option<String>,
+    data_refresh_interval: u64,
+    last_state: String,
+    last_updated: Instant,
+}
+
+impl Date {
+    fn output(&mut self) -> String {
+        let mut output = self.last_state.clone();
+        let now = Instant::now();
+
+        if now.duration_since(self.last_updated) > Duration::from_secs(self.data_refresh_interval) {
+            let formatted = match &self.timezone {
+                Some(timezone) => match timezone.parse::<Tz>() {
+                    Ok(tz) => Local::now()
+                        .with_timezone(&tz)
+                        .format(&self.format.fmt_string())
+                        .to_string()
+                        .trim()
+                        .to_string(),
+                    Err(_) => format!("Invalid timezone: {}", timezone),
+                },
+                None => Local::now()
+                    .format(&self.format.fmt_string())
+                    .to_string()
+                    .trim()
+                    .to_string(),
+            };
+
+            // if custom modifiers are used, apply them
+            output = match &self.format {
+                DateFormat::CustomModifiers(custom) => custom.apply(&formatted),
+                _ => formatted,
+            };
+
+            self.last_state.clone_from(&output);
+            self.last_updated = now;
+        }
+
+        output
+    }
+}
+
+impl BarWidget for Date {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        if self.enable {
+            let mut output = self.output();
+            if !output.is_empty() {
+                let mut layout_job = LayoutJob::simple(
+                    match self.label_prefix {
+                        LabelPrefix::Icon | LabelPrefix::IconAndText => {
+                            egui_phosphor::regular::CALENDAR_DOTS.to_string()
+                        }
+                        LabelPrefix::None | LabelPrefix::Text => String::new(),
+                    },
+                    config.icon_font_id.clone(),
+                    ctx.style().visuals.selection.stroke.color,
+                    100.0,
+                );
+
+                if let LabelPrefix::Text | LabelPrefix::IconAndText = self.label_prefix {
+                    output.insert_str(0, "DATE: ");
+                }
+
+                layout_job.append(
+                    &output,
+                    10.0,
+                    TextFormat {
+                        font_id: config.text_font_id.clone(),
+                        color: ctx.style().visuals.text_color(),
+                        valign: Align::Center,
+                        ..Default::default()
+                    },
+                );
+
+                config.apply_on_widget(false, ui, |ui| {
+                    if SelectableFrame::new(false)
+                        .show(ui, |ui| {
+                            ui.add(
+                                Label::new(WidgetText::LayoutJob(layout_job.clone()))
+                                    .selectable(false),
+                            )
+                        })
+                        .clicked()
+                    {
+                        self.format.next()
+                    }
+                });
+            }
+        }
+    }
+}

komorebi-bar/src/widgets/keyboard.rs

@@ -0,0 +1,177 @@
+use crate::config::LabelPrefix;
+use crate::render::RenderConfig;
+use crate::widgets::widget::BarWidget;
+use eframe::egui::text::LayoutJob;
+use eframe::egui::Align;
+use eframe::egui::Context;
+use eframe::egui::Label;
+use eframe::egui::TextFormat;
+use eframe::egui::Ui;
+use eframe::egui::WidgetText;
+use serde::Deserialize;
+use serde::Serialize;
+use std::time::Duration;
+use std::time::Instant;
+use windows::Win32::Globalization::LCIDToLocaleName;
+use windows::Win32::Globalization::LOCALE_ALLOW_NEUTRAL_NAMES;
+use windows::Win32::System::SystemServices::LOCALE_NAME_MAX_LENGTH;
+use windows::Win32::UI::Input::KeyboardAndMouse::GetKeyboardLayout;
+use windows::Win32::UI::WindowsAndMessaging::GetForegroundWindow;
+use windows::Win32::UI::WindowsAndMessaging::GetWindowThreadProcessId;
+
+const DEFAULT_DATA_REFRESH_INTERVAL: u64 = 1;
+const ERROR_TEXT: &str = "Error";
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct KeyboardConfig {
+    /// Enable the Input widget
+    pub enable: bool,
+    /// Data refresh interval (default: 1 second)
+    pub data_refresh_interval: Option<u64>,
+    /// Display label prefix
+    pub label_prefix: Option<LabelPrefix>,
+}
+
+impl From<KeyboardConfig> for Keyboard {
+    fn from(value: KeyboardConfig) -> Self {
+        let data_refresh_interval = value
+            .data_refresh_interval
+            .unwrap_or(DEFAULT_DATA_REFRESH_INTERVAL);
+
+        Self {
+            enable: value.enable,
+            data_refresh_interval,
+            label_prefix: value.label_prefix.unwrap_or(LabelPrefix::IconAndText),
+            last_updated: Instant::now(),
+            lang_name: get_lang(),
+        }
+    }
+}
+
+pub struct Keyboard {
+    pub enable: bool,
+    data_refresh_interval: u64,
+    label_prefix: LabelPrefix,
+    last_updated: Instant,
+    lang_name: String,
+}
+
+/// Retrieves the name of the active keyboard layout for the current foreground window.
+///
+/// This function determines the active keyboard layout by querying the system for the
+/// foreground window's thread ID and its associated keyboard layout. It then attempts
+/// to retrieve the locale name corresponding to the keyboard layout.
+///
+/// # Failure Cases
+///
+/// This function can fail in two distinct scenarios:
+///
+/// 1. **Failure to Retrieve the Locale Name**:
+///    If the system fails to retrieve the locale name (e.g., due to an invalid or unsupported
+///    language identifier), the function will return `Err(())`.
+///
+/// 2. **Invalid UTF-16 Characters in the Locale Name**:
+///    If the retrieved locale name contains invalid UTF-16 sequences, the conversion to a Rust
+///    `String` will fail, and the function will return `Err(())`.
+///
+/// # Returns
+///
+/// - `Ok(String)`: The name of the active keyboard layout as a valid UTF-8 string.
+/// - `Err(())`: Indicates that the function failed to retrieve the locale name or encountered
+///   invalid UTF-16 characters during conversion.
+fn get_active_keyboard_layout() -> Result<String, ()> {
+    let foreground_window_tid = unsafe { GetWindowThreadProcessId(GetForegroundWindow(), None) };
+    let lcid = unsafe { GetKeyboardLayout(foreground_window_tid) };
+
+    // Extract the low word (language identifier) from the keyboard layout handle.
+    let lang_id = (lcid.0 as u32) & 0xFFFF;
+    let mut locale_name_buffer = [0; LOCALE_NAME_MAX_LENGTH as usize];
+    let char_count = unsafe {
+        LCIDToLocaleName(
+            lang_id,
+            Some(&mut locale_name_buffer),
+            LOCALE_ALLOW_NEUTRAL_NAMES,
+        )
+    };
+
+    match char_count {
+        0 => Err(()),
+        _ => String::from_utf16(&locale_name_buffer[..char_count as usize]).map_err(|_| ()),
+    }
+}
+
+/// Retrieves the name of the active keyboard layout or a fallback error message.
+///
+/// # Behavior
+///
+/// - **Success Case**:
+///   If [`get_active_keyboard_layout`] succeeds, this function returns the retrieved keyboard
+///   layout name as a `String`.
+///
+/// - **Failure Case**:
+///   If [`get_active_keyboard_layout`] fails, this function returns the value of `ERROR_TEXT`
+///   as a fallback message. This ensures that the function always returns a valid `String`,
+///   even in error scenarios.
+///
+/// # Returns
+///
+/// A `String` representing either:
+/// - The name of the active keyboard layout, or
+/// - The fallback error message (`ERROR_TEXT`) if the layout name cannot be retrieved.
+fn get_lang() -> String {
+    get_active_keyboard_layout()
+        .map(|l| l.trim_end_matches('\0').to_string())
+        .unwrap_or_else(|_| ERROR_TEXT.to_string())
+}
+
+impl Keyboard {
+    fn output(&mut self) -> String {
+        let now = Instant::now();
+        if now.duration_since(self.last_updated) > Duration::from_secs(self.data_refresh_interval) {
+            self.last_updated = now;
+            self.lang_name = get_lang();
+        }
+
+        match self.label_prefix {
+            LabelPrefix::Text | LabelPrefix::IconAndText => format!("KB: {}", self.lang_name),
+            LabelPrefix::None | LabelPrefix::Icon => self.lang_name.clone(),
+        }
+    }
+}
+
+impl BarWidget for Keyboard {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        if self.enable {
+            let output = self.output();
+            if !output.is_empty() {
+                let mut layout_job = LayoutJob::simple(
+                    match self.label_prefix {
+                        LabelPrefix::Icon | LabelPrefix::IconAndText => {
+                            egui_phosphor::regular::KEYBOARD.to_string()
+                        }
+                        LabelPrefix::None | LabelPrefix::Text => String::new(),
+                    },
+                    config.icon_font_id.clone(),
+                    ctx.style().visuals.selection.stroke.color,
+                    100.0,
+                );
+
+                layout_job.append(
+                    &output,
+                    10.0,
+                    TextFormat {
+                        font_id: config.text_font_id.clone(),
+                        color: ctx.style().visuals.text_color(),
+                        valign: Align::Center,
+                        ..Default::default()
+                    },
+                );
+
+                config.apply_on_widget(true, ui, |ui| {
+                    ui.add(Label::new(WidgetText::LayoutJob(layout_job.clone())).selectable(false))
+                });
+            }
+        }
+    }
+}

komorebi-bar/src/widgets/komorebi.rs

@@ -0,0 +1,908 @@
+use crate::bar::apply_theme;
+use crate::config::DisplayFormat;
+use crate::config::KomobarTheme;
+use crate::config::WorkspacesDisplayFormat;
+use crate::render::Grouping;
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::ui::CustomUi;
+use crate::widgets::komorebi_layout::KomorebiLayout;
+use crate::widgets::widget::BarWidget;
+use crate::ICON_CACHE;
+use crate::MAX_LABEL_WIDTH;
+use crate::MONITOR_INDEX;
+use eframe::egui::vec2;
+use eframe::egui::Color32;
+use eframe::egui::ColorImage;
+use eframe::egui::Context;
+use eframe::egui::CornerRadius;
+use eframe::egui::Frame;
+use eframe::egui::Image;
+use eframe::egui::Label;
+use eframe::egui::Margin;
+use eframe::egui::RichText;
+use eframe::egui::Sense;
+use eframe::egui::Stroke;
+use eframe::egui::StrokeKind;
+use eframe::egui::TextureHandle;
+use eframe::egui::TextureOptions;
+use eframe::egui::Ui;
+use eframe::egui::Vec2;
+use image::RgbaImage;
+use komorebi_client::Container;
+use komorebi_client::NotificationEvent;
+use komorebi_client::PathExt;
+use komorebi_client::Rect;
+use komorebi_client::SocketMessage;
+use komorebi_client::Window;
+use komorebi_client::Workspace;
+use komorebi_client::WorkspaceLayer;
+use serde::Deserialize;
+use serde::Serialize;
+use std::cell::RefCell;
+use std::collections::BTreeMap;
+use std::collections::HashMap;
+use std::path::PathBuf;
+use std::rc::Rc;
+use std::sync::atomic::Ordering;
+
+#[derive(Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct KomorebiConfig {
+    /// Configure the Workspaces widget
+    pub workspaces: Option<KomorebiWorkspacesConfig>,
+    /// Configure the Layout widget
+    pub layout: Option<KomorebiLayoutConfig>,
+    /// Configure the Workspace Layer widget
+    pub workspace_layer: Option<KomorebiWorkspaceLayerConfig>,
+    /// Configure the Focused Window widget
+    pub focused_window: Option<KomorebiFocusedWindowConfig>,
+    /// Configure the Configuration Switcher widget
+    pub configuration_switcher: Option<KomorebiConfigurationSwitcherConfig>,
+}
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct KomorebiWorkspacesConfig {
+    /// Enable the Komorebi Workspaces widget
+    pub enable: bool,
+    /// Hide workspaces without any windows
+    pub hide_empty_workspaces: bool,
+    /// Display format of the workspace
+    pub display: Option<WorkspacesDisplayFormat>,
+}
+
+#[derive(Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct KomorebiLayoutConfig {
+    /// Enable the Komorebi Layout widget
+    pub enable: bool,
+    /// List of layout options
+    pub options: Option<Vec<KomorebiLayout>>,
+    /// Display format of the current layout
+    pub display: Option<DisplayFormat>,
+}
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct KomorebiWorkspaceLayerConfig {
+    /// Enable the Komorebi Workspace Layer widget
+    pub enable: bool,
+    /// Display format of the current layer
+    pub display: Option<DisplayFormat>,
+    /// Show the widget event if the layer is Tiling
+    pub show_when_tiling: Option<bool>,
+}
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct KomorebiFocusedWindowConfig {
+    /// Enable the Komorebi Focused Window widget
+    pub enable: bool,
+    /// DEPRECATED: use 'display' instead (Show the icon of the currently focused window)
+    pub show_icon: Option<bool>,
+    /// Display format of the currently focused window
+    pub display: Option<DisplayFormat>,
+}
+
+#[derive(Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct KomorebiConfigurationSwitcherConfig {
+    /// Enable the Komorebi Configurations widget
+    pub enable: bool,
+    /// A map of display friendly name => path to configuration.json
+    pub configurations: BTreeMap<String, String>,
+}
+
+impl From<&KomorebiConfig> for Komorebi {
+    fn from(value: &KomorebiConfig) -> Self {
+        let configuration_switcher =
+            if let Some(configuration_switcher) = &value.configuration_switcher {
+                let mut configuration_switcher = configuration_switcher.clone();
+                for (_, location) in configuration_switcher.configurations.iter_mut() {
+                    *location = dunce::simplified(&PathBuf::from(location.clone()).replace_env())
+                        .to_string_lossy()
+                        .to_string();
+                }
+                Some(configuration_switcher)
+            } else {
+                None
+            };
+
+        Self {
+            komorebi_notification_state: Rc::new(RefCell::new(KomorebiNotificationState {
+                selected_workspace: String::new(),
+                layout: KomorebiLayout::Default(komorebi_client::DefaultLayout::BSP),
+                workspaces: vec![],
+                hide_empty_workspaces: value
+                    .workspaces
+                    .map(|w| w.hide_empty_workspaces)
+                    .unwrap_or_default(),
+                mouse_follows_focus: true,
+                work_area_offset: None,
+                focused_container_information: KomorebiNotificationStateContainerInformation::EMPTY,
+                stack_accent: None,
+                monitor_index: MONITOR_INDEX.load(Ordering::SeqCst),
+                monitor_usr_idx_map: HashMap::new(),
+            })),
+            workspaces: value.workspaces,
+            layout: value.layout.clone(),
+            focused_window: value.focused_window,
+            workspace_layer: value.workspace_layer,
+            configuration_switcher,
+        }
+    }
+}
+
+#[derive(Clone, Debug)]
+pub struct Komorebi {
+    pub komorebi_notification_state: Rc<RefCell<KomorebiNotificationState>>,
+    pub workspaces: Option<KomorebiWorkspacesConfig>,
+    pub layout: Option<KomorebiLayoutConfig>,
+    pub focused_window: Option<KomorebiFocusedWindowConfig>,
+    pub workspace_layer: Option<KomorebiWorkspaceLayerConfig>,
+    pub configuration_switcher: Option<KomorebiConfigurationSwitcherConfig>,
+}
+
+impl BarWidget for Komorebi {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        let mut komorebi_notification_state = self.komorebi_notification_state.borrow_mut();
+        let icon_size = Vec2::splat(config.icon_font_id.size);
+        let text_size = Vec2::splat(config.text_font_id.size);
+
+        if let Some(workspaces) = self.workspaces {
+            if workspaces.enable {
+                let mut update = None;
+
+                if !komorebi_notification_state.workspaces.is_empty() {
+                    let format = workspaces.display.unwrap_or(DisplayFormat::Text.into());
+
+                    config.apply_on_widget(false, ui, |ui| {
+                        for (i, (ws, containers, _)) in
+                            komorebi_notification_state.workspaces.iter().enumerate()
+                        {
+                            let is_selected = komorebi_notification_state.selected_workspace.eq(ws);
+
+                            if SelectableFrame::new(
+                                is_selected,
+                            )
+                            .show(ui, |ui| {
+                                let mut has_icon = false;
+
+                                if format == WorkspacesDisplayFormat::AllIcons
+                                    || format == WorkspacesDisplayFormat::AllIconsAndText
+                                    || format == WorkspacesDisplayFormat::AllIconsAndTextOnSelected
+                                    || format == DisplayFormat::Icon.into()
+                                    || format == DisplayFormat::IconAndText.into()
+                                    || format == DisplayFormat::IconAndTextOnSelected.into()
+                                    || (format == DisplayFormat::TextAndIconOnSelected.into() && is_selected)
+                                {
+                                    has_icon = containers.iter().any(|(_, container_info)| {
+                                        container_info.icons.iter().any(|icon| icon.is_some())
+                                    });
+
+                                    if has_icon {
+                                        Frame::NONE
+                                            .inner_margin(Margin::same(
+                                                ui.style().spacing.button_padding.y as i8,
+                                            ))
+                                            .show(ui, |ui| {
+                                                for (is_focused, container) in containers {
+                                                    for icon in container.icons.iter().flatten().collect::<Vec<_>>() {
+                                                        ui.add(
+                                                            Image::from(&img_to_texture(ctx, icon))
+                                                                .maintain_aspect_ratio(true)
+                                                                .fit_to_exact_size(if *is_focused { icon_size } else { text_size }),
+                                                        );
+                                                    }
+                                                }
+                                            });
+                                    }
+                                }
+
+                                // draw a custom icon when there is no app icon or text
+                                if !has_icon && (matches!(format, WorkspacesDisplayFormat::AllIcons | WorkspacesDisplayFormat::Existing(DisplayFormat::Icon))
+                                || (!is_selected && matches!(format, WorkspacesDisplayFormat::AllIconsAndTextOnSelected | WorkspacesDisplayFormat::Existing(DisplayFormat::IconAndTextOnSelected)))) {
+                                    let (response, painter) =
+                                        ui.allocate_painter(icon_size, Sense::hover());
+                                    let stroke = Stroke::new(
+                                        1.0,
+                                        if is_selected { ctx.style().visuals.selection.stroke.color} else { ui.style().visuals.text_color() },
+                                    );
+                                    let mut rect = response.rect;
+                                    let rounding = CornerRadius::same((rect.width() * 0.1) as u8);
+                                    rect = rect.shrink(stroke.width);
+                                    let c = rect.center();
+                                    let r = rect.width() / 2.0;
+                                    painter.rect_stroke(rect, rounding, stroke, StrokeKind::Outside);
+                                    painter.line_segment([c - vec2(r, r), c + vec2(r, r)], stroke);
+
+                                    response.on_hover_text(ws.to_string())
+                                // add hover text when there are only icons
+                                } else if match format {
+                                    WorkspacesDisplayFormat::AllIcons | WorkspacesDisplayFormat::Existing(DisplayFormat::Icon) => has_icon,
+                                    _ => false,
+                                } {
+                                    ui.response().on_hover_text(ws.to_string())
+                                // add label only
+                                } else if (format != WorkspacesDisplayFormat::AllIconsAndTextOnSelected && format != DisplayFormat::IconAndTextOnSelected.into())
+                                    || (is_selected && matches!(format, WorkspacesDisplayFormat::AllIconsAndTextOnSelected | WorkspacesDisplayFormat::Existing(DisplayFormat::IconAndTextOnSelected)))
+                                {
+                                     if is_selected {
+                                        ui.add(Label::new(RichText::new(ws.to_string()).color(ctx.style().visuals.selection.stroke.color)).selectable(false))
+                                    }
+                                    else {
+                                        ui.add(Label::new(ws.to_string()).selectable(false))
+                                    }
+                                } else {
+                                    ui.response()
+                                }
+                            })
+                            .clicked()
+                            {
+                                update = Some(ws.to_string());
+
+                                if komorebi_notification_state.mouse_follows_focus {
+                                    if komorebi_client::send_batch([
+                                        SocketMessage::MouseFollowsFocus(false),
+                                        SocketMessage::FocusMonitorWorkspaceNumber(
+                                            komorebi_notification_state.monitor_index,
+                                            i,
+                                        ),
+                                        SocketMessage::RetileWithResizeDimensions,
+                                        SocketMessage::MouseFollowsFocus(true),
+                                    ])
+                                        .is_err()
+                                    {
+                                        tracing::error!(
+                                            "could not send the following batch of messages to komorebi:\n
+                                            MouseFollowsFocus(false)\n
+                                            FocusMonitorWorkspaceNumber({}, {})\n
+                                            RetileWithResizeDimensions
+                                            MouseFollowsFocus(true)\n",
+                                            komorebi_notification_state.monitor_index,
+                                            i,
+                                        );
+                                    }
+                                } else if komorebi_client::send_batch([
+                                    SocketMessage::FocusMonitorWorkspaceNumber(
+                                        komorebi_notification_state.monitor_index,
+                                        i,
+                                    ),
+                                    SocketMessage::RetileWithResizeDimensions,
+                                ])
+                                    .is_err()
+                                {
+                                    tracing::error!(
+                                        "could not send the following batch of messages to komorebi:\n
+                                        FocusMonitorWorkspaceNumber({}, {})\n
+                                        RetileWithResizeDimensions",
+                                        komorebi_notification_state.monitor_index,
+                                        i,
+                                    );
+                                }
+                            }
+                        }
+                    });
+                }
+
+                if let Some(update) = update {
+                    komorebi_notification_state.selected_workspace = update;
+                }
+            }
+        }
+
+        if let Some(layer_config) = &self.workspace_layer {
+            if layer_config.enable {
+                let layer = komorebi_notification_state
+                    .workspaces
+                    .iter()
+                    .find(|o| komorebi_notification_state.selected_workspace.eq(&o.0))
+                    .map(|(_, _, layer)| layer);
+
+                if let Some(layer) = layer {
+                    if (layer_config.show_when_tiling.unwrap_or_default()
+                        && matches!(layer, WorkspaceLayer::Tiling))
+                        || matches!(layer, WorkspaceLayer::Floating)
+                    {
+                        let display_format = layer_config.display.unwrap_or(DisplayFormat::Text);
+                        let size = Vec2::splat(config.icon_font_id.size);
+
+                        config.apply_on_widget(false, ui, |ui| {
+                            let layer_frame = SelectableFrame::new(false)
+                                .show(ui, |ui| {
+                                    if display_format != DisplayFormat::Text {
+                                        if matches!(layer, WorkspaceLayer::Tiling) {
+                                            let (response, painter) =
+                                                ui.allocate_painter(size, Sense::hover());
+                                            let color = ui.style().visuals.text_color();
+                                            let stroke = Stroke::new(1.0, color);
+                                            let mut rect = response.rect;
+                                            let corner =
+                                                CornerRadius::same((rect.width() * 0.1) as u8);
+                                            rect = rect.shrink(stroke.width);
+
+                                            // tiling
+                                            let mut rect_left = response.rect;
+                                            rect_left.set_width(rect.width() * 0.48);
+                                            rect_left.set_height(rect.height() * 0.98);
+                                            let mut rect_right = rect_left;
+                                            rect_left = rect_left.translate(Vec2::new(
+                                                rect.width() * 0.01 + stroke.width,
+                                                rect.width() * 0.01 + stroke.width,
+                                            ));
+                                            rect_right = rect_right.translate(Vec2::new(
+                                                rect.width() * 0.51 + stroke.width,
+                                                rect.width() * 0.01 + stroke.width,
+                                            ));
+                                            painter.rect_filled(rect_left, corner, color);
+                                            painter.rect_stroke(
+                                                rect_right,
+                                                corner,
+                                                stroke,
+                                                StrokeKind::Outside,
+                                            );
+                                        } else {
+                                            let (response, painter) =
+                                                ui.allocate_painter(size, Sense::hover());
+                                            let color = ui.style().visuals.text_color();
+                                            let stroke = Stroke::new(1.0, color);
+                                            let mut rect = response.rect;
+                                            let corner =
+                                                CornerRadius::same((rect.width() * 0.1) as u8);
+                                            rect = rect.shrink(stroke.width);
+
+                                            // floating
+                                            let mut rect_left = response.rect;
+                                            rect_left.set_width(rect.width() * 0.65);
+                                            rect_left.set_height(rect.height() * 0.65);
+                                            let mut rect_right = rect_left;
+                                            rect_left = rect_left.translate(Vec2::new(
+                                                rect.width() * 0.01 + stroke.width,
+                                                rect.width() * 0.01 + stroke.width,
+                                            ));
+                                            rect_right = rect_right.translate(Vec2::new(
+                                                rect.width() * 0.34 + stroke.width,
+                                                rect.width() * 0.34 + stroke.width,
+                                            ));
+                                            painter.rect_filled(rect_left, corner, color);
+                                            painter.rect_stroke(
+                                                rect_right,
+                                                corner,
+                                                stroke,
+                                                StrokeKind::Outside,
+                                            );
+                                        }
+                                    }
+
+                                    if display_format != DisplayFormat::Icon {
+                                        ui.add(Label::new(layer.to_string()).selectable(false));
+                                    }
+                                })
+                                .on_hover_text(layer.to_string());
+
+                            if layer_frame.clicked()
+                                && komorebi_client::send_batch([
+                                    SocketMessage::FocusMonitorAtCursor,
+                                    SocketMessage::MouseFollowsFocus(false),
+                                    SocketMessage::ToggleWorkspaceLayer,
+                                    SocketMessage::MouseFollowsFocus(
+                                        komorebi_notification_state.mouse_follows_focus,
+                                    ),
+                                ])
+                                .is_err()
+                            {
+                                tracing::error!(
+                                    "could not send the following batch of messages to komorebi:\n\
+                                                MouseFollowsFocus(false),
+                                                ToggleWorkspaceLayer,
+                                                MouseFollowsFocus({})",
+                                    komorebi_notification_state.mouse_follows_focus,
+                                );
+                            }
+                        });
+                    }
+                }
+            }
+        }
+
+        if let Some(layout_config) = &self.layout {
+            if layout_config.enable {
+                let workspace_idx: Option<usize> = komorebi_notification_state
+                    .workspaces
+                    .iter()
+                    .position(|o| komorebi_notification_state.selected_workspace.eq(&o.0));
+
+                komorebi_notification_state.layout.show(
+                    ctx,
+                    ui,
+                    config,
+                    layout_config,
+                    workspace_idx,
+                );
+            }
+        }
+
+        if let Some(configuration_switcher) = &self.configuration_switcher {
+            if configuration_switcher.enable {
+                for (name, location) in configuration_switcher.configurations.iter() {
+                    let path = PathBuf::from(location);
+                    if path.is_file() {
+                        config.apply_on_widget(false, ui,|ui|{
+                    if SelectableFrame::new(false).show(ui, |ui|{
+                          ui.add(Label::new(name).selectable(false))
+                            })
+                            .clicked()
+                        {
+                            let canonicalized = dunce::canonicalize(path.clone()).unwrap_or(path);
+                            let mut proceed = true;
+                            if komorebi_client::send_message(&SocketMessage::ReplaceConfiguration(
+                                canonicalized,
+                            ))
+                            .is_err()
+                            {
+                                tracing::error!(
+                                    "could not send message to komorebi: ReplaceConfiguration"
+                                );
+                                proceed = false;
+                            }
+
+                            if let Some(rect) = komorebi_notification_state.work_area_offset {
+                                if proceed {
+                                    match komorebi_client::send_query(&SocketMessage::Query(
+                                        komorebi_client::StateQuery::FocusedMonitorIndex,
+                                    )) {
+                                        Ok(idx) => {
+                                            if let Ok(monitor_idx) = idx.parse::<usize>() {
+                                                if komorebi_client::send_message(
+                                                    &SocketMessage::MonitorWorkAreaOffset(
+                                                        monitor_idx,
+                                                        rect,
+                                                    ),
+                                                )
+                                                .is_err()
+                                                {
+                                                    tracing::error!(
+                                                    "could not send message to komorebi: MonitorWorkAreaOffset"
+                                                );
+                                                }
+                                            }
+                                        }
+                                        Err(_) => {
+                                            tracing::error!(
+                                                "could not send message to komorebi: Query"
+                                            );
+                                        }
+                                    }
+                                }
+                            }
+                        }});
+                    }
+                }
+            }
+        }
+
+        if let Some(focused_window) = self.focused_window {
+            if focused_window.enable {
+                let titles = &komorebi_notification_state
+                    .focused_container_information
+                    .titles;
+                if !titles.is_empty() {
+                    config.apply_on_widget(false, ui, |ui| {
+                        let icons = &komorebi_notification_state
+                            .focused_container_information
+                            .icons;
+                        let focused_window_idx = komorebi_notification_state
+                            .focused_container_information
+                            .focused_window_idx;
+
+                        let iter = titles.iter().zip(icons.iter());
+                        let len = iter.len();
+
+                        for (i, (title, icon)) in iter.enumerate() {
+                            let selected = i == focused_window_idx && len != 1;
+                            let text_color = if selected { ctx.style().visuals.selection.stroke.color} else { ui.style().visuals.text_color() };
+
+                            if SelectableFrame::new(selected)
+                                .show(ui, |ui| {
+                                    // handle legacy setting
+                                    let format = focused_window.display.unwrap_or(
+                                        if focused_window.show_icon.unwrap_or(false) {
+                                            DisplayFormat::IconAndText
+                                        } else {
+                                            DisplayFormat::Text
+                                        },
+                                    );
+
+                                    if format == DisplayFormat::Icon
+                                        || format == DisplayFormat::IconAndText
+                                        || format == DisplayFormat::IconAndTextOnSelected
+                                        || (format == DisplayFormat::TextAndIconOnSelected
+                                            && i == focused_window_idx)
+                                    {
+                                        if let Some(img) = icon {
+                                            Frame::NONE
+                                                .inner_margin(Margin::same(
+                                                    ui.style().spacing.button_padding.y as i8,
+                                                ))
+                                                .show(ui, |ui| {
+                                                    let response = ui.add(
+                                                        Image::from(&img_to_texture(ctx, img))
+                                                            .maintain_aspect_ratio(true)
+                                                            .fit_to_exact_size(icon_size),
+                                                    );
+
+                                                    if let DisplayFormat::Icon = format {
+                                                        response.on_hover_text(title);
+                                                    }
+                                                });
+                                        }
+                                    }
+
+                                    if format == DisplayFormat::Text
+                                        || format == DisplayFormat::IconAndText
+                                        || format == DisplayFormat::TextAndIconOnSelected
+                                        || (format == DisplayFormat::IconAndTextOnSelected
+                                            && i == focused_window_idx)
+                                    {
+                                        let available_height = ui.available_height();
+                                        let mut custom_ui = CustomUi(ui);
+
+                                        custom_ui.add_sized_left_to_right(
+                                            Vec2::new(
+                                                MAX_LABEL_WIDTH.load(Ordering::SeqCst) as f32,
+                                                available_height,
+                                            ),
+                                            Label::new(RichText::new( title).color(text_color)).selectable(false).truncate(),
+                                        );
+                                    }
+                                })
+                                .clicked()
+                            {
+                                if selected {
+                                    return;
+                                }
+
+                                if komorebi_notification_state.mouse_follows_focus {
+                                    if komorebi_client::send_batch([
+                                        SocketMessage::MouseFollowsFocus(false),
+                                        SocketMessage::FocusStackWindow(i),
+                                        SocketMessage::MouseFollowsFocus(true),
+                                    ]).is_err() {
+                                        tracing::error!(
+                                            "could not send the following batch of messages to komorebi:\n
+                                            MouseFollowsFocus(false)\n
+                                            FocusStackWindow({})\n
+                                            MouseFollowsFocus(true)\n",
+                                            i,
+                                        );
+                                    }
+                                } else if komorebi_client::send_message(
+                                    &SocketMessage::FocusStackWindow(i)
+                                ).is_err() {
+                                    tracing::error!(
+                                        "could not send message to komorebi: FocusStackWindow"
+                                    );
+                                }
+                            }
+                        }
+                    });
+                }
+            }
+        }
+    }
+}
+
+fn img_to_texture(ctx: &Context, rgba_image: &RgbaImage) -> TextureHandle {
+    let size = [rgba_image.width() as usize, rgba_image.height() as usize];
+    let pixels = rgba_image.as_flat_samples();
+    let color_image = ColorImage::from_rgba_unmultiplied(size, pixels.as_slice());
+    ctx.load_texture("icon", color_image, TextureOptions::default())
+}
+
+#[allow(clippy::type_complexity)]
+#[derive(Clone, Debug)]
+pub struct KomorebiNotificationState {
+    pub workspaces: Vec<(
+        String,
+        Vec<(bool, KomorebiNotificationStateContainerInformation)>,
+        WorkspaceLayer,
+    )>,
+    pub selected_workspace: String,
+    pub focused_container_information: KomorebiNotificationStateContainerInformation,
+    pub layout: KomorebiLayout,
+    pub hide_empty_workspaces: bool,
+    pub mouse_follows_focus: bool,
+    pub work_area_offset: Option<Rect>,
+    pub stack_accent: Option<Color32>,
+    pub monitor_index: usize,
+    pub monitor_usr_idx_map: HashMap<usize, usize>,
+}
+
+impl KomorebiNotificationState {
+    pub fn update_from_config(&mut self, config: &Self) {
+        self.hide_empty_workspaces = config.hide_empty_workspaces;
+    }
+
+    #[allow(clippy::too_many_arguments)]
+    pub fn handle_notification(
+        &mut self,
+        ctx: &Context,
+        monitor_index: Option<usize>,
+        notification: komorebi_client::Notification,
+        bg_color: Rc<RefCell<Color32>>,
+        bg_color_with_alpha: Rc<RefCell<Color32>>,
+        transparency_alpha: Option<u8>,
+        grouping: Option<Grouping>,
+        default_theme: Option<KomobarTheme>,
+        render_config: Rc<RefCell<RenderConfig>>,
+    ) {
+        let show_all_icons = render_config.borrow().show_all_icons;
+
+        match notification.event {
+            NotificationEvent::WindowManager(_) => {}
+            NotificationEvent::Monitor(_) => {}
+            NotificationEvent::Socket(message) => match message {
+                SocketMessage::ReloadStaticConfiguration(path) => {
+                    if let Ok(config) = komorebi_client::StaticConfig::read(&path) {
+                        if let Some(theme) = config.theme {
+                            apply_theme(
+                                ctx,
+                                KomobarTheme::from(theme),
+                                bg_color.clone(),
+                                bg_color_with_alpha.clone(),
+                                transparency_alpha,
+                                grouping,
+                                render_config,
+                            );
+                            tracing::info!("applied theme from updated komorebi.json");
+                        } else if let Some(default_theme) = default_theme {
+                            apply_theme(
+                                ctx,
+                                default_theme,
+                                bg_color.clone(),
+                                bg_color_with_alpha.clone(),
+                                transparency_alpha,
+                                grouping,
+                                render_config,
+                            );
+                            tracing::info!("removed theme from updated komorebi.json and applied default theme");
+                        } else {
+                            tracing::warn!("theme was removed from updated komorebi.json but there was no default theme to apply");
+                        }
+                    }
+                }
+                SocketMessage::Theme(theme) => {
+                    apply_theme(
+                        ctx,
+                        KomobarTheme::from(theme),
+                        bg_color,
+                        bg_color_with_alpha.clone(),
+                        transparency_alpha,
+                        grouping,
+                        render_config,
+                    );
+                    tracing::info!("applied theme from komorebi socket message");
+                }
+                _ => {}
+            },
+        }
+
+        self.monitor_usr_idx_map = notification.state.monitor_usr_idx_map.clone();
+
+        if monitor_index.is_none()
+            || monitor_index.is_some_and(|idx| idx >= notification.state.monitors.elements().len())
+        {
+            // The bar's monitor is diconnected, so the bar is disabled no need to check anything
+            // any further otherwise we'll get `OutOfBounds` panics.
+            return;
+        }
+        let monitor_index = monitor_index.expect("should have a monitor index");
+        self.monitor_index = monitor_index;
+
+        self.mouse_follows_focus = notification.state.mouse_follows_focus;
+
+        let monitor = &notification.state.monitors.elements()[monitor_index];
+        self.work_area_offset =
+            notification.state.monitors.elements()[monitor_index].work_area_offset();
+
+        let focused_workspace_idx = monitor.focused_workspace_idx();
+
+        let mut workspaces = vec![];
+
+        self.selected_workspace = monitor.workspaces()[focused_workspace_idx]
+            .name()
+            .to_owned()
+            .unwrap_or_else(|| format!("{}", focused_workspace_idx + 1));
+
+        for (i, ws) in monitor.workspaces().iter().enumerate() {
+            let should_show = if self.hide_empty_workspaces {
+                focused_workspace_idx == i || !ws.is_empty()
+            } else {
+                true
+            };
+
+            if should_show {
+                workspaces.push((
+                    ws.name().to_owned().unwrap_or_else(|| format!("{}", i + 1)),
+                    if show_all_icons {
+                        let mut containers = vec![];
+                        let mut has_monocle = false;
+
+                        // add monocle container
+                        if let Some(container) = ws.monocle_container() {
+                            containers.push((true, container.into()));
+                            has_monocle = true;
+                        }
+
+                        // add all tiled windows
+                        for (i, container) in ws.containers().iter().enumerate() {
+                            containers.push((
+                                !has_monocle && i == ws.focused_container_idx(),
+                                container.into(),
+                            ));
+                        }
+
+                        // add all floating windows
+                        for floating_window in ws.floating_windows() {
+                            containers.push((
+                                !has_monocle && floating_window.is_focused(),
+                                floating_window.into(),
+                            ));
+                        }
+
+                        containers
+                    } else {
+                        vec![(true, ws.into())]
+                    },
+                    ws.layer().to_owned(),
+                ));
+            }
+        }
+
+        self.workspaces = workspaces;
+
+        if monitor.workspaces()[focused_workspace_idx]
+            .monocle_container()
+            .is_some()
+        {
+            self.layout = KomorebiLayout::Monocle;
+        } else if !*monitor.workspaces()[focused_workspace_idx].tile() {
+            self.layout = KomorebiLayout::Floating;
+        } else if notification.state.is_paused {
+            self.layout = KomorebiLayout::Paused;
+        } else {
+            self.layout = match monitor.workspaces()[focused_workspace_idx].layout() {
+                komorebi_client::Layout::Default(layout) => KomorebiLayout::Default(*layout),
+                komorebi_client::Layout::Custom(_) => KomorebiLayout::Custom,
+            };
+        }
+
+        self.focused_container_information = (&monitor.workspaces()[focused_workspace_idx]).into();
+    }
+}
+
+#[derive(Clone, Debug)]
+pub struct KomorebiNotificationStateContainerInformation {
+    pub titles: Vec<String>,
+    pub icons: Vec<Option<RgbaImage>>,
+    pub focused_window_idx: usize,
+}
+
+impl From<&Workspace> for KomorebiNotificationStateContainerInformation {
+    fn from(value: &Workspace) -> Self {
+        let mut container_info = Self::EMPTY;
+
+        if let Some(container) = value.monocle_container() {
+            container_info = container.into();
+        } else if let Some(container) = value.focused_container() {
+            container_info = container.into();
+        }
+
+        for floating_window in value.floating_windows() {
+            if floating_window.is_focused() {
+                container_info = floating_window.into();
+            }
+        }
+
+        container_info
+    }
+}
+
+impl From<&Container> for KomorebiNotificationStateContainerInformation {
+    fn from(value: &Container) -> Self {
+        let windows = value.windows().iter().collect::<Vec<_>>();
+        let mut icons = vec![];
+
+        for window in windows {
+            let mut icon_cache = ICON_CACHE.lock().unwrap();
+            let mut update_cache = false;
+            let exe = window.exe().unwrap_or_default();
+
+            match icon_cache.get(&exe) {
+                None => {
+                    icons.push(windows_icons::get_icon_by_process_id(window.process_id()));
+                    update_cache = true;
+                }
+                Some(icon) => {
+                    icons.push(Some(icon.clone()));
+                }
+            }
+
+            if update_cache {
+                if let Some(Some(icon)) = icons.last() {
+                    icon_cache.insert(exe, icon.clone());
+                }
+            }
+        }
+
+        Self {
+            titles: value
+                .windows()
+                .iter()
+                .map(|w| w.title().unwrap_or_default())
+                .collect::<Vec<_>>(),
+            icons,
+            focused_window_idx: value.focused_window_idx(),
+        }
+    }
+}
+
+impl From<&Window> for KomorebiNotificationStateContainerInformation {
+    fn from(value: &Window) -> Self {
+        let mut icon_cache = ICON_CACHE.lock().unwrap();
+        let mut update_cache = false;
+        let mut icons = vec![];
+        let exe = value.exe().unwrap_or_default();
+
+        match icon_cache.get(&exe) {
+            None => {
+                icons.push(windows_icons::get_icon_by_process_id(value.process_id()));
+                update_cache = true;
+            }
+            Some(icon) => {
+                icons.push(Some(icon.clone()));
+            }
+        }
+
+        if update_cache {
+            if let Some(Some(icon)) = icons.last() {
+                icon_cache.insert(exe, icon.clone());
+            }
+        }
+
+        Self {
+            titles: vec![value.title().unwrap_or_default()],
+            icons,
+            focused_window_idx: 0,
+        }
+    }
+}
+
+impl KomorebiNotificationStateContainerInformation {
+    pub const EMPTY: Self = Self {
+        titles: vec![],
+        icons: vec![],
+        focused_window_idx: 0,
+    };
+}

komorebi-bar/src/widgets/komorebi_layout.rs

@@ -0,0 +1,323 @@
+use crate::config::DisplayFormat;
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::widgets::komorebi::KomorebiLayoutConfig;
+use eframe::egui::vec2;
+use eframe::egui::Context;
+use eframe::egui::CornerRadius;
+use eframe::egui::FontId;
+use eframe::egui::Frame;
+use eframe::egui::Label;
+use eframe::egui::Sense;
+use eframe::egui::Stroke;
+use eframe::egui::StrokeKind;
+use eframe::egui::Ui;
+use eframe::egui::Vec2;
+use komorebi_client::SocketMessage;
+use serde::de::Error;
+use serde::Deserialize;
+use serde::Deserializer;
+use serde::Serialize;
+use serde_json::from_str;
+use std::fmt::Display;
+use std::fmt::Formatter;
+
+#[derive(Copy, Clone, Debug, Serialize, PartialEq)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+#[serde(untagged)]
+pub enum KomorebiLayout {
+    Default(komorebi_client::DefaultLayout),
+    Monocle,
+    Floating,
+    Paused,
+    Custom,
+}
+
+impl<'de> Deserialize<'de> for KomorebiLayout {
+    fn deserialize<D>(deserializer: D) -> Result<Self, D::Error>
+    where
+        D: Deserializer<'de>,
+    {
+        let s: String = String::deserialize(deserializer)?;
+
+        // Attempt to deserialize the string as a DefaultLayout
+        if let Ok(default_layout) =
+            from_str::<komorebi_client::DefaultLayout>(&format!("\"{}\"", s))
+        {
+            return Ok(KomorebiLayout::Default(default_layout));
+        }
+
+        // Handle other cases
+        match s.as_str() {
+            "Monocle" => Ok(KomorebiLayout::Monocle),
+            "Floating" => Ok(KomorebiLayout::Floating),
+            "Paused" => Ok(KomorebiLayout::Paused),
+            "Custom" => Ok(KomorebiLayout::Custom),
+            _ => Err(Error::custom(format!("Invalid layout: {}", s))),
+        }
+    }
+}
+
+impl Display for KomorebiLayout {
+    fn fmt(&self, f: &mut Formatter<'_>) -> std::fmt::Result {
+        match self {
+            KomorebiLayout::Default(layout) => write!(f, "{layout}"),
+            KomorebiLayout::Monocle => write!(f, "Monocle"),
+            KomorebiLayout::Floating => write!(f, "Floating"),
+            KomorebiLayout::Paused => write!(f, "Paused"),
+            KomorebiLayout::Custom => write!(f, "Custom"),
+        }
+    }
+}
+
+impl KomorebiLayout {
+    fn is_default(&mut self) -> bool {
+        matches!(self, KomorebiLayout::Default(_))
+    }
+
+    fn on_click(
+        &mut self,
+        show_options: &bool,
+        monitor_idx: usize,
+        workspace_idx: Option<usize>,
+    ) -> bool {
+        if self.is_default() {
+            !show_options
+        } else {
+            self.on_click_option(monitor_idx, workspace_idx);
+            false
+        }
+    }
+
+    fn on_click_option(&mut self, monitor_idx: usize, workspace_idx: Option<usize>) {
+        match self {
+            KomorebiLayout::Default(option) => {
+                if let Some(ws_idx) = workspace_idx {
+                    if komorebi_client::send_message(&SocketMessage::WorkspaceLayout(
+                        monitor_idx,
+                        ws_idx,
+                        *option,
+                    ))
+                    .is_err()
+                    {
+                        tracing::error!("could not send message to komorebi: WorkspaceLayout");
+                    }
+                }
+            }
+            KomorebiLayout::Monocle => {
+                if komorebi_client::send_batch([
+                    SocketMessage::FocusMonitorAtCursor,
+                    SocketMessage::ToggleMonocle,
+                ])
+                .is_err()
+                {
+                    tracing::error!("could not send message to komorebi: ToggleMonocle");
+                }
+            }
+            KomorebiLayout::Floating => {
+                if komorebi_client::send_batch([
+                    SocketMessage::FocusMonitorAtCursor,
+                    SocketMessage::ToggleTiling,
+                ])
+                .is_err()
+                {
+                    tracing::error!("could not send message to komorebi: ToggleTiling");
+                }
+            }
+            KomorebiLayout::Paused => {
+                if komorebi_client::send_message(&SocketMessage::TogglePause).is_err() {
+                    tracing::error!("could not send message to komorebi: TogglePause");
+                }
+            }
+            KomorebiLayout::Custom => {}
+        }
+    }
+
+    fn show_icon(&mut self, is_selected: bool, font_id: FontId, ctx: &Context, ui: &mut Ui) {
+        // paint custom icons for the layout
+        let size = Vec2::splat(font_id.size);
+        let (response, painter) = ui.allocate_painter(size, Sense::hover());
+        let color = if is_selected {
+            ctx.style().visuals.selection.stroke.color
+        } else {
+            ui.style().visuals.text_color()
+        };
+        let stroke = Stroke::new(1.0, color);
+        let mut rect = response.rect;
+        let rounding = CornerRadius::same((rect.width() * 0.1) as u8);
+        rect = rect.shrink(stroke.width);
+        let c = rect.center();
+        let r = rect.width() / 2.0;
+        painter.rect_stroke(rect, rounding, stroke, StrokeKind::Outside);
+
+        match self {
+            KomorebiLayout::Default(layout) => match layout {
+                komorebi_client::DefaultLayout::BSP => {
+                    painter.line_segment([c - vec2(0.0, r), c + vec2(0.0, r)], stroke);
+                    painter.line_segment([c, c + vec2(r, 0.0)], stroke);
+                    painter.line_segment([c + vec2(r / 2.0, 0.0), c + vec2(r / 2.0, r)], stroke);
+                }
+                komorebi_client::DefaultLayout::Columns => {
+                    painter.line_segment([c - vec2(r / 2.0, r), c + vec2(-r / 2.0, r)], stroke);
+                    painter.line_segment([c - vec2(0.0, r), c + vec2(0.0, r)], stroke);
+                    painter.line_segment([c - vec2(-r / 2.0, r), c + vec2(r / 2.0, r)], stroke);
+                }
+                komorebi_client::DefaultLayout::Rows => {
+                    painter.line_segment([c - vec2(r, r / 2.0), c + vec2(r, -r / 2.0)], stroke);
+                    painter.line_segment([c - vec2(r, 0.0), c + vec2(r, 0.0)], stroke);
+                    painter.line_segment([c - vec2(r, -r / 2.0), c + vec2(r, r / 2.0)], stroke);
+                }
+                komorebi_client::DefaultLayout::VerticalStack => {
+                    painter.line_segment([c - vec2(0.0, r), c + vec2(0.0, r)], stroke);
+                    painter.line_segment([c, c + vec2(r, 0.0)], stroke);
+                }
+                komorebi_client::DefaultLayout::RightMainVerticalStack => {
+                    painter.line_segment([c - vec2(0.0, r), c + vec2(0.0, r)], stroke);
+                    painter.line_segment([c - vec2(r, 0.0), c], stroke);
+                }
+                komorebi_client::DefaultLayout::HorizontalStack => {
+                    painter.line_segment([c - vec2(r, 0.0), c + vec2(r, 0.0)], stroke);
+                    painter.line_segment([c, c + vec2(0.0, r)], stroke);
+                }
+                komorebi_client::DefaultLayout::UltrawideVerticalStack => {
+                    painter.line_segment([c - vec2(r / 2.0, r), c + vec2(-r / 2.0, r)], stroke);
+                    painter.line_segment([c + vec2(r / 2.0, 0.0), c + vec2(r, 0.0)], stroke);
+                    painter.line_segment([c - vec2(-r / 2.0, r), c + vec2(r / 2.0, r)], stroke);
+                }
+                komorebi_client::DefaultLayout::Grid => {
+                    painter.line_segment([c - vec2(r, 0.0), c + vec2(r, 0.0)], stroke);
+                    painter.line_segment([c - vec2(0.0, r), c + vec2(0.0, r)], stroke);
+                }
+            },
+            KomorebiLayout::Monocle => {}
+            KomorebiLayout::Floating => {
+                let mut rect_left = response.rect;
+                rect_left.set_width(rect.width() * 0.5);
+                rect_left.set_height(rect.height() * 0.5);
+                let mut rect_right = rect_left;
+                rect_left = rect_left.translate(Vec2::new(
+                    rect.width() * 0.1 + stroke.width,
+                    rect.width() * 0.1 + stroke.width,
+                ));
+                rect_right = rect_right.translate(Vec2::new(
+                    rect.width() * 0.35 + stroke.width,
+                    rect.width() * 0.35 + stroke.width,
+                ));
+                painter.rect_filled(rect_left, rounding, color);
+                painter.rect_stroke(rect_right, rounding, stroke, StrokeKind::Outside);
+            }
+            KomorebiLayout::Paused => {
+                let mut rect_left = response.rect;
+                rect_left.set_width(rect.width() * 0.25);
+                rect_left.set_height(rect.height() * 0.8);
+                let mut rect_right = rect_left;
+                rect_left = rect_left.translate(Vec2::new(
+                    rect.width() * 0.2 + stroke.width,
+                    rect.width() * 0.1 + stroke.width,
+                ));
+                rect_right = rect_right.translate(Vec2::new(
+                    rect.width() * 0.55 + stroke.width,
+                    rect.width() * 0.1 + stroke.width,
+                ));
+                painter.rect_filled(rect_left, rounding, color);
+                painter.rect_filled(rect_right, rounding, color);
+            }
+            KomorebiLayout::Custom => {
+                painter.line_segment([c - vec2(0.0, r), c + vec2(0.0, r)], stroke);
+                painter.line_segment([c + vec2(0.0, r / 2.0), c + vec2(r, r / 2.0)], stroke);
+                painter.line_segment([c - vec2(0.0, r / 3.0), c - vec2(r, r / 3.0)], stroke);
+            }
+        }
+    }
+
+    pub fn show(
+        &mut self,
+        ctx: &Context,
+        ui: &mut Ui,
+        render_config: &mut RenderConfig,
+        layout_config: &KomorebiLayoutConfig,
+        workspace_idx: Option<usize>,
+    ) {
+        let monitor_idx = render_config.monitor_idx;
+        let font_id = render_config.icon_font_id.clone();
+        let mut show_options = RenderConfig::load_show_komorebi_layout_options();
+        let format = layout_config.display.unwrap_or(DisplayFormat::IconAndText);
+
+        if !self.is_default() {
+            show_options = false;
+        }
+
+        render_config.apply_on_widget(false, ui, |ui| {
+            let layout_frame = SelectableFrame::new(false)
+                .show(ui, |ui| {
+                    if let DisplayFormat::Icon | DisplayFormat::IconAndText = format {
+                        self.show_icon(false, font_id.clone(), ctx, ui);
+                    }
+
+                    if let DisplayFormat::Text | DisplayFormat::IconAndText = format {
+                        ui.add(Label::new(self.to_string()).selectable(false));
+                    }
+                })
+                .on_hover_text(self.to_string());
+
+            if layout_frame.clicked() {
+                show_options = self.on_click(&show_options, monitor_idx, workspace_idx);
+            }
+
+            if show_options {
+                if let Some(workspace_idx) = workspace_idx {
+                    Frame::NONE.show(ui, |ui| {
+                        ui.add(
+                            Label::new(egui_phosphor::regular::ARROW_FAT_LINES_RIGHT.to_string())
+                                .selectable(false),
+                        );
+
+                        let mut layout_options = layout_config.options.clone().unwrap_or(vec![
+                            KomorebiLayout::Default(komorebi_client::DefaultLayout::BSP),
+                            KomorebiLayout::Default(komorebi_client::DefaultLayout::Columns),
+                            KomorebiLayout::Default(komorebi_client::DefaultLayout::Rows),
+                            KomorebiLayout::Default(komorebi_client::DefaultLayout::VerticalStack),
+                            KomorebiLayout::Default(
+                                komorebi_client::DefaultLayout::RightMainVerticalStack,
+                            ),
+                            KomorebiLayout::Default(
+                                komorebi_client::DefaultLayout::HorizontalStack,
+                            ),
+                            KomorebiLayout::Default(
+                                komorebi_client::DefaultLayout::UltrawideVerticalStack,
+                            ),
+                            KomorebiLayout::Default(komorebi_client::DefaultLayout::Grid),
+                            //KomorebiLayout::Custom,
+                            KomorebiLayout::Monocle,
+                            KomorebiLayout::Floating,
+                            KomorebiLayout::Paused,
+                        ]);
+
+                        for layout_option in &mut layout_options {
+                            let is_selected = self == layout_option;
+
+                            if SelectableFrame::new(is_selected)
+                                .show(ui, |ui| {
+                                    layout_option.show_icon(is_selected, font_id.clone(), ctx, ui)
+                                })
+                                .on_hover_text(match layout_option {
+                                    KomorebiLayout::Default(layout) => layout.to_string(),
+                                    KomorebiLayout::Monocle => "Toggle monocle".to_string(),
+                                    KomorebiLayout::Floating => "Toggle tiling".to_string(),
+                                    KomorebiLayout::Paused => "Toggle pause".to_string(),
+                                    KomorebiLayout::Custom => "Custom".to_string(),
+                                })
+                                .clicked()
+                            {
+                                layout_option.on_click_option(monitor_idx, Some(workspace_idx));
+                                show_options = false;
+                            };
+                        }
+                    });
+                }
+            }
+        });
+
+        RenderConfig::store_show_komorebi_layout_options(show_options);
+    }
+}

komorebi-bar/src/widgets/media.rs

@@ -0,0 +1,124 @@
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::ui::CustomUi;
+use crate::widgets::widget::BarWidget;
+use crate::MAX_LABEL_WIDTH;
+use eframe::egui::text::LayoutJob;
+use eframe::egui::Align;
+use eframe::egui::Context;
+use eframe::egui::Label;
+use eframe::egui::TextFormat;
+use eframe::egui::Ui;
+use eframe::egui::Vec2;
+use serde::Deserialize;
+use serde::Serialize;
+use std::sync::atomic::Ordering;
+use windows::Media::Control::GlobalSystemMediaTransportControlsSessionManager;
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct MediaConfig {
+    /// Enable the Media widget
+    pub enable: bool,
+}
+
+impl From<MediaConfig> for Media {
+    fn from(value: MediaConfig) -> Self {
+        Self::new(value.enable)
+    }
+}
+
+#[derive(Clone, Debug)]
+pub struct Media {
+    pub enable: bool,
+    pub session_manager: GlobalSystemMediaTransportControlsSessionManager,
+}
+
+impl Media {
+    pub fn new(enable: bool) -> Self {
+        Self {
+            enable,
+            session_manager: GlobalSystemMediaTransportControlsSessionManager::RequestAsync()
+                .unwrap()
+                .get()
+                .unwrap(),
+        }
+    }
+
+    pub fn toggle(&self) {
+        if let Ok(session) = self.session_manager.GetCurrentSession() {
+            if let Ok(op) = session.TryTogglePlayPauseAsync() {
+                op.get().unwrap_or_default();
+            }
+        }
+    }
+
+    fn output(&mut self) -> String {
+        if let Ok(session) = self.session_manager.GetCurrentSession() {
+            if let Ok(operation) = session.TryGetMediaPropertiesAsync() {
+                if let Ok(properties) = operation.get() {
+                    if let (Ok(artist), Ok(title)) = (properties.Artist(), properties.Title()) {
+                        if artist.is_empty() {
+                            return format!("{title}");
+                        }
+
+                        if title.is_empty() {
+                            return format!("{artist}");
+                        }
+
+                        return format!("{artist} - {title}");
+                    }
+                }
+            }
+        }
+
+        String::new()
+    }
+}
+
+impl BarWidget for Media {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        if self.enable {
+            let output = self.output();
+            if !output.is_empty() {
+                let mut layout_job = LayoutJob::simple(
+                    egui_phosphor::regular::HEADPHONES.to_string(),
+                    config.icon_font_id.clone(),
+                    ctx.style().visuals.selection.stroke.color,
+                    100.0,
+                );
+
+                layout_job.append(
+                    &output,
+                    10.0,
+                    TextFormat {
+                        font_id: config.text_font_id.clone(),
+                        color: ctx.style().visuals.text_color(),
+                        valign: Align::Center,
+                        ..Default::default()
+                    },
+                );
+
+                config.apply_on_widget(false, ui, |ui| {
+                    if SelectableFrame::new(false)
+                        .show(ui, |ui| {
+                            let available_height = ui.available_height();
+                            let mut custom_ui = CustomUi(ui);
+
+                            custom_ui.add_sized_left_to_right(
+                                Vec2::new(
+                                    MAX_LABEL_WIDTH.load(Ordering::SeqCst) as f32,
+                                    available_height,
+                                ),
+                                Label::new(layout_job).selectable(false).truncate(),
+                            )
+                        })
+                        .clicked()
+                    {
+                        self.toggle();
+                    }
+                });
+            }
+        }
+    }
+}

komorebi-bar/src/widgets/memory.rs

@@ -0,0 +1,118 @@
+use crate::config::LabelPrefix;
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::widgets::widget::BarWidget;
+use eframe::egui::text::LayoutJob;
+use eframe::egui::Align;
+use eframe::egui::Context;
+use eframe::egui::Label;
+use eframe::egui::TextFormat;
+use eframe::egui::Ui;
+use serde::Deserialize;
+use serde::Serialize;
+use std::process::Command;
+use std::time::Duration;
+use std::time::Instant;
+use sysinfo::RefreshKind;
+use sysinfo::System;
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct MemoryConfig {
+    /// Enable the Memory widget
+    pub enable: bool,
+    /// Data refresh interval (default: 10 seconds)
+    pub data_refresh_interval: Option<u64>,
+    /// Display label prefix
+    pub label_prefix: Option<LabelPrefix>,
+}
+
+impl From<MemoryConfig> for Memory {
+    fn from(value: MemoryConfig) -> Self {
+        let data_refresh_interval = value.data_refresh_interval.unwrap_or(10);
+
+        Self {
+            enable: value.enable,
+            system: System::new_with_specifics(
+                RefreshKind::default().without_cpu().without_processes(),
+            ),
+            data_refresh_interval,
+            label_prefix: value.label_prefix.unwrap_or(LabelPrefix::IconAndText),
+            last_updated: Instant::now()
+                .checked_sub(Duration::from_secs(data_refresh_interval))
+                .unwrap(),
+        }
+    }
+}
+
+pub struct Memory {
+    pub enable: bool,
+    system: System,
+    data_refresh_interval: u64,
+    label_prefix: LabelPrefix,
+    last_updated: Instant,
+}
+
+impl Memory {
+    fn output(&mut self) -> String {
+        let now = Instant::now();
+        if now.duration_since(self.last_updated) > Duration::from_secs(self.data_refresh_interval) {
+            self.system.refresh_memory();
+            self.last_updated = now;
+        }
+
+        let used = self.system.used_memory();
+        let total = self.system.total_memory();
+        match self.label_prefix {
+            LabelPrefix::Text | LabelPrefix::IconAndText => {
+                format!("RAM: {}%", (used * 100) / total)
+            }
+            LabelPrefix::None | LabelPrefix::Icon => format!("{}%", (used * 100) / total),
+        }
+    }
+}
+
+impl BarWidget for Memory {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        if self.enable {
+            let output = self.output();
+            if !output.is_empty() {
+                let mut layout_job = LayoutJob::simple(
+                    match self.label_prefix {
+                        LabelPrefix::Icon | LabelPrefix::IconAndText => {
+                            egui_phosphor::regular::MEMORY.to_string()
+                        }
+                        LabelPrefix::None | LabelPrefix::Text => String::new(),
+                    },
+                    config.icon_font_id.clone(),
+                    ctx.style().visuals.selection.stroke.color,
+                    100.0,
+                );
+
+                layout_job.append(
+                    &output,
+                    10.0,
+                    TextFormat {
+                        font_id: config.text_font_id.clone(),
+                        color: ctx.style().visuals.text_color(),
+                        valign: Align::Center,
+                        ..Default::default()
+                    },
+                );
+
+                config.apply_on_widget(false, ui, |ui| {
+                    if SelectableFrame::new(false)
+                        .show(ui, |ui| ui.add(Label::new(layout_job).selectable(false)))
+                        .clicked()
+                    {
+                        if let Err(error) =
+                            Command::new("cmd.exe").args(["/C", "taskmgr.exe"]).spawn()
+                        {
+                            eprintln!("{}", error)
+                        }
+                    }
+                });
+            }
+        }
+    }
+}

komorebi-bar/src/widgets/mod.rs

@@ -0,0 +1,13 @@
+pub mod battery;
+pub mod cpu;
+pub mod date;
+pub mod keyboard;
+pub mod komorebi;
+mod komorebi_layout;
+pub mod media;
+pub mod memory;
+pub mod network;
+pub mod storage;
+pub mod time;
+pub mod update;
+pub mod widget;

komorebi-bar/src/widgets/network.rs

@@ -0,0 +1,376 @@
+use crate::config::LabelPrefix;
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::widgets::widget::BarWidget;
+use eframe::egui::text::LayoutJob;
+use eframe::egui::Align;
+use eframe::egui::Context;
+use eframe::egui::Label;
+use eframe::egui::TextFormat;
+use eframe::egui::Ui;
+use num_derive::FromPrimitive;
+use serde::Deserialize;
+use serde::Serialize;
+use std::fmt;
+use std::process::Command;
+use std::time::Duration;
+use std::time::Instant;
+use sysinfo::Networks;
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct NetworkConfig {
+    /// Enable the Network widget
+    pub enable: bool,
+    /// Show total data transmitted
+    pub show_total_data_transmitted: bool,
+    /// Show network activity
+    pub show_network_activity: bool,
+    /// Show default interface
+    pub show_default_interface: Option<bool>,
+    /// Characters to reserve for network activity data
+    pub network_activity_fill_characters: Option<usize>,
+    /// Data refresh interval (default: 10 seconds)
+    pub data_refresh_interval: Option<u64>,
+    /// Display label prefix
+    pub label_prefix: Option<LabelPrefix>,
+}
+
+impl From<NetworkConfig> for Network {
+    fn from(value: NetworkConfig) -> Self {
+        let data_refresh_interval = value.data_refresh_interval.unwrap_or(10);
+
+        Self {
+            enable: value.enable,
+            show_total_activity: value.show_total_data_transmitted,
+            show_activity: value.show_network_activity,
+            show_default_interface: value.show_default_interface.unwrap_or(true),
+            networks_network_activity: Networks::new_with_refreshed_list(),
+            default_interface: String::new(),
+            data_refresh_interval,
+            label_prefix: value.label_prefix.unwrap_or(LabelPrefix::Icon),
+            network_activity_fill_characters: value
+                .network_activity_fill_characters
+                .unwrap_or_default(),
+            last_state_total_activity: vec![],
+            last_state_activity: vec![],
+            last_updated_network_activity: Instant::now()
+                .checked_sub(Duration::from_secs(data_refresh_interval))
+                .unwrap(),
+        }
+    }
+}
+
+pub struct Network {
+    pub enable: bool,
+    pub show_total_activity: bool,
+    pub show_activity: bool,
+    pub show_default_interface: bool,
+    networks_network_activity: Networks,
+    data_refresh_interval: u64,
+    label_prefix: LabelPrefix,
+    default_interface: String,
+    last_state_total_activity: Vec<NetworkReading>,
+    last_state_activity: Vec<NetworkReading>,
+    last_updated_network_activity: Instant,
+    network_activity_fill_characters: usize,
+}
+
+impl Network {
+    fn default_interface(&mut self) {
+        if let Ok(interface) = netdev::get_default_interface() {
+            if let Some(friendly_name) = &interface.friendly_name {
+                self.default_interface.clone_from(friendly_name);
+            }
+        }
+    }
+
+    fn network_activity(&mut self) -> (Vec<NetworkReading>, Vec<NetworkReading>) {
+        let mut activity = self.last_state_activity.clone();
+        let mut total_activity = self.last_state_total_activity.clone();
+        let now = Instant::now();
+
+        if now.duration_since(self.last_updated_network_activity)
+            > Duration::from_secs(self.data_refresh_interval)
+        {
+            activity.clear();
+            total_activity.clear();
+
+            if let Ok(interface) = netdev::get_default_interface() {
+                if let Some(friendly_name) = &interface.friendly_name {
+                    self.default_interface.clone_from(friendly_name);
+
+                    self.networks_network_activity.refresh(true);
+
+                    for (interface_name, data) in &self.networks_network_activity {
+                        if friendly_name.eq(interface_name) {
+                            if self.show_activity {
+                                activity.push(NetworkReading::new(
+                                    NetworkReadingFormat::Speed,
+                                    Self::to_pretty_bytes(
+                                        data.received(),
+                                        self.data_refresh_interval,
+                                    ),
+                                    Self::to_pretty_bytes(
+                                        data.transmitted(),
+                                        self.data_refresh_interval,
+                                    ),
+                                ));
+                            }
+
+                            if self.show_total_activity {
+                                total_activity.push(NetworkReading::new(
+                                    NetworkReadingFormat::Total,
+                                    Self::to_pretty_bytes(data.total_received(), 1),
+                                    Self::to_pretty_bytes(data.total_transmitted(), 1),
+                                ))
+                            }
+                        }
+                    }
+                }
+            }
+
+            self.last_state_activity.clone_from(&activity);
+            self.last_state_total_activity.clone_from(&total_activity);
+            self.last_updated_network_activity = now;
+        }
+
+        (activity, total_activity)
+    }
+
+    fn reading_to_label(
+        &self,
+        ctx: &Context,
+        reading: NetworkReading,
+        config: RenderConfig,
+    ) -> Label {
+        let (text_down, text_up) = match self.label_prefix {
+            LabelPrefix::None | LabelPrefix::Icon => match reading.format {
+                NetworkReadingFormat::Speed => (
+                    format!(
+                        "{: >width$}/s ",
+                        reading.received_text,
+                        width = self.network_activity_fill_characters
+                    ),
+                    format!(
+                        "{: >width$}/s",
+                        reading.transmitted_text,
+                        width = self.network_activity_fill_characters
+                    ),
+                ),
+                NetworkReadingFormat::Total => (
+                    format!("{} ", reading.received_text),
+                    reading.transmitted_text,
+                ),
+            },
+            LabelPrefix::Text | LabelPrefix::IconAndText => match reading.format {
+                NetworkReadingFormat::Speed => (
+                    format!(
+                        "DOWN: {: >width$}/s ",
+                        reading.received_text,
+                        width = self.network_activity_fill_characters
+                    ),
+                    format!(
+                        "UP: {: >width$}/s",
+                        reading.transmitted_text,
+                        width = self.network_activity_fill_characters
+                    ),
+                ),
+                NetworkReadingFormat::Total => (
+                    format!("\u{2211}DOWN: {}/s ", reading.received_text),
+                    format!("\u{2211}UP: {}/s", reading.transmitted_text),
+                ),
+            },
+        };
+
+        let icon_format = TextFormat::simple(
+            config.icon_font_id.clone(),
+            ctx.style().visuals.selection.stroke.color,
+        );
+        let text_format = TextFormat {
+            font_id: config.text_font_id.clone(),
+            color: ctx.style().visuals.text_color(),
+            valign: Align::Center,
+            ..Default::default()
+        };
+
+        // icon
+        let mut layout_job = LayoutJob::simple(
+            match self.label_prefix {
+                LabelPrefix::Icon | LabelPrefix::IconAndText => {
+                    egui_phosphor::regular::ARROW_FAT_DOWN.to_string()
+                }
+                LabelPrefix::None | LabelPrefix::Text => String::new(),
+            },
+            icon_format.font_id.clone(),
+            icon_format.color,
+            100.0,
+        );
+
+        // text
+        layout_job.append(
+            &text_down,
+            ctx.style().spacing.item_spacing.x,
+            text_format.clone(),
+        );
+
+        // icon
+        layout_job.append(
+            &match self.label_prefix {
+                LabelPrefix::Icon | LabelPrefix::IconAndText => {
+                    egui_phosphor::regular::ARROW_FAT_UP.to_string()
+                }
+                LabelPrefix::None | LabelPrefix::Text => String::new(),
+            },
+            0.0,
+            icon_format.clone(),
+        );
+
+        // text
+        layout_job.append(
+            &text_up,
+            ctx.style().spacing.item_spacing.x,
+            text_format.clone(),
+        );
+
+        Label::new(layout_job).selectable(false)
+    }
+
+    fn to_pretty_bytes(input_in_bytes: u64, timespan_in_s: u64) -> String {
+        let input = input_in_bytes as f32 / timespan_in_s as f32;
+        let mut magnitude = input.log(1024f32) as u32;
+
+        // let the base unit be KiB
+        if magnitude < 1 {
+            magnitude = 1;
+        }
+
+        let base: Option<DataUnit> = num::FromPrimitive::from_u32(magnitude);
+        let result = input / ((1u64) << (magnitude * 10)) as f32;
+
+        match base {
+            Some(DataUnit::B) => format!("{result:.1} B"),
+            Some(unit) => format!("{result:.1} {unit}iB"),
+            None => String::from("Unknown data unit"),
+        }
+    }
+}
+
+impl BarWidget for Network {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        if self.enable {
+            // widget spacing: make sure to use the same config to call the apply_on_widget function
+            let mut render_config = config.clone();
+
+            if self.show_total_activity || self.show_activity {
+                let (activity, total_activity) = self.network_activity();
+
+                if self.show_total_activity {
+                    for reading in total_activity {
+                        render_config.apply_on_widget(true, ui, |ui| {
+                            ui.add(self.reading_to_label(ctx, reading, config.clone()));
+                        });
+                    }
+                }
+
+                if self.show_activity {
+                    for reading in activity {
+                        render_config.apply_on_widget(true, ui, |ui| {
+                            ui.add(self.reading_to_label(ctx, reading, config.clone()));
+                        });
+                    }
+                }
+            }
+
+            if self.show_default_interface {
+                self.default_interface();
+
+                if !self.default_interface.is_empty() {
+                    let mut layout_job = LayoutJob::simple(
+                        match self.label_prefix {
+                            LabelPrefix::Icon | LabelPrefix::IconAndText => {
+                                egui_phosphor::regular::WIFI_HIGH.to_string()
+                            }
+                            LabelPrefix::None | LabelPrefix::Text => String::new(),
+                        },
+                        config.icon_font_id.clone(),
+                        ctx.style().visuals.selection.stroke.color,
+                        100.0,
+                    );
+
+                    if let LabelPrefix::Text | LabelPrefix::IconAndText = self.label_prefix {
+                        self.default_interface.insert_str(0, "NET: ");
+                    }
+
+                    layout_job.append(
+                        &self.default_interface,
+                        10.0,
+                        TextFormat {
+                            font_id: config.text_font_id.clone(),
+                            color: ctx.style().visuals.text_color(),
+                            valign: Align::Center,
+                            ..Default::default()
+                        },
+                    );
+
+                    render_config.apply_on_widget(false, ui, |ui| {
+                        if SelectableFrame::new(false)
+                            .show(ui, |ui| ui.add(Label::new(layout_job).selectable(false)))
+                            .clicked()
+                        {
+                            if let Err(error) = Command::new("cmd.exe").args(["/C", "ncpa"]).spawn()
+                            {
+                                eprintln!("{}", error)
+                            }
+                        }
+                    });
+                }
+            }
+
+            // widget spacing: pass on the config that was use for calling the apply_on_widget function
+            *config = render_config.clone();
+        }
+    }
+}
+
+#[derive(Clone)]
+enum NetworkReadingFormat {
+    Speed = 0,
+    Total = 1,
+}
+
+#[derive(Clone)]
+struct NetworkReading {
+    pub format: NetworkReadingFormat,
+    pub received_text: String,
+    pub transmitted_text: String,
+}
+
+impl NetworkReading {
+    pub fn new(format: NetworkReadingFormat, received: String, transmitted: String) -> Self {
+        NetworkReading {
+            format,
+            received_text: received,
+            transmitted_text: transmitted,
+        }
+    }
+}
+
+#[derive(Debug, FromPrimitive)]
+enum DataUnit {
+    B = 0,
+    K = 1,
+    M = 2,
+    G = 3,
+    T = 4,
+    P = 5,
+    E = 6,
+    Z = 7,
+    Y = 8,
+}
+
+impl fmt::Display for DataUnit {
+    fn fmt(&self, f: &mut fmt::Formatter) -> fmt::Result {
+        write!(f, "{:?}", self)
+    }
+}

komorebi-bar/src/widgets/storage.rs

@@ -0,0 +1,127 @@
+use crate::config::LabelPrefix;
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::widgets::widget::BarWidget;
+use eframe::egui::text::LayoutJob;
+use eframe::egui::Align;
+use eframe::egui::Context;
+use eframe::egui::Label;
+use eframe::egui::TextFormat;
+use eframe::egui::Ui;
+use serde::Deserialize;
+use serde::Serialize;
+use std::process::Command;
+use std::time::Duration;
+use std::time::Instant;
+use sysinfo::Disks;
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct StorageConfig {
+    /// Enable the Storage widget
+    pub enable: bool,
+    /// Data refresh interval (default: 10 seconds)
+    pub data_refresh_interval: Option<u64>,
+    /// Display label prefix
+    pub label_prefix: Option<LabelPrefix>,
+}
+
+impl From<StorageConfig> for Storage {
+    fn from(value: StorageConfig) -> Self {
+        Self {
+            enable: value.enable,
+            disks: Disks::new_with_refreshed_list(),
+            data_refresh_interval: value.data_refresh_interval.unwrap_or(10),
+            label_prefix: value.label_prefix.unwrap_or(LabelPrefix::IconAndText),
+            last_updated: Instant::now(),
+        }
+    }
+}
+
+pub struct Storage {
+    pub enable: bool,
+    disks: Disks,
+    data_refresh_interval: u64,
+    label_prefix: LabelPrefix,
+    last_updated: Instant,
+}
+
+impl Storage {
+    fn output(&mut self) -> Vec<String> {
+        let now = Instant::now();
+        if now.duration_since(self.last_updated) > Duration::from_secs(self.data_refresh_interval) {
+            self.disks.refresh(true);
+            self.last_updated = now;
+        }
+
+        let mut disks = vec![];
+
+        for disk in &self.disks {
+            let mount = disk.mount_point();
+            let total = disk.total_space();
+            let available = disk.available_space();
+            let used = total - available;
+
+            disks.push(match self.label_prefix {
+                LabelPrefix::Text | LabelPrefix::IconAndText => {
+                    format!("{} {}%", mount.to_string_lossy(), (used * 100) / total)
+                }
+                LabelPrefix::None | LabelPrefix::Icon => format!("{}%", (used * 100) / total),
+            })
+        }
+
+        disks.sort();
+        disks.reverse();
+
+        disks
+    }
+}
+
+impl BarWidget for Storage {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        if self.enable {
+            for output in self.output() {
+                let mut layout_job = LayoutJob::simple(
+                    match self.label_prefix {
+                        LabelPrefix::Icon | LabelPrefix::IconAndText => {
+                            egui_phosphor::regular::HARD_DRIVES.to_string()
+                        }
+                        LabelPrefix::None | LabelPrefix::Text => String::new(),
+                    },
+                    config.icon_font_id.clone(),
+                    ctx.style().visuals.selection.stroke.color,
+                    100.0,
+                );
+
+                layout_job.append(
+                    &output,
+                    10.0,
+                    TextFormat {
+                        font_id: config.text_font_id.clone(),
+                        color: ctx.style().visuals.text_color(),
+                        valign: Align::Center,
+                        ..Default::default()
+                    },
+                );
+
+                config.apply_on_widget(false, ui, |ui| {
+                    if SelectableFrame::new(false)
+                        .show(ui, |ui| ui.add(Label::new(layout_job).selectable(false)))
+                        .clicked()
+                    {
+                        if let Err(error) = Command::new("cmd.exe")
+                            .args([
+                                "/C",
+                                "explorer.exe",
+                                output.split(' ').collect::<Vec<&str>>()[0],
+                            ])
+                            .spawn()
+                        {
+                            eprintln!("{}", error)
+                        }
+                    }
+                });
+            }
+        }
+    }
+}

komorebi-bar/src/widgets/time.rs

@@ -0,0 +1,538 @@
+use crate::bar::Alignment;
+use crate::config::LabelPrefix;
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::widgets::widget::BarWidget;
+use chrono::Local;
+use chrono::NaiveTime;
+use chrono_tz::Tz;
+use eframe::egui::text::LayoutJob;
+use eframe::egui::Align;
+use eframe::egui::Context;
+use eframe::egui::CornerRadius;
+use eframe::egui::Label;
+use eframe::egui::Sense;
+use eframe::egui::Stroke;
+use eframe::egui::TextFormat;
+use eframe::egui::Ui;
+use eframe::egui::Vec2;
+use eframe::epaint::StrokeKind;
+use lazy_static::lazy_static;
+use serde::Deserialize;
+use serde::Serialize;
+use std::time::Duration;
+use std::time::Instant;
+
+lazy_static! {
+    static ref TIME_RANGES: Vec<(&'static str, NaiveTime)> = {
+        vec![
+            (
+                egui_phosphor::regular::MOON,
+                NaiveTime::from_hms_opt(0, 0, 0).expect("invalid"),
+            ),
+            (
+                egui_phosphor::regular::ALARM,
+                NaiveTime::from_hms_opt(6, 0, 0).expect("invalid"),
+            ),
+            (
+                egui_phosphor::regular::BREAD,
+                NaiveTime::from_hms_opt(6, 1, 0).expect("invalid"),
+            ),
+            (
+                egui_phosphor::regular::BARBELL,
+                NaiveTime::from_hms_opt(6, 30, 0).expect("invalid"),
+            ),
+            (
+                egui_phosphor::regular::COFFEE,
+                NaiveTime::from_hms_opt(8, 0, 0).expect("invalid"),
+            ),
+            (
+                egui_phosphor::regular::CLOCK,
+                NaiveTime::from_hms_opt(8, 30, 0).expect("invalid"),
+            ),
+            (
+                egui_phosphor::regular::HAMBURGER,
+                NaiveTime::from_hms_opt(12, 0, 0).expect("invalid"),
+            ),
+            (
+                egui_phosphor::regular::CLOCK_AFTERNOON,
+                NaiveTime::from_hms_opt(12, 30, 0).expect("invalid"),
+            ),
+            (
+                egui_phosphor::regular::FORK_KNIFE,
+                NaiveTime::from_hms_opt(18, 0, 0).expect("invalid"),
+            ),
+            (
+                egui_phosphor::regular::MOON_STARS,
+                NaiveTime::from_hms_opt(18, 30, 0).expect("invalid"),
+            ),
+        ]
+    };
+}
+
+#[derive(Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct TimeConfig {
+    /// Enable the Time widget
+    pub enable: bool,
+    /// Set the Time format
+    pub format: TimeFormat,
+    /// Display label prefix
+    pub label_prefix: Option<LabelPrefix>,
+    /// TimeZone (https://docs.rs/chrono-tz/latest/chrono_tz/enum.Tz.html)
+    ///
+    /// Use a custom format to display additional information, i.e.:
+    /// ```json
+    /// {
+    ///     "Time": {
+    ///         "enable": true,
+    ///         "format": { "Custom": "%T %Z (Tokyo)" },
+    ///         "timezone": "Asia/Tokyo"
+    ///      }
+    ///}
+    /// ```
+    pub timezone: Option<String>,
+    /// Change the icon depending on the time. The default icon is used between 8:30 and 12:00. (default: false)
+    pub changing_icon: Option<bool>,
+}
+
+impl From<TimeConfig> for Time {
+    fn from(value: TimeConfig) -> Self {
+        // using 1 second made the widget look "less accurate" and lagging (especially having multiple with seconds).
+        // This is still better than getting an update every frame
+        let data_refresh_interval = 500;
+
+        Self {
+            enable: value.enable,
+            format: value.format,
+            label_prefix: value.label_prefix.unwrap_or(LabelPrefix::Icon),
+            timezone: value.timezone,
+            changing_icon: value.changing_icon.unwrap_or_default(),
+            data_refresh_interval_millis: data_refresh_interval,
+            last_state: TimeOutput::new(),
+            last_updated: Instant::now()
+                .checked_sub(Duration::from_millis(data_refresh_interval))
+                .unwrap(),
+        }
+    }
+}
+
+#[derive(Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub enum TimeFormat {
+    /// Twelve-hour format (with seconds)
+    TwelveHour,
+    /// Twelve-hour format (without seconds)
+    TwelveHourWithoutSeconds,
+    /// Twenty-four-hour format (with seconds)
+    TwentyFourHour,
+    /// Twenty-four-hour format (without seconds)
+    TwentyFourHourWithoutSeconds,
+    /// Twenty-four-hour format displayed as a binary clock with circles (with seconds) (https://en.wikipedia.org/wiki/Binary_clock)
+    BinaryCircle,
+    /// Twenty-four-hour format displayed as a binary clock with rectangles (with seconds) (https://en.wikipedia.org/wiki/Binary_clock)
+    BinaryRectangle,
+    /// Custom format (https://docs.rs/chrono/latest/chrono/format/strftime/index.html)
+    Custom(String),
+}
+
+impl TimeFormat {
+    pub fn toggle(&mut self) {
+        match self {
+            TimeFormat::TwelveHour => *self = TimeFormat::TwelveHourWithoutSeconds,
+            TimeFormat::TwelveHourWithoutSeconds => *self = TimeFormat::TwentyFourHour,
+            TimeFormat::TwentyFourHour => *self = TimeFormat::TwentyFourHourWithoutSeconds,
+            TimeFormat::TwentyFourHourWithoutSeconds => *self = TimeFormat::BinaryCircle,
+            TimeFormat::BinaryCircle => *self = TimeFormat::BinaryRectangle,
+            TimeFormat::BinaryRectangle => *self = TimeFormat::TwelveHour,
+            _ => {}
+        };
+    }
+
+    fn fmt_string(&self) -> String {
+        match self {
+            TimeFormat::TwelveHour => String::from("%l:%M:%S %p"),
+            TimeFormat::TwelveHourWithoutSeconds => String::from("%l:%M %p"),
+            TimeFormat::TwentyFourHour => String::from("%T"),
+            TimeFormat::TwentyFourHourWithoutSeconds => String::from("%H:%M"),
+            TimeFormat::BinaryCircle => String::from("c%T"),
+            TimeFormat::BinaryRectangle => String::from("r%T"),
+            TimeFormat::Custom(format) => format.to_string(),
+        }
+    }
+}
+
+#[derive(Clone, Debug)]
+struct TimeOutput {
+    label: String,
+    icon: String,
+}
+
+impl TimeOutput {
+    fn new() -> Self {
+        Self {
+            label: String::new(),
+            icon: String::new(),
+        }
+    }
+}
+
+#[derive(Clone, Debug)]
+pub struct Time {
+    pub enable: bool,
+    pub format: TimeFormat,
+    label_prefix: LabelPrefix,
+    timezone: Option<String>,
+    changing_icon: bool,
+    data_refresh_interval_millis: u64,
+    last_state: TimeOutput,
+    last_updated: Instant,
+}
+
+impl Time {
+    fn output(&mut self) -> TimeOutput {
+        let mut output = self.last_state.clone();
+        let now = Instant::now();
+
+        if now.duration_since(self.last_updated)
+            > Duration::from_millis(self.data_refresh_interval_millis)
+        {
+            let (formatted, current_time) = match &self.timezone {
+                Some(timezone) => match timezone.parse::<Tz>() {
+                    Ok(tz) => {
+                        let dt = Local::now().with_timezone(&tz);
+                        (
+                            dt.format(&self.format.fmt_string())
+                                .to_string()
+                                .trim()
+                                .to_string(),
+                            Some(dt.time()),
+                        )
+                    }
+                    Err(_) => (format!("Invalid timezone: {:?}", timezone), None),
+                },
+                None => {
+                    let dt = Local::now();
+                    (
+                        dt.format(&self.format.fmt_string())
+                            .to_string()
+                            .trim()
+                            .to_string(),
+                        Some(dt.time()),
+                    )
+                }
+            };
+
+            if current_time.is_none() {
+                return TimeOutput {
+                    label: formatted,
+                    icon: egui_phosphor::regular::WARNING_CIRCLE.to_string(),
+                };
+            }
+
+            let current_range = match &self.changing_icon {
+                true => TIME_RANGES
+                    .iter()
+                    .rev()
+                    .find(|&(_, start)| current_time.unwrap() > *start)
+                    .cloned(),
+                false => None,
+            }
+            .unwrap_or((egui_phosphor::regular::CLOCK, NaiveTime::default()));
+
+            output = TimeOutput {
+                label: formatted,
+                icon: current_range.0.to_string(),
+            };
+
+            self.last_state.clone_from(&output);
+            self.last_updated = now;
+        }
+
+        output
+    }
+
+    fn paint_binary_circle(
+        &mut self,
+        size: f32,
+        number: u32,
+        max_power: usize,
+        ctx: &Context,
+        ui: &mut Ui,
+    ) {
+        let full_height = size;
+        let height = full_height / 4.0;
+        let width = height;
+        let offset = height / 2.0 - height / 8.0;
+
+        let (response, painter) =
+            ui.allocate_painter(Vec2::new(width, full_height + offset * 2.0), Sense::hover());
+        let color = ctx.style().visuals.text_color();
+
+        let c = response.rect.center();
+        let r = height / 2.0 - 0.5;
+
+        if number == 1 || number == 3 || number == 5 || number == 7 || number == 9 {
+            painter.circle_filled(c + Vec2::new(0.0, height * 1.50 + offset), r, color);
+        } else {
+            painter.circle_filled(c + Vec2::new(0.0, height * 1.50 + offset), r / 2.5, color);
+        }
+
+        if number == 2 || number == 3 || number == 6 || number == 7 {
+            painter.circle_filled(c + Vec2::new(0.0, height * 0.50 + offset), r, color);
+        } else {
+            painter.circle_filled(c + Vec2::new(0.0, height * 0.50 + offset), r / 2.5, color);
+        }
+
+        if number == 4 || number == 5 || number == 6 || number == 7 {
+            painter.circle_filled(c + Vec2::new(0.0, -height * 0.50 + offset), r, color);
+        } else if max_power > 2 {
+            painter.circle_filled(c + Vec2::new(0.0, -height * 0.50 + offset), r / 2.5, color);
+        }
+
+        if number == 8 || number == 9 {
+            painter.circle_filled(c + Vec2::new(0.0, -height * 1.50 + offset), r, color);
+        } else if max_power > 3 {
+            painter.circle_filled(c + Vec2::new(0.0, -height * 1.50 + offset), r / 2.5, color);
+        }
+    }
+
+    fn paint_binary_rect(
+        &mut self,
+        size: f32,
+        number: u32,
+        max_power: usize,
+        ctx: &Context,
+        ui: &mut Ui,
+    ) {
+        let full_height = size;
+        let height = full_height / 4.0;
+        let width = height * 1.5;
+        let offset = height / 2.0 - height / 8.0;
+
+        let (response, painter) =
+            ui.allocate_painter(Vec2::new(width, full_height + offset * 2.0), Sense::hover());
+        let color = ctx.style().visuals.text_color();
+        let stroke = Stroke::new(1.0, color);
+
+        let round_all = CornerRadius::same((response.rect.width() * 0.1) as u8);
+        let round_top = CornerRadius {
+            nw: round_all.nw,
+            ne: round_all.ne,
+            ..Default::default()
+        };
+        let round_none = CornerRadius::ZERO;
+        let round_bottom = CornerRadius {
+            sw: round_all.nw,
+            se: round_all.ne,
+            ..Default::default()
+        };
+
+        if max_power == 2 {
+            let mut rect = response
+                .rect
+                .shrink2(Vec2::new(stroke.width, stroke.width + offset));
+            rect.set_height(rect.height() - height * 2.0);
+            rect = rect.translate(Vec2::new(0.0, height * 2.0 + offset));
+            painter.rect_stroke(rect, round_all, stroke, StrokeKind::Outside);
+        } else if max_power == 3 {
+            let mut rect = response
+                .rect
+                .shrink2(Vec2::new(stroke.width, stroke.width + offset));
+            rect.set_height(rect.height() - height);
+            rect = rect.translate(Vec2::new(0.0, height + offset));
+            painter.rect_stroke(rect, round_all, stroke, StrokeKind::Outside);
+        } else {
+            let mut rect = response
+                .rect
+                .shrink2(Vec2::new(stroke.width, stroke.width + offset));
+            rect = rect.translate(Vec2::new(0.0, 0.0 + offset));
+            painter.rect_stroke(rect, round_all, stroke, StrokeKind::Outside);
+        }
+
+        let mut rect_bin = response.rect;
+        rect_bin.set_width(width);
+
+        if number == 1 || number == 5 || number == 9 {
+            rect_bin.set_height(height);
+            painter.rect_filled(
+                rect_bin.translate(Vec2::new(stroke.width, height * 3.0 + offset * 2.0)),
+                round_bottom,
+                color,
+            );
+        }
+        if number == 2 {
+            rect_bin.set_height(height);
+            painter.rect_filled(
+                rect_bin.translate(Vec2::new(stroke.width, height * 2.0 + offset * 2.0)),
+                if max_power == 2 {
+                    round_top
+                } else {
+                    round_none
+                },
+                color,
+            );
+        }
+        if number == 3 {
+            rect_bin.set_height(height * 2.0);
+            painter.rect_filled(
+                rect_bin.translate(Vec2::new(stroke.width, height * 2.0 + offset * 2.0)),
+                round_bottom,
+                color,
+            );
+        }
+        if number == 4 || number == 5 {
+            rect_bin.set_height(height);
+            painter.rect_filled(
+                rect_bin.translate(Vec2::new(stroke.width, height * 1.0 + offset * 2.0)),
+                if max_power == 3 {
+                    round_top
+                } else {
+                    round_none
+                },
+                color,
+            );
+        }
+        if number == 6 {
+            rect_bin.set_height(height * 2.0);
+            painter.rect_filled(
+                rect_bin.translate(Vec2::new(stroke.width, height * 1.0 + offset * 2.0)),
+                if max_power == 3 {
+                    round_top
+                } else {
+                    round_none
+                },
+                color,
+            );
+        }
+        if number == 7 {
+            rect_bin.set_height(height * 3.0);
+            painter.rect_filled(
+                rect_bin.translate(Vec2::new(stroke.width, height + offset * 2.0)),
+                if max_power == 3 {
+                    round_all
+                } else {
+                    round_bottom
+                },
+                color,
+            );
+        }
+        if number == 8 || number == 9 {
+            rect_bin.set_height(height);
+            painter.rect_filled(
+                rect_bin.translate(Vec2::new(stroke.width, 0.0 + offset * 2.0)),
+                round_top,
+                color,
+            );
+        }
+    }
+}
+
+impl BarWidget for Time {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        if self.enable {
+            let mut output = self.output();
+            if !output.label.is_empty() {
+                let use_binary_circle = output.label.starts_with('c');
+                let use_binary_rectangle = output.label.starts_with('r');
+
+                let mut layout_job = LayoutJob::simple(
+                    match self.label_prefix {
+                        LabelPrefix::Icon | LabelPrefix::IconAndText => output.icon,
+                        LabelPrefix::None | LabelPrefix::Text => String::new(),
+                    },
+                    config.icon_font_id.clone(),
+                    ctx.style().visuals.selection.stroke.color,
+                    100.0,
+                );
+
+                if let LabelPrefix::Text | LabelPrefix::IconAndText = self.label_prefix {
+                    output.label.insert_str(0, "TIME: ");
+                }
+
+                if !use_binary_circle && !use_binary_rectangle {
+                    layout_job.append(
+                        &output.label,
+                        10.0,
+                        TextFormat {
+                            font_id: config.text_font_id.clone(),
+                            color: ctx.style().visuals.text_color(),
+                            valign: Align::Center,
+                            ..Default::default()
+                        },
+                    );
+                }
+
+                let font_id = config.icon_font_id.clone();
+                let is_reversed = matches!(config.alignment, Some(Alignment::Right));
+
+                config.apply_on_widget(false, ui, |ui| {
+                    if SelectableFrame::new(false)
+                        .show(ui, |ui| {
+                            if !is_reversed {
+                                ui.add(Label::new(layout_job.clone()).selectable(false));
+                            }
+
+                            if use_binary_circle || use_binary_rectangle {
+                                let ordered_output = if is_reversed {
+                                    output.label.chars().rev().collect()
+                                } else {
+                                    output.label
+                                };
+
+                                for (section_index, section) in
+                                    ordered_output.split(':').enumerate()
+                                {
+                                    ui.scope(|ui| {
+                                        ui.spacing_mut().item_spacing = Vec2::splat(2.0);
+                                        for (number_index, number_char) in
+                                            section.chars().enumerate()
+                                        {
+                                            if let Some(number) = number_char.to_digit(10) {
+                                                // the hour is the second char in the first section (in reverse, it's in the last section)
+                                                let max_power = match (
+                                                    is_reversed,
+                                                    section_index,
+                                                    number_index,
+                                                ) {
+                                                    (true, 2, 1) | (false, 0, 1) => 2,
+                                                    (true, _, 1) | (false, _, 0) => 3,
+                                                    _ => 4,
+                                                };
+
+                                                if use_binary_circle {
+                                                    self.paint_binary_circle(
+                                                        font_id.size,
+                                                        number,
+                                                        max_power,
+                                                        ctx,
+                                                        ui,
+                                                    );
+                                                } else if use_binary_rectangle {
+                                                    self.paint_binary_rect(
+                                                        font_id.size,
+                                                        number,
+                                                        max_power,
+                                                        ctx,
+                                                        ui,
+                                                    );
+                                                }
+                                            }
+                                        }
+                                    });
+                                }
+                            }
+
+                            if is_reversed {
+                                ui.add(Label::new(layout_job.clone()).selectable(false));
+                            }
+                        })
+                        .clicked()
+                    {
+                        self.format.toggle()
+                    }
+                });
+            }
+        }
+    }
+}

komorebi-bar/src/widgets/update.rs

@@ -0,0 +1,158 @@
+use crate::config::LabelPrefix;
+use crate::render::RenderConfig;
+use crate::selected_frame::SelectableFrame;
+use crate::widgets::widget::BarWidget;
+use eframe::egui::text::LayoutJob;
+use eframe::egui::Align;
+use eframe::egui::Context;
+use eframe::egui::Label;
+use eframe::egui::TextFormat;
+use eframe::egui::Ui;
+use serde::Deserialize;
+use serde::Serialize;
+use std::process::Command;
+use std::time::Duration;
+use std::time::Instant;
+
+#[derive(Copy, Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub struct UpdateConfig {
+    /// Enable the Update widget
+    pub enable: bool,
+    /// Data refresh interval (default: 12 hours)
+    pub data_refresh_interval: Option<u64>,
+    /// Display label prefix
+    pub label_prefix: Option<LabelPrefix>,
+}
+
+impl From<UpdateConfig> for Update {
+    fn from(value: UpdateConfig) -> Self {
+        let data_refresh_interval = value.data_refresh_interval.unwrap_or(12);
+
+        let mut latest_version = String::new();
+
+        let client = reqwest::blocking::Client::new();
+        if let Ok(response) = client
+            .get("https://api.github.com/repos/LGUG2Z/komorebi/releases/latest")
+            .header("User-Agent", "komorebi-bar-version-checker")
+            .send()
+        {
+            #[derive(Deserialize)]
+            struct Release {
+                tag_name: String,
+            }
+
+            if let Ok(release) =
+                serde_json::from_str::<Release>(&response.text().unwrap_or_default())
+            {
+                let trimmed = release.tag_name.trim_start_matches("v");
+                latest_version = trimmed.to_string();
+            }
+        }
+
+        Self {
+            enable: value.enable,
+            data_refresh_interval,
+            installed_version: env!("CARGO_PKG_VERSION").to_string(),
+            latest_version,
+            label_prefix: value.label_prefix.unwrap_or(LabelPrefix::IconAndText),
+            last_updated: Instant::now()
+                .checked_sub(Duration::from_secs(data_refresh_interval))
+                .unwrap(),
+        }
+    }
+}
+
+pub struct Update {
+    pub enable: bool,
+    data_refresh_interval: u64,
+    installed_version: String,
+    latest_version: String,
+    label_prefix: LabelPrefix,
+    last_updated: Instant,
+}
+
+impl Update {
+    fn output(&mut self) -> String {
+        let now = Instant::now();
+        if now.duration_since(self.last_updated)
+            > Duration::from_secs((self.data_refresh_interval * 60) * 60)
+        {
+            let client = reqwest::blocking::Client::new();
+            if let Ok(response) = client
+                .get("https://api.github.com/repos/LGUG2Z/komorebi/releases/latest")
+                .header("User-Agent", "komorebi-bar-version-checker")
+                .send()
+            {
+                #[derive(Deserialize)]
+                struct Release {
+                    tag_name: String,
+                }
+
+                if let Ok(release) =
+                    serde_json::from_str::<Release>(&response.text().unwrap_or_default())
+                {
+                    let trimmed = release.tag_name.trim_start_matches("v");
+                    self.latest_version = trimmed.to_string();
+                }
+            }
+
+            self.last_updated = now;
+        }
+
+        if self.latest_version > self.installed_version {
+            format!("Update available! v{}", self.latest_version)
+        } else {
+            String::new()
+        }
+    }
+}
+
+impl BarWidget for Update {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig) {
+        if self.enable {
+            let output = self.output();
+            if !output.is_empty() {
+                let mut layout_job = LayoutJob::simple(
+                    match self.label_prefix {
+                        LabelPrefix::Icon | LabelPrefix::IconAndText => {
+                            egui_phosphor::regular::ROCKET_LAUNCH.to_string()
+                        }
+                        LabelPrefix::None | LabelPrefix::Text => String::new(),
+                    },
+                    config.icon_font_id.clone(),
+                    ctx.style().visuals.selection.stroke.color,
+                    100.0,
+                );
+
+                layout_job.append(
+                    &output,
+                    10.0,
+                    TextFormat {
+                        font_id: config.text_font_id.clone(),
+                        color: ctx.style().visuals.text_color(),
+                        valign: Align::Center,
+                        ..Default::default()
+                    },
+                );
+
+                config.apply_on_widget(false, ui, |ui| {
+                    if SelectableFrame::new(false)
+                        .show(ui, |ui| ui.add(Label::new(layout_job).selectable(false)))
+                        .clicked()
+                    {
+                        if let Err(error) = Command::new("explorer.exe")
+                            .args([format!(
+                                "https://github.com/LGUG2Z/komorebi/releases/v{}",
+                                self.latest_version
+                            )])
+                            .spawn()
+                        {
+                            eprintln!("{}", error)
+                        }
+                    }
+                });
+            }
+        }
+    }
+}

komorebi-bar/src/widgets/widget.rs

@@ -0,0 +1,89 @@
+use crate::render::RenderConfig;
+use crate::widgets::battery::Battery;
+use crate::widgets::battery::BatteryConfig;
+use crate::widgets::cpu::Cpu;
+use crate::widgets::cpu::CpuConfig;
+use crate::widgets::date::Date;
+use crate::widgets::date::DateConfig;
+use crate::widgets::keyboard::Keyboard;
+use crate::widgets::keyboard::KeyboardConfig;
+use crate::widgets::komorebi::Komorebi;
+use crate::widgets::komorebi::KomorebiConfig;
+use crate::widgets::media::Media;
+use crate::widgets::media::MediaConfig;
+use crate::widgets::memory::Memory;
+use crate::widgets::memory::MemoryConfig;
+use crate::widgets::network::Network;
+use crate::widgets::network::NetworkConfig;
+use crate::widgets::storage::Storage;
+use crate::widgets::storage::StorageConfig;
+use crate::widgets::time::Time;
+use crate::widgets::time::TimeConfig;
+use crate::widgets::update::Update;
+use crate::widgets::update::UpdateConfig;
+use eframe::egui::Context;
+use eframe::egui::Ui;
+use serde::Deserialize;
+use serde::Serialize;
+
+pub trait BarWidget {
+    fn render(&mut self, ctx: &Context, ui: &mut Ui, config: &mut RenderConfig);
+}
+
+#[derive(Clone, Debug, Serialize, Deserialize)]
+#[cfg_attr(feature = "schemars", derive(schemars::JsonSchema))]
+pub enum WidgetConfig {
+    Battery(BatteryConfig),
+    Cpu(CpuConfig),
+    Date(DateConfig),
+    Keyboard(KeyboardConfig),
+    Komorebi(KomorebiConfig),
+    Media(MediaConfig),
+    Memory(MemoryConfig),
+    Network(NetworkConfig),
+    Storage(StorageConfig),
+    Time(TimeConfig),
+    Update(UpdateConfig),
+}
+
+impl WidgetConfig {
+    pub fn as_boxed_bar_widget(&self) -> Box<dyn BarWidget> {
+        match self {
+            WidgetConfig::Battery(config) => Box::new(Battery::from(*config)),
+            WidgetConfig::Cpu(config) => Box::new(Cpu::from(*config)),
+            WidgetConfig::Date(config) => Box::new(Date::from(config.clone())),
+            WidgetConfig::Keyboard(config) => Box::new(Keyboard::from(*config)),
+            WidgetConfig::Komorebi(config) => Box::new(Komorebi::from(config)),
+            WidgetConfig::Media(config) => Box::new(Media::from(*config)),
+            WidgetConfig::Memory(config) => Box::new(Memory::from(*config)),
+            WidgetConfig::Network(config) => Box::new(Network::from(*config)),
+            WidgetConfig::Storage(config) => Box::new(Storage::from(*config)),
+            WidgetConfig::Time(config) => Box::new(Time::from(config.clone())),
+            WidgetConfig::Update(config) => Box::new(Update::from(*config)),
+        }
+    }
+
+    pub fn enabled(&self) -> bool {
+        match self {
+            WidgetConfig::Battery(config) => config.enable,
+            WidgetConfig::Cpu(config) => config.enable,
+            WidgetConfig::Date(config) => config.enable,
+            WidgetConfig::Keyboard(config) => config.enable,
+            WidgetConfig::Komorebi(config) => {
+                config.workspaces.as_ref().is_some_and(|w| w.enable)
+                    || config.layout.as_ref().is_some_and(|w| w.enable)
+                    || config.focused_window.as_ref().is_some_and(|w| w.enable)
+                    || config
+                        .configuration_switcher
+                        .as_ref()
+                        .is_some_and(|w| w.enable)
+            }
+            WidgetConfig::Media(config) => config.enable,
+            WidgetConfig::Memory(config) => config.enable,
+            WidgetConfig::Network(config) => config.enable,
+            WidgetConfig::Storage(config) => config.enable,
+            WidgetConfig::Time(config) => config.enable,
+            WidgetConfig::Update(config) => config.enable,
+        }
+    }
+}