save

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

@@ -15,8 +15,8 @@
         ]) }}">
         <button>Deployments</button>
     </a>
+    <livewire:project.application.status :application="$application" />
     <div class="flex-1"></div>
-
     <div class="dropdown dropdown-bottom">
         <label tabindex="0">
             <x-forms.button>
@@ -60,5 +60,4 @@
     </div>
     </div>
     <livewire:project.application.deploy :applicationId="$application->id" />
-    <livewire:project.application.status :application="$application" />
 </nav>

resources/views/components/forms/textarea.blade.php

@@ -4,12 +4,11 @@
     'label' => $attributes->has('label'),
     'helper' => $attributes->has('helper'),
     'instantSave' => $attributes->has('instantSave'),
-    'noLabel' => $attributes->has('noLabel'),
     'noDirty' => $attributes->has('noDirty'),
 ])
 
 <div class=" form-control">
-    @if (!$noLabel)
+    @if ($label)
         <label class="label">
             <span class="label-text">
                 @if ($label)

resources/views/components/loading.blade.php

@@ -1 +1 @@
-<span class="loading loading-spinner"></span>
+<span class="loading loading-bars"></span>

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

@@ -1,6 +1,6 @@
 <div class="pb-6">
     <h1>Server</h1>
-    <div class="text-sm breadcrumbs pb-11">
+    <div class="pb-10 text-sm breadcrumbs">
         <ul>
             <li>{{ data_get($server, 'name') }}</li>
         </ul>
@@ -18,5 +18,7 @@
             ]) }}">
             <button>Proxy</button>
         </a>
+        <div class="flex-1"></div>
+        <livewire:server.proxy.deploy :server="$server" />
     </nav>
 </div>

resources/views/livewire/activity-monitor.blade.php

@@ -1,7 +1,13 @@
 <div>
     @if ($this->activity)
+        @if ($header)
+            <h2>Logs</h2>
+        @endif
         <div
             class="scrollbar flex flex-col-reverse w-full overflow-y-auto border border-solid rounded border-coolgray-300 max-h-[32rem] p-4 text-xs text-white">
+            @if ($isPollingActive)
+                <span class="loading loading-bars"></span>
+            @endif
             <pre class="font-mono whitespace-pre-wrap" @if ($isPollingActive) wire:poll.2000ms="polling" @endif>{{ \App\Actions\CoolifyTask\RunRemoteProcess::decodeOutput($this->activity) }}</pre>
             {{-- @else
             <pre class="whitespace-pre-wrap">Output will be here...</pre> --}}

resources/views/livewire/project/application/deployments.blade.php

@@ -1,62 +1,64 @@
  <div class="flex flex-col gap-2" wire:init='load_deployments'
      @if ($skip == 0) wire:poll.5000ms='reload_deployments' @endif>
-     @if (count($deployments) > 0)
-         <h2 class="pt-4">Deployments <span class="text-xs">({{ $deployments_count }})</span></h2>
-         @if ($show_next)
-             <x-forms.button isHighlighted wire:click="load_deployments({{ $default_take }})">Show More
-             </x-forms.button>
-         @else
-             <x-forms.button disabled>Show More
-             </x-forms.button>
-         @endif
-         @foreach ($deployments as $deployment)
-             <a @class([
-                 'bg-coolgray-200 p-2 border-l border-dashed transition-colors hover:no-underline',
-                 'cursor-not-allowed hover:bg-coolgray-200' =>
-                     data_get($deployment, 'status') === 'queued' ||
-                     data_get($deployment, 'status') === 'cancelled by system',
-                 'border-warning hover:bg-warning hover:text-black' =>
-                     data_get($deployment, 'status') === 'in_progress',
-                 'border-error hover:bg-error' =>
-                     data_get($deployment, 'status') === 'error',
-                 'border-success hover:bg-success' =>
-                     data_get($deployment, 'status') === 'finished',
-             ]) @if (data_get($deployment, 'status') !== 'cancelled by system' && data_get($deployment, 'status') !== 'queued')
-                 href="{{ $current_url . '/' . data_get($deployment, 'deployment_uuid') }}"
-         @endif
-         class="hover:no-underline">
-         <div class="flex flex-col justify-start">
-             <div>
-                 {{ $deployment->id }} <span class="text-sm text-warning">></span> {{ $deployment->deployment_uuid }}
-                 <span class="text-sm text-warning">></span>
-                 {{ $deployment->status }}
-             </div>
-             @if (data_get($deployment, 'pull_request_id'))
-                 <div>
-                     Pull Request #{{ data_get($deployment, 'pull_request_id') }}
-                     @if (data_get($deployment, 'is_webhook'))
-                         (Webhook)
-                     @endif
-                 </div>
-             @elseif (data_get($deployment, 'is_webhook'))
-                 <div>Webhook (sha
-                     @if (data_get($deployment, 'commit'))
-                         {{ data_get($deployment, 'commit') }})
-                     @else
-                         HEAD)
-                     @endif
-                 </div>
-             @endif
-             <div class="flex flex-col" x-data="elapsedTime('{{ $deployment->deployment_uuid }}', '{{ $deployment->status }}', '{{ $deployment->created_at }}', '{{ $deployment->updated_at }}')">
-                 <div>Finished <span x-text="measure_since_started()">0s</span> in <span class="font-bold"
-                         x-text="measure_finished_time()">0s</span></div>
-             </div>
-         </div>
-         </a>
-     @endforeach
- @else
-     <span wire:loading.remove wire:target='load_deployments' class="loading loading-spinner"></span>
+     <h2 class="pt-4">Deployments <span class="text-xs">({{ $deployments_count }})</span></h2>
+     @if (count($deployments) === 0)
+         <x-forms.button isHighlighted wire:click="load_deployments({{ $default_take }})">Load Deployments
+         </x-forms.button>
      @endif
