fixes

resources/views/components/helper.blade.php

@@ -0,0 +1,16 @@
+@props([
+    'helper' => $attributes->has('helper'),
+])
+<div class="group">
+    <div class="cursor-pointer text-warning">
+        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="w-4 h-4 stroke-current">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+        </svg>
+    </div>
+    <div class="absolute hidden text-xs group-hover:block border-coolgray-400 bg-coolgray-500">
+        <div class="p-4 card-body">
+            {!! $helper !!}
+        </div>
+    </div>
+</div>

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

@@ -1,4 +1,4 @@
-<div class="flex items-center gap-2" wire:poll.10000ms="pollStatus">
+<div class="flex items-center gap-2" wire:poll.10000ms="pollStatus" x-init="$wire.pollStatus">
     <div class="group">
         <label tabindex="0" class="flex items-center gap-2 cursor-pointer hover:text-white"> Actions
             <x-chevron-down />

resources/views/livewire/project/application/environment-variable/add.blade.php

@@ -1,10 +1,8 @@
-<form wire:submit.prevent='submit' class="flex flex-col max-w-fit">
-    <div class="flex items-end justify-center gap-2">
-        <x-forms.input placeholder="NODE_ENV" noDirty id="key" label="Name" required />
-        <x-forms.input placeholder="production" noDirty id="value" label="Value" required />
-        <x-forms.checkbox noDirty class="flex-col text-center w-96" id="is_build_time" label="Build Variable?" />
-        <x-forms.button type="submit">
-            Add New Variable
-        </x-forms.button>
-    </div>
+<form wire:submit.prevent='submit' class="flex flex-col gap-2 xl:items-end xl:flex-row"">
+    <x-forms.input placeholder="NODE_ENV" noDirty id="key" label="Name" required />
+    <x-forms.input placeholder="production" noDirty id="value" label="Value" required />
+    <x-forms.checkbox noDirty id="is_build_time" label="Build Variable?" />
+    <x-forms.button type="submit">
+        Add New Variable
+    </x-forms.button>
 </form>

resources/views/livewire/project/application/environment-variable/all.blade.php

@@ -8,7 +8,7 @@
             :env="$env" />
     @endforeach
     <div class="pt-2 pb-8">
-        <livewire:project.application.environment-variable.add />
+        <livewire:project.application.environment-varia /ble.add />
     </div>
     <div>
         <h3>Preview Deployments</h3>

resources/views/livewire/project/application/environment-variable/show.blade.php

@@ -1,17 +1,15 @@
 <div x-data="{ deleteEnvironment: false }">
-    <form wire:submit.prevent='submit' class="flex flex-col max-w-fit">
-        <div class="flex items-end gap-2">
-            <x-forms.input label="Name" id="env.key" />
-            <x-forms.input label="Value" id="env.value" />
-            <x-forms.checkbox disabled class="flex-col text-center w-96" id="env.is_build_time" label="Build Variable?" />
-            <div class="flex gap-2">
-                <x-forms.button type="submit">
-                    Update
-                </x-forms.button>
-                <x-forms.button x-on:click.prevent="deleteEnvironment = true">
-                    Delete
-                </x-forms.button>
-            </div>
+    <form wire:submit.prevent='submit' class="flex flex-col gap-2 xl:items-end xl:flex-row">
+        <x-forms.input label="Name" id="env.key" />
+        <x-forms.input label="Value" id="env.value" />
+        <x-forms.checkbox disabled id="env.is_build_time" label="Build Variable?" />
+        <div class="flex gap-2">
+            <x-forms.button type="submit">
+                Update
+            </x-forms.button>
+            <x-forms.button x-on:click.prevent="deleteEnvironment = true">
+                Delete
+            </x-forms.button>
         </div>
     </form>
     <x-naked-modal show="deleteEnvironment" message="Are you sure you want to delete {{ $env->key }}?" />

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

