Adds ios workaround that stopped some on:clicks functioning

hiveboardgame · May 21, 2024 · 5dc62b3 · 5dc62b3
1 parent 2fe7ff7
commit 5dc62b3
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 6 deletions.
diff --git a/apis/src/components/layouts/base_layout.rs b/apis/src/components/layouts/base_layout.rs
@@ -9,6 +9,7 @@ use crate::providers::navigation_controller::NavigationControllerSignal;
 use crate::providers::refocus::RefocusSignal;
 use crate::providers::websocket::WebsocketContext;
 use crate::providers::PingSignal;
+use cfg_if::cfg_if;
 use chrono::Utc;
 use hive_lib::GameControl;
 use lazy_static::lazy_static;
@@ -19,6 +20,13 @@ use leptos_use::core::ConnectionReadyState;
 use leptos_use::utils::Pausable;
 use leptos_use::{use_interval_fn, use_media_query, use_window_focus};
 use regex::Regex;
+cfg_if! { if #[cfg(not(feature = "ssr"))] {
+    use leptos_use::utils::IS_IOS;
+    use std::sync::RwLock;
+    use web_sys::js_sys::Function;
+
+    static IOS_WORKAROUND: RwLock<bool> = RwLock::new(false);
+}}
 
 lazy_static! {
     static ref NANOID: Regex =
@@ -58,6 +66,27 @@ pub fn BaseLayout(children: ChildrenFn) -> impl IntoView {
         orientation_vertical,
     });
 
+    //Copied from leptos-use https://github.com/Synphonyte/leptos-use/blob/main/src/on_click_outside.rs#L123-#L144
+    #[cfg(not(feature = "ssr"))]
+    {
+        if *IS_IOS {
+            if let Ok(mut ios_workaround) = IOS_WORKAROUND.write() {
+                if !*ios_workaround {
+                    *ios_workaround = true;
+                    if let Some(body) = document().body() {
+                        let children = body.children();
+                        for i in 0..children.length() {
+                            let _ = children
+                                .get_with_index(i)
+                                .expect("checked index")
+                                .add_event_listener_with_callback("click", &Function::default());
+                        }
+                    }
+                }
+            }
+        }
+    }
+
     let color_scheme_meta = move || {
         if (color_scheme.prefers_dark)() {
             "dark".to_string()

diff --git a/apis/src/components/molecules/hamburger.rs b/apis/src/components/molecules/hamburger.rs
@@ -11,33 +11,32 @@ pub fn Hamburger<T: IntoView>(
     dropdown_style: &'static str,
     content: T,
 ) -> impl IntoView {
-    let children_ref = create_node_ref::<Div>();
+    let target = create_node_ref::<Div>();
     create_effect(move |_| {
         if hamburger_show() {
             let _ = on_click_outside_with_options(
-                children_ref,
+                target,
                 move |_| {
                     hamburger_show.update(|b| *b = false);
                 },
-                OnClickOutsideOptions::default().ignore(["input", "#ignoreChat", "#ignoreButton"]),
+                OnClickOutsideOptions::default().ignore(["input", "#ignoreChat"]),
             );
         }
     });
 
     let children = store_value(children);
 
     view! {
-        <div class=format!("inline-block {extend_tw_classes}")>
+        <div ref=target class=format!("inline-block {extend_tw_classes}")>
             <button
-                id="ignoreButton"
                 on:click=move |_| hamburger_show.update(|b| *b = !*b)
 
                 class=button_style
             >
                 {content}
             </button>
             <Show when=hamburger_show>
-                <div ref=children_ref class=dropdown_style>
+                <div class=dropdown_style>
                     {children()}
                 </div>
             </Show>