+     <div wire:loading wire:target='load_deployments'>
+         <x-loading />
+     </div>
+     @if ($show_next)
+         <x-forms.button isHighlighted wire:click="load_deployments({{ $default_take }})">Show More
+         </x-forms.button>
+     @endif
+     @foreach ($deployments as $deployment)
+         <a @class([
+             'bg-coolgray-200 p-2 border-l border-dashed transition-colors hover:no-underline',
+             'cursor-not-allowed hover:bg-coolgray-200' =>
+                 data_get($deployment, 'status') === 'queued' ||
+                 data_get($deployment, 'status') === 'cancelled by system',
+             'border-warning hover:bg-warning hover:text-black' =>
+                 data_get($deployment, 'status') === 'in_progress',
+             'border-error hover:bg-error' =>
+                 data_get($deployment, 'status') === 'error',
+             'border-success hover:bg-success' =>
+                 data_get($deployment, 'status') === 'finished',
+         ]) @if (data_get($deployment, 'status') !== 'cancelled by system' && data_get($deployment, 'status') !== 'queued')
+             href="{{ $current_url . '/' . data_get($deployment, 'deployment_uuid') }}"
+     @endif
+     class="hover:no-underline">
+     <div class="flex flex-col justify-start">
+         <div>
+             {{ $deployment->id }} <span class="text-sm text-warning">></span> {{ $deployment->deployment_uuid }}
+             <span class="text-sm text-warning">></span>
+             {{ $deployment->status }}
+         </div>
+         @if (data_get($deployment, 'pull_request_id'))
+             <div>
+                 Pull Request #{{ data_get($deployment, 'pull_request_id') }}
+                 @if (data_get($deployment, 'is_webhook'))
+                     (Webhook)
+                 @endif
+             </div>
+         @elseif (data_get($deployment, 'is_webhook'))
+             <div>Webhook (sha
+                 @if (data_get($deployment, 'commit'))
+                     {{ data_get($deployment, 'commit') }})
+                 @else
+                     HEAD)
+                 @endif
+             </div>
+         @endif
+         <div class="flex flex-col" x-data="elapsedTime('{{ $deployment->deployment_uuid }}', '{{ $deployment->status }}', '{{ $deployment->created_at }}', '{{ $deployment->updated_at }}')">
+             <div>Finished <span x-text="measure_since_started()">0s</span> in <span class="font-bold"
+                     x-text="measure_finished_time()">0s</span></div>
+         </div>
+     </div>
+     </a>
+     @endforeach
+
+
      <script src="https://cdn.jsdelivr.net/npm/dayjs@1/dayjs.min.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/dayjs@1/plugin/utc.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/dayjs@1/plugin/relativeTime.js"></script>

resources/views/livewire/project/application/status.blade.php

@@ -2,14 +2,12 @@
     @if ($application->status === 'running')
         <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
         <div class="flex items-center gap-2 text-sm" wire:loading.remove.delay.longer>
-            <span class="flex w-3 h-3 rounded-full bg-success"></span>
-            <span class="text-green-500">Running</span>
+            <div class="text-xs font-medium tracking-wide text-white badge border-success">Running</div>
         </div>
     @else
         <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
         <div class="flex items-center gap-2 text-sm" wire:loading.remove.delay.longer>
-            <span class="flex w-3 h-3 rounded-full bg-error"></span>
-            <span class="text-error">Stopped</span>
+            <div class="text-xs font-medium tracking-wide text-white badge border-error">Stopped</div>
         </div>
     @endif
 </div>

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

