diff --git a/resources/views/bookings/bookings-create.blade.php b/resources/views/bookings/bookings-create.blade.php
new file mode 100644
index 0000000..c8dbf8b
--- /dev/null
+++ b/resources/views/bookings/bookings-create.blade.php
@@ -0,0 +1,3 @@
+<div>
+asda
+</div>
diff --git a/resources/views/bookings/bookings-listing.blade.php b/resources/views/bookings/bookings-listing.blade.php
new file mode 100644
index 0000000..5cb0a47
--- /dev/null
+++ b/resources/views/bookings/bookings-listing.blade.php
@@ -0,0 +1,58 @@
+<div>
+    <x-p-pagination livewire :source="$bookings"/>
+    <x-p-paper class="bg-slate-800">
+        <x-slot:title>Item list</x-slot:title>
+        <x-slot:actions>
+            <x-p-button color="success" href="{{ route('dhl24.bookings.create') }}">New courier booking</x-p-button>
+        </x-slot:actions>
+        @if($bookings->count())
+            <x-p-table>
+                <x-p-thead>
+                    <x-p-tr>
+                        <x-p-th left>Booking ID</x-p-th>
+                        <x-p-th left>Date</x-p-th>
+                        <x-p-th center>Pickup time</x-p-th>
+                        <x-p-th left>Info</x-p-th>
+                        <x-p-th center>Shipments</x-p-th>
+                        <x-p-th right>Options</x-p-th>
+                    </x-p-tr>
+                </x-p-thead>
+                <x-p-tbody>
+                    @foreach($bookings as $booking)
+                        <x-p-tr>
+                            <x-p-td>
+                                <x-p-link href="{{route('dhl24.bookings.show', $booking->id)}}">
+                                    {{ $booking->order_id }}
+                                </x-p-link>
+                            </x-p-td>
+                            <x-p-td>{{$booking->pickup_from->format('d-m-Y')}}</x-p-td>
+                            <x-p-td center>
+                                {{ $booking->pickup_from->format("H:i") }}
+                                -
+                                {{ $booking->pickup_to->format("H:i") }}</x-p-td>
+                            <x-p-td>{{ $booking->additional_info }}</x-p-td>
+                            <x-p-td center>{{$booking->shipments->count()}}</x-p-td>
+                            <x-p-td right>
+                                <x-p-button
+                                    color="danger"
+                                    size="small"
+                                    wire:click="$dispatch('openModal', { component: 'cancel-booking-modal', arguments: { booking: {{$booking->id}} } })"
+                                >
+                                    Cancel
+                                </x-p-button>
+                            </x-p-td>
+                        </x-p-tr>
+                    @endforeach
+                </x-p-tbody>
+            </x-p-table>
+
+            <div class="py-3">
+                <x-p-pagination :source="$bookings"/>
+            </div>
+        @else
+            <x-p-not-found message="Bookings not found."/>
+        @endif
+
+    </x-p-paper>
+    <x-p-pagination livewire :source="$bookings"/>
+</div>
diff --git a/resources/views/bookings/bookings-show.blade.php b/resources/views/bookings/bookings-show.blade.php
new file mode 100644
index 0000000..2ae15e1
--- /dev/null
+++ b/resources/views/bookings/bookings-show.blade.php
@@ -0,0 +1,52 @@
+<div>
+    <x-p-paper>
+        <x-slot:title>Courier book: {{$booking->order_id}}</x-slot:title>
+        Courier has been booked for {{$booking->pickup_from->format('d-m-Y')}}
+        from {{$booking->pickup_from->format('H:i')}}
+        to {{$booking->pickup_to->format('H:i')}}.
+    </x-p-paper>
+
+    <x-p-paper class="mt-2">
+        <x-slot:title>
+            Shipments in booking
+        </x-slot:title>
+        <x-p-table size="small">
+            <x-p-tbody>
+                <x-p-thead>
+                    <x-p-tr>
+                        <x-p-th left>Number</x-p-th>
+                        <x-p-th left>Status</x-p-th>
+                        <x-p-th left>Receiver name</x-p-th>
+                        <x-p-th left>Receiver city</x-p-th>
+                        <x-p-th left>Items</x-p-th>
+                        <x-p-th left>Type</x-p-th>
+                    </x-p-tr>
+                </x-p-thead>
+                @foreach($booking->shipments as $shipment)
+                    <x-p-tr>
+                        <x-p-td>
+                            <x-p-link href="{{route('dhl24.shipments.show', $shipment->id)}}">
+                                {{$shipment->number}}
+                            </x-p-link>
+                        </x-p-td>
+                        <x-p-td>
+                            <x-dhl-ui::shipment-state :status="$shipment->tracking->first()"/>
+                            <span class="text-sm block">
+                                    {{$shipment->tracking->first()?->pivot->event_timestamp->format('d-m-Y H:i')}}
+                                </span>
+                        </x-p-td>
+                        <x-p-td>{{$shipment->receiver_name}}</x-p-td>
+                        <x-p-td>{{$shipment->receiver_city}}</x-p-td>
+                        <x-p-td>{{$shipment->items->count()}}</x-p-td>
+                        <x-p-td>
+                            <x-dhl-ui::shipment-type :shipment="$shipment"/>
+                        </x-p-td>
+                    </x-p-tr>
+                @endforeach
+            </x-p-tbody>
+        </x-p-table>
+    </x-p-paper>
+    <div class="mt-4 text-right">
+        <x-p-button color="danger">Cancel booking</x-p-button>
+    </div>
+</div>
diff --git a/resources/views/bookings/cancel-booking-modal.blade.php b/resources/views/bookings/cancel-booking-modal.blade.php
new file mode 100644
index 0000000..8c74669
--- /dev/null
+++ b/resources/views/bookings/cancel-booking-modal.blade.php
@@ -0,0 +1,11 @@
+<x-p-paper>
+    <x-slot:title>Cancel booking confirmation</x-slot:title>
+    Are you sure you want to cancel courier booking ({{$booking->order_id}})?<br/>
+    Courier was booked for {{$booking->pickup_from->format('d-m-Y')}} ({{$booking->pickup_from->format('H:i')}}-{{$booking->pickup_to->format('H:i')}})
+    <div class="mt-2 text-right">
+        <x-p-button color="success" wire:click="$dispatch('closeModal')">No</x-p-button>
+        <x-p-button color="danger" wire:click="cancelBooking">
+            Yes, remove booking
+        </x-p-button>
+    </div>
+</x-p-paper>
diff --git a/resources/views/bookings/index.blade.php b/resources/views/bookings/index.blade.php
index fa760b3..8e3dd92 100644
--- a/resources/views/bookings/index.blade.php
+++ b/resources/views/bookings/index.blade.php
@@ -35,8 +35,11 @@
                             <x-p-td>{{ $booking->additional_info }}</x-p-td>
                             <x-p-td center>{{$booking->shipments->count()}}</x-p-td>
                             <x-p-td right>
