diff --git a/app/Livewire/Branch.php b/app/Livewire/Branch.php
index 4e4355a..8fc28f2 100644
--- a/app/Livewire/Branch.php
+++ b/app/Livewire/Branch.php
@@ -8,8 +8,22 @@ use Livewire\Attributes\Layout;  // Required for layout declaration
 #[Layout('layouts.dashboard')]  // Attribute syntax for Laravel 11
 class Branch extends Component
 {
+    public $branches = [];
+
+    public function mount()
+    {
+        $this->loadBranches();  // Load branches initially
+    }
+
+    public function loadBranches()
+    {
+        $this->branches = collect(json_decode(file_get_contents(storage_path('app/branches.json')), true));
+    }
+
     public function render()
     {
-        return view('livewire.station-locator.branch');
+        return view('livewire.station-locator.branch', [
+            'branches' => $this->branches,  // Pass all branches to the table
+        ]);
     }
 }
diff --git a/app/Livewire/CardMember.php b/app/Livewire/CardMember.php
index 0af1943..f15d416 100644
--- a/app/Livewire/CardMember.php
+++ b/app/Livewire/CardMember.php
@@ -8,8 +8,22 @@ use Livewire\Attributes\Layout;  // Required for layout declaration
 #[Layout('layouts.dashboard')]  // Attribute syntax for Laravel 11
 class CardMember extends Component
 {
+    public $cardMembers = [];
+
+    public function mount()
+    {
+        $this->loadCardMembers();  // Load users initially
+    }
+
+    public function loadCardMembers()
+    {
+        $this->cardMembers = collect(json_decode(file_get_contents(storage_path('app/c-member.json')), true));
+    }
+
     public function render()
     {
-        return view('livewire.member-management.card-member');
+        return view('livewire.member-management.card-member', [
+            'card_members' => $this->cardMembers,  // Pass all users to the table
+        ]);
     }
 }
diff --git a/app/Livewire/CardType.php b/app/Livewire/CardType.php
index 6bf42d1..8f6f265 100644
--- a/app/Livewire/CardType.php
+++ b/app/Livewire/CardType.php
@@ -8,8 +8,23 @@ use Livewire\Attributes\Layout;  // Required for layout declaration
 #[Layout('layouts.dashboard')]  // Attribute syntax for Laravel 11
 class CardType extends Component
 {
+    public $cardTypes = [];
+
+    public function mount()
+    {
+        $this->loadCardTypes();  // Load users initially
+    }
+
+    public function loadCardTypes()
+    {
+        // Load card types from JSON file
+        $this->cardTypes = collect(json_decode(file_get_contents(storage_path('app/card-types.json')), true));
+    }
+
     public function render()
     {
-        return view('livewire.about-us.card-type');
+        return view('livewire.about-us.card-type', [
+            'users' => $this->cardTypes,  // Pass all users to the table
+        ]);
     }
 }
diff --git a/app/Livewire/Components/Table.php b/app/Livewire/Components/Table.php
index ed675af..e383995 100644
--- a/app/Livewire/Components/Table.php
+++ b/app/Livewire/Components/Table.php
@@ -10,6 +10,7 @@ class Table extends Component
     public $rows = [];
     public $selected = [];
     public $selectAll = false;
+    public $hasCheckbox = true;
     public $hasActions = false;
     public $isViewPage = false;
     public $search = '';
diff --git a/app/Livewire/Fuel.php b/app/Livewire/Fuel.php
index a4c8ec4..e6923c4 100644
--- a/app/Livewire/Fuel.php
+++ b/app/Livewire/Fuel.php
@@ -8,8 +8,22 @@ use Livewire\Attributes\Layout;  // Required for layout declaration
 #[Layout('layouts.dashboard')]  // Attribute syntax for Laravel 11
 class Fuel extends Component
 {
+    public $fuels = [];
+
+    public function mount()
+    {
+        $this->loadFuel();  // Load fuel initially
+    }
+
+    public function loadFuel()
+    {
+        $this->fuels = collect(json_decode(file_get_contents(storage_path('app/fuels.json')), true));
+    }
+
     public function render()
     {
-        return view('livewire.station-locator.fuel');
+        return view('livewire.station-locator.fuel', [
+            'fuels' => $this->fuels,  // Pass all fuel to the table
+        ]);
     }
 }
