From 48ab7519f27d6206df15bd877f1914fa6788fa7e Mon Sep 17 00:00:00 2001
From: Vinod J M <vinodjacobmatthew@gmail.com>
Date: Fri, 7 Oct 2022 23:30:30 +0530
Subject: [PATCH] v0.04a

---
 frontend/src/main.rs | 55 ++++++++++++++++++++++++++------------------
 1 file changed, 33 insertions(+), 22 deletions(-)

diff --git a/frontend/src/main.rs b/frontend/src/main.rs
index 7dc10f5..a9b3d6f 100644
--- a/frontend/src/main.rs
+++ b/frontend/src/main.rs
@@ -1,6 +1,8 @@
+use log::info;
 //use log::Level;
 use reqwasm::http::Request;
 use serde::{Deserialize, Serialize};
+use sycamore::futures::spawn_local;
 use sycamore::prelude::*;
 use sycamore::suspense::Suspense;
 use sycamore_router::Route;
@@ -35,17 +37,6 @@ pub struct AppState {
     pub search: RcSignal<String>,
 }
 
-impl AppState {
-    //   #[tokio::main]
-    async fn set_books(&self, search: String) {
-        self.books.set(fetch_books(search).await.unwrap());
-    }
-
-    fn set_search(&self, search: String) {
-        self.search.set(search);
-    }
-}
-
 #[derive(Route)]
 enum AppRoutes {
     #[to("/")]
@@ -78,9 +69,10 @@ pub fn Header<G: Html>(cx: Scope) -> View<G> {
             task = task.trim().to_string();
 
             if !task.is_empty() {
-                app_state.set_search(task);
+                app_state.search.set(task);
 
                 println!("Fetching search\n");
+                info!("Fetching search\n");
                 value.set("".to_string());
                 input_ref
                     .get::<DomNode>()
@@ -106,20 +98,40 @@ pub fn Header<G: Html>(cx: Scope) -> View<G> {
 
 #[component]
 async fn VisitsCount<G: Html>(cx: Scope<'_>) -> View<G> {
-    //let app_state = use_context::<AppState>(cx);
-    //create_effect(cx, || {
-    //    println!("The state changed. New value: {}", app_state.search.get())
-    //});
-    //let search = create_memo(cx, || app_state.search.get());
+    let app_state = use_context::<AppState>(cx);
+    /* create_effect(cx, || {
+        info!(
+            "The state changed. New value: {} {}",
+            app_state.search.get(),
+            app_state.books.get().num_found
+        )
+    });
+    */
     //    app_state.set_books(search.to_string()).await;
     //app_state.set_books("Lord of the rings".to_string()).await;
-    let lbooks = fetch_books("lord of the rings".to_string()).await.unwrap();
-    print!("Visitcounts\n");
+    create_effect(cx, || {
+        //info!(
+        //    "The state changed. New value: {} {}",
+        //    app_state.search.get(),
+        //    app_state.books.get().num_found
+        //);
+        let app_state = app_state.clone();
+        spawn_local(async move {
+            app_state.books.set(
+                fetch_books(app_state.search.get().to_string())
+                    .await
+                    .unwrap(),
+            )
+        });
+    });
+
+    //    let lbooks = fetch_books("lord of the rings".to_string()).await.unwrap();
     view! {cx,
              p {
             "Total visits: "
             span {
-                (lbooks.num_found)
+                //(search)
+                (app_state.books.get().num_found)
             }
         }
     }
@@ -135,12 +147,11 @@ fn App<G: Html>(cx: Scope) -> View<G> {
     view! {
         cx,
         div {
-            //Header {}
+            Header {}
             p { "Page Visit Counter" }
             Suspense(fallback=view! { cx, "Loading..." }) {
                 VisitsCount {}
             }
-            //create_effect(cx, || println!("The state changed. New value: {}", state.get()));
         }
     /*
     Router {