-                                <form action="{{route('dhl24.bookings.destroy', $booking)}}" id="delete_{{$booking->id}}" method="POST">@csrf @method('DELETE')</form>
-                                <x-p-button type="submit" color="danger" size="small" form="delete_{{$booking->id}}">
+                                <x-p-button
+                                    color="danger"
+                                    size="small"
+                                    wire:click="$dispatch('openModal', { component: 'cancel-booking-modal', arguments: { booking: {{$booking->id}} } })"
+                                >
                                     Cancel
                                 </x-p-button>
                             </x-p-td>
diff --git a/routes/web.php b/routes/web.php
index 300d847..ce2d47d 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -2,13 +2,15 @@
 
 
 use xGrz\Dhl24UI\Http\Controllers\CostController;
-use xGrz\Dhl24UI\Http\Controllers\CourierBookingsController;
 use xGrz\Dhl24UI\Http\Controllers\DHLLabelController;
 use xGrz\Dhl24UI\Http\Controllers\DHLReportController;
 use xGrz\Dhl24UI\Http\Controllers\SettingsContentsController;
 use xGrz\Dhl24UI\Http\Controllers\SettingsController;
 use xGrz\Dhl24UI\Http\Controllers\SettingsTrackingStatesController;
 use xGrz\Dhl24UI\Http\Controllers\SingleShipmentBookingController;
+use xGrz\Dhl24UI\Livewire\Bookings\DHLBookingsCreate;
+use xGrz\Dhl24UI\Livewire\Bookings\DHLBookingsListing;
+use xGrz\Dhl24UI\Livewire\Bookings\DHLBookingsShow;
 use xGrz\Dhl24UI\Livewire\CostsCenter\DHLCostsCenterListing;
 use xGrz\Dhl24UI\Livewire\CostsCenter\DHLCostsCenterShow;
 use xGrz\Dhl24UI\Livewire\Shipments\DHLShipmentsCreate;
@@ -37,9 +39,12 @@
         Route::get('report/{date}/{type}', DHLReportController::class)->name('report')
             ->where('date', '[0-9]{2}-[0-9]{2}-[0-9]{4}');
 
+        Route::get('bookings', DHLBookingsListing::class)->name('bookings.index');
+        Route::get('bookings/create', DHLBookingsCreate::class)->name('bookings.create');
+        Route::get('bookings/{booking}', DHLBookingsShow::class)->name('bookings.show');
 
         //Route::resource('/shipments', ShipmentsController::class);
