diff --git a/app/Livewire/SparePackData.php b/app/Livewire/SparePackData.php
new file mode 100644
index 0000000..7b8c77e
--- /dev/null
+++ b/app/Livewire/SparePackData.php
@@ -0,0 +1,55 @@
+<?php
+
+namespace App\Livewire;
+
+use App\Models\SparePacking;
+use Livewire\Component;
+
+class SparePackData extends Component
+{
+
+public $plantId;
+
+    public $sparePackNo;
+
+    public $snoCount = 0;
+
+    public $records = [];
+
+    protected $listeners = [
+        'loadData' => 'loadSparePackingData',
+    ];
+
+    public function loadSparePackingData($sparePackNo, $plantId)
+    {
+        $this->plantId = $plantId;
+        $this->sparePackNo = $sparePackNo;
+        $this->records = [];
+
+        $this->records = SparePacking::query()
+            ->where('plant_id', $this->plantId)
+            ->where('spare_packing_number', $this->sparePackNo)
+            ->orderBy('scanned_at')
+            ->get()
+            ->map(function ($record) {
+                return [
+                    'created_at' => $record->created_at,
+                    'created_by' => $record->created_by ?? '',
+                    'spare_packing_number' => $record->spare_packing_number,
+                    'item_code'          => $record->item?->code ?? '',
+                    'item_description'   => $record->item?->description ?? '',
+                    'document_number' => $record->document_number,
+                    'quantity' => $record->quantity,
+                    'scanned_at' => $record->scanned_at,
+                    'scanned_by' => $record->scanned_by ?? '',
+                ];
+            })
+            ->toArray();
+
+    }
+
+    public function render()
+    {
+        return view('livewire.spare-pack-data');
+    }
+}
diff --git a/resources/views/livewire/spare-pack-data.blade.php b/resources/views/livewire/spare-pack-data.blade.php
new file mode 100644
index 0000000..4eb66fe
--- /dev/null
+++ b/resources/views/livewire/spare-pack-data.blade.php
@@ -0,0 +1,47 @@
+<div class="p-4">
+    <h2 class="text-lg font-bold mb-4 text-gray-700 uppercase tracking-wider">
+        SPARE PACKING DATA TABLE:
+    </h2>
+    <div class="overflow-x-auto rounded-lg shadow">
+        <table class="w-full divide-y divide-gray-200 text-sm text-center">
+            <thead class="bg-gray-100 text-s font-semibold uppercase text-gray-700">
+                <tr>
+                    <th class="border px-4 py-2">No</th>
+                    <th class="border px-4 py-2">Created Datetime</th>
+                    <th class="border px-4 py-2 whitespace-nowrap">Created By</th>
+                    <th class="border px-4 py-2 whitespace-nowrap">S PACKING No</th>
+                    <th class="border px-4 py-2 whitespace-nowrap">Item Code</th>
+                    <th class="border px-4 py-2">Description</th>
+                    <th class="border px-4 py-2">Doc No</th>
+                    <th class="border px-4 py-2">Quantity</th>
+                    <th class="border px-4 py-2">Scanned Datetime</th>
+                    <th class="border px-4 py-2 whitespace-nowrap">Scanned By</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-gray-100">
+                @forelse ($records as $index => $record)
+                    <tr class="hover:bg-gray-50">
+                        <td class="border px-4 py-2">{{ $index + 1 }}</td>
+                        <td class="border px-4 py-2 whitespace-nowrap">{{ $record['created_at'] ?? '-' }}</td>
+                        <td class="border px-4 py-2 whitespace-nowrap">{{ $record['created_by'] ?? '-' }}</td>
+                        <td class="border px-4 py-2 whitespace-nowrap">{{ $record['spare_packing_number'] ?? '-' }}</td>
+                        <td class="border px-4 py-2">{{ $record['item_code'] ?? '-' }}</td>
+                        <td class="border px-4 py-2 whitespace-nowrap">{{ $record['item_description'] ?? '-' }}</td>
+                        <td class="border px-4 py-2 whitespace-nowrap">{{ $record['document_number'] ?? '-' }}</td>
+                        <td class="border px-4 py-2">{{ $record['quantity'] ?? '-' }}</td>
+                        <td class="border px-4 py-2 whitespace-nowrap">{{ $record['scanned_at'] ?? '-' }}</td>
+                        <td class="border px-4 py-2">{{ $record['scanned_by'] ?? '-' }}</td>
+                    </tr>
+                @empty
+                    <tr>
+                        <td colspan="10" class="px-4 py-4 text-center text-gray-500">
+                            No spare packing records found.
+                        </td>
+                    </tr>
+                @endforelse
+            </tbody>
+        </table>
+    </div>
+
+</div>
+