add status requesting to frontend

common/src/lib.rs

@@ -3,6 +3,7 @@ use serde::{Deserialize, Serialize};
 #[derive(Debug, Clone, Deserialize, Serialize, Default)]
 pub struct ClientConfig {
     pub proxy_url: Option<String>,
+    pub status_url: Option<String>,
     pub cert_hash: Option<Vec<u8>>,
 }
 

gui/src/app.rs

@@ -3,7 +3,7 @@
 use base64::{display::Base64Display, prelude::BASE64_URL_SAFE};
 use dioxus::prelude::*;
 use mime_guess::Mime;
-use mumble_web2_common::ClientConfig;
+use mumble_web2_common::{ClientConfig, ServerStatus};
 use ordermap::OrderSet;
 use sir::{css, global_css};
 use std::collections::HashMap;
@@ -823,10 +823,37 @@ pub fn ServerView(config: Resource<ClientConfig>) -> Element {
     )
 }
 
+async fn get_status(
+    client: &reqwest::Client,
+    status_url: &str,
+) -> color_eyre::Result<ServerStatus> {
+    Ok(client
+        .get(status_url)
+        .send()
+        .await?
+        .json::<ServerStatus>()
+        .await?)
+}
+
 #[component]
 pub fn LoginView(config: Resource<ClientConfig>) -> Element {
     let net: Coroutine<Command> = use_coroutine_handle();
 
+    let last_status = use_signal(|| None::<color_eyre::Result<ServerStatus>>);
+    use_resource(move || async move {
+        let Some(config) = config.read().clone() else {
+            return;
+        };
+        let Some(status_url) = config.status_url else {
+            return;
+        };
+        let client = reqwest::Client::new();
+        loop {
+            *last_status.write_unchecked() = Some(get_status(&client, &status_url).await);
+            imp::sleep(std::time::Duration::from_secs_f32(1.0)).await;
+        }
+    });
+
     let mut address_input = use_signal(|| None::<String>);
     let mut address = use_memo(move || {
         if let Some(addr) = address_input() {
@@ -930,21 +957,59 @@ pub fn LoginView(config: Resource<ClientConfig>) -> Element {
             h1 {
                 "Mumble Web"
             }
-            input {
+            div {
-                placeholder: "username",
+                label {
-                value: "{username.read()}",
+                    for: "username-entry",
-                autofocus: "true",
+                    "Username:"
-                oninput: move |evt| username.set(evt.value().clone()),
+                    //style: "color: rgba(255, 255, 255, 0.5); font-variation-settings: 'FILL' 1, 'wght' 700, 'GRAD' 0, 'opsz' 48; vertical-align: middle; font-size: 35px; user-select: none;",
+                }
+                input {
+                    id: "username-entry",
+                    placeholder: "username",
+                    value: "{username.read()}",
+                    autofocus: "true",
+                    oninput: move |evt| username.set(evt.value().clone()),
+                }
             }
-            input {
+            div {
-                placeholder: "server address",
+                div {
-                value: "{address.read()}",
+                    span {}
-                autofocus: "true",
+                    span {"—"}
-                oninput: move |evt| address_input.set(Some(evt.value().clone())),
+                    span {}
+                }
+                div {
+                    span {"1/100 Online"}
+                    span {"—"}
+                    span {"Version: 1.4.255"}
+                }
+                div {
+                    {bottom}
+                }
+
             }
-            {bottom}
         }
     )
+    //    rsx!(
+    //        div {
+    //            class: "{login_box}",
+    //            h1 {
+    //                "Mumble Web"
+    //            }
+    //            input {
+    //                placeholder: "username",
+    //                value: "{username.read()}",
+    //                autofocus: "true",
+    //                oninput: move |evt| username.set(evt.value().clone()),
+    //            }
+    //            input {
+    //                placeholder: "server address",
+    //                value: "{address.read()}",
+    //                autofocus: "true",
+    //                oninput: move |evt| address_input.set(Some(evt.value().clone())),
+    //            }
+    //            {bottom}
+    //        }
+    //    )
 }
 
 pub fn app() -> Element {

proxy/src/main.rs

@@ -81,8 +81,12 @@ async fn main() -> Result<()> {
         .install_default()
         .map_err(|e| anyhow!("could not install crypto provider {e:?}"))?;
 
-    let mut client_config = ClientConfig::default();
+    let mut client_config = ClientConfig {
-    client_config.proxy_url = Some(server_config.public_url.join("proxy")?.to_string());
+        proxy_url: Some(server_config.public_url.join("proxy")?.to_string()),
+        status_url: Some(server_config.public_url.join("status")?.to_string()),
+        cert_hash: None,
+    };
+
     let (cert, key) = match (&server_config.cert_path, &server_config.key_path) {
         (None, None) => {
             info!("generating self-signed cert");