@@ -37,17 +37,20 @@
                 @endif
             </div>
         </div>
-        <h3 class="pt-8 pb-4">Quick Actions</h3>
-        <div class="flex items-center gap-2">
-            <x-forms.button wire:click.prevent='validateServer'>
-                @if ($server->settings->is_validated)
-                    Check Connection
-                @else
-                    Validate Server
-                @endif
+        @if (!$server->settings->is_validated)
+            <x-forms.button class="mt-4" isHighlighted wire:click.prevent='validateServer'>
+                Validate Server
             </x-forms.button>
-            {{-- <x-forms.button wire:click.prevent='installDocker'>Install Docker</x-forms.button> --}}
-        </div>
+        @endif
+        @if ($server->settings->is_validated)
+            <h3 class="pt-8 pb-4">Quick Actions</h3>
+            <div class="flex items-center gap-2">
+                <x-forms.button wire:click.prevent='validateServer'>
+                    Check Connection
+                </x-forms.button>
+                {{-- <x-forms.button wire:click.prevent='installDocker'>Install Docker</x-forms.button> --}}
+            </div>
+        @endif
         <div class="pt-3 text-sm">
             @isset($uptime)
                 <p>Uptime: {{ $uptime }}</p>
@@ -76,10 +79,12 @@
         </a>
     </div>
     <div>
-        @foreach ($server->standaloneDockers as $docker)
+        @forelse ($server->standaloneDockers as $docker)
             <a href="{{ route('destination.show', ['destination_uuid' => data_get($docker, 'uuid')]) }}">
                 <button class="text-white btn-link">{{ data_get($docker, 'network') }}</button>
             </a>
-        @endforeach
+        @empty
+            <div class="text-sm">No destinations added</div>
+        @endforelse
     </div>
 </div>

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

@@ -2,38 +2,6 @@
     <x-naked-modal show="stopProxy" action="stopProxy"
         message='Are you sure you would like to stop the proxy? All resources will be unavailable.' />
     @if ($server->settings->is_validated)
-        <div class="flex items-center gap-2 mb-2">
-            <h2>Proxy</h2>
-            @if ($server->extra_attributes->proxy_type)
-                <x-forms.button isHighlighted wire:click.prevent="installProxy">
-                    Start/Reconfigure Proxy
-                </x-forms.button>
-                <x-forms.button x-on:click.prevent="stopProxy = true">Stop
-                </x-forms.button>
-                <div wire:poll.5000ms="proxyStatus">
-                    @if (
-                        $server->extra_attributes->last_applied_proxy_settings &&
-                            $server->extra_attributes->last_saved_proxy_settings !== $server->extra_attributes->last_applied_proxy_settings)
-                        <div class="text-red-500">Configuration out of sync.</div>
-                    @endif
-                </div>
-            @endif
-            @if ($server->extra_attributes->proxy_status === 'running')
-                <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
-                <div class="flex items-center gap-2 text-sm" wire:loading.remove.delay.longer>
-                    <span class="flex w-3 h-3 rounded-full bg-success"></span>
-                    <span class="text-green-500">Running</span>
-                </div>
-            @else
-                <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
-                <div class="flex items-center gap-2 text-sm" wire:loading.remove.delay.longer>
-                    <span class="flex w-3 h-3 rounded-full bg-error"></span>
-                    <span class="text-error">Stopped</span>
-                </div>
-            @endif
-        </div>
-
-        <livewire:activity-monitor />
         @if ($server->extra_attributes->proxy_type)
             <div x-init="$wire.checkProxySettingsInSync">
                 <div wire:loading wire:target="checkProxySettingsInSync">
@@ -41,15 +9,23 @@
                 </div>
                 @isset($proxy_settings)
                     @if ($selectedProxy->value === 'TRAEFIK_V2')
-                        <form wire:submit.prevent='saveConfiguration'>
+                        <form wire:submit.prevent='saveConfiguration({{ $server }})'>
                             <div class="flex items-center gap-2">
-                                <h3>Configuration</h3>
-                                <x-forms.button type="submit">Save</x-forms.button>
-                                <x-forms.button wire:click.prevent="resetProxy">
-                                    Reset Configuration
-                                </x-forms.button>
+                                <h2>Proxy</h2>
+                                <livewire:server.proxy.status :server="$server" />
                             </div>
-                            <h4>traefik.conf</h4>
+                            <div class="pb-4 text-sm">Traefik v2</div>
+                            @if (
+                                $server->extra_attributes->proxy_last_applied_settings &&
+                                    $server->extra_attributes->proxy_last_saved_settings !== $server->extra_attributes->proxy_last_applied_settings)
+                                <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.button wire:click.prevent="resetProxy">
+                                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>
@@ -57,14 +33,16 @@
                 @endisset
             </div>
         @else
