From 88622ba7ea4046a6b8dbd3b7e78347302cd5d1ab Mon Sep 17 00:00:00 2001
From: Andras Bacsai <5845193+andrasbacsai@users.noreply.github.com>
Date: Tue, 2 Jun 2026 11:54:38 +0200
Subject: [PATCH] fix(ui): prevent persisted sidebar restore animation

Remove Railpack example applications from the default seed data and update
seed tests to assert they are no longer created.
---
 database/seeders/ApplicationSeeder.php        | 32 -------------------
 .../seeders/ApplicationSettingsSeeder.php     |  7 ----
 resources/views/components/navbar.blade.php   |  4 +--
 resources/views/layouts/app.blade.php         | 24 ++++++++------
 tests/Feature/ApplicationSeederTest.php       | 18 ++---------
 tests/Feature/SidebarNavigationMarkupTest.php | 19 +++++++++++
 6 files changed, 38 insertions(+), 66 deletions(-)
 create mode 100644 tests/Feature/SidebarNavigationMarkupTest.php

diff --git a/database/seeders/ApplicationSeeder.php b/database/seeders/ApplicationSeeder.php
index 212bcce79..2a0273e0f 100644
--- a/database/seeders/ApplicationSeeder.php
+++ b/database/seeders/ApplicationSeeder.php
@@ -47,22 +47,6 @@ public function run(): void
             'source_id' => 1,
             'source_type' => GithubApp::class,
         ]);
-        Application::create([
-            'uuid' => 'railpack-nodejs',
-            'name' => 'Railpack NodeJS Fastify Example',
-            'fqdn' => 'http://railpack-nodejs.127.0.0.1.sslip.io',
-            'repository_project_id' => 603035348,
-            'git_repository' => 'coollabsio/coolify-examples',
-            'git_branch' => 'v4.x',
-            'base_directory' => '/nodejs',
-            'build_pack' => 'railpack',
-            'ports_exposes' => '3000',
-            'environment_id' => 1,
-            'destination_id' => 0,
-            'destination_type' => StandaloneDocker::class,
-            'source_id' => 1,
-            'source_type' => GithubApp::class,
-        ]);
         Application::create([
             'uuid' => 'dockerfile',
             'name' => 'Dockerfile Example',
@@ -161,21 +145,5 @@ public function run(): void
             'source_id' => 1,
             'source_type' => GitlabApp::class,
         ]);
-        Application::create([
-            'uuid' => 'railpack-static',
-            'name' => 'Railpack Static Example',
-            'fqdn' => 'http://railpack-static.127.0.0.1.sslip.io',
-            'repository_project_id' => 603035348,
-            'git_repository' => 'coollabsio/coolify-examples',
-            'git_branch' => 'v4.x',
-            'base_directory' => '/static',
-            'build_pack' => 'railpack',
-            'ports_exposes' => '80',
-            'environment_id' => 1,
-            'destination_id' => 0,
-            'destination_type' => StandaloneDocker::class,
-            'source_id' => 1,
-            'source_type' => GithubApp::class,
-        ]);
     }
 }
diff --git a/database/seeders/ApplicationSettingsSeeder.php b/database/seeders/ApplicationSettingsSeeder.php
index e8be0ba70..87236df8a 100644
--- a/database/seeders/ApplicationSettingsSeeder.php
+++ b/database/seeders/ApplicationSettingsSeeder.php
@@ -22,12 +22,5 @@ public function run(): void
             $gitlabPublic->settings->is_static = true;
             $gitlabPublic->settings->save();
         }
-
-        $railpackStatic = Application::where('uuid', 'railpack-static')->first();
-        if ($railpackStatic) {
-            $railpackStatic->load(['settings']);
-            $railpackStatic->settings->is_static = true;
-            $railpackStatic->settings->save();
-        }
     }
 }
