diff --git a/frontend/src/main.rs b/frontend/src/main.rs
index b0a11b6..651fbd9 100644
--- a/frontend/src/main.rs
+++ b/frontend/src/main.rs
@@ -9,8 +9,32 @@ use sycamore_router::Route;
 use wasm_bindgen::JsCast;
 use web_sys::{Event, HtmlInputElement, KeyboardEvent}; // 0.3.5
 
+#[derive(Deserialize, Serialize, Debug, Default, Clone, PartialEq, Hash, Eq)]
+pub struct BookUI {
+    id: i32,
+    open_library_key: Option<String>,
+    title: String,
+    edition_count: Option<i32>,
+    first_publish_year: Option<i32>,
+    median_page_count: Option<i32>,
+    goodread_id: Option<String>,
+    description: Option<String>,
+    cover: Option<String>,
+    location: Option<String>,
+    time_added: Option<String>,
+    rating: Option<i32>,
+    comments: Option<String>,
+    author_name: Option<Vec<String>>,
+    person: Option<Vec<String>>,
+    place: Option<Vec<String>>,
+    subject: Option<Vec<String>>,
+    time: Option<Vec<String>>,
+    isbn: Option<Vec<String>>,
+}
+
 #[derive(Deserialize, Serialize, Debug, Default, Clone, PartialEq, Hash, Eq)]
 pub struct Docs {
+    id: u32,
     key: String,
     title: String,
     first_publish_year: Option<u32>,
@@ -32,7 +56,7 @@ pub struct Books {
 
 #[derive(Debug, Default, Clone)]
 pub struct AppState {
-    pub books: RcSignal<Books>,
+    pub books: RcSignal<Vec<BookUI>>,
     pub search: RcSignal<String>,
 }
 
@@ -46,11 +70,11 @@ enum AppRoutes {
     NotFound,
 }
 
-async fn fetch_books(search: String) -> Result<Books, reqwasm::Error> {
-    let url = format!("http://localhost:8081/api/hello?search={}", search);
+async fn fetch_books(search: String) -> Result<Vec<BookUI>, reqwasm::Error> {
+    let url = format!("http://localhost:8081/api/search_openlibrary?search={}", search);
     let resp = Request::get(&url).send().await?;
     println!("Fetching books\n");
-    let body = resp.json::<Books>().await?;
+    let body = resp.json::<Vec<BookUI>>().await?;
     Ok(body)
 }
 
@@ -112,19 +136,26 @@ async fn VisitsCount<G: Html>(cx: Scope<'_>) -> View<G> {
             )
         });
     });
-    let docs = create_memo(cx, || app_state.books.get().docs.clone());
+    let state = create_signal(cx, 0i32);
+//    let increment = |x: Docs| (state.set(x.first_publish_year.unwrap().try_into().unwrap()));
+    let increment = |_| (state.set(2));
+ 
+    let docs = create_memo(cx, || app_state.books.get().iter().cloned().collect::<Vec<_>>());
     //let docs = create_signal(cx, vec![1, 2]);
     view! {cx,
         p {
             (if !app_state.search.get().is_empty() {
                 view!{ cx,
-                span {(app_state.books.get().num_found)}
+                //span {(app_state.books.get().num_found)}
                 ul {
-            Indexed(
+            Keyed(
              iterable=docs,
-             view=|cx, x| view! { cx,
-                 li { (format!("{:?}",x)) }
-              })
+             view=move |cx, x| view! { cx,
+                 li { (format!("{:?}",x))
+                 button(on:click=increment) { "+" }
+                 }
+              },
+              key =|x| x.id )
               }
              }
             }
@@ -138,7 +169,7 @@ async fn VisitsCount<G: Html>(cx: Scope<'_>) -> View<G> {
 #[component]
 fn App<G: Html>(cx: Scope) -> View<G> {
     let app_state = AppState {
-        books: create_rc_signal(Books::default()),
+        books: create_rc_signal(Vec::new()),
         search: create_rc_signal(String::default()),
     };
     provide_context(cx, app_state);