From 26ccc4afb4e5a92ed25dd64b340f9f03c9968b7e Mon Sep 17 00:00:00 2001
From: Andras Bacsai <andras.bacsai@gmail.com>
Date: Mon, 5 Feb 2024 15:13:39 +0100
Subject: [PATCH] Refactor server validation and installation logic

---
 app/Livewire/Server/ValidateAndInstall.php    | 21 +++--
 .../server/validate-and-install.blade.php     | 82 +++++++++++++------
 2 files changed, 70 insertions(+), 33 deletions(-)

diff --git a/app/Livewire/Server/ValidateAndInstall.php b/app/Livewire/Server/ValidateAndInstall.php
index c93f51735..e5d2a4b39 100644
--- a/app/Livewire/Server/ValidateAndInstall.php
+++ b/app/Livewire/Server/ValidateAndInstall.php
@@ -17,16 +17,22 @@ class ValidateAndInstall extends Component
     public $docker_version = null;
     public $error = null;
 
-    protected $listeners = ['validateServer', 'validateDockerEngine'];
+    protected $listeners = ['validateServer' => 'init', 'validateDockerEngine', 'validateServerNow' => 'validateServer'];
 
-    public function validateServer(bool $install = true)
+    public function init(bool $install = true)
     {
         $this->install = $install;
         $this->uptime = null;
         $this->supported_os_type = null;
         $this->docker_installed = null;
         $this->docker_version = null;
+        $this->error = null;
+        $this->number_of_tries = 0;
+        $this->dispatch('validateServerNow');
+    }
 
+    public function validateServer()
+    {
         try {
             $this->validateConnection();
             $this->validateOS();
@@ -46,7 +52,7 @@ public function validateConnection()
     {
         $this->uptime = $this->server->validateConnection();
         if (!$this->uptime) {
-            $this->dispatch('error', 'Server is not reachable.', 'Please validate your configuration and connection.<br><br>Check this <a target="_blank" class="underline" href="https://coolify.io/docs/server/openssh">documentation</a> for further help.');
+            $this->error = 'Server is not reachable. Please validate your configuration and connection.<br><br>Check this <a target="_blank" class="underline" href="https://coolify.io/docs/server/openssh">documentation</a> for further help.';
             return;
         }
     }
@@ -54,7 +60,7 @@ public function validateOS()
     {
         $this->supported_os_type = $this->server->validateOS();
         if (!$this->supported_os_type) {
-            $this->dispatch('error', 'Server OS type is not supported.', 'Please install Docker manually before continuing: <a target="_blank" class="underline" href="https://docs.docker.com/engine/install/#server">documentation</a>.');
+            $this->error = 'Server OS type is not supported. Please install Docker manually before continuing: <a target="_blank" class="underline" href="https://docs.docker.com/engine/install/#server">documentation</a>.';
             return;
         }
     }
@@ -66,16 +72,15 @@ public function validateDockerEngine()
                 ray($this->number_of_tries, $this->max_tries);
                 if ($this->number_of_tries == $this->max_tries) {
                     $this->error = 'Docker Engine could not be installed. Please install Docker manually before continuing: <a target="_blank" class="underline" href="https://docs.docker.com/engine/install/#server">documentation</a>.';
-                        return;
+                    return;
                 } else {
                     $activity = $this->server->installDocker();
                     $this->number_of_tries++;
                     $this->dispatch('newActivityMonitor', $activity->id, 'validateDockerEngine');
                     return;
-
                 }
             } else {
-                $this->dispatch('error', 'Docker Engine is not installed.', 'Please install Docker manually before continuing: <a target="_blank" class="underline" href="https://docs.docker.com/engine/install/#server">documentation</a>.');
+                $this->error = 'Docker Engine is not installed. Please install Docker manually before continuing: <a target="_blank" class="underline" href="https://docs.docker.com/engine/install/#server">documentation</a>.';
                 return;
             }
         } else {
@@ -89,7 +94,7 @@ public function validateDockerVersion()
             $this->dispatch('serverInstalled');
             $this->dispatch('success', 'Server validated successfully.');
         } else {
-            $this->dispatch('error', 'Docker Engine version is not 22+.', 'Please install Docker manually before continuing: <a target="_blank" class="underline" href="https://docs.docker.com/engine/install/#server">documentation</a>.');
+            $this->error = 'Docker Engine version is not 22+. Please install Docker manually before continuing: <a target="_blank" class="underline" href="https://docs.docker.com/engine/install/#server">documentation</a>.';
             return;
         }
     }
