How to implement automatic reconnection for WebSocket?

[callmeitachi]

Below is my WebSocket reconnection code implemented with a loop.
Is this approach suboptimal? Are there alternative methods?:

    use gloo_net::websocket::{futures::WebSocket,Message, WebSocketError};
    use wasm_bindgen_futures::spawn_local;
   use futures::{SinkExt,StreamExt};
   use leptos::{prelude::*, reactive::{graph::ReactiveNode, signal}};
  #[component]
  pub fn WebSocketComponent() -> impl IntoView {
     let (status,set_status)=signal("".to_string());
     Effect::new(move |_| {
    spawn_local(async move {
        loop {
               let new=status.get();
              let mut ws=WebSocket::open("ws://192.168.1.5:8080/wswsws").unwrap();
              let (mut write,mut read)=ws.split();
             while let Some(msg)=read.next().await {
               match msg {
                  Ok(v) => {
                    leptos::logging::log!("ok");
                    match v {
                        Message::Text(text) => {
                            leptos::logging::log!("Text:{:?}",text);
                            set_status.set(text);
                        }
                        Message::Bytes(bytes) => {
                            if let Ok(text)=String::from_utf8(bytes) {
                                leptos::logging::log!("Bytes:{:?}",text);
                                set_status.set(text);
                            }
                        }
                    }
                }
                Err(ea) => {
                   leptos::logging::log!("WebSocketError");
                }
            }
        }
        leptos::logging::log!("WebSocket Closed");
}
});
});
view! {
    <div>
        <h1>"WebSocket Example"</h1>
        <p>Status: {status}</p>
        // <button on:click=connect>"Connect"</button>
        
        <h2>"Messages:{status}"</h2>
        // <ul>
        //     {message.get().into_iter()
        //         .map(|msg| view! {
        //         <li>{msg}</li>
        //     }).collect_view()}
        // </ul>
    </div>
}

}

[myrpg-fun]

I think your problem with unwrap here... let mut ws=WebSocket::open("ws://192.168.1.5:8080/wswsws").unwrap();
if you haven't connection after socket die, it will panic.

[callmeitachi]

So do I have to implement it using the 'loop' syntax?

[myrpg-fun]

IMO it should work, because you are using async/await there.

I didn't implement websocket with leptos, so I don't know the good pattern / good solution.

https://leptos-use.rs/network/use_websocket.html try this one. leptos-use is standart library with many good functional for leptos. (also you can check their implementation in git)