feat(ui): persist theme selection in local storage
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
use leptos::*;
|
||||
use wasm_bindgen::JsCast;
|
||||
use shared::GlobalLimitRequest;
|
||||
use wasm_bindgen::JsCast;
|
||||
|
||||
fn format_bytes(bytes: i64) -> String {
|
||||
const UNITS: [&str; 6] = ["B", "KB", "MB", "GB", "TB", "PB"];
|
||||
@@ -27,6 +27,24 @@ pub fn StatusBar() -> impl IntoView {
|
||||
let store = use_context::<crate::store::TorrentStore>().expect("store not provided");
|
||||
let stats = store.global_stats;
|
||||
|
||||
let (current_theme, set_current_theme) = create_signal("light".to_string());
|
||||
|
||||
create_effect(move |_| {
|
||||
if let Some(win) = web_sys::window() {
|
||||
if let Some(storage) = win.local_storage().ok().flatten() {
|
||||
if let Ok(Some(stored_theme)) = storage.get_item("vibetorrent_theme") {
|
||||
set_current_theme.set(stored_theme.clone());
|
||||
if let Some(doc) = win.document() {
|
||||
let _ = doc
|
||||
.document_element()
|
||||
.unwrap()
|
||||
.set_attribute("data-theme", &stored_theme);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Preset limits in bytes/s
|
||||
let limits: Vec<(i64, &str)> = vec![
|
||||
(0, "Unlimited"),
|
||||
@@ -83,7 +101,9 @@ pub fn StatusBar() -> impl IntoView {
|
||||
let close_dropdown = move || {
|
||||
if let Some(doc) = web_sys::window().and_then(|w| w.document()) {
|
||||
if let Some(active) = doc.active_element() {
|
||||
let _ = active.dyn_into::<web_sys::HtmlElement>().map(|el| el.blur());
|
||||
let _ = active
|
||||
.dyn_into::<web_sys::HtmlElement>()
|
||||
.map(|el| el.blur());
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -93,7 +113,9 @@ pub fn StatusBar() -> impl IntoView {
|
||||
if let Some(doc) = web_sys::window().and_then(|w| w.document()) {
|
||||
if let Some(active) = doc.active_element() {
|
||||
// If something is focused, blur it to close dropdowns
|
||||
let _ = active.dyn_into::<web_sys::HtmlElement>().map(|el| el.blur());
|
||||
let _ = active
|
||||
.dyn_into::<web_sys::HtmlElement>()
|
||||
.map(|el| el.blur());
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -240,10 +262,17 @@ pub fn StatusBar() -> impl IntoView {
|
||||
view! {
|
||||
<li>
|
||||
<button
|
||||
class=move || if theme == "dim" { "bg-primary/10 text-primary font-bold text-xs capitalize" } else { "text-xs capitalize" }
|
||||
class=move || if current_theme.get() == theme { "bg-primary/10 text-primary font-bold text-xs capitalize" } else { "text-xs capitalize" }
|
||||
on:click=move |_| {
|
||||
let doc = web_sys::window().unwrap().document().unwrap();
|
||||
set_current_theme.set(theme.to_string());
|
||||
if let Some(win) = web_sys::window() {
|
||||
if let Some(doc) = win.document() {
|
||||
let _ = doc.document_element().unwrap().set_attribute("data-theme", theme);
|
||||
}
|
||||
if let Some(storage) = win.local_storage().ok().flatten() {
|
||||
let _ = storage.set_item("vibetorrent_theme", theme);
|
||||
}
|
||||
}
|
||||
close();
|
||||
}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user