diff --git a/app/Livewire/LockedAccount.php b/app/Livewire/LockedAccount.php
index 6749e8c..516d8c1 100644
--- a/app/Livewire/LockedAccount.php
+++ b/app/Livewire/LockedAccount.php
@@ -8,8 +8,22 @@ use Livewire\Attributes\Layout;  // Required for layout declaration
 #[Layout('layouts.dashboard')]  // Attribute syntax for Laravel 11
 class LockedAccount extends Component
 {
+    public $lockedAccounts = [];
+
+    public function mount()
+    {
+        $this->loadLockedAccounts();  // Load users initially
+    }
+
+    public function loadLockedAccounts()
+    {
+        $this->lockedAccounts = collect(json_decode(file_get_contents(storage_path('app/locked-accounts.json')), true));
+    }
+
     public function render()
     {
-        return view('livewire.member-management.locked-account');
+        return view('livewire.member-management.locked-account', [
+            'locked_accounts' => $this->lockedAccounts,  // Pass all users to the table
+        ]);
     }
-}
+}
\ No newline at end of file
diff --git a/app/Livewire/Notification.php b/app/Livewire/Notification.php
index 63b0f6f..380e407 100644
--- a/app/Livewire/Notification.php
+++ b/app/Livewire/Notification.php
@@ -5,16 +5,8 @@ namespace App\Livewire;
 use Livewire\Component;
 class Notification extends Component
 {
-    public $search = '';
     public $notifs = [];
 
-    // protected $queryString = ['search'];
-
-    // // Reset the current page when search is updated
-    // public function updatingSearch()
-    // {
-    //     $this->search = $this->search;
-    // }
 
     public function mount()
     {
diff --git a/app/Livewire/PhotoSlider.php b/app/Livewire/PhotoSlider.php
index d79531c..626fc42 100644
--- a/app/Livewire/PhotoSlider.php
+++ b/app/Livewire/PhotoSlider.php
@@ -8,8 +8,22 @@ use Livewire\Attributes\Layout;  // Required for layout declaration
 #[Layout('layouts.dashboard')]  // Attribute syntax for Laravel 11
 class PhotoSlider extends Component
 {
+    public $photoSliders = [];
+
+    public function mount()
+    {
+        $this->loadPhotoSliders();  // Load users initially
+    }
+
+    public function loadPhotoSliders()
+    {
+        $this->photoSliders = collect(json_decode(file_get_contents(storage_path('app/photo-sliders.json')), true));
+    }
+
     public function render()
     {
-        return view('livewire.home-page-mobile.photo-slider');
+        return view('livewire.home-page-mobile.photo-slider', [
+            'photo_slider' => $this->photoSliders,  // Pass all users to the table
+        ]);
     }
 }
diff --git a/app/Livewire/Promotion.php b/app/Livewire/Promotion.php
index 0680f9c..2123d6f 100644
--- a/app/Livewire/Promotion.php
+++ b/app/Livewire/Promotion.php
@@ -8,8 +8,22 @@ use Livewire\Attributes\Layout;  // Required for layout declaration
 #[Layout('layouts.dashboard')]  // Attribute syntax for Laravel 11
 class Promotion extends Component
 {
+    public $promotions = [];
+
+    public function mount()
+    {
+        $this->loadPromotions();  // Load users initially
+    }
+
+    public function loadPromotions()
+    {
+        $this->promotions = collect(json_decode(file_get_contents(storage_path('app/promotions.json')), true));
+    }
+
     public function render()
     {
-        return view('livewire.promotion.promotion');
+        return view('livewire.promotion.promotion', [
+            'promotions' => $this->promotions, 
+        ]);
     }
 }
diff --git a/app/Livewire/Station.php b/app/Livewire/Station.php
index 7dc8dc0..f01033a 100644
--- a/app/Livewire/Station.php
+++ b/app/Livewire/Station.php
@@ -8,8 +8,22 @@ use Livewire\Attributes\Layout;  // Required for layout declaration
 #[Layout('layouts.dashboard')]  // Attribute syntax for Laravel 11
 class Station extends Component
 {
+    public $stations = [];
+
+    public function mount()
+    {
+        $this->loadStations();  // Load stations initially
+    }
+
+    public function loadStations()
+    {
+        $this->stations = collect(json_decode(file_get_contents(storage_path('app/stations.json')), true));
+    }
+
     public function render()
     {
-        return view('livewire.station-locator.station');
+        return view('livewire.station-locator.station', [
+            'stations' => $this->stations,  // Pass all stations to the table
+        ]);
     }
 }
diff --git a/app/Livewire/TermsAndPrivacy.php b/app/Livewire/TermsAndPrivacy.php
index d322f9c..c77d0d6 100644
--- a/app/Livewire/TermsAndPrivacy.php
+++ b/app/Livewire/TermsAndPrivacy.php
@@ -8,8 +8,23 @@ use Livewire\Attributes\Layout;  // Required for layout declaration
 #[Layout('layouts.dashboard')]  // Attribute syntax for Laravel 11
 class TermsAndPrivacy extends Component
 {
+    public $termsAndPrivacy = [];
+
+    public function mount()
+    {
+        $this->loadTermsAndPrivacy();  // Load users initially
+    }
+
+    public function loadTermsAndPrivacy()
+    {
+        // Load card types from JSON file
+        $this->termsAndPrivacy = collect(json_decode(file_get_contents(storage_path('app/terms-privacy.json')), true));
+    }
+
     public function render()
     {
-        return view('livewire.about-us.terms-and-privacy');
+        return view('livewire.about-us.terms-and-privacy', [
+            'terms_and_privacy' => $this->termsAndPrivacy,  // Pass all users to the table
+        ]);
     }
 }
diff --git a/app/Livewire/TopUp.php b/app/Livewire/TopUp.php
index fde724d..3da35cb 100644
--- a/app/Livewire/TopUp.php
+++ b/app/Livewire/TopUp.php
@@ -8,8 +8,22 @@ use Livewire\Attributes\Layout;  // Required for layout declaration
 #[Layout('layouts.dashboard')]  // Attribute syntax for Laravel 11
 class TopUp extends Component
 {
+    public $topUp = [];
+
+    public function mount()
+    {
+        $this->loadTopUp();  // Load users initially
+    }
+
+    public function loadTopUp()
+    {
+        $this->topUp = collect(json_decode(file_get_contents(storage_path('app/top-up.json')), true));
+    }
+
     public function render()
     {
-        return view('livewire.top-up.top-up');
+        return view('livewire.top-up.top-up', [
+            'top_up' => $this->topUp,  // Pass all users to the table
+        ]);
     }
-}
+}
\ No newline at end of file
diff --git a/resources/views/livewire/about-us/card-type.blade.php b/resources/views/livewire/about-us/card-type.blade.php
index 98cab90..821216e 100644
--- a/resources/views/livewire/about-us/card-type.blade.php
+++ b/resources/views/livewire/about-us/card-type.blade.php
@@ -1,5 +1,13 @@
 <div>
 {{-- Top Nav --}}
 @include('livewire.about-us.top-nav.card-type')
-<h1>This is card type page</h1>
+<livewire:components.table 
+    :columns="[
+        ['label' => 'Card Type Code', 'field' => 'card_type_code'],
+        ['label' => 'Card Type Description', 'field' => 'card_type_description'],
+    ]"
+    :rows="$cardTypes" 
+    :hasActions="true"
+    :isViewPage="false"
+    />
 </div>
