diff --git a/ipi-survey-platform/src/components/dashboard/SubmissionHistory.jsx b/ipi-survey-platform/src/components/dashboard/SubmissionHistory.jsx
index b6b55b6..648c7f1 100644
--- a/ipi-survey-platform/src/components/dashboard/SubmissionHistory.jsx
+++ b/ipi-survey-platform/src/components/dashboard/SubmissionHistory.jsx
@@ -36,11 +36,11 @@ const getStatusBadge = (status) => {
         Submitted
       </span>
     );
-   } else if (normalized === 'resubmitted') {
+  } else if (normalized === 'resubmitted') {
     return (
       <span className="px-3 py-1 rounded-md text-[#7C5E24] bg-[#F9F7ED] font-medium text-sm whitespace-nowrap">
         Resubmitted
-     </span>
+      </span>
     );
   } else if (['pending', 'under review', 'in-progress'].includes(normalized)) {
     return (
@@ -102,7 +102,6 @@ const downloadCsv = (data) => {
   URL.revokeObjectURL(url);
 };
 
-
 export const SubmissionHistory = ({ history = [], loading = false, error = '' }) => {
   const [searchTerm, setSearchTerm] = React.useState('');
   const [selectedSubmission, setSelectedSubmission] = React.useState(null);
@@ -110,6 +109,10 @@ export const SubmissionHistory = ({ history = [], loading = false, error = '' })
   const pageSize = 10;
   const navigate = useNavigate();
 
+  const handleViewDetails = (submission) => {
+    navigate('/overview', { state: { selectedSubmission: submission } });
+  };
+
   const normalizedHistory = React.useMemo(() => {
     if (!Array.isArray(history)) return [];
     return history.map((entry, index) => ({
@@ -126,11 +129,11 @@ export const SubmissionHistory = ({ history = [], loading = false, error = '' })
   const filtered = normalizedHistory.filter((entry) => {
     const term = searchTerm.trim().toLowerCase().replace(/\s+/g, '');
     if (!term) return true;
-  
+
     return Object.values(entry).some((val) =>
       String(val).toLowerCase().replace(/\s+/g, '').includes(term)
     );
-  });  
+  });
 
   const tableHeaders = [
     'Survey Name',
@@ -152,7 +155,7 @@ export const SubmissionHistory = ({ history = [], loading = false, error = '' })
       <span className="whitespace-nowrap">{item.submission_on}</span>,
       productsLabel,
       <button
-        onClick={() => navigate(`/submission/${item.id}`)}
+        onClick={() => handleViewDetails(item)}
         className="text-[#9E792B] hover:text-[#7b5f22] font-medium"
       >
         View Details
@@ -220,8 +223,8 @@ export const SubmissionHistory = ({ history = [], loading = false, error = '' })
             </div>
           ) : filtered.length === 0 ? (
             <div className="flex items-center justify-center py-20 text-[#7B5C1F] font-semibold text-[15px]">
-  No Submission Found
-</div>
+              No Submission Found
+            </div>
           ) : (
             <div className="overflow-x-auto">
               <div className="min-w-[1200px]">
diff --git a/ipi-survey-platform/src/pages/History/History.jsx b/ipi-survey-platform/src/pages/History/History.jsx
index 199f27a..8c2ff1c 100644
--- a/ipi-survey-platform/src/pages/History/History.jsx
+++ b/ipi-survey-platform/src/pages/History/History.jsx
@@ -314,7 +314,7 @@ const formatExportDateTime = (value) => {
     { value: 'approved', label: 'Approved' },
     { value: 'rejected', label: 'Rejected' },
     { value: 'submitted', label: 'Submitted' },
-    { value: 'resubmitted', label: 'ReSubmitted' },
+    { value: 'resubmitted', label: 'Resubmitted' },
   ];
 
 const filteredRows = useMemo(() => {
@@ -810,6 +810,7 @@ const tableRows = auditHistory.map((entry, index) => {
                   <option value="approved">Approved</option>
                   <option value="rejected">Rejected</option>
                   <option value="submitted">Submitted</option>
+                  <option value="resubmitted">Resubmitted</option>
                 </select>
                 <svg className="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 h-4 w-4 text-[#6B7280]" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
                   <polyline points="6 9 12 15 18 9" />
@@ -884,7 +885,7 @@ const tableRows = auditHistory.map((entry, index) => {
                 { width: 120, style: { whiteSpace: 'normal', wordWrap: 'break-word' } },  // HS Code
                 { width: 200, style: { whiteSpace: 'normal', wordWrap: 'break-word' } },  // Product
                 { width: 130, align: 'center', style: { whiteSpace: 'normal', wordWrap: 'break-word' } },  // Status
-                { width: 140, style: { whiteSpace: 'normal', wordWrap: 'break-word' } },  // Actors
+                { width: 150, style: { whiteSpace: 'normal', wordWrap: 'break-word' } },  // Actors
                 { width: 270, style: { whiteSpace: 'normal', wordWrap: 'break-word' } }   // Details
               ]}
               pagination={{
diff --git a/ipi-survey-platform/src/pages/Overview/Overview.jsx b/ipi-survey-platform/src/pages/Overview/Overview.jsx
index 41c18bc..31d98f1 100644
--- a/ipi-survey-platform/src/pages/Overview/Overview.jsx
+++ b/ipi-survey-platform/src/pages/Overview/Overview.jsx
@@ -1,6 +1,6 @@
 // src/pages/Overview/Overview.jsx
 import React, { useState, useEffect, useMemo } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, useLocation } from 'react-router-dom';
 import { getSubmissions, getSubmissionHistoryByEstablishment } from '@/services/submissions/submissionService';
 import HeaderBar from '@/components/layout/HeaderBar';
 import Table from '@/components/common/Table';
@@ -24,6 +24,8 @@ const formatDate = (dateString) => {
 };
 
 const Overview = () => {
+  const location = useLocation();
+  const navigate = useNavigate();
   const [searchTerm, setSearchTerm] = useState('');
   const [selectedStatus, setSelectedStatus] = useState('');
   const [selectedSubmission, setSelectedSubmission] = useState(null);
@@ -37,7 +39,13 @@ const Overview = () => {
     totalItems: 0,
     pageSizeOptions: [10, 20, 50, 100]
   });
-  const navigate = useNavigate();
+
+  // Set selected submission from route state if available
+  useEffect(() => {
+    if (location.state?.selectedSubmission) {
+      setSelectedSubmission(location.state.selectedSubmission);
+    }
+  }, [location.state]);
 
   useEffect(() => {
     const fetchSubmissions = async () => {
@@ -205,6 +213,36 @@ const Overview = () => {
     setSelectedSubmission(filteredRows[rowIndex]);
   };
 
+  // If we've navigated here with a selected submission, update the state
+  useEffect(() => {
+    if (location.state?.selectedSubmission) {
+      setSelectedSubmission(location.state.selectedSubmission);
+      // Clear the location state to prevent re-triggering on re-renders
+      window.history.replaceState({}, document.title);
+    }
+  }, [location.state]);
+
+  // If we have a selected submission, show the detailed view
+  if (selectedSubmission) {
+    return (
+      <div className="min-h-screen bg-[#F8FAFC]">
+        <HeaderBar />
+        <main className="max-w-[1280px] mx-auto px-4 py-6">
+          <button
+            onClick={() => setSelectedSubmission(null)}
+            className="mb-4 flex items-center text-[#9E792B] hover:text-[#7b5f22] font-medium"
+          >
+            <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5 mr-1" viewBox="0 0 20 20" fill="currentColor">
+              <path fillRule="evenodd" d="M9.707 16.707a1 1 0 01-1.414 0l-6-6a1 1 0 010-1.414l6-6a1 1 0 011.414 1.414L5.414 9H17a1 1 0 110 2H5.414l4.293 4.293a1 1 0 010 1.414z" clipRule="evenodd" />
+            </svg>
+            Back to Submissions
+          </button>
+          <DetailedOverview submission={selectedSubmission} onBack={() => setSelectedSubmission(null)} />
+        </main>
+      </div>
+    );
+  }
+
   if (loading) {
     return (
       <div className="min-h-screen bg-[#F8FAFC]">