changes in phase 2

ipi-survey-platform/src/components/admin/AdminHeader.jsx

@@ -146,6 +146,12 @@ const AdminHeader = () => {
               iconActive={configActiveSrc}
               iconInactive={configInactiveSrc}
             />
+            <NavItem
+              to="/manufacturing-index"
+              label="Manufacturing Index"
+              iconActive={configActiveSrc}
+              iconInactive={configInactiveSrc}
+            />
           </nav>
 
           <div className="hidden lg:flex items-center gap-3 ml-auto">
@@ -240,6 +246,12 @@ const AdminHeader = () => {
                 iconActive={configActiveSrc}
                 iconInactive={configInactiveSrc}
               />
+              <NavItem
+                to="/manufacturing-index"
+                label="Manufacturing"
+                iconActive={configActiveSrc}
+                iconInactive={configInactiveSrc}
+              />
               <NavItem
                 to="/admin/users"
                 label="Users"

ipi-survey-platform/src/pages/ManufacturingIndex/ManufacturingIndex.jsx

@@ -1,4 +1,5 @@
 import React, { useState, useMemo, useEffect } from 'react';
+import AdminHeader from '@/components/admin/AdminHeader';
 import {
   IconButton,
   Dialog,
@@ -10,8 +11,10 @@ import Table from '@/components/common/Table';
 import {
   FiberManualRecord as FiberManualRecordIcon,
   KeyboardArrowRight as KeyboardArrowRightIcon,
-  InfoOutlined as InfoOutlinedIcon
+  InfoOutlined as InfoOutlinedIcon,
+  NavigateNext as NavigateNextIcon
 } from '@mui/icons-material';
+import { Breadcrumbs, Link } from '@mui/material';
 import Card from '@/components/common/Card';
 import { getManufacturingIndex, getManufacturingMonthlyOverview } from '@/services/manufacturingIndex/ManufacturingIndex';
 
@@ -59,12 +62,6 @@ const ManufacturingIndex = () => {
     totalItems: 0
   });
 
-  // Month name to number mapping
-  const monthMap = {
-    'Jan': 1, 'Feb': 2, 'Mar': 3, 'Apr': 4,
-    'May': 5, 'Jun': 6, 'Jul': 7, 'Aug': 8,
-    'Sep': 9, 'Oct': 10, 'Nov': 11, 'Dec': 12
-  };
 
   // Fetch data from API
   useEffect(() => {
@@ -348,7 +345,9 @@ const ManufacturingIndex = () => {
   }
 
   return (
-    <div className="min-h-screen bg-gray-100">
+    <div className="min-h-screen w-full bg-gray-50">
+      <AdminHeader />
+      <div className="max-w-[1280px] mx-auto px-4 py-6">
         {/* Popup Dialog */}
         <Dialog
           open={isPopupOpen}
@@ -449,7 +448,19 @@ const ManufacturingIndex = () => {
         </Dialog>
 
         {/* Main UI */}
-      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
+        <div className="w-full py-6">
+          {/* Breadcrumbs */}
+          <nav className="mb-6 text-sm text-[#8F9299] flex items-center gap-2">
+            <Link
+              to="/admin/dashboard"
+              className="font-bold flex items-center gap-1 !text-black no-underline hover:underline hover:!text-black"
+            >
+              Dashboard
+              <img src="/assets/images/Breadcrumb-vector.svg" alt="" className="ml-1 w-3 h-3" />
+            </Link>
+            <span className="text-[#92722A] font-medium">Manufacturing Index</span>
+          </nav>
+          
           <div className="mb-6">
             <Card className="p-6 bg-white rounded-lg shadow">
               <div className="flex flex-col md:flex-row justify-between items-start md:items-start gap-4">
@@ -622,6 +633,7 @@ const ManufacturingIndex = () => {
           </div>
         </div>
       </div>
+    </div>
   );
 };