populating menu from a vector now

3 files changed, 71 insertions, 58 deletions

diff --git a/src/app/home/mod.rs b/src/app/home/mod.rs
index 71f3a58..2d792aa 100644
--- a/src/app/home/mod.rs
+++ b/src/app/home/mod.rs
@@ -23,6 +23,29 @@ use crate::components::navigation_menu::*;
 
 #[function_component(HomePage)]
 pub fn home_page() -> Html {
+    let page_menu_items = Vec::from([
+        menu_items::Item {
+            icon: IconId::FontAwesomeSolidPlus,
+            label: String::from("Create New Invoice"),
+            to: Route::NewInvoice,
+        },
+        menu_items::Item {
+            icon: IconId::FontAwesomeSolidMagnifyingGlass,
+            label: String::from("View Invoices"),
+            to: Route::ViewInvoices,
+        },
+        menu_items::Item {
+            icon: IconId::FontAwesomeSolidMountainSun,
+            label: String::from("Manage Data"),
+            to: Route::ManageMenu,
+        },
+        menu_items::Item {
+            icon: IconId::FontAwesomeSolidGear,
+            label: String::from("Settings"),
+            to: Route::Settings,
+        },
+    ]);
+
     html! {
         <div id={"home-page"}>
             <NavigationMenu>
@@ -30,31 +53,7 @@ pub fn home_page() -> Html {
                     <h1>{ "Welcome To OpenBills!" }</h1>
                 </menu_header::MenuHeader>
 
-                <menu_items::MenuItems>
-                    <menu_item::MenuItem
-                        icon={IconId::FontAwesomeSolidPlus}
-                        label={"Create New Invoice"}
-                        to={Route::NewInvoice}
-                        />
-
-                    <menu_item::MenuItem
-                        icon={IconId::FontAwesomeSolidMagnifyingGlass}
-                        label={"View Invoices"}
-                        to={Route::ViewInvoices}
-                        />
-
-                    <menu_item::MenuItem
-                        icon={IconId::FontAwesomeSolidMountainSun}
-                        label={"Manage Data"}
-                        to={Route::ManageMenu}
-                        />
-
-                    <menu_item::MenuItem
-                        icon={IconId::FontAwesomeSolidGear}
-                        label={"Settings"}
-                        to={Route::Settings}
-                        />
-                </menu_items::MenuItems>
+                <menu_items::MenuItems items={page_menu_items}/>
             </NavigationMenu>
         </div>
     }
diff --git a/src/app/manage/mod.rs b/src/app/manage/mod.rs
index 17b7b16..bdca731 100644
--- a/src/app/manage/mod.rs
+++ b/src/app/manage/mod.rs
@@ -23,6 +23,34 @@ use crate::components::navigation_menu::*;
 
 #[function_component(ManageMenuPage)]
 pub fn manage_menu_page() -> Html {
+    let page_menu_items = Vec::from([
+        menu_items::Item {
+            icon: IconId::FontAwesomeSolidUser,
+            label: String::from("Edit Clients"),
+            to: Route::ManageClients,
+        },
+        menu_items::Item {
+            icon: IconId::FontAwesomeSolidIndustry,
+            label: String::from("Edit Brands"),
+            to: Route::ManageBrands,
+        },
+        menu_items::Item {
+            icon: IconId::FontAwesomeSolidCartShopping,
+            label: String::from("Edit Items"),
+            to: Route::ManageItems,
+        },
+        menu_items::Item {
+            icon: IconId::FontAwesomeSolidFileInvoice,
+            label: String::from("Edit Invoices"),
+            to: Route::ManageInvoices,
+        },
+        menu_items::Item {
+            icon: IconId::FontAwesomeSolidHouseChimney,
+            label: String::from("Home"),
+            to: Route::Home,
+        },
+    ]);
+
     html! {
         <div id={"manage-menu-page"}>
             <NavigationMenu>
@@ -31,37 +59,7 @@ pub fn manage_menu_page() -> Html {
                     <p>{ "Here you can add/modify/delete OpenBills data (clients, invoices, etc)" }</p>
                 </menu_header::MenuHeader>
 
-                <menu_items::MenuItems>
-                    <menu_item::MenuItem
-                        icon={IconId::FontAwesomeSolidUser}
-                        label={"Edit Clients"}
-                        to={Route::ManageClients}
-                        />
-
-                    <menu_item::MenuItem
-                        icon={IconId::FontAwesomeSolidIndustry}
-                        label={"Edit Brands"}
-                        to={Route::ManageBrands}
-                        />
-
-                    <menu_item::MenuItem
-                        icon={IconId::FontAwesomeSolidCartShopping}
-                        label={"Edit Items"}
-                        to={Route::ManageItems}
-                        />
-
-                    <menu_item::MenuItem
-                        icon={IconId::FontAwesomeSolidFileInvoice}
-                        label={"Edit Invoices"}
-                        to={Route::ManageInvoices}
-                        />
-
-                    <menu_item::MenuItem
-                        icon={IconId::FontAwesomeSolidHouseChimney}
-                        label={"Home"}
-                        to={Route::Home}
-                        />
-                </menu_items::MenuItems>
+                <menu_items::MenuItems items={page_menu_items}/>
             </NavigationMenu>
         </div>
     }
diff --git a/src/components/navigation_menu/menu_items.rs b/src/components/navigation_menu/menu_items.rs
index efab75e..f3e33b3 100644
--- a/src/components/navigation_menu/menu_items.rs
+++ b/src/components/navigation_menu/menu_items.rs
@@ -16,17 +16,33 @@
  */
 
 use yew::prelude::*;
+use yew_icons::{IconId};
+
+use crate::app::Route;
+use crate::components::navigation_menu::menu_item;
+
+#[derive(PartialEq)]
+pub struct Item {
+    pub label: String,
+    pub icon: IconId,
+    pub to: Route,
+}
 
 #[derive(Properties, PartialEq)]
 pub struct Props {
-    pub children: Children,
+    pub items: Vec<Item>,
 }
 
 #[function_component(MenuItems)]
 pub fn menu_items(props: &Props) -> Html {
+    let menu_items: Html = props.items
+        .iter()
+        .map(|item| html!(<menu_item::MenuItem icon={item.icon} label={item.label.clone()} to={item.to.clone()} />))
+        .collect();
+
     html! {
         <div class={"items-wrapper"}>
-            {props.children.clone()}
+            {menu_items}
         </div>
     }
 }