diff --git a/resources/views/components/navbar.blade.php b/resources/views/components/navbar.blade.php
index a8a9aaf76..ecd798cc2 100644
--- a/resources/views/components/navbar.blade.php
+++ b/resources/views/components/navbar.blade.php
@@ -101,7 +101,7 @@
                 }
             }
     }">
-    <div class="flex pt-4 pb-4 pl-2 pr-3 items-start gap-3 motion-safe:transition-all motion-safe:duration-200 motion-safe:ease-out motion-reduce:transition-none"
+    <div class="flex pt-4 pb-4 pl-2 pr-3 items-start gap-3"
         :class="collapsed ? 'lg:flex-col lg:items-center lg:pl-0 lg:pr-0 lg:gap-3 lg:pt-7' : 'lg:pt-6'">
         <div class="flex min-w-0 flex-1 flex-col" :class="collapsed && 'lg:hidden'">
             <a href="/" {{ wireNavigate() }} class="text-2xl font-bold tracking-tight dark:text-white hover:opacity-80 transition-opacity">Coolify</a>
@@ -130,7 +130,7 @@ class="px-1 py-0.5 text-xs font-semibold text-neutral-500 dark:text-neutral-400
             </button>
         </div>
     </div>
-    <div class="px-2 pt-2 pb-7 overflow-hidden motion-safe:transition-all motion-safe:duration-200 motion-safe:ease-out motion-reduce:transition-none" :class="collapsed && 'lg:px-0 lg:pt-0 lg:pb-4 lg:min-h-8 lg:flex lg:justify-center'">
+    <div class="px-2 pt-2 pb-7 overflow-hidden" :class="collapsed && 'lg:px-0 lg:pt-0 lg:pb-4 lg:min-h-8 lg:flex lg:justify-center'">
         <livewire:switch-team />
     </div>
     <ul role="list" class="flex flex-col flex-1 gap-y-7">
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index 1171c2b19..6be40f966 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -9,15 +9,19 @@
     @auth
         <div x-data="{
             open: false,