@@ -21,7 +21,7 @@
         <div class="text-sm">Code source of your application.</div>
         <x-forms.input placeholder="coollabsio/coolify-example" id="application.git_repository" label="Repository" />
         <x-forms.input placeholder="main" id="application.git_branch" label="Branch" />
-        <div class="flex items-end gap-2">
+        <div class="flex items-end gap-2 w-96">
             <x-forms.input placeholder="HEAD" id="application.git_commit_sha" placeholder="HEAD" label="Commit SHA" />
             <a target="_blank" class="flex hover:no-underline" href="{{ $application?->gitCommits }}">
                 <x-forms.button><svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" viewBox="0 0 24 24"

resources/views/livewire/project/application/storages/add.blade.php

@@ -1,10 +1,8 @@
-<form wire:submit.prevent='submit' class="flex flex-col w-full px-2">
-    <div class="flex items-end gap-2">
-        <x-forms.input placeholder="pv-name" noDirty id="name" label="Name" required />
-        <x-forms.input placeholder="/root" noDirty id="host_path" label="Source Path" />
-        <x-forms.input placeholder="/tmp/root" noDirty id="mount_path" label="Destination Path" required />
-        <x-forms.button type="submit">
-            Add New Volume
-        </x-forms.button>
-    </div>
+<form wire:submit.prevent='submit' class="flex flex-col gap-2 xl:items-end xl:flex-row">
+    <x-forms.input placeholder="pv-name" noDirty id="name" label="Name" required />
+    <x-forms.input placeholder="/root" noDirty id="host_path" label="Source Path" />
+    <x-forms.input placeholder="/tmp/root" noDirty id="mount_path" label="Destination Path" required />
+    <x-forms.button type="submit">
+        Add New Volume
+    </x-forms.button>
 </form>

resources/views/livewire/project/application/storages/all.blade.php

@@ -1,17 +1,18 @@
 <div>
     <div>
-        <h2>Storages</h2>
-        <div class="text-sm">Persistent storage to preserve data between deployments.</div>
-        <div class="text-sm">Preview Deployments has a <span class='text-helper'>-pr-#PRNumber</span> in their
+        <div class="flex items-center gap-2">
+            <h2>Storages </h2>
+            <x-helper
+                helper="For Preview Deployments, storage has a <span class='text-helper'>-pr-#PRNumber</span> in their
             volume
-            name, example: <span class='text-helper'>-pr-1</span>.</div>
+            name, example: <span class='text-helper'>-pr-1</span>" />
+        </div>
+        <div class="text-sm">Persistent storage to preserve data between deployments.</div>
     </div>
     <div class="flex flex-col gap-2 py-4">
-        @forelse ($application->persistentStorages as $storage)
+        @foreach ($application->persistentStorages as $storage)
             <livewire:project.application.storages.show wire:key="storage-{{ $storage->id }}" :storage="$storage" />
-        @empty
-            <p>There are no persistent storages attached for this application.</p>
-        @endforelse
+        @endforeach
     </div>
     <livewire:project.application.storages.add />
 </div>

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

@@ -1,9 +1,9 @@
 <div x-data="{ deleteStorage: false }">
-    <form wire:submit.prevent='submit' class="flex flex-col px-2">
-        <div class="flex items-end gap-2">
-            <x-forms.input id="storage.name" label="Name" required />
-            <x-forms.input id="storage.host_path" label="Source Path" />
-            <x-forms.input id="storage.mount_path" label="Destination Path" required />
+    <form wire:submit.prevent='submit' class="flex flex-col gap-2 xl:items-end xl:flex-row">
+        <x-forms.input id="storage.name" label="Name" required />
+        <x-forms.input id="storage.host_path" label="Source Path" />
+        <x-forms.input id="storage.mount_path" label="Destination Path" required />
+        <div class="flex gap-2">
             <x-forms.button type="submit">
                 Update
             </x-forms.button>