diff --git a/app/Http/Controllers/Admin/PaylaterController.php b/app/Http/Controllers/Admin/PaylaterController.php
index ebb719b..ab10828 100644
--- a/app/Http/Controllers/Admin/PaylaterController.php
+++ b/app/Http/Controllers/Admin/PaylaterController.php
@@ -5,6 +5,7 @@ namespace App\Http\Controllers\Admin;
 use App\Http\Controllers\Controller;
 use App\Models\Customer;
 use App\Models\PaylaterHistory;
+use App\Services\GeneralService;
 use Illuminate\Http\Request;
 use Illuminate\Support\Facades\DB;
 
@@ -47,7 +48,8 @@ class PaylaterController extends Controller
 
         $customer->paylaterHistories()->create([
             'credit' => $request->limit,
-            'description' => $request->description,
+            'description' => GeneralService::generatePaylaterTopupCode(),
+            'note' => $request->description,
             'type' => PaylaterHistory::TYPE_UPGRADE,
         ]);
 
diff --git a/app/Models/PaylaterHistory.php b/app/Models/PaylaterHistory.php
index 3fe1993..16335a1 100644
--- a/app/Models/PaylaterHistory.php
+++ b/app/Models/PaylaterHistory.php
@@ -33,6 +33,7 @@ class PaylaterHistory extends Model
         'debit',
         'credit',
         'description',
+        'note',
         'customer_id',
         'type',
         'is_valid',
diff --git a/app/Services/GeneralService.php b/app/Services/GeneralService.php
index 4dab4a7..cb7ac62 100644
--- a/app/Services/GeneralService.php
+++ b/app/Services/GeneralService.php
@@ -5,6 +5,7 @@ namespace App\Services;
 use App\Models\Customer;
 use App\Models\DepositHistory;
 use App\Models\DepositLocation;
+use App\Models\PaylaterHistory;
 use App\Models\PoinHistory;
 use App\Models\Sale;
 use App\Models\Setting;
@@ -147,6 +148,15 @@ class GeneralService
         return substr($r, 0, -1);
     }
 
+    public static function generatePaylaterTopupCode()
+    {
+        $code = PaylaterHistory::where('type', PaylaterHistory::TYPE_UPGRADE)
+            ->whereDate('created_at', now())
+            ->count() + 1;
+
+        return 'Invoice #TLH'.now()->format('dmy').GeneralService::formatNumberCode($code);
+    }
+
     public static function generateDepositCode()
     {
         $code = DepositHistory::where('type', DepositHistory::TYPE_DEPOSIT)
diff --git a/database/migrations/2023_06_03_033734_create_paylater_histories_table.php b/database/migrations/2023_06_03_033734_create_paylater_histories_table.php
index 025933d..72a5677 100644
--- a/database/migrations/2023_06_03_033734_create_paylater_histories_table.php
+++ b/database/migrations/2023_06_03_033734_create_paylater_histories_table.php
@@ -16,7 +16,8 @@ return new class extends Migration
 
             $table->decimal('debit', 20, 2)->default(0);
             $table->decimal('credit', 20, 2)->default(0);
-            $table->text('description')->nullable();
+            $table->string('description')->nullable();
+            $table->text('note')->nullable();
             $table->ulid('customer_id')->nullable();
             $table->smallInteger('type')->default(0);
             $table->smallInteger('is_valid')->default(0);
diff --git a/resources/js/Customer/Paylater/Detail.jsx b/resources/js/Customer/Paylater/Detail.jsx
index 9afd740..63b0920 100644
--- a/resources/js/Customer/Paylater/Detail.jsx
+++ b/resources/js/Customer/Paylater/Detail.jsx
@@ -32,6 +32,13 @@ export default function Detail({ paylater }) {
                         </div>
                     </div>
                 </div>
+                <div className="w-full px-5">
+                    <div className="my-5">
+                        <div className="bg-blue-50 text-blue-700 p-3 border rounded-md">
+                            {paylater.note}
+                        </div>
+                    </div>
+                </div>
             </div>
         </CustomerLayout>
     )
diff --git a/resources/js/Pages/CustomerHistory/PaylaterLimitHistory.jsx b/resources/js/Pages/CustomerHistory/PaylaterLimitHistory.jsx
index 608a949..0a37094 100644
--- a/resources/js/Pages/CustomerHistory/PaylaterLimitHistory.jsx
+++ b/resources/js/Pages/CustomerHistory/PaylaterLimitHistory.jsx
@@ -50,6 +50,12 @@ export default function PaylaterLimitHistory(props) {
                                 <table className="w-full text-sm text-left text-gray-500 dark:text-gray-400 mb-4">
                                     <thead className="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
                                         <tr>
+                                            <th
+                                                scope="col"
+                                                className="py-3 px-6"
+                                            >
+                                                #
+                                            </th>
                                             <th
                                                 scope="col"
                                                 className="py-3 px-6"
@@ -92,6 +98,9 @@ export default function PaylaterLimitHistory(props) {
                                                     scope="row"
                                                     className="py-4 px-6 font-medium text-gray-900 whitespace-nowrap dark:text-white"
                                                 >
+                                                    {history.description}
+                                                </td>
+                                                <td>
                                                     <Link
                                                         className="hover:underline"
                                                         href={route(
@@ -110,7 +119,7 @@ export default function PaylaterLimitHistory(props) {
                                                     {formatIDR(history.credit)}
                                                 </td>
                                                 <td className="py-4 px-6">
-                                                    {history.description}
+                                                    {history.note}
                                                 </td>
                                                 <td className="py-4 px-6">
                                                     {history.creator.name}