feat(list): Add initial empty row and auto-add new row on editing last row

src/app.rs

@@ -4,7 +4,6 @@ use crate::components::items_list::ItemsList;
 use crate::models::item::Item;
 use crate::nostr::NostrClient;
 use tokio::sync::mpsc;
-use uuid::Uuid;
 use leptos::spawn_local;
 use nostr_sdk::serde_json;
 
@@ -28,24 +27,10 @@ pub fn App() -> impl IntoView {
         }
     });
 
-    // Handle adding a new item
-    let add_item = move || {
-        let new_item = Item {
-            id: Uuid::new_v4().to_string(),
-            name: "New Item".to_string(),
-            description: String::new(),
-            tags: vec![],
-            reviews: vec![],
-            wikidata_id: None,
-        };
-        set_items.update(|items| items.push(new_item));
-    };
-
     view! {
         <Stylesheet href="/assets/style.css" />
         <div>
             <h1>{ "CompareWare" }</h1>
-            <button on:click=move |_| add_item()>{ "Add New Item" }</button>
             <ItemsList items=items_signal set_items=set_items />
         </div>
     }

src/components/items_list.rs

@@ -14,12 +14,22 @@ struct WikidataSuggestion {
     description: Option<String>,
 }
 
-
 #[component]
 pub fn ItemsList(
     items: ReadSignal<Vec<Item>>,
     set_items: WriteSignal<Vec<Item>>,
 ) -> impl IntoView {
+    
+    // Ensure there's an initial empty row
+    set_items.set(vec![Item {
+        id: Uuid::new_v4().to_string(),
+        name: String::new(),
+        description: String::new(),
+        tags: vec![],
+        reviews: vec![],
+        wikidata_id: None,
+    }]);
+
     let (wikidata_suggestions, set_wikidata_suggestions) =
         create_signal(Vec::<WikidataSuggestion>::new());
 
@@ -54,12 +64,26 @@ pub fn ItemsList(
                 match field {
                     "name" => {
                         item.name = value.clone();
-                        fetch_wikidata_suggestions(value);
+                        fetch_wikidata_suggestions(value.clone());
+                    }
+                    "description" => {
+                        item.description = value.clone();
                     }
-                    "description" => item.description = value,
                     _ => (),
                 }
             }
+
+            // Automatically add a new row when editing the last row
+            if index == items.len() - 1 && !value.is_empty() {
+                items.push(Item {
+                    id: Uuid::new_v4().to_string(),
+                    name: String::new(),
+                    description: String::new(),
+                    tags: vec![],
+                    reviews: vec![],
+                    wikidata_id: None,
+                });
+            }
         });
     };
 
@@ -81,20 +105,6 @@ pub fn ItemsList(
         });
     };
 
-    // Add a new item
-    let add_item = move |_: web_sys::MouseEvent|{
-        set_items.update(|items| {
-            items.push(Item {
-                id: Uuid::new_v4().to_string(),
-                name: String::new(),
-                description: String::new(),
-                tags: vec![],
-                reviews: vec![],
-                wikidata_id: None,
-            });
-        });
-    };
-
     // Remove an item
     let remove_item = move |index: usize| {
         set_items.update(|items| {
@@ -105,7 +115,6 @@ pub fn ItemsList(
     view! {
         <div>
             <h1>{ "Items List" }</h1>
-            <button on:click=add_item>{ "Add New Item" }</button>
             <table>
                 <thead>
                     <tr>
@@ -121,11 +130,11 @@ pub fn ItemsList(
                             <tr>
                                 // Editable Name Field with Wikidata Integration
                                 <td>
-                                        <EditableCell
+                                    <EditableCell
-                                            value=item.name.clone()
+                                        value=item.name.clone()
-                                            on_input=move |value| update_item(index, "name", value)
+                                        on_input=move |value| update_item(index, "name", value)
-                                            key=format!("name-{}", index) // Unique key per cell
+                                        key=format!("name-{}", index) // Unique key per cell
-                                        />
+                                    />
                                     <ul>
                                         {move || {
                                             let suggestions = wikidata_suggestions.get().to_vec();
@@ -162,11 +171,11 @@ pub fn ItemsList(
                                 </td>
                                 // Editable Description Field
                                 <td>
-                                        <EditableCell
+                                    <EditableCell
-                                            value=item.description.clone()
+                                        value=item.description.clone()
-                                            on_input=move |value| update_item(index, "description", value)
+                                        on_input=move |value| update_item(index, "description", value)
-                                            key=format!("description-{}", index)
+                                        key=format!("description-{}", index)
-                                        />
+                                    />
                                 </td>
                                 // Tag Editor
                                 <td>