-        Route::resource('/bookings', CourierBookingsController::class);
+        //Route::resource('/bookings', CourierBookingsController::class);
         Route::prefix('settings')
             ->name('settings.')
             ->group(function () {
diff --git a/src/DHLUIServiceProvider.php b/src/DHLUIServiceProvider.php
index 6c661e9..e12578a 100644
--- a/src/DHLUIServiceProvider.php
+++ b/src/DHLUIServiceProvider.php
@@ -5,6 +5,9 @@
 
 use Illuminate\Support\ServiceProvider;
 use Livewire\Livewire;
+use xGrz\Dhl24UI\Livewire\Bookings\DHLBookingsListing;
+use xGrz\Dhl24UI\Livewire\Bookings\DHLBookingsShow;
+use xGrz\Dhl24UI\Livewire\Bookings\DHLCancelBookingModal;
 use xGrz\Dhl24UI\Livewire\CostsCenter\DHLCostsCenterCreate;
 use xGrz\Dhl24UI\Livewire\CostsCenter\DHLCostsCenterDelete;
 use xGrz\Dhl24UI\Livewire\CostsCenter\DHLCostsCenterEdit;
@@ -64,6 +67,11 @@ public function boot(): void
         Livewire::component('daily-report', DHLDailyReport::class);
 
 
+        Livewire::component('bookings-listing', DHLBookingsListing::class);
+        Livewire::component('bookings-show', DHLBookingsShow::class);
+        Livewire::component('cancel-booking-modal', DHLCancelBookingModal::class);
+
+
 
         // Livewire::component('create-shipment', CreateShipment::class);
         Livewire::component('error-modal', DHLErrorModal::class);
diff --git a/src/Livewire/Bookings/DHLBookingsCreate.php b/src/Livewire/Bookings/DHLBookingsCreate.php
new file mode 100644
index 0000000..3183865
--- /dev/null
+++ b/src/Livewire/Bookings/DHLBookingsCreate.php
@@ -0,0 +1,14 @@
+<?php
+
+namespace xGrz\Dhl24UI\Livewire\Bookings;
+
+use Illuminate\View\View;
+use xGrz\Dhl24UI\Livewire\BaseComponent;
+
+class DHLBookingsCreate extends BaseComponent
+{
+    public function render(): View
+    {
+        return view('livewire.d-h-l-bookings-create');
+    }
+}
diff --git a/src/Livewire/Bookings/DHLBookingsListing.php b/src/Livewire/Bookings/DHLBookingsListing.php
new file mode 100644
index 0000000..4e0fef1
--- /dev/null
+++ b/src/Livewire/Bookings/DHLBookingsListing.php
@@ -0,0 +1,19 @@
+<?php
+
+namespace xGrz\Dhl24UI\Livewire\Bookings;
+
+
+use xGrz\Dhl24\Models\DHLCourierBooking;
+use xGrz\Dhl24UI\Livewire\BaseComponent;
+
+class DHLBookingsListing extends BaseComponent
+{
+    public function render()
+    {
+        return view('dhl-ui::bookings.bookings-listing', [
+            'bookings' => DHLCourierBooking::orderByDesc('pickup_from')->with('shipments')->latest()->paginate(),
+        ])
+            ->extends('p::app')
+            ->section('content');
+    }
+}
diff --git a/src/Livewire/Bookings/DHLBookingsShow.php b/src/Livewire/Bookings/DHLBookingsShow.php
new file mode 100644
index 0000000..6400eb4
--- /dev/null
+++ b/src/Livewire/Bookings/DHLBookingsShow.php
@@ -0,0 +1,20 @@
+<?php
+
+namespace xGrz\Dhl24UI\Livewire\Bookings;
+
+use Illuminate\View\View;
+use xGrz\Dhl24\Models\DHLCourierBooking;
+use xGrz\Dhl24UI\Livewire\BaseComponent;
+
+class DHLBookingsShow extends BaseComponent
+{
+
+    public DHLCourierBooking $booking;
+
+    public function render(): View
+    {
+        return view('dhl-ui::bookings.bookings-show')
+            ->extends('p::app')
+            ->section('content');
+    }
+}
diff --git a/src/Livewire/Bookings/DHLCancelBookingModal.php b/src/Livewire/Bookings/DHLCancelBookingModal.php
new file mode 100644
index 0000000..cf6acbd
--- /dev/null
+++ b/src/Livewire/Bookings/DHLCancelBookingModal.php
@@ -0,0 +1,35 @@
+<?php
+
+namespace xGrz\Dhl24UI\Livewire\Bookings;
+
+use Illuminate\View\View;
+use LivewireUI\Modal\ModalComponent;
+use xGrz\Dhl24\Exceptions\DHL24Exception;
+use xGrz\Dhl24\Models\DHLCourierBooking;
+use xGrz\Dhl24\Services\DHLBookingService;
+
+class DHLCancelBookingModal extends ModalComponent
+{
+
+    public DHLCourierBooking $booking;
+
+    public function render(): View
+    {
+        return view('dhl-ui::bookings.cancel-booking-modal');
+    }
+
+    public function cancelBooking(): void
+    {
+        try {
+            (new DHLBookingService())->cancel($this->booking);
+            session()->flash('success', 'Courier booking has been cancelled.');
+            $this->redirectRoute('dhl24.bookings.index');
+        } catch (DHL24Exception $e) {
+            $this->dispatch('openModal', component: 'error-modal', arguments: [
+                'title' => 'Shipment cannot be deleted',
+                'message' => $e->getMessage(),
+            ]);
+        }
+
+    }
+}