Compare commits

...

6 Commits

Author SHA1 Message Date
spinline
80f9e5cda2 fix: resolve race condition in ButtonAction using a generation counter for safety
All checks were successful
Build MIPS Binary / build (push) Successful in 1m52s
2026-02-13 13:50:47 +03:00
spinline
a12265573c fix: resolve type mismatch between Mouse and Touch events in ButtonAction
All checks were successful
Build MIPS Binary / build (push) Successful in 1m51s
2026-02-13 13:44:15 +03:00
spinline
e45ec46793 feat: replace legacy hold-to-delete logic with modern ButtonAction component
Some checks failed
Build MIPS Binary / build (push) Failing after 34s
2026-02-13 13:41:46 +03:00
spinline
0e075d6092 feat: implement high-performance CSS-based ButtonAction component
Some checks failed
Build MIPS Binary / build (push) Failing after 34s
2026-02-13 13:39:53 +03:00
spinline
dbbc722f50 perf: refactor hold-to-action animation using CSS for silky-smooth performance
Some checks failed
Build MIPS Binary / build (push) Failing after 35s
2026-02-13 13:32:40 +03:00
spinline
dd3b3f3504 fix: resolve all compilation errors in push notification logic and stabilize UI components
All checks were successful
Build MIPS Binary / build (push) Successful in 1m51s
2026-02-13 13:26:22 +03:00
7 changed files with 184 additions and 181 deletions

View File

@@ -1,5 +1,9 @@
use leptos::prelude::*;
use crate::components::ui::context_menu::*;
use crate::components::ui::context_menu::{
ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger,
};
use crate::components::ui::button_action::ButtonAction;
use crate::components::ui::button::ButtonVariant;
#[component]
pub fn TorrentContextMenu(
@@ -7,72 +11,55 @@ pub fn TorrentContextMenu(
torrent_hash: String,
on_action: Callback<(String, String)>,
) -> impl IntoView {
let hash = StoredValue::new(torrent_hash);
let hash_c1 = torrent_hash.clone();
let hash_c2 = torrent_hash.clone();
let hash_c3 = torrent_hash.clone();
let hash_c4 = torrent_hash.clone();
let menu_action = move |action: &'static str| {
on_action.run((action.to_string(), hash.get_value()));
};
let on_action_stored = StoredValue::new(on_action);
view! {
<ContextMenu>
<ContextMenuTrigger>
{children()}
</ContextMenuTrigger>
<ContextMenuContent class="w-56">
<ContextMenuAction
class="px-2 py-1.5 hover:bg-accent hover:text-accent-foreground rounded-sm"
on:click=move |_| menu_action("start")
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="mr-2 h-4 w-4 opacity-70">
<path stroke-linecap="round" stroke-linejoin="round" d="M5.25 5.653c0-.856.917-1.398 1.667-.986l11.54 6.348a1.125 1.125 0 010 1.971l-11.54 6.347a1.125 1.125 0 01-1.667-.985V5.653z" />
</svg>
"Start"
</ContextMenuAction>
<ContextMenuContent class="w-56 p-1.5">
<ContextMenuItem on:click={let h = hash_c1; move |_| on_action_stored.get_value().run(("start".to_string(), h.clone()))}>
"Başlat"
</ContextMenuItem>
<ContextMenuItem on:click={let h = hash_c2; move |_| on_action_stored.get_value().run(("stop".to_string(), h.clone()))}>
"Durdur"
</ContextMenuItem>
<div class="my-1.5 h-px bg-border/50" />
// --- Modern Hold-to-Action Buttons ---
<div class="space-y-1">
<ButtonAction
variant=ButtonVariant::Ghost
class="w-full justify-start h-8 px-2 text-xs text-destructive hover:bg-destructive/10 hover:text-destructive transition-none"
hold_duration=800
on_action={let h = hash_c3; move || {
on_action_stored.get_value().run(("delete".to_string(), h.clone()));
crate::components::ui::context_menu::close_context_menu();
}}
>
"Sil (Basılı Tut)"
</ButtonAction>
<ContextMenuAction
class="px-2 py-1.5 hover:bg-accent hover:text-accent-foreground rounded-sm"
on:click=move |_| menu_action("stop")
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="mr-2 h-4 w-4 opacity-70">
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 5.25v13.5m-7.5-13.5v13.5" />
</svg>
"Stop"
</ContextMenuAction>
<ContextMenuAction
class="px-2 py-1.5 hover:bg-accent hover:text-accent-foreground rounded-sm"
on:click=move |_| menu_action("recheck")
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="mr-2 h-4 w-4 opacity-70">
<path stroke-linecap="round" stroke-linejoin="round" d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0l3.181 3.183a8.25 8.25 0 0013.803-3.7M4.031 9.865a8.25 8.25 0 0113.803-3.7l3.181 3.182m0-4.991v4.99" />
</svg>
"Recheck"
</ContextMenuAction>
<div class="-mx-1 my-1 h-px bg-border" />
<ContextMenuAction
class="px-2 py-1.5 text-destructive hover:bg-destructive/10 hover:text-destructive rounded-sm"
on:click=move |_| menu_action("delete")
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="mr-2 h-4 w-4 opacity-70">
<path stroke-linecap="round" stroke-linejoin="round" d="M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.164h-2.34c-1.18 0-2.09.984-2.09 2.164v.916m7.5 0a48.667 48.667 0 00-7.5 0" />
</svg>
"Remove"
</ContextMenuAction>
<ContextMenuHoldAction
class="text-destructive hover:bg-destructive/10 hover:text-destructive"
on_hold_complete=move |_| menu_action("delete_with_data")
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="mr-2 h-4 w-4 opacity-70">
<path stroke-linecap="round" stroke-linejoin="round" d="M20.25 7.5l-.625 10.632a2.25 2.25 0 01-2.247 2.118H6.622a2.25 2.25 0 01-2.247-2.118L3.75 7.5m6 4.125l2.25 2.25m0 0l2.25 2.25M12 13.875l2.25-2.25M12 13.875l-2.25-2.25M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125z" />
</svg>
"Remove with Data"
<span class="ml-auto text-[10px] opacity-50">"Hold"</span>
</ContextMenuHoldAction>
<ButtonAction
variant=ButtonVariant::Destructive
class="w-full justify-start h-8 px-2 text-xs font-bold"
hold_duration=1200
on_action={let h = hash_c4; move || {
on_action_stored.get_value().run(("delete_with_data".to_string(), h.clone()));
crate::components::ui::context_menu::close_context_menu();
}}
>
"Verilerle Sil (Basılı Tut)"
</ButtonAction>
</div>
</ContextMenuContent>
</ContextMenu>
}
}
}

