Merge 520b4547fc into 201998638a

app/Livewire/Project/Service/Storage.php

@@ -56,6 +56,7 @@ class Storage extends Component
         }
 
         $this->refreshStorages();
+        $this->name = $this->generateDefaultVolumeName();
     }
 
     public function refreshStoragesFromEvent()
@@ -202,7 +203,7 @@ class Storage extends Component
 
     public function clearForm()
     {
-        $this->name = '';
+        $this->name = $this->generateDefaultVolumeName();
         $this->mount_path = '';
         $this->host_path = null;
         $this->file_storage_path = '';
@@ -216,6 +217,14 @@ class Storage extends Component
         }
     }
 
+    private function generateDefaultVolumeName(): string
+    {
+        return str($this->resource->name ?? 'volume')
+            ->slug()
+            ->append('-data')
+            ->value();
+    }
+
     public function render()
     {
         return view('livewire.project.service.storage');

app/Livewire/Project/Shared/Storages/Show.php

@@ -88,4 +88,13 @@ class Show extends Component
         $this->storage->delete();
         $this->dispatch('refreshStorages');
     }
+
+    public function clearHostPath()
+    {
+        $this->authorize('update', $this->resource);
+        $this->hostPath = null;
+        $this->storage->host_path = null;
+        $this->storage->save();
+        $this->dispatch('success', 'Source path removed. Use Directory Mount for host directory bindings.');
+    }
 }

resources/views/livewire/project/service/storage.blade.php

@@ -41,7 +41,7 @@
 
                                 <div x-show="dropdownOpen" @click.away="dropdownOpen=false"
                                     x-transition:enter="ease-out duration-200" x-transition:enter-start="-translate-y-2"
-                                    x-transition:enter-end="translate-y-0" class="absolute top-0 z-50 mt-10 min-w-max"
+                                    x-transition:enter-end="translate-y-0" class="absolute top-0 z-50 mt-8 min-w-max"
                                     x-cloak>
                                     <div
                                         class="p-1 mt-1 bg-white border rounded-sm shadow-sm dark:bg-coolgray-200 dark:border-coolgray-300 border-neutral-300">
@@ -118,25 +118,9 @@
                                                 <div class="flex flex-col">
                                                     <div>Docker Volumes mounted to the container.</div>
                                                 </div>
-                                                @if ($isSwarm)
-                                                    <div class="text-warning">Swarm Mode detected: You need to set a shared
-                                                        volume
-                                                        (EFS/NFS/etc) on all the worker nodes if you would like to use a
-                                                        persistent
-                                                        volumes.</div>
-                                                @endif
                                                 <div class="flex flex-col gap-2">
                                                     <x-forms.input canGate="update" :canResource="$resource" placeholder="pv-name"
                                                         id="name" label="Name" required helper="Volume name." />
-                                                    @if ($isSwarm)
-                                                        <x-forms.input canGate="update" :canResource="$resource"
-                                                            placeholder="/root" id="host_path" label="Source Path" required
-                                                            helper="Directory on the host system." />
-                                                    @else
-                                                        <x-forms.input canGate="update" :canResource="$resource"
-                                                            placeholder="/root" id="host_path" label="Source Path"
-                                                            helper="Directory on the host system." />
-                                                    @endif
                                                     <x-forms.input canGate="update" :canResource="$resource"
                                                         placeholder="/tmp/root" id="mount_path" label="Destination Path"
                                                         required helper="Directory inside the container." />
@@ -198,7 +182,7 @@
                                                         label="Destination Path" required
                                                         helper="File location inside the container" />
                                                     <x-forms.textarea canGate="update" :canResource="$resource" label="Content"
-                                                        id="file_storage_content"></x-forms.textarea>
+                                                        id="file_storage_content" useMonacoEditor></x-forms.textarea>
                                                     <x-forms.button canGate="update" :canResource="$resource" type="submit">
                                                         Add
                                                     </x-forms.button>

resources/views/livewire/project/shared/storages/show.blade.php