-            collapsed: false,
-            pageWidth: 'full',
+            collapsed: localStorage.getItem('sidebarCollapsed') === 'true',
+            pageWidth: localStorage.getItem('pageWidth') || 'full',
+            sidebarReady: false,
             init() {
-                this.pageWidth = localStorage.getItem('pageWidth');
-                if (!this.pageWidth) {
-                    this.pageWidth = 'full';
-                    localStorage.setItem('pageWidth', 'full');
+                if (!localStorage.getItem('pageWidth')) {
+                    localStorage.setItem('pageWidth', this.pageWidth);
                 }
-                this.collapsed = localStorage.getItem('sidebarCollapsed') === 'true';
+
+                this.$nextTick(() => {
+                    requestAnimationFrame(() => {
+                        this.sidebarReady = true;
+                    });
+                });
             },
             toggleSidebar() {
                 this.collapsed = !this.collapsed;
@@ -47,8 +51,8 @@
                 </div>
             </div>
 
-            <div class="hidden lg:fixed lg:inset-y-0 lg:z-50 lg:flex lg:flex-col min-w-0 transition-[width] duration-200"
-                :class="collapsed ? 'lg:w-16' : 'lg:w-56'">
+            <div class="hidden lg:fixed lg:inset-y-0 lg:z-50 lg:flex lg:flex-col min-w-0"
+                :class="[collapsed ? 'lg:w-16' : 'lg:w-56', sidebarReady ? 'transition-[width] duration-200' : '']">
                 <div class="flex flex-col overflow-y-auto grow gap-y-5 scrollbar min-w-0">
                     <x-navbar />
                 </div>
@@ -79,7 +83,7 @@ class="text-xl font-bold tracking-wide dark:text-white hover:opacity-80 transiti
                 </button>
             </div>
 
-            <main class="transition-[padding] duration-200 p-6" :class="collapsed ? 'lg:pl-[6rem]' : 'lg:pl-[16rem]'">
+            <main class="p-6" :class="[collapsed ? 'lg:pl-[6rem]' : 'lg:pl-[16rem]', sidebarReady ? 'transition-[padding] duration-200' : '']">
                     {{ $slot }}
             </main>
         </div>
diff --git a/tests/Feature/ApplicationSeederTest.php b/tests/Feature/ApplicationSeederTest.php
index ac39ea4a7..f9c59f7a5 100644
--- a/tests/Feature/ApplicationSeederTest.php
+++ b/tests/Feature/ApplicationSeederTest.php
@@ -13,7 +13,7 @@
 
 uses(RefreshDatabase::class);
 
-it('seeds a railpack nodejs fastify example alongside the existing nixpacks example', function () {
+it('seeds the default applications without railpack examples', function () {
     $this->seed([
         UserSeeder::class,
         TeamSeeder::class,
@@ -26,7 +26,6 @@
     ]);
 
     $nixpacksExample = Application::where('uuid', 'nodejs')->first();
-    $railpackExample = Application::where('uuid', 'railpack-nodejs')->first();
 
     expect($nixpacksExample)
         ->not->toBeNull()
@@ -35,17 +34,6 @@
         ->and($nixpacksExample->base_directory)->toBe('/nodejs')
         ->and($nixpacksExample->ports_exposes)->toBe('3000');
 
-    expect($railpackExample)
-        ->not->toBeNull()
-        ->and($railpackExample->name)->toBe('Railpack NodeJS Fastify Example')
-        ->and($railpackExample->fqdn)->toBe('http://railpack-nodejs.127.0.0.1.sslip.io')
-        ->and($railpackExample->repository_project_id)->toBe(603035348)
-        ->and($railpackExample->git_repository)->toBe('coollabsio/coolify-examples')
-        ->and($railpackExample->git_branch)->toBe('v4.x')
-        ->and($railpackExample->base_directory)->toBe('/nodejs')
-        ->and($railpackExample->build_pack)->toBe('railpack')
-        ->and($railpackExample->ports_exposes)->toBe('3000')
-        ->and($railpackExample->environment_id)->toBe(1)
-        ->and($railpackExample->destination_id)->toBe(0)
-        ->and($railpackExample->source_id)->toBe(1);
+    expect(Application::query()->where('build_pack', 'railpack')->exists())->toBeFalse();
+    expect(Application::query()->whereIn('uuid', ['railpack-nodejs', 'railpack-static'])->exists())->toBeFalse();
 });
diff --git a/tests/Feature/SidebarNavigationMarkupTest.php b/tests/Feature/SidebarNavigationMarkupTest.php
new file mode 100644
index 000000000..5e8ffe58f
--- /dev/null
+++ b/tests/Feature/SidebarNavigationMarkupTest.php
@@ -0,0 +1,19 @@
+<?php
+
+it('initializes persisted sidebar state before enabling layout transitions', function () {
+    $layout = file_get_contents(resource_path('views/layouts/app.blade.php'));
+
+    expect($layout)
+        ->toContain("collapsed: localStorage.getItem('sidebarCollapsed') === 'true'")
+        ->toContain('sidebarReady: false')
+        ->toContain(":class=\"[collapsed ? 'lg:w-16' : 'lg:w-56', sidebarReady ? 'transition-[width] duration-200' : '']\"")
+        ->toContain(":class=\"[collapsed ? 'lg:pl-[6rem]' : 'lg:pl-[16rem]', sidebarReady ? 'transition-[padding] duration-200' : '']\"");
+});
+
+it('does not animate navbar padding when restoring collapsed state', function () {
+    $navbar = file_get_contents(resource_path('views/components/navbar.blade.php'));
+
+    expect($navbar)
+        ->not->toContain('items-start gap-3 motion-safe:transition-all')
+        ->not->toContain('overflow-hidden motion-safe:transition-all');
+});