1 files changed, 19 insertions, 59 deletions
diff --git a/src/pages/home.rs b/src/pages/home.rs
index 9c86833..8749860 100644
--- a/src/pages/home.rs
+++ b/src/pages/home.rs
@@ -3,45 +3,26 @@ use std::sync::Arc;
 use leptos::{
     IntoView, component,
     error::ErrorBoundary,
-    prelude::{
-        ClassAttribute, CollectView, ElementChild, Get, Read, ReadSignal, Set, With, signal,
-    },
-    reactive::spawn_local,
-    server::{LocalResource, Resource},
+    prelude::{CollectView, ElementChild, Get, GetUntracked},
     view,
 };
-use rocie_client::apis::{
-    api_get_product_api::{ProductsError, products},
-    configuration::Configuration,
+use leptos_router::{
+    NavigateOptions,
+    hooks::{use_navigate, use_query_map},
 };
+use rocie_client::apis::configuration::Configuration;
+use thaw::{Layout, LayoutPosition};
+
+use crate::components::{product_overview::ProductOverview, side_header::SiteHeader};
 
 #[component]
 pub fn Home(config: Arc<Configuration>) -> impl IntoView {
-    let (read_status, write_status) = signal("Loading..".to_owned());
-
-    {
-        let local_config = Arc::clone(&config);
+    let query_map = use_query_map().get_untracked();
+    let navigate = use_navigate();
 
-        spawn_local(async move {
-            let products = products(&local_config).await;
-
-            write_status.set(
-                products
-                    .as_ref()
-                    .map(move |products| {
-                        let products_num = products.len();
-                        let plural_s = if products_num == 1 { "" } else { "s" };
-                        let products_value = 2;
-                        let products_currency = "EUR";
-                        format!(
-                            "You have {products_num} product{plural_s} \
-                         in stock with a value \
-                         of {products_value} {products_currency}.",
-                        )
-                    })
-                    .unwrap(),
-            );
-        });
+    // mobile page
+    if let Some(path) = query_map.get("path") {
+        navigate(&path, NavigateOptions::default());
     }
 
     view! {
@@ -63,33 +44,12 @@ pub fn Home(config: Arc<Configuration>) -> impl IntoView {
             }
         }>
 
-            <nav>
-                <div class="nav">
-                    <img
-                        src="https://raw.githubusercontent.com/leptos-rs/leptos/main/docs/logos/Leptos_logo_RGB.svg"
-                        alt="Rocie Logo"
-                        height="200"
-                        width="400"
-                    />
-                    <h1>Rocie</h1>
-                </div>
-            </nav>
-
-            <div class="container">
-                <div class="container">
-                    <h1>"Inventory"</h1>
-
-                    <p>{read_status}</p>
-                </div>
-
-                <div class="container">
-                    <h1>"Recipies"</h1>
-                </div>
-
-                <div class="container">
-                    <h1>"Shopping list"</h1>
-                </div>
-            </div>
+            <Layout position=LayoutPosition::Absolute>
+                <SiteHeader />
+                <Layout>
+                    <ProductOverview config />
+                </Layout>
+            </Layout>
         </ErrorBoundary>
     }
 }