From dfc69faf48aa4bf8210f2fb8a9277bbdd42e7be4 Mon Sep 17 00:00:00 2001
From: sazzadulalambd <sazzad.sua@gmail.com>
Date: Fri, 15 May 2026 02:37:31 +0600
Subject: [PATCH] style: standardize header icons and update sidebar navigation
 labels and icons

---
 src/app/investor/investments/[id]/page.tsx |  5 +++--
 src/app/investor/plans/new/page.tsx        |  3 ++-
 src/app/investor/plans/page.tsx            | 20 +++++++++++---------
 src/app/investor/withdraw/page.tsx         |  4 +++-
 src/components/Sidebar.tsx                 | 13 ++++++-------
 5 files changed, 25 insertions(+), 20 deletions(-)

diff --git a/src/app/investor/investments/[id]/page.tsx b/src/app/investor/investments/[id]/page.tsx
index a6a49bc..ddd30e4 100644
--- a/src/app/investor/investments/[id]/page.tsx
+++ b/src/app/investor/investments/[id]/page.tsx
@@ -7,7 +7,7 @@ import {
   ArrowLeft, TrendingUp, Bike, DollarSign, Calendar,
   CreditCard, FileText, Download, Check,
   Printer, BarChart3, Wallet, Clock, Shield, Percent, Activity, AlertTriangle,
-  Receipt, CreditCardIcon, Zap, Smartphone, ChevronRight
+  Receipt, CreditCardIcon, Zap, Smartphone, ChevronRight, Target
 } from 'lucide-react';
 import { investors, bikes, transactions } from '@/data/mockData';
 import toast from 'react-hot-toast';
