more ui

app/Http/Controllers/Controller.php

@@ -33,7 +33,18 @@ public function settings()
     {
         if (auth()->user()->isAdmin()) {
             $settings = InstanceSettings::get();
-            return view('settings', [
+            return view('settings.configuration', [
+                'settings' => $settings
+            ]);
+        } else {
+            return redirect()->route('dashboard');
+        }
+    }
+    public function emails()
+    {
+        if (auth()->user()->isAdmin()) {
+            $settings = InstanceSettings::get();
+            return view('settings.emails', [
                 'settings' => $settings
             ]);
         } else {

app/Http/Livewire/Settings/Configuration.php

@@ -8,7 +8,7 @@
 use Spatie\Url\Url;
 use Symfony\Component\Yaml\Yaml;
 
-class Form extends Component
+class Configuration extends Component
 {
     public ModelsInstanceSettings $settings;
     public $do_not_track;

resources/views/components/navbar.blade.php

@@ -57,7 +57,7 @@ class="{{ request()->is('command-center') ? 'text-warning icon' : 'icon' }}" vie
                 <li title="Settings">
                     <a class="hover:bg-transparent" @if (!request()->is('settings')) href="/settings" @endif>
                         <svg xmlns="http://www.w3.org/2000/svg"
-                            class="{{ request()->is('settings') ? 'text-warning icon' : 'icon' }}" viewBox="0 0 24 24"
+                            class="{{ request()->is('settings*') ? 'text-warning icon' : 'icon' }}" viewBox="0 0 24 24"
                             stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round"
                             stroke-linejoin="round">
                             <path stroke="none" d="M0 0h24v24H0z" fill="none" />

resources/views/components/settings/navbar.blade.php

@@ -0,0 +1,21 @@
+<div class="pb-6">
+    <h1>Settings</h1>
+    <nav class="flex pt-2 pb-10 text-sm">
+        <ol class="inline-flex items-center">
+            <li class="inline-flex items-center">
+                Instance wide settings for Coolify.
+            </li>
+        </ol>
+    </nav>
+    <nav class="flex items-center gap-4 py-2 border-b-2 border-solid border-coolgray-200">
+        <a class="{{ request()->routeIs('settings.configuration') ? 'text-white' : '' }}"
+            href="{{ route('settings.configuration') }}">
+            <button>Configuration</button>
+        </a>
+        <a class="{{ request()->routeIs('settings.emails') ? 'text-white' : '' }}" href="{{ route('settings.emails') }}">
+            <button>Emails</button>
+        </a>
+        <div class="flex-1"></div>
+        <livewire:switch-team />
+    </nav>
+</div>

resources/views/livewire/force-upgrade.blade.php

@@ -1,6 +1,6 @@
 <div class="flex gap-10 text-xs text-white" x-data="{ visible: @entangle('visible') }">
     <x-forms.button x-cloak x-show="!visible" wire:click='upgrade'>
-        Force Upgrade
+        Force Upgrade Your Instance
     </x-forms.button>
     <template x-if="visible">
         <div class="bg-coollabs-gradient">

resources/views/livewire/server/proxy.blade.php

@@ -12,6 +12,10 @@
                         <form wire:submit.prevent='saveConfiguration({{ $server }})'>
                             <div class="flex items-center gap-2">
                                 <h2>Proxy</h2>
+                                <x-forms.button type="submit">Save</x-forms.button>
+                                <x-forms.button wire:click.prevent="resetProxy">
+                                    Reset to default
+                                </x-forms.button>
                                 <livewire:server.proxy.status :server="$server" />
                             </div>
                             <div class="pb-4 text-sm">Traefik v2</div>
@@ -21,13 +25,8 @@
                                 <div class="text-sm text-red-500">Configuration out of sync. Restart to get the new configs.
                                 </div>
                             @endif
-                            <x-forms.button type="submit">Save</x-forms.button>
+                            <x-forms.textarea label="Configuration file: traefik.conf" class="text-xs" noDirty
-                            <x-forms.button wire:click.prevent="resetProxy">
+                                name="proxy_settings" wire:model.defer="proxy_settings" rows="30" />
-                                Reset to default
-                            </x-forms.button>
-                            <div class="pt-4 pb-0 text-xs">traefik.conf</div>
-                            <x-forms.textarea class="text-xs" noDirty name="proxy_settings"
-                                wire:model.defer="proxy_settings" rows="30" />
                         </form>
                     @endif
                 @endisset

resources/views/livewire/settings/configuration.blade.php

@@ -1,15 +1,7 @@
 <div>
     <form wire:submit.prevent='submit' class="flex flex-col">
-        <h1>Settings</h1>
-        <nav class="flex pt-2 pb-10 text-sm">
-            <ol class="inline-flex items-center">
-                <li class="inline-flex items-center">
-                    Instance wide settings for Coolify.
-                </li>
-            </ol>
-        </nav>
         <div class="flex items-center gap-2">
-            <h3>General</h3>
+            <h3>Configuration</h3>
             <x-forms.button type="submit">
                 Save
             </x-forms.button>
@@ -29,8 +21,7 @@
         </div>
     </form>
 
-    <h3 class="pt-6">Advanced</h3>
+    <div class="flex flex-col py-6 text-right w-52">
-    <div class="flex flex-col text-right w-52">
         <x-forms.checkbox instantSave id="is_auto_update_enabled" label="Auto Update Coolify" />
         <x-forms.checkbox instantSave id="is_registration_enabled" label="Registration Allowed" />
         <x-forms.checkbox instantSave id="do_not_track" label="Do Not Track" />

resources/views/livewire/settings/email.blade.php

@@ -1,4 +1,4 @@
-<div class="py-8">
+<div>
     <form wire:submit.prevent='submit' class="flex flex-col">
         <div class="flex items-center gap-2">
             <h3>Transactional Emails</h3>

resources/views/settings.blade.php

@@ -1,10 +0,0 @@
-<x-layout>
-
-    <livewire:settings.form :settings="$settings" />
-    <livewire:settings.email :settings="$settings" />
-
-    <h3 class='pb-4'>Actions</h3>
-    @if (auth()->user()->isAdmin())
-        <livewire:force-upgrade />
-    @endif
-</x-layout>

resources/views/settings/configuration.blade.php

@@ -0,0 +1,8 @@
+<x-layout>
+    <x-settings.navbar />
+    <livewire:settings.configuration :settings="$settings" />
+
+    @if (auth()->user()->isAdmin())
+        <livewire:force-upgrade />
+    @endif
+</x-layout>

resources/views/settings/emails.blade.php

@@ -0,0 +1,4 @@
+<x-layout>
+    <x-settings.navbar />
+    <livewire:settings.email :settings="$settings" />
+</x-layout>

routes/web.php

@@ -51,7 +51,8 @@
 
 Route::middleware(['auth'])->group(function () {
     Route::get('/', [Controller::class, 'dashboard'])->name('dashboard');
-    Route::get('/settings', [Controller::class, 'settings'])->name('settings');
+    Route::get('/settings', [Controller::class, 'settings'])->name('settings.configuration');
+    Route::get('/settings/emails', [Controller::class, 'emails'])->name('settings.emails');
     Route::get('/profile', fn () => view('profile', ['request' => request()]))->name('profile');
     Route::get('/profile/team', fn () => view('team.show'))->name('team.show');
     Route::get('/profile/team/notifications', fn () => view('team.notifications'))->name('team.notifications');