diff --git a/frontend/src/Pages/delivery/DLDriverDashboard.jsx b/frontend/src/Pages/delivery/DLDriverDashboard.jsx
index 473f92aa..bc806e2e 100644
--- a/frontend/src/Pages/delivery/DLDriverDashboard.jsx
+++ b/frontend/src/Pages/delivery/DLDriverDashboard.jsx
@@ -2,6 +2,7 @@ import React, { useState, useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
 import axios from 'axios';
 import DeliverySidebar from '../../Components/delivery/DeliverySidebar';
+import { FaCheck, FaTruck, FaClipboardCheck, FaShippingFast } from 'react-icons/fa'; // Import icons for status
 
 const DLDriverDashboard = () => {
     const [driver, setDriver] = useState(null);
@@ -64,8 +65,76 @@ const DLDriverDashboard = () => {
         }
     };
 
+    const handleStatusUpdate = async (deliveryId, currentStatus) => {
+        let newStatus;
+
+        // Determine next status
+        if (currentStatus === 'Ready') {
+            newStatus = 'Picked Up';
+        } else if (currentStatus === 'Picked Up') {
+            newStatus = 'On The Way';
+        } else if (currentStatus === 'On The Way') {
+            newStatus = 'Delivered';
+        } else {
+            return; // If already delivered or status is not eligible for change, do nothing
+        }
+
+        try {
+            const driverToken = localStorage.getItem('driverToken');
+            await axios.put(
+                `/api/delivery/${deliveryId}/status`,
+                { deliveryStatus: newStatus },
+                {
+                    headers: {
+                        Authorization: `Bearer ${driverToken}`,
+                    },
+                }
+            );
+
+            // Update the delivery status in the state
+            setOngoingDeliveries((prevDeliveries) =>
+                prevDeliveries.map((delivery) =>
+                    delivery._id === deliveryId
+                        ? { ...delivery, deliveryStatus: newStatus }
+                        : delivery
+                )
+            );
+        } catch (error) {
+            console.error('Error updating delivery status:', error);
+        }
+    };
+
+    const handleViewDelivery = (deliveryId) => {
+        navigate(`/driver/delivery/${deliveryId}`); // Redirect to delivery view page
+    };
+
     if (loading) return <div>Loading...</div>;
 
+    // Helper function to render delivery status with icons
+    const renderDeliveryStatus = (status) => {
+        if (status === 'Ready') {
+            return <FaClipboardCheck className="text-yellow-500" />;
+        } else if (status === 'Picked Up') {
+            return <FaTruck className="text-blue-500" />;
+        } else if (status === 'On The Way') {
+            return <FaShippingFast className="text-green-500" />;
+        } else if (status === 'Delivered') {
+            return <FaCheck className="text-gray-500" />;
+        }
+    };
+
+    // Helper function to render progress bar based on status
+    const renderProgressBar = (status) => {
+        const progress = status === 'Ready' ? 25 : status === 'Picked Up' ? 50 : status === 'On The Way' ? 75 : 100;
+        const bgColor = progress === 100 ? 'bg-gray-400' : 'bg-green-500';
+
+        return (
+            <div className="w-full bg-gray-200 rounded-full h-2.5">
+                <div className={`${bgColor} h-2.5 rounded-full`} style={{ width: `${progress}%` }}></div>
+            </div>
+        );
+    };
+
     return (
         <div className="flex min-h-screen bg-gray-50">
             {/* Sidebar */}
@@ -75,6 +144,15 @@ const DLDriverDashboard = () => {
 
             {/* Main content */}
             <main className="flex-1 ml-64 p-16 overflow-y-auto">
+
+                   {/* NIC and Password Equality Check */}
+{driver && driver.idCardNumber === driver.password && (
+    <div className="bg-red-500 text-white p-4 rounded-md mb-6 text-center">
+        <strong>Warning:</strong> Your NIC number and password are the same. Please update your password for better security.
+    </div>
+)}
+
+
                 <div className="max-w-5xl mx-auto p-8 bg-white shadow-lg rounded-lg">
                     <h1 className="text-3xl font-bold mb-6 text-center">Welcome, {driver.fullName}</h1>
 
@@ -111,41 +189,95 @@ const DLDriverDashboard = () => {
                     </div>
 
                     {/* Ongoing Deliveries Section */}
-                    <div className="bg-gray-100 p-6 rounded-lg shadow-lg">
-                        <h2 className="text-2xl font-bold mb-4">Ongoing Deliveries</h2>
-                        {ongoingDeliveries.length > 0 ? (
-                            <table className="min-w-full bg-white border border-gray-200">
-                                <thead>
-                                    <tr className="bg-gray-200">
-                                        <th className="px-4 py-2 border">Tracking ID</th>
-                                        <th className="px-4 py-2 border">Shop Name</th>
-                                        <th className="px-4 py-2 border">Pickup Address</th>
-                                        <th className="px-4 py-2 border">Dropoff Address</th>
-                                        <th className="px-4 py-2 border">Status</th>
-                                        <th className="px-4 py-2 border">Actions</th>
-                                    </tr>
-                                </thead>
-                                <tbody>
-                                    {ongoingDeliveries.map((delivery) => (
-                                        <tr key={delivery._id} className="hover:bg-gray-100">
-                                            <td className="px-4 py-2 border">{delivery.trackingID}</td>
-                                            <td className="px-4 py-2 border">{delivery.shopName}</td>
-                                            <td className="px-4 py-2 border">{delivery.pickupAddress}</td>
-                                            <td className="px-4 py-2 border">{delivery.dropOffAddress}</td>
-                                            <td className="px-4 py-2 border">{delivery.deliveryStatus}</td>
-                                            <td className="px-4 py-2 border">
-                                                <button className="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600">
-                                                    View
-                                                </button>
-                                            </td>
-                                        </tr>
-                                    ))}
-                                </tbody>
-                            </table>
-                        ) : (
-                            <p>No ongoing deliveries at the moment.</p>
-                        )}
+<div className="bg-gray-100 p-6 rounded-lg shadow-lg">
+    <h2 className="text-2xl font-bold mb-4">Ongoing Deliveries</h2>
+
+    {ongoingDeliveries.length > 0 ? (
+        <div className="space-y-6">
+            {ongoingDeliveries.map((delivery) => (
+                <div key={delivery._id} className="bg-white p-6 shadow-lg rounded-lg">
+                    {/* Delivery Tracking ID */}
+                    <h3 className="text-xl font-semibold mb-4">Tracking ID: {delivery.trackingID}</h3>
+
+                    {/* Delivery Status Progress Bar */}
+                    <div className="relative pt-1 mb-4">
+                        <div className="flex mb-2 items-center justify-between">
+                            <div>
+                                <span className="text-base font-medium text-green-500">
+                                    Status: {delivery.deliveryStatus}
+                                </span>
+                            </div>
+                        </div>
+                        <div className="overflow-hidden h-6 mb-4 text-xs flex rounded bg-gray-200">
+                            <div
+                                style={{
+                                    width: `${
+                                        delivery.deliveryStatus === 'Ready'
+                                            ? 25
+                                            : delivery.deliveryStatus === 'Picked Up'
+                                            ? 50
+                                            : delivery.deliveryStatus === 'On The Way'
+                                            ? 75
+                                            : 100
+                                    }%`,
+                                }}
+                                className={`${
+                                    delivery.deliveryStatus === 'Delivered' ? 'bg-gray-400' : 'bg-green-500'
+                                } h-full rounded-full`}
+                            ></div>
+                        </div>
+                        <div className="text-sm text-gray-600">
+                            Progress: 
+                            {delivery.deliveryStatus === 'Ready'
+                                ? '25%'
+                                : delivery.deliveryStatus === 'Picked Up'
+                                ? '50%'
+                                : delivery.deliveryStatus === 'On The Way'
+                                ? '75%'
+                                : '100% (Delivered)'}
+                        </div>
                     </div>
+
+                    {/* Delivery Table for Detailed Info */}
+                    <table className="min-w-full bg-white border border-gray-200 mb-4">
+                        <thead>
+                            <tr className="bg-gray-200">
+                                <th className="px-4 py-2 border">Shop Name</th>
+                                <th className="px-4 py-2 border">Pickup Address</th>
+                                <th className="px-4 py-2 border">Dropoff Address</th>
+                                <th className="px-4 py-2 border">Actions</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            <tr className="hover:bg-gray-100">
+                                <td className="px-4 py-2 border">{delivery.shopName}</td>
+                                <td className="px-4 py-2 border">{delivery.pickupAddress}</td>
+                                <td className="px-4 py-2 border">{delivery.dropOffAddress}</td>
+                                <td className="px-4 py-2 border space-y-2">
+                                    <button
+                                        onClick={() => handleStatusUpdate(delivery._id, delivery.deliveryStatus)}
+                                        className="block w-full px-4 py-2 bg-green-500 hover:bg-green-600 text-white rounded-md"
+                                    >
+                                        Update Status
+                                    </button>
+                                    <button
+                                        onClick={() => handleViewDelivery(delivery._id)}
+                                        className="block w-full px-4 py-2 bg-blue-500 hover:bg-blue-600 text-white rounded-md"
+                                    >
+                                        View
+                                    </button>
+                                </td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+            ))}
+        </div>
+    ) : (
+        <p>No ongoing deliveries at the moment.</p>
+    )}
+</div>
+
                 </div>
             </main>
         </div>
diff --git a/frontend/src/Pages/delivery/driver/ViewDelivery.jsx b/frontend/src/Pages/delivery/driver/ViewDelivery.jsx
index 49fad8db..543c0734 100644
--- a/frontend/src/Pages/delivery/driver/ViewDelivery.jsx
+++ b/frontend/src/Pages/delivery/driver/ViewDelivery.jsx
@@ -1,13 +1,16 @@
 import React, { useState, useEffect } from 'react';
 import { useParams, useNavigate } from 'react-router-dom';
 import axios from 'axios';
-import DeliverySidebar from '../../../Components/delivery/DeliverySidebar';
+import jsPDF from 'jspdf';
+import 'jspdf-autotable'; // Import jsPDF-autotable for table formatting
+import farmcartLogo from '../../../assets/logo.png'; // Make sure you have your logo here
+import DLmanageSidebar from '../../../Components/delivery/DeliverySidebar'; // Sidebar component
 
-const ViewDelivery = () => {
+const DLViewDelivery = () => {
     const { id } = useParams(); // Get the delivery ID from the URL
     const [delivery, setDelivery] = useState(null); // State for storing delivery data
     const [driver, setDriver] = useState(null); // State for driver info
-    const [loading, setLoading] = useState(true); // Loading state
+    const [loading, setLoading] = useState(true);
     const driverToken = localStorage.getItem('driverToken'); // Get driver token from localStorage
     const navigate = useNavigate();
 
@@ -44,75 +47,129 @@ const ViewDelivery = () => {
         fetchDelivery();
     }, [driverToken, id, navigate]);
 
-    if (loading) return <div>Loading...</div>;
+    if (loading) return <div className="text-center mt-10">Loading...</div>;
+
+    // Function to generate the PDF
+    const generatePDF = () => {
+        const doc = new jsPDF();
+
+        // Add logo
+        doc.addImage(farmcartLogo, 'PNG', 10, 10, 50, 20); // Add logo with width and height
+
+        // Add title
+        doc.setFontSize(22);
+        doc.text('Delivery Details', 105, 40, null, null, 'center'); // Title centered at the top
+
+        // Add company name
+        doc.setFontSize(12);
+        doc.text('FarmCart Lanka (PVT.) LTD', 105, 50, null, null, 'center');
+        doc.text('No.78, Malabe, Colombo', 105, 55, null, null, 'center');
+        doc.text('(+94) 011 34 56 837', 105, 60, null, null, 'center');
+        doc.text('www.farmcart.com', 105, 65, null, null, 'center');
+
+        // Move down to add delivery details table
+        doc.setFontSize(12);
+        doc.text('Delivery Information', 14, 80); // Left-aligned delivery information
+
+        // Create a table with delivery details
+        doc.autoTable({
+            startY: 85, // Starting position on the Y-axis
+            head: [['Field', 'Details']], // Table headers
+            body: [
+                ['Tracking ID', delivery.trackingID],
+                ['Order ID', delivery.oID],
+                ['Driver Name', driver?.firstName + ' ' + driver?.lastName], // Adding driver name
+                ['Driver ID', delivery.drID],
+                ['Shop Name', delivery.shopName],
+                ['Pickup Address', delivery.pickupAddress],
+                ['Customer Name', delivery.customerName || 'N/A'],
+                ['Dropoff Address', delivery.dropOffAddress],
+                ['Assigned Time', new Date(delivery.assignDateTime).toLocaleString()],
+                ['Delivery Status', delivery.deliveryStatus],
+                [
+                    'Delivered Time',
+                    delivery.deliveredDateTime
+                        ? new Date(delivery.deliveredDateTime).toLocaleString()
+                        : 'Ongoing',
+                ],
+            ],
+            theme: 'grid', // Use grid theme for the table
+            headStyles: { fillColor: [46, 204, 113] }, // Green background for headers
+            bodyStyles: { textColor: [0, 0, 0] }, // Black text color for table body
+        });
+
+        // Save the PDF with a dynamic name based on the delivery tracking ID
+        doc.save(`Delivery_${delivery.trackingID}.pdf`);
+    };
 
     return (
         <div className="flex min-h-screen bg-gray-50">
             {/* Sidebar */}
             <aside className="fixed top-0 left-0 bottom-0 w-64 bg-gray-50 shadow-md pl-8 pt-16 mt-16">
-                <DeliverySidebar driver={driver} />
+                <DLmanageSidebar driver={driver} />
             </aside>
 
             {/* Main content */}
-            <main className="flex-1 ml-64 p-16 overflow-y-auto">
-                <div className="max-w-5xl mx-auto p-8 bg-white shadow-lg rounded-lg">
-                    <h1 className="text-3xl font-bold mb-6 text-center">Delivery Details</h1>
+            <main className="flex-1 ml-64 p-10 md:p-16 overflow-y-auto">
+                <div className="max-w-3xl mx-auto p-8 bg-white shadow-lg rounded-lg border-l-4 border-green-500"> {/* Added a green left border */}
+                    <h2 className="text-4xl font-bold mb-8 text-center text-gray-900"> {/* Increased font size and made it bolder */}
+                        Delivery Details
+                    </h2>
 
                     {delivery ? (
-                        <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
-                            {/* Displaying all delivery details */}
-                            <div>
-                                <h3 className="font-semibold">Tracking ID:</h3>
-                                <p>{delivery.trackingID}</p>
-                            </div>
-                            <div>
-                                <h3 className="font-semibold">Order ID:</h3>
-                                <p>{delivery.oID}</p>
-                            </div>
-                            <div>
-                                <h3 className="font-semibold">Driver ID:</h3>
-                                <p>{delivery.drID}</p>
-                            </div>
-                            <div>
-                                <h3 className="font-semibold">Shop Name:</h3>
-                                <p>{delivery.shopName}</p>
-                            </div>
-                            <div>
-                                <h3 className="font-semibold">Pickup Address:</h3>
-                                <p>{delivery.pickupAddress}</p>
-                            </div>
-                            <div>
-                                <h3 className="font-semibold">Customer Name:</h3>
-                                <p>{delivery.customerName}</p>
-                            </div>
-                            <div>
-                                <h3 className="font-semibold">Dropoff Address:</h3>
-                                <p>{delivery.dropOffAddress}</p>
-                            </div>
-                            <div>
-                                <h3 className="font-semibold">Assigned Time:</h3>
-                                <p>{new Date(delivery.assignDateTime).toLocaleString()}</p>
-                            </div>
-                            <div>
-                                <h3 className="font-semibold">Delivery Status:</h3>
-                                <p>{delivery.deliveryStatus}</p>
-                            </div>
-                            <div>
-                                <h3 className="font-semibold">Delivered Time:</h3>
-                                <p>
-                                    {delivery.deliveredDateTime
-                                        ? new Date(delivery.deliveredDateTime).toLocaleString()
-                                        : 'Not Delivered Yet'}
-                                </p>
-                            </div>
+                        <div className="overflow-x-auto">
+                            <table className="mx-auto w-full text-left text-gray-700">
+                                <tbody>
+                                    {[
+                                        ['Tracking ID', delivery.trackingID],
+                                        ['Order ID', delivery.oID],
+                                        ['Driver Name', driver?.firstName + ' ' + driver?.lastName], // Display driver name
+                                        ['Driver ID', delivery.drID],
+                                        ['Shop Name', delivery.shopName],
+                                        ['Pickup Address', delivery.pickupAddress],
+                                        ['Customer Name', delivery.customerName || 'N/A'],
+                                        ['Dropoff Address', delivery.dropOffAddress],
+                                        ['Assigned Time', new Date(delivery.assignDateTime).toLocaleString()],
+                                        ['Delivery Status', delivery.deliveryStatus],
+                                        [
+                                            'Delivered Time',
+                                            delivery.deliveredDateTime
+                                                ? new Date(delivery.deliveredDateTime).toLocaleString()
+                                                : 'Ongoing',
+                                        ],
+                                    ].map(([field, value], index) => (
+                                        <tr
+                                            key={index}
+                                            className="hover:bg-gray-100 cursor-pointer"
+                                        >
+                                            <td className="py-4 px-6 font-medium text-lg">
+                                                {field}
+                                            </td>
+                                            <td className="py-4 px-6 text-lg">
+                                                {value}
+                                            </td>
+                                        </tr>
+                                    ))}
+                                </tbody>
+                            </table>
                         </div>
                     ) : (
-                        <p className="text-center text-gray-600">No delivery details found.</p>
+                        <p>No delivery details found.</p>
                     )}
+
+                    {/* Download Button */}
+                    <div className="mt-6 text-center">
+                        <button
+                            className="bg-green-500 text-white py-2 px-4 rounded-md hover:bg-green-600 focus:outline-none focus:ring-2 focus:ring-green-300"
+                            onClick={generatePDF}
+                        >
+                            Download PDF
+                        </button>
+                    </div>
                 </div>
             </main>
         </div>
     );
 };
 
-export default ViewDelivery;
+export default DLViewDelivery;