From a11642e0e8232f5ab2a59baf5ad4940327ec44c7 Mon Sep 17 00:00:00 2001 From: nick Date: Fri, 26 Jul 2024 20:46:23 -0400 Subject: [PATCH] Front end created --- frontend/Cargo.toml | 7 ++++ frontend/Trunk.toml | 3 ++ frontend/index.html | 9 +++++ frontend/src/main.rs | 87 +++++++++++++++++++++++++++++++++++++++++++- 4 files changed, 104 insertions(+), 2 deletions(-) create mode 100644 frontend/Trunk.toml create mode 100644 frontend/index.html diff --git a/frontend/Cargo.toml b/frontend/Cargo.toml index 413beef..0ab2f80 100644 --- a/frontend/Cargo.toml +++ b/frontend/Cargo.toml @@ -4,3 +4,10 @@ version = "0.1.0" edition = "2021" [dependencies] +console_error_panic_hook = "0.1.7" +gloo-net = "0.6.0" +log = "0.4.22" +wasm-bindgen-futures = "0.4.42" +wasm-logger = "0.2.0" +yew = { version = "0.21.0", features = ["csr"] } +yew-router = "0.18.0" diff --git a/frontend/Trunk.toml b/frontend/Trunk.toml new file mode 100644 index 0000000..925d336 --- /dev/null +++ b/frontend/Trunk.toml @@ -0,0 +1,3 @@ +[build] +target = "index.html" +dist = "../dist" diff --git a/frontend/index.html b/frontend/index.html new file mode 100644 index 0000000..4c32f2c --- /dev/null +++ b/frontend/index.html @@ -0,0 +1,9 @@ + + + + + + Yew App + + loading... + diff --git a/frontend/src/main.rs b/frontend/src/main.rs index e7a11a9..09dd9ef 100644 --- a/frontend/src/main.rs +++ b/frontend/src/main.rs @@ -1,3 +1,86 @@ -fn main() { - println!("Hello, world!"); +use gloo_net::http::Request; +use wasm_bindgen_futures::spawn_local; +use yew::prelude::*; +use yew_router::prelude::*; + +#[derive(Clone, Routable, PartialEq)] +enum Route { + #[at("/")] + Home, + #[at("/hello-server")] + HelloServer, } + +fn switch(routes: Route) -> Html { + match routes { + Route::Home => html! {

{ "Hello Frontend" }

}, + Route::HelloServer => html! { }, + } +} + +#[function_component(App)] +fn app() -> Html { + html! { + + render={switch} /> + + } +} + +#[function_component(HelloServer)] +fn hello_server() -> Html { + let data = use_state(|| None); + + // Request `/api/hello` once + { + let data = data.clone(); + use_effect(move || { + if data.is_none() { + spawn_local(make_request(data)); + } + + || {} + }); + } + + match data.as_ref() { + None => { + html! { +
{"No server response"}
+ } + } + Some(Ok(data)) => { + html! { +
{"Got server response: "}{data}
+ } + } + Some(Err(err)) => { + html! { +
{"Error requesting data from server: "}{err}
+ } + } + } +} + +async fn make_request(data: UseStateHandle>>) { + let resp = Request::get("/api/hello").send().await.unwrap(); + let result = { + if !resp.ok() { + Err(format!( + "Error fetching data {} ({})", + resp.status(), + resp.status_text() + )) + } else { + resp.text().await.map_err(|err| err.to_string()) + } + }; + data.set(Some(result)); + +} + +fn main() { + wasm_logger::init(wasm_logger::Config::new(log::Level::Trace)); + console_error_panic_hook::set_once(); + yew::Renderer::::new().render(); +} \ No newline at end of file