diff --git a/resources/views/livewire/about-us/terms-and-privacy.blade.php b/resources/views/livewire/about-us/terms-and-privacy.blade.php
index b2d92f3..09a120f 100644
--- a/resources/views/livewire/about-us/terms-and-privacy.blade.php
+++ b/resources/views/livewire/about-us/terms-and-privacy.blade.php
@@ -1,5 +1,15 @@
 <div>
-{{-- Top Nav --}}
-@include('livewire.about-us.top-nav.terms-and-privacy')
-<h1>This is terms and privacy page</h1>
+    {{-- Top Nav --}}
+    @include('livewire.about-us.top-nav.terms-and-privacy')
+
+    <livewire:components.table 
+        :columns="[
+            ['label' => 'Title', 'field' => 'title'],
+            ['label' => 'Details', 'field' => 'details'],
+            ['label' => 'Type', 'field' => 'type']
+        ]"
+        :rows="$termsAndPrivacy" 
+        :hasActions="true"
+        :isViewPage="false"
+    />
 </div>
diff --git a/resources/views/livewire/components/table.blade.php b/resources/views/livewire/components/table.blade.php
index 3b7a59f..896c7f5 100644
--- a/resources/views/livewire/components/table.blade.php
+++ b/resources/views/livewire/components/table.blade.php
@@ -11,10 +11,12 @@
         <table class="table-auto w-full">
             <thead class="bg-gray-100">
                 <tr>