-            <select wire:model="selectedProxy">
-                <option value="{{ \App\Enums\ProxyTypes::TRAEFIK_V2 }}">
-                    {{ \App\Enums\ProxyTypes::TRAEFIK_V2 }}
-                </option>
-            </select>
-            <x-forms.button wire:click="setProxy">Set Proxy</x-forms.button>
+            <div>
+                <h2>Select a Proxy</h2>
+                <x-forms.button wire:click="setProxy('{{ \App\Enums\ProxyTypes::TRAEFIK_V2 }}')">Traefik v2
+                </x-forms.button>
+            </div>
         @endif
+        <div class="container w-full pt-4 mx-auto">
+            <livewire:activity-monitor :header="true" />
+        </div>
     @else
-        <p>Server is not validated. Validate first.</p>
+        <div class="text-sm">Server is not validated. Validate first.</div>
     @endif
 </div>

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

@@ -0,0 +1,44 @@
+<div>
+    @if ($server->settings->is_validated)
+        @if ($server->extra_attributes->proxy_status === 'running')
+            <div class="dropdown dropdown-bottom">
+                <x-forms.button isHighlighted tabindex="0">
+                    Actions
+                    <x-chevron-down />
+                </x-forms.button>
+                <ul tabindex="0"
+                    class="mt-1 text-xs text-white normal-case rounded min-w-max dropdown-content menu bg-coolgray-200">
+                    <li>
+                        <div class="rounded-none hover:bg-coollabs" wire:click='deploy'><svg
+                                xmlns="http://www.w3.org/2000/svg" class="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" />
+                                <path d="M9 4.55a8 8 0 0 1 6 14.9m0 -4.45v5h5" />
+                                <path d="M5.63 7.16l0 .01" />
+                                <path d="M4.06 11l0 .01" />
+                                <path d="M4.63 15.1l0 .01" />
+                                <path d="M7.16 18.37l0 .01" />
+                                <path d="M11 19.94l0 .01" />
+                            </svg>Restart</div>
+                    </li>
+                    <li>
+                        <div class="rounded-none hover:bg-red-500" wire:click='stop'> <svg
+                                xmlns="http://www.w3.org/2000/svg" class="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" />
+                                <path
+                                    d="M5 5m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z" />
+                            </svg>Stop</div>
+                    </li>
+                </ul>
+            </div>
+        @else
+            <x-forms.button isHighlighted wire:click='deploy'> <svg xmlns="http://www.w3.org/2000/svg" class="icon"
+                    width="44" height="44" 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" />
+                    <path d="M7 4v16l13 -8z" />
+                </svg>Start</x-forms.button>
+        @endif
+    @endif
+</div>

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

@@ -0,0 +1,17 @@
+<div>
+    @if ($server->settings->is_validated)
+        <div wire:poll.5000ms="proxyStatus">
+            @if ($server->extra_attributes->proxy_status === 'running')
+                <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
+                <div class="flex items-center gap-2 text-sm" wire:loading.remove.delay.longer>
+                    <div class="text-xs font-medium tracking-wide text-white badge border-success">Running</div>
+                </div>
+            @else
+                <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
+                <div class="flex items-center gap-2 text-sm" wire:loading.remove.delay.longer>
+                    <div class="text-xs font-medium tracking-wide text-white badge border-error">Stopped</div>
+                </div>
+            @endif
+        </div>
+    @endif
+</div>

resources/views/servers.blade.php

@@ -7,14 +7,16 @@
             </li>
         </ul>
     </div>
-    @forelse ($servers as $server)
-        <a href="{{ route('server.show', ['server_uuid' => data_get($server, 'uuid')]) }}"
-            class="box">{{ $server->name }}</a>
-    @empty
-        <div class="flex flex-col">
-            <div>Without a server, you won't be able to do much.</div>
-            <div>Let's <a class="text-lg underline text-warning" href="{{ route('server.new') }}">create</a> your
-                first one.</div>
-        </div>
-    @endforelse
+    <div class="flex flex-col gap-2">
+        @forelse ($servers as $server)
+            <a href="{{ route('server.show', ['server_uuid' => data_get($server, 'uuid')]) }}"
+                class="box">{{ $server->name }}</a>
+        @empty
+            <div class="flex flex-col">
+                <div>Without a server, you won't be able to do much.</div>
+                <div>Let's <a class="text-lg underline text-warning" href="{{ route('server.new') }}">create</a> your
+                    first one.</div>
+            </div>
+        @endforelse
+    </div>
 </x-layout>