From d23644d90fdd09e10e6356f77cf87a2bac7efb0b Mon Sep 17 00:00:00 2001
From: Pantry Lead Agent <pantry-bot@jeanlucmakiola.de>
Date: Wed, 25 Feb 2026 01:28:18 +0000
Subject: [PATCH] feat: integrate LowStockDashboard into inventory page (#68)

---
 app/pages/index.vue | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/app/pages/index.vue b/app/pages/index.vue
index d71f6e2..9cf9103 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -83,12 +83,20 @@
       @updated="handleItemUpdated"
     />
 
-    <!-- Expiry Dashboard -->
-    <div class="mb-6">
+    <!-- Dashboard Cards -->
+    <div class="grid gap-6 mb-6 md:grid-cols-2">
+      <!-- Expiry Dashboard -->
       <InventoryExpiryDashboard
         :items="inventoryItems"
         @view-item="editingItem = $event"
       />
+
+      <!-- Low Stock Dashboard -->
+      <InventoryLowStockDashboard
+        :items="inventoryItems"
+        @view-item="editingItem = $event"
+        @restock-item="handleRestockFromDashboard"
+      />
     </div>
 
     <!-- Inventory List -->
@@ -169,4 +177,9 @@ const handleItemUpdated = async (item: any) => {
   inventoryListRef.value?.reload()
   await loadInventoryData()
 }
+
+const handleRestockFromDashboard = (item: any) => {
+  // Open edit modal with the item (user can use Restock button there)
+  editingItem.value = item
+}
 </script>