-                    <!-- Select All Checkbox -->
-                    <th class="px-4 py-2 text-left">
-                        <input type="checkbox" wire:model="selectAll" wire:change="selectAllRows" class="cursor-pointer">
-                    </th>
+                    <!-- Conditionally display Select All Checkbox in the header -->
+                    @if ($hasCheckbox)
+                        <th class="px-4 py-2 text-left">
+                            <input type="checkbox" wire:model="selectAll" wire:change="selectAllRows" class="cursor-pointer">
+                        </th>
+                    @endif
 
                     @foreach ($columns as $column)
                         <th class="px-4 py-2 text-left cursor-pointer" wire:click="sortBy('{{ $column['field'] }}')">
@@ -22,14 +24,11 @@
                             <!-- Sorting Icons -->
                             @if ($sortField === $column['field'])
                                 @if ($sortDirection === 'asc')
-                                    <!-- Ascending Triangle (Up) -->
                                     <span class="ml-2">&#8593;</span> <!-- Up Triangle -->
                                 @else
-                                    <!-- Descending Triangle (Down) -->
-                                    <span class="ml-2">	&#8595;</span> <!-- Down Triangle -->
+                                    <span class="ml-2">&#8595;</span> <!-- Down Triangle -->
                                 @endif
                             @else
-                                <!-- Default to Ascending Triangle (Up) -->
                                 <span class="ml-2">&#8597;</span> <!-- Up Triangle by default -->
                             @endif
                         </th>
@@ -43,11 +42,13 @@
             <tbody>
                 @forelse ($rows as $row)
                     <tr class="hover:bg-gray-50">
-                        <!-- Row Checkbox -->
-                        <td class="px-4 py-2">
-                            <input type="checkbox" wire:click="selectRow('{{ $row['id'] }}')" 
-                                   @if(in_array($row['id'], $selected)) checked @endif class="cursor-pointer">
-                        </td>
+                        <!-- Conditionally display Row Checkbox based on hasCheckbox -->
+                        @if ($hasCheckbox)
+                            <td class="px-4 py-2">
+                                <input type="checkbox" wire:click="selectRow('{{ $row['id'] }}')" 
+                                       @if(in_array($row['id'], $selected)) checked @endif class="cursor-pointer">
+                            </td>
+                        @endif
 
                         @foreach ($columns as $column)
                             <td class="px-4 py-2">
diff --git a/resources/views/livewire/home-page-mobile/photo-slider.blade.php b/resources/views/livewire/home-page-mobile/photo-slider.blade.php
index aeebaa6..51f5934 100644
--- a/resources/views/livewire/home-page-mobile/photo-slider.blade.php
+++ b/resources/views/livewire/home-page-mobile/photo-slider.blade.php
@@ -1,5 +1,16 @@
 <div>
 {{-- Top Nav --}}
 @include('livewire.home-page-mobile.top-nav.photo-slider')
