toggle

crates/ascend/src/pages/wall.rs

@@ -43,6 +43,7 @@ use crate::models::HoldRole;
 use leptos::Params;
 use leptos::prelude::*;
 use leptos_router::params::Params;
+use web_sys::MouseEvent;
 
 #[derive(Params, PartialEq, Clone)]
 struct RouteParams {
@@ -91,9 +92,11 @@ pub fn Wall() -> impl IntoView {
         None => {}
     });
 
-    let ui_is_flash = RwSignal::new(false);
+    let (attempt_today, set_attempt_today) = signal(None);
-    let ui_is_send = RwSignal::new(false);
+
-    let ui_is_attempt = RwSignal::new(false);
+    let ui_is_flash = Signal::derive(move || matches!(attempt_today.get(), Some(models::Attempt::Flash)));
+    let ui_is_send = Signal::derive(move || matches!(attempt_today.get(), Some(models::Attempt::Send)));
+    let ui_is_attempt = Signal::derive(move || matches!(attempt_today.get(), Some(models::Attempt::Attempt)));
     let ui_is_favorite = RwSignal::new(false);
 
     // On reception of user interaction state, set UI signals
@@ -127,6 +130,27 @@ pub fn Wall() -> impl IntoView {
         ],
     };
 
+    // onclick handler helper
+    let set_or_deselect = |s: WriteSignal<Option<models::Attempt>>, v: models::Attempt| {
+        s.update(|s| match s {
+            Some(x) if *x == v => {
+                *s = None;
+            }
+            _ => {
+                *s = Some(v);
+            }
+        });
+    };
+    let onclick_flash = move |_| {
+        set_or_deselect(set_attempt_today, models::Attempt::Flash);
+    };
+    let onclick_send = move |_| {
+        set_or_deselect(set_attempt_today, models::Attempt::Send);
+    };
+    let onclick_attempt = move |_| {
+        set_or_deselect(set_attempt_today, models::Attempt::Attempt);
+    };
+
     leptos::view! {
         <div class="min-h-screen min-w-screen bg-neutral-950">
             <StyledHeader items=Signal::derive(header_items) />
@@ -176,6 +200,9 @@ pub fn Wall() -> impl IntoView {
                                         flash=ui_is_flash
                                         send=ui_is_send
                                         attempt=ui_is_attempt
+                                        onclick_flash
+                                        onclick_send
+                                        onclick_attempt
                                     />
 
                                     <Separator />
@@ -236,18 +263,20 @@ pub fn Wall() -> impl IntoView {
 
 #[component]
 #[tracing::instrument(skip_all)]
-fn AttemptRadio(#[prop(into)] flash: RwSignal<bool>, #[prop(into)] send: RwSignal<bool>, #[prop(into)] attempt: RwSignal<bool>) -> impl IntoView {
+fn AttemptRadio(
+    #[prop(into)] flash: Signal<bool>,
+    #[prop(into)] send: Signal<bool>,
+    #[prop(into)] attempt: Signal<bool>,
+    onclick_flash: impl FnMut(MouseEvent) + 'static,
+    onclick_send: impl FnMut(MouseEvent) + 'static,
+    onclick_attempt: impl FnMut(MouseEvent) + 'static,
+) -> impl IntoView {
     tracing::debug!("Enter");
 
     view! {
         <div class="flex flex-row justify-evenly md:flex-col 2xl:flex-row">
             <Button
-                onclick=move |_| {
+                onclick=onclick_flash
-                    flash
-                        .update(|x| {
-                            *x = !*x;
-                        });
-                }
                 text="Flash"
                 icon=Icon::BoltSolid
                 color=Gradient::CyanBlue
@@ -255,11 +284,7 @@ fn AttemptRadio(#[prop(into)] flash: RwSignal<bool>, #[prop(into)] send: RwSigna
             />
 
             <Button
-                onclick=move |_| {
+                onclick=onclick_send
-                    send.update(|x| {
-                        *x = !*x;
-                    });
-                }
                 text="Send"
                 icon=Icon::Trophy
                 color=Gradient::TealLime
@@ -267,12 +292,7 @@ fn AttemptRadio(#[prop(into)] flash: RwSignal<bool>, #[prop(into)] send: RwSigna
             />
 
             <Button
-                onclick=move |_| {
+                onclick=onclick_attempt
-                    attempt
-                        .update(|x| {
-                            *x = !*x;
-                        });
-                }
                 text="Attempt"
                 icon=Icon::ArrowTrendingUp
                 color=Gradient::PinkOrange