View File

@@ -146,48 +146,50 @@ pub fn Sidebar() -> impl IntoView {
</SidenavGroup>
</SidenavContent>
<SidenavFooter class="p-4 space-y-4">
// Push Notification Toggle
<div class="flex items-center justify-between px-2 py-1 bg-muted/20 rounded-md border border-border/50">
<div class="flex flex-col gap-0.5">
<span class="text-[10px] font-bold uppercase tracking-wider text-foreground/70">"Bildirimler"</span>
<span class="text-[9px] text-muted-foreground">"Web Push"</span>
<SidenavFooter>
<div class="flex flex-col gap-4 p-4">
// Push Notification Toggle
<div class="flex items-center justify-between px-2 py-1 bg-muted/20 rounded-md border border-border/50">
<div class="flex flex-col gap-0.5">
<span class="text-[10px] font-bold uppercase tracking-wider text-foreground/70">"Bildirimler"</span>
<span class="text-[9px] text-muted-foreground">"Web Push"</span>
</div>
<Switch
checked=Signal::from(store.push_enabled)
on_checked_change=Callback::new(on_push_toggle)
/>
</div>
<Switch
checked=store.push_enabled.into()
on_checked_change=Callback::new(on_push_toggle)
/>
</div>
<div class="flex items-center gap-3 p-2 rounded-lg border bg-muted/30 shadow-xs overflow-hidden">
<div class="h-8 w-8 rounded-full bg-primary text-primary-foreground flex items-center justify-center text-xs font-medium shrink-0 border border-primary-foreground/10">
{first_letter}
</div>
<div class="flex-1 overflow-hidden">
<div class="font-medium text-[11px] truncate text-foreground leading-tight">{username}</div>
<div class="text-[9px] text-muted-foreground truncate opacity-70">"Yönetici"</div>
</div>
<div class="flex items-center gap-1">
<ThemeToggle />
<div class="flex items-center gap-3 p-2 rounded-lg border bg-muted/30 shadow-xs overflow-hidden">
<div class="h-8 w-8 rounded-full bg-primary text-primary-foreground flex items-center justify-center text-xs font-medium shrink-0 border border-primary-foreground/10">
{first_letter}
</div>
<div class="flex-1 overflow-hidden">
<div class="font-medium text-[11px] truncate text-foreground leading-tight">{username}</div>
<div class="text-[9px] text-muted-foreground truncate opacity-70">"Yönetici"</div>
</div>
<Button
variant=ButtonVariant::Ghost
size=ButtonSize::Icon
class="size-7 text-destructive hover:bg-destructive/10"
on:click=move |_| {
spawn_local(async move {
if shared::server_fns::auth::logout().await.is_ok() {
let window = web_sys::window().expect("window should exist");
let _ = window.location().set_href("/login");
}
});
}
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-4">
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15M12 9l-3 3m0 0l3 3m-3-3h12.75" />
</svg>
</Button>
<div class="flex items-center gap-1">
<ThemeToggle />
<Button
variant=ButtonVariant::Ghost
size=ButtonSize::Icon
class="size-7 text-destructive hover:bg-destructive/10"
on:click=move |_| {
spawn_local(async move {
if shared::server_fns::auth::logout().await.is_ok() {
let window = web_sys::window().expect("window should exist");
let _ = window.location().set_href("/login");
}
});
}
>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-4">
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15M12 9l-3 3m0 0l3 3m-3-3h12.75" />
</svg>
</Button>
</div>
</div>
</div>
</SidenavFooter>

View File

@@ -0,0 +1,72 @@
use leptos::prelude::*;
use tailwind_fuse::tw_merge;
use crate::components::ui::button::{Button, ButtonVariant};
#[component]
pub fn ButtonAction(
children: Children,
#[prop(into)] on_action: Callback<()>,
#[prop(optional, into)] class: String,
#[prop(default = 1000)] hold_duration: u64,
#[prop(default = ButtonVariant::Default)] variant: ButtonVariant,
) -> impl IntoView {
let is_holding = RwSignal::new(false);
let generation = StoredValue::new(0u64);
let on_down = move |_| {
generation.update_value(|g| *g += 1);
is_holding.set(true);
};
let on_up = move |_| is_holding.set(false);
Effect::new(move |_| {
if is_holding.get() {
let current_gen = generation.get_value();
leptos::task::spawn_local(async move {
gloo_timers::future::TimeoutFuture::new(hold_duration as u32).await;
// Double validation: Is user still holding AND is it the SAME hold attempt?
if is_holding.get_untracked() && generation.get_value() == current_gen {
on_action.run(());
is_holding.set(false);
}
});
}
});
let merged_class = move || tw_merge!(
"relative overflow-hidden transition-all active:scale-[0.98]",
class.clone()
);
view! {
<style>
"@keyframes button-hold-progress {
from { width: 0%; }
to { width: 100%; }
}
.animate-button-hold {
animation: button-hold-progress var(--button-hold-duration) linear forwards;
}"
</style>
<Button
variant=variant
class=merged_class()
attr:style=format!("--button-hold-duration: {}ms", hold_duration)
on:mousedown=on_down
on:mouseup=on_up
on:mouseleave=on_up
on:touchstart=move |_| is_holding.set(true)
on:touchend=move |_| is_holding.set(false)
>
// Progress Overlay
<Show when=move || is_holding.get()>
<div class="absolute inset-0 bg-white/20 dark:bg-black/20 pointer-events-none animate-button-hold" />
</Show>
<span class="relative z-10 flex items-center justify-center gap-2">
{children()}
</span>
</Button>
}
}