-<h1>This is photo slider page</h1>
+<livewire:components.table 
+    :columns="[
+        ['label' => 'Title', 'field' => 'title'],
+        ['label' => 'Type', 'field' => 'type'],
+        ['label' => 'Start Date', 'field' => 'start_date'],
+        ['label' => 'End Date', 'field' => 'end_date'],
+    ]"
+    :rows="$photoSliders" 
+    :hasCheckbox="true"
+    :hasActions="true"
+    :isViewPage="false"
+    />
 </div>
diff --git a/resources/views/livewire/member-management/card-member.blade.php b/resources/views/livewire/member-management/card-member.blade.php
index 7f79557..91d650c 100644
--- a/resources/views/livewire/member-management/card-member.blade.php
+++ b/resources/views/livewire/member-management/card-member.blade.php
@@ -1,5 +1,18 @@
 <div>
 {{-- Top Nav --}}
 @include('livewire.member-management.top-nav.card-member')
-<h1>This is card member page</h1>
+<livewire:components.table 
+    :columns="[
+        ['label' => 'Card Number', 'field' => 'card_number'],
+        ['label' => 'First Name', 'field' => 'first_name'],
+        ['label' => 'Last Name', 'field' => 'last_name'],
+        ['label' => 'Birthday', 'field' => 'birthday'],
+        ['label' => 'Card Type', 'field' => 'card_type'],
+        ['label' => 'Status', 'field' => 'status'],
+    ]"
+    :rows="$cardMembers" 
+    :hasCheckbox="false"
+    :hasActions="true"
+    :isViewPage="true"
+    />
 </div>
\ No newline at end of file
diff --git a/resources/views/livewire/member-management/locked-account.blade.php b/resources/views/livewire/member-management/locked-account.blade.php
index a4538aa..5d133cf 100644
--- a/resources/views/livewire/member-management/locked-account.blade.php
+++ b/resources/views/livewire/member-management/locked-account.blade.php
@@ -1,7 +1,18 @@
 <div>
 {{-- Top Nav --}}
 @include('livewire.member-management.top-nav.locked-account')
-    <div>
-        <h1>This is locked account page</h1>
-    </div>
+<livewire:components.table 
+    :columns="[
+        ['label' => 'Card Number', 'field' => 'card_number'],
+        ['label' => 'First Name', 'field' => 'first_name'],
+        ['label' => 'Last Name', 'field' => 'last_name'],
+        ['label' => 'Birthday', 'field' => 'birthday'],
+        ['label' => 'Card Type', 'field' => 'card_type'],
+        ['label' => 'Status', 'field' => 'status'],
+    ]"
+    :rows="$lockedAccounts" 
+    :hasCheckbox="false"
+    :hasActions="true"
+    :isViewPage="true"
+    />
 </div>
diff --git a/resources/views/livewire/promotion/promotion.blade.php b/resources/views/livewire/promotion/promotion.blade.php
index 83334d9..e471944 100644
--- a/resources/views/livewire/promotion/promotion.blade.php
+++ b/resources/views/livewire/promotion/promotion.blade.php
@@ -1,5 +1,17 @@
 <div>
 {{-- Top Nav --}}
 @include('livewire.promotion.top-nav.promotion')
-<h1>This is card type page</h1>
+<livewire:components.table 
+    :columns="[
+        ['label' => 'Title', 'field' => 'title'],
+        ['label' => 'Type', 'field' => 'type'],
+        ['label' => 'Start Date', 'field' => 'start_date'],
+        ['label' => 'End Date', 'field' => 'end_date'],
+        ['label' => 'Status', 'field' => 'status'],
+    ]"
+    :rows="$promotions" 
+    :hasCheckbox="true"
+    :hasActions="true"
+    :isViewPage="false"
+    />
 </div>
