From bcbdee1dcc245d50bcab9cc8982e3d88fc1c2390 Mon Sep 17 00:00:00 2001
From: Andras Bacsai <andras.bacsai@gmail.com>
Date: Mon, 25 Mar 2024 13:10:05 +0100
Subject: [PATCH] Refactor Docker-related code and add conditional rendering

---
 app/Livewire/Destination/New/Docker.php          |  4 +++-
 resources/views/destination/all.blade.php        | 16 +++++++++++-----
 resources/views/livewire/server/create.blade.php |  2 +-
 .../views/livewire/server/new/by-ip.blade.php    | 12 ++++++------
 4 files changed, 21 insertions(+), 13 deletions(-)

diff --git a/app/Livewire/Destination/New/Docker.php b/app/Livewire/Destination/New/Docker.php
index d68bf84d4..d87f4bc0a 100644
--- a/app/Livewire/Destination/New/Docker.php
+++ b/app/Livewire/Destination/New/Docker.php
@@ -49,7 +49,9 @@ public function mount()
         } else {
             $this->network = new Cuid2(7);
         }
-        $this->name = str("{$this->servers->first()->name}-{$this->network}")->kebab();
+        if ($this->servers->count() > 0) {
+            $this->name = str("{$this->servers->first()->name}-{$this->network}")->kebab();
+        }
     }
 
     public function generate_name()
diff --git a/resources/views/destination/all.blade.php b/resources/views/destination/all.blade.php
index 91ab2032e..0326d8a67 100644
--- a/resources/views/destination/all.blade.php
+++ b/resources/views/destination/all.blade.php
@@ -1,11 +1,13 @@
 <x-layout>
     <div class="flex items-start gap-2">
         <h1>Destinations</h1>
-        <x-modal-input buttonTitle="+ Add" title="New Destination">
-            <livewire:destination.new.docker :server_id="$server_id" />
-        </x-modal-input>
+        @if ($servers->count() > 0)
+            <x-modal-input buttonTitle="+ Add" title="New Destination">
+                <livewire:destination.new.docker :server_id="$server_id" />
+            </x-modal-input>
+        @endif
     </div>
-    <div class="subtitle">Endpoints to deploy your resources.</div>
+    <div class="subtitle">Network endpoints to deploy your resources.</div>
     <div class="grid gap-2 lg:grid-cols-2">
         @forelse ($destinations as $destination)
             @if ($destination->getMorphClass() === 'App\Models\StandaloneDocker')
@@ -27,7 +29,11 @@
             @endif
         @empty
             <div>
-                <div>No destinations found.</div>
+                @if ($servers->count() === 0)
+                    <div> No servers found. Please add one first.</div>
+                @else
+                    <div>No destinations found.</div>
+                @endif
             </div>
         @endforelse
     </div>
diff --git a/resources/views/livewire/server/create.blade.php b/resources/views/livewire/server/create.blade.php
index 29d412a95..acab92374 100644
--- a/resources/views/livewire/server/create.blade.php
+++ b/resources/views/livewire/server/create.blade.php
@@ -1,3 +1,3 @@
-<div>
+<div class="w-full">
     <livewire:server.new.by-ip :private_keys="$private_keys" :limit_reached="$limit_reached" />
 </div>
diff --git a/resources/views/livewire/server/new/by-ip.blade.php b/resources/views/livewire/server/new/by-ip.blade.php
index 0120f1f2c..59c8c6b74 100644
--- a/resources/views/livewire/server/new/by-ip.blade.php
+++ b/resources/views/livewire/server/new/by-ip.blade.php
@@ -1,10 +1,10 @@
-<div>
+<div class="w-full">
     @if ($limit_reached)
         <x-limit-reached name="servers" />
     @else
-        <form class="flex flex-col gap-2" wire:submit='submit'>
-            <div class="flex gap-2">
-                <x-forms.input id="name" label="Name" required />
+        <form class="flex flex-col w-full gap-2" wire:submit='submit'>
+            <div class="flex w-full gap-2">
+                <x-forms.input autofocus id="name" label="Name" required />
                 <x-forms.input id="description" label="Description" />
             </div>
             <div class="flex gap-2">
@@ -23,10 +23,10 @@
                     @endif
                 @endforeach
             </x-forms.select>
-            <div class="w-96">
+            <div class="">
                 <x-forms.checkbox instantSave type="checkbox" id="is_build_server" label="Use it as a build server?" />
             </div>
-            <div class="w-96">
+            <div class="">
                 <h3 class="pt-6">Swarm <span class="text-xs text-neutral-500">(experimental)</span></h3>
                 <div class="pb-4">Read the docs <a class='dark:text-white'
                         href='https://coolify.io/docs/docker/swarm#deploy-with-persistent-storage'