View File

@@ -78,76 +78,6 @@ pub fn ContextMenuAction(
}
}
#[component]
pub fn ContextMenuHoldAction(
children: Children,
#[prop(into)] on_hold_complete: Callback<()>,
#[prop(optional, into)] class: String,
#[prop(default = 1000)] hold_duration: u64,
) -> impl IntoView {
let is_holding = RwSignal::new(false);
let progress = RwSignal::new(0.0);
let on_mousedown = move |_| {
is_holding.set(true);
progress.set(0.0);
};
let on_mouseup = move |_| {
is_holding.set(false);
progress.set(0.0);
};
Effect::new(move |_| {
if is_holding.get() {
let start_time = js_sys::Date::now();
let duration = hold_duration as f64;
leptos::task::spawn_local(async move {
while is_holding.get_untracked() {
let now = js_sys::Date::now();
let elapsed = now - start_time;
let p = (elapsed / duration).min(1.0);
progress.set(p * 100.0);
if p >= 1.0 {
on_hold_complete.run(());
is_holding.set(false);
close_context_menu();
break;
}
gloo_timers::future::TimeoutFuture::new(16).await; // ~60fps
}
});
}
});
let class = tw_merge!(
"relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors overflow-hidden",
class
);
view! {
<div
class=class
on:mousedown=on_mousedown
on:mouseup=on_mouseup
on:mouseleave=on_mouseup
on:touchstart=move |_| on_mousedown(web_sys::MouseEvent::new("mousedown").unwrap())
on:touchend=move |_| on_mouseup(web_sys::MouseEvent::new("mouseup").unwrap())
>
// Progress background
<div
class="absolute inset-y-0 left-0 bg-destructive/20 transition-all duration-75 ease-linear pointer-events-none"
style=move || format!("width: {}%;", progress.get())
/>
<span class="relative z-10 flex items-center gap-2 w-full">
{children()}
</span>
</div>
}.into_any()
}
#[derive(Clone)]
struct ContextMenuContext {
target_id: String,
@@ -397,7 +327,7 @@ pub fn ContextMenuContent(
target_id_for_script,
)}
</script>
}.into_any()
}
}
#[component]