@@ -17,24 +17,20 @@
                         <x-forms.input id="name" label="Volume Name" required readonly
                             helper="Warning: Changing the volume name after the initial start could cause problems. Only use it when you know what are you doing." />
                     @endif
-                    @if ($isService || $startedAt)
+                    @if ($hostPath)
                         <x-forms.input id="hostPath" readonly helper="Directory on the host system."
                             label="Source Path"
                             helper="Warning: Changing the source path after the initial start could cause problems. Only use it when you know what are you doing." />
-                        <x-forms.input id="mountPath" label="Destination Path"
-                            helper="Directory inside the container." required readonly />
-                    @else
-                        <x-forms.input id="hostPath" readonly helper="Directory on the host system."
-                            label="Source Path"
-                            helper="Warning: Changing the source path after the initial start could cause problems. Only use it when you know what are you doing." />
-                        <x-forms.input id="mountPath" label="Destination Path"
-                            helper="Directory inside the container." required readonly />
                     @endif
+                    <x-forms.input id="mountPath" label="Destination Path"
+                        helper="Directory inside the container." required readonly />
                 </div>
             @else
                 <div class="flex gap-2 items-end w-full">
                     <x-forms.input id="name" required readonly />
-                    <x-forms.input id="hostPath" readonly />
+                    @if ($hostPath)
+                        <x-forms.input id="hostPath" readonly />
+                    @endif
                     <x-forms.input id="mountPath" required readonly />
                 </div>
             @endif
@@ -43,14 +39,18 @@
                 @if ($isFirst)
                     <div class="flex gap-2 items-end w-full">
                         <x-forms.input id="name" label="Volume Name" required />
-                        <x-forms.input id="hostPath" helper="Directory on the host system." label="Source Path" />
+                        @if ($hostPath)
+                            <x-forms.input id="hostPath" helper="Directory on the host system." label="Source Path" />
+                        @endif
                         <x-forms.input id="mountPath" label="Destination Path"
                             helper="Directory inside the container." required />
                     </div>
                 @else
                     <div class="flex gap-2 items-end w-full">
                         <x-forms.input id="name" required />
-                        <x-forms.input id="hostPath" />
+                        @if ($hostPath)
+                            <x-forms.input id="hostPath" />
+                        @endif
                         <x-forms.input id="mountPath" required />
                     </div>
                 @endif
@@ -58,6 +58,13 @@
                     <x-forms.button type="submit">
                         Update
                     </x-forms.button>
+                    @if ($hostPath)
+                        <x-modal-confirmation title="Remove Source Path?" isErrorButton buttonTitle="Remove"
+                            submitAction="clearHostPath" :actions="[
+                                'Are you sure you want to remove the source path?',
+                                'If you need to mount a host directory, use Directory Mount instead of Volume Mount.',
+                            ]" />
+                    @endif
                     <x-modal-confirmation title="Confirm persistent storage deletion?" isErrorButton buttonTitle="Delete"
                         submitAction="delete" :actions="[
                             'The selected persistent storage/volume will be permanently deleted.',
@@ -70,15 +77,19 @@
                 @if ($isFirst)
                     <div class="flex gap-2 items-end w-full">
                         <x-forms.input id="name" label="Volume Name" required disabled />
-                        <x-forms.input id="hostPath" helper="Directory on the host system." label="Source Path"
+                        @if ($hostPath)
-                            disabled />
+                            <x-forms.input id="hostPath" helper="Directory on the host system." label="Source Path"
+                                disabled />
+                        @endif
                         <x-forms.input id="mountPath" label="Destination Path"
                             helper="Directory inside the container." required disabled />
                     </div>
                 @else
                     <div class="flex gap-2 items-end w-full">
                         <x-forms.input id="name" required disabled />
-                        <x-forms.input id="hostPath" disabled />
+                        @if ($hostPath)
+                            <x-forms.input id="hostPath" disabled />
+                        @endif
                         <x-forms.input id="mountPath" required disabled />
                     </div>
                 @endif