1 files changed, 52 insertions, 0 deletions
diff --git a/src/pages/product.rs b/src/pages/product.rs
new file mode 100644
index 0000000..0e4ac04
--- /dev/null
+++ b/src/pages/product.rs
@@ -0,0 +1,52 @@
+use leptos::{
+    IntoView, component,
+    prelude::{ElementChild, Get, IntoAny},
+    view,
+};
+use leptos_router::hooks::use_params_map;
+use rocie_client::models::product;
+
+use crate::{
+    api::product_by_name_wrapped,
+    components::{
+        async_fetch::{AsyncFetch, AsyncResource},
+        catch_errors::CatchErrors,
+        login_wall::LoginWall,
+        site_header::SiteHeader,
+    },
+};
+
+#[component]
+pub fn Product() -> impl IntoView {
+    let name = || {
+        use_params_map()
+            .get()
+            .get("name")
+            .expect("Should always have a name, because the router would otherwise not match")
+    };
+
+    view! {
+        <CatchErrors>
+            <LoginWall back=move || format!("/product/{}", name())>
+                <SiteHeader logo=icondata_io::IoArrowBack back_location="/" name="Recipies" />
+                {
+                    AsyncFetch! {
+                        @map_error_in_producer
+                        from_resource=AsyncResource! {
+                            (name: String = name().clone())
+                            -> Result<product::Product, leptos::error::Error> {
+                                product_by_name_wrapped(&name).await
+
+                            }
+                        },
+                        producer=render_product
+                    }
+                }
+            </LoginWall>
+        </CatchErrors>
+    }
+}
+
+fn render_product(product: product::Product) -> impl IntoView {
+    view! { <h1>{product.name}</h1> }
+}