@@ -57,7 +57,8 @@ export default function InvestorInvestmentDetailPage({ params }: { params: Promi
           </button>
           <div>
             <div className="flex items-center gap-3">
-              <h1 className="text-xl lg:text-2xl font-extrabold text-slate-800">{investment.planName}</h1>
+              <h1 className="text-xl lg:text-2xl font-extrabold text-slate-800 flex items-center gap-2">
+                <Target className="w-5 h-5 lg:w-6 lg:h-6 text-investor" />{investment.planName}</h1>
               <span className={`px-2.5 py-1 rounded-full text-xs font-bold ${style.badge} capitalize`}>
                 {investment.planType} Plan
               </span>
diff --git a/src/app/investor/plans/new/page.tsx b/src/app/investor/plans/new/page.tsx
index 8b5c264..533dc58 100644
--- a/src/app/investor/plans/new/page.tsx
+++ b/src/app/investor/plans/new/page.tsx
@@ -93,7 +93,8 @@ export default function NewInvestmentPage() {
           <ArrowLeft className="w-5 h-5 text-slate-600" />
         </button>
         <div>
-          <h1 className="text-xl lg:text-2xl font-extrabold text-slate-800">
+          <h1 className="text-xl lg:text-2xl font-extrabold text-slate-800 flex items-center gap-2">
+            <Zap className="w-5 h-5 lg:w-6 lg:h-6 text-investor" />
             {step === 'select' ? 'Select Investment Plan' : 'Configure New Investment'}
           </h1>
           <p className="text-sm text-slate-500">
diff --git a/src/app/investor/plans/page.tsx b/src/app/investor/plans/page.tsx
index e25329b..2244493 100644
--- a/src/app/investor/plans/page.tsx
+++ b/src/app/investor/plans/page.tsx
@@ -10,14 +10,17 @@ export default function MyInvestmentsPage() {
   const investor = investors[0]; // mock logged-in investor
 
   return (
-    <div className="p-4 lg:p-6 max-w-6xl mx-auto mb-20 lg:mb-0">
+    <div className="p-4 lg:p-6 max-w-8xl mx-auto mb-20 lg:mb-0">
       <div className="flex flex-col md:flex-row md:items-center justify-between gap-4 mb-8">
         <div>
-          <h1 className="text-2xl lg:text-3xl font-extrabold text-slate-800 mb-2">My Investments</h1>
-          <p className="text-slate-500">Manage your active portfolios and track your earnings.</p>
+          <h1 className="text-xl lg:text-2xl font-bold text-slate-800 flex items-center gap-2">
+            <Target className="w-5 h-5 lg:w-6 lg:h-6 text-investor" /> My Investments
+          </h1>
+          <p className="text-sm text-slate-500 mt-1">Manage your active portfolios and track your earnings.</p>
         </div>
-        <Link 
-          href="/investor/plans/new" 
+
+        <Link
+          href="/investor/plans/new"
           className="inline-flex items-center gap-2 px-6 py-3 bg-investor text-white rounded-xl font-bold shadow-lg shadow-investor/20 hover:bg-investor-dark transition-all transform hover:-translate-y-0.5 active:scale-95"
         >
           <Plus className="w-5 h-5" /> New Investment
@@ -101,15 +104,14 @@ export default function MyInvestmentsPage() {
                     <p className="text-[10px] text-slate-400 font-bold uppercase mt-1">+{inv.expectedRoi}% ROI</p>
                   </td>
                   <td className="px-6 py-5">
-                    <span className={`inline-flex items-center gap-1.5 px-2.5 py-1 rounded-lg text-[10px] font-bold uppercase ${
-                      inv.status === 'active' ? 'bg-green-50 text-green-700 border border-green-100' : 'bg-slate-50 text-slate-600 border border-slate-100'
-                    }`}>
+                    <span className={`inline-flex items-center gap-1.5 px-2.5 py-1 rounded-lg text-[10px] font-bold uppercase ${inv.status === 'active' ? 'bg-green-50 text-green-700 border border-green-100' : 'bg-slate-50 text-slate-600 border border-slate-100'
+                      }`}>
                       <div className={`w-1.5 h-1.5 rounded-full ${inv.status === 'active' ? 'bg-green-500' : 'bg-slate-400'}`} />
                       {inv.status}
                     </span>
                   </td>
                   <td className="px-6 py-5 text-right">
-                    <Link 
+                    <Link
                       href={`/investor/investments/${inv.id}`}
                       className="inline-flex items-center gap-2 text-investor hover:text-investor-dark font-bold text-sm transition-all group-hover:gap-3"
                     >
diff --git a/src/app/investor/withdraw/page.tsx b/src/app/investor/withdraw/page.tsx
index c76c97c..8d40564 100644
--- a/src/app/investor/withdraw/page.tsx
+++ b/src/app/investor/withdraw/page.tsx
@@ -111,7 +111,9 @@ export default function InvestorWithdrawPage() {
       {/* Header */}
       <div className="mb-6 flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
         <div>
-          <h1 className="text-xl lg:text-2xl font-bold text-slate-800">Withdraw Funds</h1>
+          <h1 className="text-xl lg:text-2xl font-bold text-slate-800 flex items-center gap-2">
+            <CreditCard className="w-5 h-5 lg:w-6 lg:h-6 text-investor" /> Withdraw Funds
+          </h1>
           <p className="text-sm text-slate-500 mt-1">Request withdrawals to your bank or mobile banking accounts</p>
         </div>
         <button
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index bb4306e..e15cb38 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -23,7 +23,7 @@ import {
   LogOut,
   Calculator,
   Wrench,
-  Target, User
+  Target, User, History
 } from 'lucide-react';
 import { getUserName, getUserRole, logout } from '@/lib/auth';
 
@@ -65,9 +65,9 @@ const bikerNavItems = [
 ];
 
 const investorNavItems = [
-  { label: 'Dashboard', href: '/investor', icon: BarChart3 },
+  { label: 'Dashboard', href: '/investor', icon: Bike },
   { label: 'My Investments', href: '/investor/plans', icon: Target },
-  { label: 'Rental History', href: '/investor/rental-history', icon: FileText },
+  { label: 'Rental History', href: '/investor/rental-history', icon: History },
   { label: 'Withdraw', href: '/investor/withdraw', icon: CreditCard },
   { label: 'My Profile', href: '/investor/profile', icon: User },
 ];
@@ -100,14 +100,13 @@ export default function Sidebar() {
     isInvestor ? investorNavItems :
       isShop ? shopNavItems : bikerNavItems;
 
-  const bottomNavItems = isAdmin ? [
+const bottomNavItems = isAdmin ? [
     { label: 'Home', href: '/admin', icon: BarChart3 },
     { label: 'Fleet', href: '/admin/fleet', icon: Bike },
     { label: 'Users', href: '/admin/users', icon: Users },
   ] : isInvestor ? [
-    { label: 'Home', href: '/investor', icon: BarChart3 },
-    { label: 'Investments', href: '/investor/plans', icon: Target },
-    { label: 'History', href: '/investor/rental-history', icon: FileText },
+    { label: 'Home', href: '/investor', icon: Bike },
+    { label: 'History', href: '/investor/rental-history', icon: History },
     { label: 'Withdraw', href: '/investor/withdraw', icon: CreditCard },
     { label: 'Profile', href: '/investor/profile', icon: User },
   ] : isShop ? [