diff --git a/resources/views/livewire/station-locator/branch.blade.php b/resources/views/livewire/station-locator/branch.blade.php
index 7d58844..89d8c97 100644
--- a/resources/views/livewire/station-locator/branch.blade.php
+++ b/resources/views/livewire/station-locator/branch.blade.php
@@ -1,5 +1,17 @@
 <div>
 {{-- Top Nav --}}
 @include('livewire.station-locator.top-nav.branch')
-<h1>This is branch page</h1>
+<livewire:components.table 
+    :columns="[
+        ['label' => 'Branch Code', 'field' => 'branch_code'],
+        ['label' => 'Branch Name', 'field' => 'branch_name'],
+        ['label' => 'Details', 'field' => 'details'],
+        ['label' => 'Date Created', 'field' => 'date_created'],
+        ['label' => 'Created By', 'field' => 'created_by'],
+        ['label' => 'Date Modified', 'field' => 'date_modified'],
+    ]"
+    :rows="$branches" 
+    :hasActions="true"
+    :isViewPage="false"
+    />
 </div>
\ No newline at end of file
diff --git a/resources/views/livewire/station-locator/fuel.blade.php b/resources/views/livewire/station-locator/fuel.blade.php
index 0b5e92a..02c4a77 100644
--- a/resources/views/livewire/station-locator/fuel.blade.php
+++ b/resources/views/livewire/station-locator/fuel.blade.php
@@ -1,5 +1,14 @@
 <div>
 {{-- Top Nav --}}
 @include('livewire.station-locator.top-nav.fuel')
-<h1>This is fuel page</h1>
+<livewire:components.table 
+    :columns="[
+        ['label' => 'Fuel Name', 'field' => 'fuel_name'],
+        ['label' => 'Date Created', 'field' => 'date_created'],
+        ['label' => 'Date Modified', 'field' => 'date_modified'],
+    ]"
+    :rows="$fuels" 
+    :hasActions="true"
+    :isViewPage="false"
+    />
 </div>
\ No newline at end of file
diff --git a/resources/views/livewire/station-locator/station.blade.php b/resources/views/livewire/station-locator/station.blade.php
index ed744b3..e507427 100644
--- a/resources/views/livewire/station-locator/station.blade.php
+++ b/resources/views/livewire/station-locator/station.blade.php
@@ -1,5 +1,18 @@
 <div>
 {{-- Top Nav --}}
 @include('livewire.station-locator.top-nav.station')
-<h1>This is card type page</h1>
+<livewire:components.table 
+    :columns="[
+        ['label' => 'Station Code', 'field' => 'station_code'],
+        ['label' => 'Station Name', 'field' => 'station_name'],
+        ['label' => 'Branch Name', 'field' => 'branch_name'],
+        ['label' => 'Date Created', 'field' => 'date_created'],
+        ['label' => 'Created By', 'field' => 'created_by'],
+        ['label' => 'Modified By', 'field' => 'modified_by'],
+        ['label' => 'Date Modified', 'field' => 'date_modified'],
+    ]"
+    :rows="$stations" 
+    :hasActions="true"
+    :isViewPage="false"
+    />
 </div>
diff --git a/resources/views/livewire/top-up/top-up.blade.php b/resources/views/livewire/top-up/top-up.blade.php
index de0e9ff..57b37fd 100644
--- a/resources/views/livewire/top-up/top-up.blade.php
+++ b/resources/views/livewire/top-up/top-up.blade.php
@@ -1,5 +1,15 @@
 <div>
 {{-- Top Nav --}}
 @include('livewire.top-up.top-nav.top-up')
-<h1>This is top up page</h1>
+<livewire:components.table 
+    :columns="[
+        ['label' => 'Free Code', 'field' => 'free_code'],
+        ['label' => 'Name', 'field' => 'name'],
+        ['label' => 'Value', 'field' => 'value'],
+        ['label' => 'Type', 'field' => 'type'],
+    ]"
+    :rows="$topUp" 
+    :hasActions="true"
+    :isViewPage="false"
+    />
 </div>
\ No newline at end of file