diff --git a/resources/views/livewire/server/validate-and-install.blade.php b/resources/views/livewire/server/validate-and-install.blade.php
index 08cefd97d..9eaa33d9b 100644
--- a/resources/views/livewire/server/validate-and-install.blade.php
+++ b/resources/views/livewire/server/validate-and-install.blade.php
@@ -11,31 +11,63 @@
                 </g>
             </svg></div>
     @else
-        <div class="w-64"><x-loading text="Server is reachable" /></div>
+        @if ($error)
+            <div class="flex w-64 gap-2">Server is reachable: <svg class="w-5 h-5 text-error" viewBox="0 0 256 256"
+                    xmlns="http://www.w3.org/2000/svg">
+                    <path fill="currentColor"
+                        d="M208.49 191.51a12 12 0 0 1-17 17L128 145l-63.51 63.49a12 12 0 0 1-17-17L111 128L47.51 64.49a12 12 0 0 1 17-17L128 111l63.51-63.52a12 12 0 0 1 17 17L145 128Z" />
+                </svg></div>
+        @else
+            <div class="w-64"><x-loading text="Server is reachable: " /></div>
+        @endif
     @endif
-    @isset($supported_os_type)
-        <div class="flex w-64 gap-2">Supported OS type: <svg class="w-5 h-5 text-success" viewBox="0 0 256 256"
-                xmlns="http://www.w3.org/2000/svg">
-                <g fill="currentColor">
-                    <path
-                        d="m237.66 85.26l-128.4 128.4a8 8 0 0 1-11.32 0l-71.6-72a8 8 0 0 1 0-11.31l24-24a8 8 0 0 1 11.32 0l36.68 35.32a8 8 0 0 0 11.32 0l92.68-91.32a8 8 0 0 1 11.32 0l24 23.6a8 8 0 0 1 0 11.31"
-                        opacity=".2" />
-                    <path
-                        d="m243.28 68.24l-24-23.56a16 16 0 0 0-22.58 0L104 136l-.11-.11l-36.64-35.27a16 16 0 0 0-22.57.06l-24 24a16 16 0 0 0 0 22.61l71.62 72a16 16 0 0 0 22.63 0l128.4-128.38a16 16 0 0 0-.05-22.67M103.62 208L32 136l24-24l.11.11l36.64 35.27a16 16 0 0 0 22.52 0L208.06 56L232 79.6Z" />
-                </g>
-            </svg></div>
-    @endisset
-    @if ($docker_installed)
-        <div class="flex w-64 gap-2">Docker is installed: <svg class="w-5 h-5 text-success" viewBox="0 0 256 256"
-                xmlns="http://www.w3.org/2000/svg">
-                <g fill="currentColor">
-                    <path
-                        d="m237.66 85.26l-128.4 128.4a8 8 0 0 1-11.32 0l-71.6-72a8 8 0 0 1 0-11.31l24-24a8 8 0 0 1 11.32 0l36.68 35.32a8 8 0 0 0 11.32 0l92.68-91.32a8 8 0 0 1 11.32 0l24 23.6a8 8 0 0 1 0 11.31"
-                        opacity=".2" />
-                    <path
-                        d="m243.28 68.24l-24-23.56a16 16 0 0 0-22.58 0L104 136l-.11-.11l-36.64-35.27a16 16 0 0 0-22.57.06l-24 24a16 16 0 0 0 0 22.61l71.62 72a16 16 0 0 0 22.63 0l128.4-128.38a16 16 0 0 0-.05-22.67M103.62 208L32 136l24-24l.11.11l36.64 35.27a16 16 0 0 0 22.52 0L208.06 56L232 79.6Z" />
-                </g>
-            </svg></div>
+    @if ($uptime)
+        @if ($supported_os_type)
+            <div class="flex w-64 gap-2">Supported OS type: <svg class="w-5 h-5 text-success" viewBox="0 0 256 256"
+                    xmlns="http://www.w3.org/2000/svg">
+                    <g fill="currentColor">
+                        <path
+                            d="m237.66 85.26l-128.4 128.4a8 8 0 0 1-11.32 0l-71.6-72a8 8 0 0 1 0-11.31l24-24a8 8 0 0 1 11.32 0l36.68 35.32a8 8 0 0 0 11.32 0l92.68-91.32a8 8 0 0 1 11.32 0l24 23.6a8 8 0 0 1 0 11.31"
+                            opacity=".2" />
+                        <path
+                            d="m243.28 68.24l-24-23.56a16 16 0 0 0-22.58 0L104 136l-.11-.11l-36.64-35.27a16 16 0 0 0-22.57.06l-24 24a16 16 0 0 0 0 22.61l71.62 72a16 16 0 0 0 22.63 0l128.4-128.38a16 16 0 0 0-.05-22.67M103.62 208L32 136l24-24l.11.11l36.64 35.27a16 16 0 0 0 22.52 0L208.06 56L232 79.6Z" />
+                    </g>
+                </svg></div>
+        @else
+            @if ($error)
+                <div class="flex w-64 gap-2">Server is reachable: <svg class="w-5 h-5 text-error" viewBox="0 0 256 256"
+                        xmlns="http://www.w3.org/2000/svg">
+                        <path fill="currentColor"
+                            d="M208.49 191.51a12 12 0 0 1-17 17L128 145l-63.51 63.49a12 12 0 0 1-17-17L111 128L47.51 64.49a12 12 0 0 1 17-17L128 111l63.51-63.52a12 12 0 0 1 17 17L145 128Z" />
+                    </svg></div>
+            @else
+                <div class="w-64"><x-loading text="Server is reachable:" /></div>
+            @endif
+        @endif
+    @endif
+    @if ($uptime && $supported_os_type)
+        @if ($docker_installed)
+            <div class="flex w-64 gap-2">Docker is installed: <svg class="w-5 h-5 text-success" viewBox="0 0 256 256"
+                    xmlns="http://www.w3.org/2000/svg">
+                    <g fill="currentColor">
+                        <path
+                            d="m237.66 85.26l-128.4 128.4a8 8 0 0 1-11.32 0l-71.6-72a8 8 0 0 1 0-11.31l24-24a8 8 0 0 1 11.32 0l36.68 35.32a8 8 0 0 0 11.32 0l92.68-91.32a8 8 0 0 1 11.32 0l24 23.6a8 8 0 0 1 0 11.31"
+                            opacity=".2" />
+                        <path
+                            d="m243.28 68.24l-24-23.56a16 16 0 0 0-22.58 0L104 136l-.11-.11l-36.64-35.27a16 16 0 0 0-22.57.06l-24 24a16 16 0 0 0 0 22.61l71.62 72a16 16 0 0 0 22.63 0l128.4-128.38a16 16 0 0 0-.05-22.67M103.62 208L32 136l24-24l.11.11l36.64 35.27a16 16 0 0 0 22.52 0L208.06 56L232 79.6Z" />
+                    </g>
+                </svg></div>
+        @else
+            @if ($error)
+                <div class="flex w-64 gap-2">Docker is installed: <svg class="w-5 h-5 text-error" viewBox="0 0 256 256"
+                        xmlns="http://www.w3.org/2000/svg">
+                        <path fill="currentColor"
+                            d="M208.49 191.51a12 12 0 0 1-17 17L128 145l-63.51 63.49a12 12 0 0 1-17-17L111 128L47.51 64.49a12 12 0 0 1 17-17L128 111l63.51-63.52a12 12 0 0 1 17 17L145 128Z" />
+                    </svg></div>
+            @else
+                <div class="w-64"><x-loading text="Docker is installed:" /></div>
+            @endif
+        @endif
     @endif
     @isset($docker_version)
         <div class="flex w-64 gap-2">Minimum Docker version installed: <svg class="w-5 h-5 text-success"
@@ -49,7 +81,7 @@
                 </g>
             </svg></div>
     @endisset
-    <livewire:new-activity-monitor header="Docker Installation" />
+    <livewire:new-activity-monitor header="Logs" />
     @isset($error)
         <pre class="font-bold whitespace-pre-line text-error">{!! $error !!}</pre>
     @endisset