View File

@@ -2,6 +2,7 @@ pub mod accordion;
pub mod alert_dialog;
pub mod badge;
pub mod button;
pub mod button_action;
pub mod card;
pub mod checkbox;
pub mod context_menu;

View File

@@ -162,7 +162,7 @@ pub async fn is_push_subscribed() -> Result<bool, String> {
.dyn_into::<web_sys::ServiceWorkerRegistration>()
.map_err(|_| "not a registration")?;
let push_manager = registration.push_manager();
let push_manager = registration.push_manager().map_err(|e| format!("{:?}", e))?;
let subscription = wasm_bindgen_futures::JsFuture::from(push_manager.get_subscription().map_err(|e| format!("{:?}", e))?)
.await
.map_err(|e| format!("{:?}", e))?;
@@ -181,7 +181,8 @@ pub async fn subscribe_to_push_notifications() {
};
// 1. Get Public Key from Backend
let public_key = match shared::server_fns::push::get_push_public_key().await {
let public_key_res: Result<String, _> = shared::server_fns::push::get_public_key().await;
let public_key = match public_key_res {
Ok(key) => key,
Err(e) => { log::error!("Failed to get public key: {:?}", e); return; }
};
@@ -192,25 +193,25 @@ pub async fn subscribe_to_push_notifications() {
// 3. Prepare Options
let mut options = web_sys::PushSubscriptionOptionsInit::new();
options.user_visible_only(true);
options.application_server_key(Some(&key_array.into()));
options.set_user_visible_only(true);
options.set_application_server_key(&key_array.into());
// 4. Subscribe
let push_manager = registration.push_manager();
let push_manager = registration.push_manager().expect("no push manager");
match wasm_bindgen_futures::JsFuture::from(push_manager.subscribe_with_options(&options).expect("subscribe failed")).await {
Ok(subscription) => {
let sub = subscription.dyn_into::<web_sys::PushSubscription>().expect("not a sub");
let json = sub.to_json().expect("sub to json failed");
let sub_js = subscription.clone();
// Extract keys from JSON
let sub_obj: serde_json::Value = serde_wasm_bindgen::from_value(json).expect("serde from value failed");
// Use JS to extract JSON string representation
let json_str = js_sys::JSON::stringify(&sub_js).expect("stringify failed").as_string().expect("not a string");
let sub_obj: serde_json::Value = serde_json::from_str(&json_str).expect("serde from str failed");
let endpoint = sub_obj["endpoint"].as_str().expect("no endpoint").to_string();
let p256dh = sub_obj["keys"]["p256dh"].as_str().expect("no p256dh").to_string();
let auth = sub_obj["keys"]["auth"].as_str().expect("no auth").to_string();
// 5. Save to Backend
match shared::server_fns::push::save_push_subscription(endpoint, p256dh, auth).await {
match shared::server_fns::push::subscribe_push(endpoint, p256dh, auth).await {
Ok(_) => {
log::info!("Push subscription saved successfully");
toast_success("Bildirimler aktif edildi");
@@ -229,7 +230,7 @@ pub async fn unsubscribe_from_push_notifications() {
let registration = wasm_bindgen_futures::JsFuture::from(sw_container.ready().expect("sw not ready")).await
.unwrap().dyn_into::<web_sys::ServiceWorkerRegistration>().unwrap();
let push_manager = registration.push_manager();
let push_manager = registration.push_manager().unwrap();
if let Ok(sub_future) = push_manager.get_subscription() {
if let Ok(subscription) = wasm_bindgen_futures::JsFuture::from(sub_future).await {
if !subscription.is_null() {
@@ -240,7 +241,7 @@ pub async fn unsubscribe_from_push_notifications() {
let _ = wasm_bindgen_futures::JsFuture::from(sub.unsubscribe().unwrap()).await;
// 2. Remove from Backend
let _ = shared::server_fns::push::remove_push_subscription(endpoint).await;
let _ = shared::server_fns::push::unsubscribe_push(endpoint).await;
log::info!("Push subscription removed");
show_toast(NotificationLevel::Info, "Bildirimler kapatıldı");
}

View File

@@ -20,3 +20,13 @@ pub async fn subscribe_push(
.await
.map_err(|e| ServerFnError::new(format!("Failed to save subscription: {}", e)))
}
#[server(UnsubscribePush, "/api/server_fns")]
pub async fn unsubscribe_push(endpoint: String) -> Result<(), ServerFnError> {
let db_ctx = expect_context::<crate::DbContext>();
db_ctx
.db
.remove_push_subscription(&endpoint)
.await
.map_err(|e| ServerFnError::new(format!("Failed to remove subscription: {}", e)))
}