fix ci

Author: jetli

crates/yew-hooks/src/hooks/use_permission.rs

@@ -23,7 +23,7 @@ use crate::use_effect_once;
 ///     html! {
 ///         <>
 ///             <b>{ " state: " }</b>
-///             { state.to_string() }
+///             { format!("{state:?}") }
 ///         </>
 ///     }
 /// }
@@ -39,20 +39,20 @@ pub fn use_permission(name: String) -> UseStateHandle<Option<PermissionState>> {
             let state = state.clone();
 
             spawn_local(async move {
-                let permissions = window().navigator().permissions().unwrap();
+                let permissions = window().navigator().permissions().unwrap_throw();
 
                 let obj = Object::new();
-                Reflect::set(&obj, &"name".into(), &name.into()).unwrap();
+                Reflect::set(&obj, &"name".into(), &name.into()).unwrap_throw();
 
-                let fut = JsFuture::from(permissions.query(&obj).unwrap());
-                let stat = PermissionStatus::from(fut.await.unwrap());
+                let fut = JsFuture::from(permissions.query(&obj).unwrap_throw());
+                let stat = PermissionStatus::from(fut.await.unwrap_throw());
 
                 let onchange = {
                     let state = state.clone();
 
                     Closure::wrap(Box::new(move |event: Event| {
                         if let Some(target) = event.target() {
-                            let stat: PermissionStatus = target.dyn_into().unwrap();
+                            let stat: PermissionStatus = target.dyn_into().unwrap_throw();
 
                             state.set(Some(stat.state()));
                         }

examples/yew-app/src/app/home.rs

@@ -91,6 +91,7 @@ pub fn home() -> Html {
                         <li><Link<AppRoute> to={AppRoute::UseSwipe} classes="text-emerald-800 underline" >{ "use_swipe" }</Link<AppRoute>> { " - detects swipe based on TouchEvent." }</li>
                         <li><Link<AppRoute> to={AppRoute::UseVisible} classes="text-emerald-800 underline" >{ "use_visible" }</Link<AppRoute>> { " - checks if an element is visible." }</li>
                         <li><Link<AppRoute> to={AppRoute::UseHovered} classes="text-emerald-800 underline" >{ "use_hovered" }</Link<AppRoute>> { " - checks if an element is being hovered." }</li>
+                        <li><Link<AppRoute> to={AppRoute::UsePermission} classes="text-emerald-800 underline" >{ "use_permisson" }</Link<AppRoute>> { " - tracks browser's permission changes using the Permissions API." }</li>
                     </ul>
 
                     <h2 class="text-2xl font-bold">{ "UI" }</h2>

examples/yew-app/src/app/hooks/mod.rs

@@ -31,6 +31,7 @@ mod use_measure;
 mod use_media;
 mod use_mount;
 mod use_mut_latest;
+mod use_permission;
 mod use_previous;
 mod use_queue;
 mod use_raf;
@@ -90,6 +91,7 @@ pub use use_measure::*;
 pub use use_media::*;
 pub use use_mount::*;
 pub use use_mut_latest::*;
+pub use use_permission::*;
 pub use use_previous::*;
 pub use use_queue::*;
 pub use use_raf::*;

examples/yew-app/src/app/hooks/use_permission.rs

@@ -0,0 +1,21 @@
+use yew::prelude::*;
+use yew_hooks::prelude::*;
+
+/// `use_permission` demo
+#[function_component]
+pub fn UsePermission() -> Html {
+    let state = use_permission("notifications".to_owned());
+
+    html! {
+        <div class="container">
+            <header class="mt-24 text-xl text-center">
+                <div class="space-x-4 space-y-4">
+                    <p>
+                        <b>{ "state: " }</b>
+                        { format!("{state:?}") }
+                    </p>
+                </div>
+            </header>
+        </div>
+    }
+}

examples/yew-app/src/app/mod.rs

@@ -131,6 +131,8 @@ pub enum AppRoute {
     UseVisible,
     #[at("/use_hovered")]
     UseHovered,
+    #[at("/use_permission")]
+    UsePermission,
     #[not_found]
     #[at("/page-not-found")]
     PageNotFound,
@@ -201,6 +203,7 @@ pub fn switch(routes: AppRoute) -> Html {
         AppRoute::UseInfiniteScroll => html! { <UseInfiniteScroll /> },
         AppRoute::UseVisible => html! { <UseVisible /> },
         AppRoute::UseHovered => html! { <UseHovered /> },
+        AppRoute::UsePermission => html! { <UsePermission /> },
         AppRoute::PageNotFound => html! { <Home /> },
     }
 }