diff --git a/app/Controller/System/AboutController.php b/app/Controller/System/AboutController.php
index 62bc48d..7842b26 100644
--- a/app/Controller/System/AboutController.php
+++ b/app/Controller/System/AboutController.php
@@ -16,6 +16,7 @@ declare(strict_types=1);
 
 namespace App\Controller\System;
 
+use Composer\Autoload\ClassLoader;
 use flight\Engine;
 use flight\Session;
 use Webapp\App\Register;
@@ -91,6 +92,28 @@ class AboutController {
         $this->app->json($ajson);
     }
 
+    public function composer() {
+        $packages = [];
+        if (class_exists(ClassLoader::class, false)) {
+            $baseDir = (function () {
+                $baseDir = null;
+                @include dirname((string) (new \ReflectionClass(ClassLoader::class))->getFileName()) . '/autoload_psr4.php'; // @ may not exist
+                return $baseDir;
+            })();
+            $composer = @json_decode((string) file_get_contents($baseDir . '/composer.lock')); // @ may not exist or be valid
+            $packages = (array) @$composer->packages; // @ keys may not exist
+            array_walk($packages, function ($package) {
+                $package->hash = $package->source->reference ?? $package->dist->reference ?? null;
+            }, $packages);
+            usort($packages, fn($a, $b): int => $a->name <=> $b->name);
+        }
+        $text = '';
+        foreach ($packages as $item) {
+            $text .= '- ' .$item->name. ' Version ' .$item->version. '<br>';
+        }
+        $this->app->json([ 'html' => $text ]);
+    }
+
     public function index() {
         $ajson = [];
         $apps = $this->session->get('WEB_APP');
@@ -119,7 +142,10 @@ class AboutController {
                 <div class="text-center text-secondary">'.$apps['APP_NAMES'].' Ver. '.$apps['APP_VER'].'<br>Updated : '.$apps['APP_UPDATED'].'<br><br><span style="font-size:.9em;"><i class="bi-c-circle pe-1"></i>'.$apps['CREATOR_YEARS'].', '.$apps['CREATOR_NAME'].'<br>'.$apps['CREATOR_WEBSITE'].'.</span></div>
             </div>
             <div class="tab-pane fade" id="other" role="tabpanel" aria-labelledby="other-tab">
-                <div class="row"><div class="col" id="divBuildInfo"></div></div>
+                <div class="row mb-1"><div class="col fw-bold">Komponen Javascript</div></div>
+                <div class="row mb-1"><div class="col" id="divBuildInfo"></div></div>
+                <div class="row mb-1"><div class="col fw-bold">Composer Packages</div></div>
+                <div class="row mb-1"><div class="col overflow-auto" style="height:100px;" id="divComposerInfo"></div></div>
             </div>
             <div class="tab-pane fade" id="tool" role="tabpanel" aria-labelledby="tool-tab">
                 <div class="row mb-2">
diff --git a/app/Scripts/system/about.js b/app/Scripts/system/about.js
index b5fa6d7..85a5e70 100644
--- a/app/Scripts/system/about.js
+++ b/app/Scripts/system/about.js
@@ -15,10 +15,16 @@ var AboutJS = {
     KODE: '',
 
     index() {
-        $('#win'+this.KODE).find('#divBuildInfo').html('<p>Aplikasi dibuat dengan komponen :<br>- jQuery Version '+$().jquery+' <br>- Bootstrap Version '+$.fn.tooltip.Constructor.VERSION+' <br>- FoniaJS Version '+FoniaJS.version+' <br>- FoniaPHP Version '+FoniaJS.version+'</p>');
+        $('#win'+this.KODE).find('#divBuildInfo').html('<p>- jQuery Version '+$().jquery+' <br>- Bootstrap Version '+$.fn.tooltip.Constructor.VERSION+' <br>- FoniaJS Version '+FoniaJS.version+'</p>');
         $('#butDBCek').click(() => this.db_check());
         $('#butDBOpti').click(() => this.db_opti());
         $('#butUpdateCek').click(() => this.update_check());
+        new Request({
+            url: this.PHP + '/composer',
+            onSuccess: (ajson) => {
+                $('#win'+this.KODE).find('#divComposerInfo').html(ajson.html);
+            }
+        }).send();
     },
 
     db_check() {