diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage.tsx
index cd1bd1e99..7eb038196 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingDetailPage.tsx
@@ -14,14 +14,9 @@ import {
 } from "lucide-react";
 
 import Breadcrumbs from "@/components/Breadcrumbs";
-import NewBookingPage from "./NewBookingPage";
 import DeleteBookingDialog from "./DeleteBookingDialog";
 import { getBookingById, type BookingStatus } from "./bookings.mock";
-import {
-  Button,
-  Card,
-  CardContent,
-} from "@edr/ui-common";
+import { Button, Card } from "@edr/ui-common";
 
 export default function BookingDetailPage() {
   const { id } = useParams<{ id: string }>();
@@ -89,26 +84,7 @@ export default function BookingDetailPage() {
             </div>
 
             <div className="flex items-center gap-3">
-              <NewBookingPage
-                mode="edit"
-                booking={{
-                  customerId: booking.customerId,
-                  cargoType: booking.cargoType,
-                  originStation: booking.originStation,
-                  destinationStation: booking.destinationStation,
-                  transportMode: booking.transportMode,
-                  legs: booking.legs,
-                  containerType: booking.containerType,
-                  containerCount: booking.containerCount,
-                  weightTons: booking.weightTons,
-                  requestedDate: booking.requestedDate,
-                  priority: booking.priority,
-                  cargoDescription: booking.cargoDescription,
-                  specialInstructions: booking.specialInstructions,
-                }}
-              >
-                <Button>Edit Booking</Button>
-              </NewBookingPage>
+              <Button>Edit Booking</Button>
 
               <DeleteBookingDialog
                 bookingReference={booking.reference}
@@ -142,7 +118,9 @@ export default function BookingDetailPage() {
           </div>
         </Card>
 
-        {booking.transportMode === "Multimodal" && booking.legs && booking.legs.length > 0 ? (
+        {booking.transportMode === "Multimodal" &&
+          booking.legs &&
+          booking.legs.length > 0 ? (
           <Card className="p-6">
             <div className="mb-4 flex items-center gap-2">
               <Train />
diff --git a/apps/edr-freight-web/portal/src/pages/bookings/BookingsPage.tsx b/apps/edr-freight-web/portal/src/pages/bookings/BookingsPage.tsx
index e755c174b..ad7a6cf92 100644
--- a/apps/edr-freight-web/portal/src/pages/bookings/BookingsPage.tsx
+++ b/apps/edr-freight-web/portal/src/pages/bookings/BookingsPage.tsx
@@ -1,5 +1,5 @@
 import { useMemo } from "react";
-import { useNavigate } from "react-router-dom";
+import { Link, useNavigate } from "react-router-dom";
 import {
   ArrowRight,
   Clock,
@@ -15,7 +15,6 @@ import {
 } from "lucide-react";
 
 import Breadcrumbs from "@/components/Breadcrumbs";
-import NewBookingPage from "./NewBookingPage";
 import DeleteBookingDialog from "./DeleteBookingDialog";
 import { bookings, type BookingStatus } from "./bookings.mock";
 import {
@@ -125,29 +124,6 @@ export default function BookingsPage() {
                   <Eye />
                   View
                 </DropdownMenuItem>
-                <NewBookingPage
-                  mode="edit"
-                  booking={{
-                    customerId: booking.customerId,
-                    cargoType: booking.cargoType,
-                    originStation: booking.originStation,
-                    destinationStation: booking.destinationStation,
-                    transportMode: booking.transportMode,
-                    legs: booking.legs,
-                    containerType: booking.containerType,
-                    containerCount: booking.containerCount,
-                    weightTons: booking.weightTons,
-                    requestedDate: booking.requestedDate,
-                    priority: booking.priority,
-                    cargoDescription: booking.cargoDescription,
-                    specialInstructions: booking.specialInstructions,
-                  }}
-                >
-                  <DropdownMenuItem onSelect={(e: Event) => e.preventDefault()}>
-                    <Pencil />
-                    Edit
-                  </DropdownMenuItem>
-                </NewBookingPage>
                 <DropdownMenuSeparator />
                 <DeleteBookingDialog bookingReference={booking.reference}>
                   <DropdownMenuItem
@@ -191,12 +167,12 @@ export default function BookingsPage() {
               />
             </div>
 
-            <NewBookingPage>
+            <Link to="/bookings/new">
               <Button>
                 <Plus />
                 New Booking
               </Button>
-            </NewBookingPage>
+            </Link>
           </div>
         </Card>