From 203c19c01fa202e241864b71916d17240c94bc64 Mon Sep 17 00:00:00 2001
From: Andras Bacsai <andras.bacsai@gmail.com>
Date: Thu, 18 May 2023 15:12:26 +0200
Subject: [PATCH] wip

---
 .../Livewire/Project/Application/Rollback.php |  1 -
 ...03_27_081716_create_applications_table.php |  2 +-
 resources/css/app.css                         | 23 +++++++------
 .../views/components/inputs/button.blade.php  |  2 +-
 .../views/components/inputs/input.blade.php   |  2 +-
 .../views/components/magic-bar.blade.php      | 26 +++++++-------
 resources/views/components/navbar.blade.php   | 15 +++++---
 .../project/application/deploy.blade.php      | 34 ++++++++++++++-----
 .../environment-variable/add.blade.php        |  4 +--
 .../project/application/general.blade.php     | 31 +++++++++--------
 .../application/resource-limits.blade.php     |  9 ++---
 .../project/application/rollback.blade.php    |  5 +--
 .../project/application/source.blade.php      | 23 +++++++------
 .../application/storages/add.blade.php        |  6 ++--
 .../new/public-git-repository.blade.php       | 15 ++++----
 .../views/livewire/run-command.blade.php      |  4 +--
 .../application/configuration.blade.php       |  4 +--
 17 files changed, 117 insertions(+), 89 deletions(-)

diff --git a/app/Http/Livewire/Project/Application/Rollback.php b/app/Http/Livewire/Project/Application/Rollback.php
index 68658e0b3..df166b25c 100644
--- a/app/Http/Livewire/Project/Application/Rollback.php
+++ b/app/Http/Livewire/Project/Application/Rollback.php
@@ -17,7 +17,6 @@ class Rollback extends Component
     }
     public function loadImages()
     {
-        sleep(2);
         try {
             $image = $this->application->uuid;
             $output = instantRemoteProcess([
diff --git a/database/migrations/2023_03_27_081716_create_applications_table.php b/database/migrations/2023_03_27_081716_create_applications_table.php
index 9cabae3e1..b180ca8b9 100644
--- a/database/migrations/2023_03_27_081716_create_applications_table.php
+++ b/database/migrations/2023_03_27_081716_create_applications_table.php
@@ -62,7 +62,7 @@ return new class extends Migration
             $table->boolean('limits_memory_oom_kill')->default(false);
 
             $table->string('limits_cpus')->default("0");
-            $table->string('limits_cpuset')->nullable()->default("");
+            $table->string('limits_cpuset')->nullable()->default("0");
             $table->integer('limits_cpu_shares')->default(1024);
 
             $table->string('status')->default('exited');
diff --git a/resources/css/app.css b/resources/css/app.css
index 4dc2c5131..afda48be6 100644
--- a/resources/css/app.css
+++ b/resources/css/app.css
@@ -3,29 +3,30 @@
 @tailwind utilities;
 
 * {
-@apply scrollbar-thumb-yellow-400 scrollbar-track-coolgray-200 scrollbar-w-1;
+  //outline: solid 0.25rem hsla(210, 100%, 100%, 0.5); 
+    @apply scrollbar-thumb-yellow-400 scrollbar-track-coolgray-200 scrollbar-w-2;
 }
 html {
-    @apply h-full min-h-full bg-coolgray-100 ;
+    @apply h-full min-h-full bg-coolgray-100;
 }
 body {
-    @apply bg-coolgray-100 text-white min-h-full antialiased;
+    @apply bg-coolgray-100 text-neutral-400 min-h-full antialiased;
 }
 input[type="checkbox"] {
     @apply toggle toggle-warning toggle-sm;
 }
 input {
-    @apply input input-sm;
+    @apply input input-sm placeholder:text-neutral-700 text-white;
 }
 input[type="text"],[type="number"],[type="email"],[type="password"] {
     @apply read-only:opacity-40;
 }
 
 textarea {
-    @apply textarea;
+    @apply textarea placeholder:text-neutral-700 text-white;
 }
 select {
-    @apply select select-sm disabled:opacity-40 font-normal;
+    @apply select select-sm disabled:opacity-40 font-normal placeholder:text-neutral-700 text-white;
 }
 
 button[type="button"] {
@@ -41,13 +42,13 @@ button[isHighlighted] {
     @apply btn-primary text-white;
 }
 h1 {
-    @apply text-3xl font-bold pb-4;
+    @apply text-3xl font-bold pb-4 text-white;
 }
 h2 {
-    @apply text-2xl font-bold pb-4;
+    @apply text-2xl font-bold pb-4 text-white;
 }
 h3 {
-    @apply text-xl font-bold py-4;
+    @apply text-xl font-bold py-4 text-white;
 }
 a {
     @apply text-neutral-400 hover:text-white text-sm link link-hover hover:bg-transparent;
@@ -62,10 +63,10 @@ a {
 }
 .main-menu:after {
     content: "/";
-    @apply font-bold absolute right-0 top-0 text-neutral-400 px-2 pt-[0.7rem];
+    @apply absolute border border-dotted rounded border-neutral-600 right-0 top-0 text-warning mx-1 px-2 mt-[0.7rem];
 }
 .magic-input {
-    @apply input input-ghost w-96 placeholder:text-neutral-400 text-sm;
+    @apply input  w-96 placeholder:text-neutral-700 text-sm;
 }
 .magic-items {
     @apply absolute top-16 mt-2 w-[24rem] bg-coolgray-200  rounded-xl outline outline-coolgray-500;
diff --git a/resources/views/components/inputs/button.blade.php b/resources/views/components/inputs/button.blade.php
index 44f738c13..a323d620f 100644
--- a/resources/views/components/inputs/button.blade.php
+++ b/resources/views/components/inputs/button.blade.php
@@ -5,7 +5,7 @@
     'confirmAction' => null,
 ])
 @if ($type === 'submit')
-    <button type="submit" @if ($disabled !== null) disabled @endif wire:target="submit"
+    <button {{ $attributes }} type="submit" @if ($disabled !== null) disabled @endif wire:target="submit"
         wire:loading.delay.shorter.class="loading"
         @isset($confirm)
         x-on:click="toggleConfirmModal('{{ $confirm }}', '{{ explode('(', $confirmAction)[0] }}')"
diff --git a/resources/views/components/inputs/input.blade.php b/resources/views/components/inputs/input.blade.php
index 615c35825..39124e2a9 100644
--- a/resources/views/components/inputs/input.blade.php
+++ b/resources/views/components/inputs/input.blade.php
@@ -31,7 +31,7 @@
                             </svg>
                         </label>
                         <div tabindex="0"
-                            class="border-2 shadow whitespace-nowrap w-max-fit border-coolgray-500 card compact dropdown-content bg-coolgray-200">
+                            class="border-2 shadow w-96 border-coolgray-500 card compact dropdown-content bg-coolgray-200">
                             <div class="card-body">
                                 {!! $helper !!}
                             </div>
diff --git a/resources/views/components/magic-bar.blade.php b/resources/views/components/magic-bar.blade.php
index 6b4c3f30e..8b675d8d4 100644
--- a/resources/views/components/magic-bar.blade.php
+++ b/resources/views/components/magic-bar.blade.php
@@ -13,7 +13,7 @@
                 <template x-for="(item,index) in filteredItems" :key="item.name">
                     <div x-on:click="await set(item.next ?? 'server',item.name)"
                         :class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
-                        <span class="w-12 w- badge badge-primary badge-sm" x-show="item.type === 'Apps'"
+                        <span class="w-12 badge badge-primary badge-sm" x-show="item.type === 'Apps'"
                             x-text="item.type"></span>
                         <span class="w-12 badge badge-secondary badge-sm" x-show="item.type === 'Add'"
                             x-text="item.type"></span>
@@ -42,7 +42,7 @@
                 <template x-for="(server,index) in filteredServers" :key="server.name ?? server">
                     <div x-on:click="await set('destination',server.uuid)"
                         :class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
-                        <span class="w-12 badge badge-primary badge-sm">Server</span>
+                        <span class="badge badge-primary badge-sm">Server</span>
                         <span x-text="server.name"></span>
                     </div>
                 </template>
@@ -50,7 +50,7 @@
         </div>
     </template>
     {{-- Destinations --}}
-    <template x-cloak x-if="destinationMenu"">
+    <template x-cloak x-if="destinationMenu">
         <div x-on:click.outside="closeMenus">
             <input class="magic-input" x-ref="search" x-model="search" placeholder="Select a destination..."
                 x-on:keydown.down="focusNext(destinations.length)" x-on:keydown.up="focusPrev(destinations.length)"
@@ -65,7 +65,7 @@
                 <template x-for="(destination,index) in filteredDestinations" :key="destination.name ?? destination">
                     <div x-on:click="await set('project',destination.uuid)"
                         :class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
-                        <span class="w-12 badge badge-primary badge-sm">Destination</span>
+                        <span class=" badge badge-primary badge-sm">Destination</span>
                         <span x-text="destination.name"></span>
                     </div>
                 </template>
@@ -88,7 +88,7 @@
                 <template x-for="(project,index) in filteredProjects" :key="project.name ?? project">
                     <div x-on:click="await set('environment',project.uuid)"
                         :class="focusedIndex === index + 1 && 'magic-item-focused'" class="magic-item">
-                        <span class="w-12 badge badge-primary badge-sm">Project</span>
+                        <span class="badge badge-primary badge-sm">Project</span>
                         <span x-text="project.name"></span>
                     </div>
                 </template>
@@ -111,7 +111,7 @@
                 <template x-for="(environment,index) in filteredEnvironments" :key="environment.name ?? environment">
                     <div x-on:click="await set('jump',environment.name)"
                         :class="focusedIndex === index + 1 && 'magic-item-focused'" class="magic-item">
-                        <span class="w-12 badge badge-primary badge-sm">Env</span>
+                        <span class="badge badge-primary badge-sm">Env</span>
                         <span x-text="environment.name"></span>
                     </div>
                 </template>
@@ -134,7 +134,7 @@
                 <template x-for="(project,index) in filteredProjects" :key="project.name ?? project">
                     <div x-on:click="await set('jumpToProject',project.uuid)"
                         :class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
-                        <span class="w-12 badge badge-primary badge-sm">Jump</span>
+                        <span class="badge badge-primary badge-sm">Jump</span>
                         <span x-text="project.name"></span>
                     </div>
                 </template>
@@ -157,7 +157,7 @@
                 <template x-for="(destination,index) in filteredDestinations" :key="destination.name ?? destination">
                     <div x-on:click="await set('jumpToDestination',destination.uuid)"
                         :class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
-                        <span class="w-12 badge badge-primary badge-sm">Jump</span>
+                        <span class="badge badge-primary badge-sm">Jump</span>
                         <span x-text="destination.name"></span>
                     </div>
                 </template>
@@ -180,7 +180,7 @@
                 <template x-for="(privateKey,index) in filteredPrivateKeys" :key="privateKey.name ?? privateKey">
                     <div x-on:click="await set('jumpToPrivateKey',privateKey.uuid)"
                         :class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
-                        <span class="w-12 badge badge-primary badge-sm">Jump</span>
+                        <span class="badge badge-primary badge-sm">Jump</span>
                         <span x-text="privateKey.name"></span>
                     </div>
                 </template>
@@ -203,7 +203,7 @@
                 <template x-for="(source,index) in filteredSources" :key="source.name ?? source">
                     <div x-on:click="await set('jumpToSource',source)"
                         :class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
-                        <span class="w-12 badge badge-primary badge-sm">Jump</span>
+                        <span class="badge badge-primary badge-sm">Jump</span>
                         <span x-text="source.name"></span>
                     </div>
                 </template>
@@ -281,17 +281,17 @@
             focusedIndex: "",
             items: [{
                     name: 'Public Repository',
-                    type: 'Apps',
+                    type: 'Add',
                     tags: 'Appslication,public,repository,github,gitlab,bitbucket,git',
                 },
                 {
                     name: 'Private Repository (with GitHub Apps)',
-                    type: 'Apps',
+                    type: 'Add',
                     tags: 'Appslication,private,repository,github,gitlab,bitbucket,git',
                 },
                 {
                     name: 'Private Repository (with Deploy Key)',
-                    type: 'Apps',
+                    type: 'Add',
                     tags: 'Appslication,private,repository,github,gitlab,bitbucket,git',
                 },
                 {
diff --git a/resources/views/components/navbar.blade.php b/resources/views/components/navbar.blade.php
index be6128fc0..91b5d7df1 100644
--- a/resources/views/components/navbar.blade.php
+++ b/resources/views/components/navbar.blade.php
@@ -11,9 +11,10 @@
                 <ul tabindex="0" class="p-2 mt-3 shadow menu menu-compact dropdown-content bg-base-100 rounded-box w-52">
                     <li>
                         <a href="/">
-                            Home
+                            Dashboard
                         </a>
                     </li>
+
                     @if (auth()->user()->isRoot())
                         <li>
                             <a href="/settings">
@@ -44,18 +45,23 @@
                     <li>
                         <form action="/logout" method="POST">
                             @csrf
-                            <button type="submit">Logout</button>
+                            <button>Logout</button>
                         </form>
                     </li>
                 </ul>
             </div>
-            <a href="/" class="text-xl no-underline normal-case btn btn-ghost">Coolify</a>
+            <div href="/" class="text-xl text-white normal-case btn btn-ghost hover:bg-transparent">Coolify</div>
             <div class="form-control">
                 <x-magic-bar />
             </div>
         </div>
         <div class="hidden navbar-end xl:flex">
             <ul class="px-1 menu menu-horizontal text-neutral-400">
+                <li>
+                    <a href="/">
+                        Dashboard
+                    </a>
+                </li>
                 @if (auth()->user()->isRoot())
                     <li>
                         <a href="/settings">
@@ -86,8 +92,7 @@
                 <li>
                     <form action="/logout" method="POST" class="hover:bg-transparent">
                         @csrf
-                        <button class="font-normal link link-hover hover:bg-transparent hover:text-white"
-                            type="submit">Logout</button>
+                        <button class="text-sm link link-hover hover:text-white">Logout</button>
                     </form>
                 </li>
             </ul>
diff --git a/resources/views/livewire/project/application/deploy.blade.php b/resources/views/livewire/project/application/deploy.blade.php
index f78108704..3c0d0a746 100644
--- a/resources/views/livewire/project/application/deploy.blade.php
+++ b/resources/views/livewire/project/application/deploy.blade.php
@@ -1,20 +1,38 @@
 <div class="flex items-center gap-2">
     @if ($application->status === 'running')
-        <x-inputs.button wire:click='start'>Rebuild</x-inputs.button>
-        <x-inputs.button wire:click='forceRebuild'>Force Rebuild</x-inputs.button>
-        <x-inputs.button wire:click='stop'>Stop</x-inputs.button>
+        <div class="btn-group">
+            <x-inputs.button isWarning wire:click='stop'>Stop</x-inputs.button>
+            <div class="border-none dropdown dropdown-hover btn btn-xs bg-coollabs hover:bg-coollabs-100 no-animation">
+                <button tabindex="0" class="flex items-center justify-center h-full">👇</button>
+                <ul tabindex="0"
+                    class="text-xs text-white normal-case rounded min-w-max dropdown-content menu bg-coolgray-200">
+                    <li>
+                        <div wire:click='forceRebuild'>Force deploy without cache</div>
+                    </li>
+                </ul>
+            </div>
+        </div>
     @else
-        <x-inputs.button wire:click='start'>Start</x-inputs.button>
-        <x-inputs.button wire:click='forceRebuild'>Start (no cache)</x-inputs.button>
+        <div class="btn-group">
+            <x-inputs.button isHighlighted wire:click='start'>Deploy</x-inputs.button>
+            <div class="border-none dropdown dropdown-hover btn btn-xs bg-coollabs hover:bg-coollabs-100 no-animation">
+                <button tabindex="0" class="flex items-center justify-center h-full">👇</button>
+                <ul tabindex="0"
+                    class="text-xs text-white normal-case rounded min-w-max dropdown-content menu bg-coolgray-200">
+                    <li>
+                        <div wire:click='forceRebuild'>Deploy without cache</div>
+                    </li>
+                </ul>
+            </div>
+        </div>
     @endif
-
     <span wire:poll.5000ms='pollingStatus'>
-        @if ($application->status === 'running')
+        {{-- @if ($application->status === 'running')
             <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
             <span class="text-green-500" wire:loading.remove.delay.longer>{{ $application->status }}</span>
         @else
             <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
             <span class="text-red-500" wire:loading.remove.delay.longer>{{ $application->status }}</span>
-        @endif
+        @endif --}}
     </span>
 </div>
diff --git a/resources/views/livewire/project/application/environment-variable/add.blade.php b/resources/views/livewire/project/application/environment-variable/add.blade.php
index b83ca2fcc..b966e0249 100644
--- a/resources/views/livewire/project/application/environment-variable/add.blade.php
+++ b/resources/views/livewire/project/application/environment-variable/add.blade.php
@@ -1,7 +1,7 @@
 <form wire:submit.prevent='submit' class="flex flex-col px-2 max-w-fit">
     <div class="flex gap-2">
-        <x-inputs.input noDirty id="key" label="Name" required />
-        <x-inputs.input noDirty id="value" label="Value" required />
+        <x-inputs.input placeholder="NODE_ENV" noDirty id="key" label="Name" required />
+        <x-inputs.input placeholder="production" noDirty id="value" label="Value" required />
         <x-inputs.checkbox noDirty class="flex-col items-center" id="is_build_time" label="Build Variable?" />
     </div>
     <div class="pt-2">
diff --git a/resources/views/livewire/project/application/general.blade.php b/resources/views/livewire/project/application/general.blade.php
index 32ac01d0d..611877265 100644
--- a/resources/views/livewire/project/application/general.blade.php
+++ b/resources/views/livewire/project/application/general.blade.php
@@ -7,10 +7,10 @@
             </x-inputs.button>
         </div>
         <div class="flex flex-col gap-2 pb-4">
-            <div class="flex gap-2">
+            <div class="flex flex-col gap-2 xl:flex-row">
                 <x-inputs.input class="w-full" id="application.name" label="Name" required />
-                <x-inputs.input class="w-full" id="application.fqdn" label="Domains"
-                    helper="You can specify one domain with path or more with comma.<br><span class='inline-block font-bold text-warning'>Example</span>- http://app.coolify.io,https://cloud.coolify.io/dashboard<br>- http://app.coolify.io/api/v3" />
+                <x-inputs.input placeholder="https://coolify.io" class="w-full" id="application.fqdn" label="Domains"
+                    helper="You can specify one domain with path or more with comma.<br><span class='inline-block font-bold text-warning'>Example</span>- http://app.coolify.io, https://cloud.coolify.io/dashboard<br>- http://app.coolify.io/api/v3" />
             </div>
             <x-inputs.select id="application.build_pack" label="Build Pack" required>
                 <option value="nixpacks">Nixpacks</option>
@@ -23,28 +23,29 @@
                     <option disabled value="apache:alpine">apache:alpine</option>
                 </x-inputs.select>
             @endif
-            <div class="flex gap-2">
-                <x-inputs.input id="application.install_command" label="Install Command" />
-                <x-inputs.input id="application.build_command" label="Build Command" />
-                <x-inputs.input id="application.start_command" label="Start Command" />
+            <div class="flex flex-col gap-2 xl:flex-row">
+                <x-inputs.input placeholder="pnpm install" id="application.install_command" label="Install Command" />
+                <x-inputs.input placeholder="pnpm build" id="application.build_command" label="Build Command" />
+                <x-inputs.input placeholder="pnpm start" id="application.start_command" label="Start Command" />
             </div>
-            <div class="flex gap-2">
-                <x-inputs.input id="application.base_directory" label="Base Directory"
+            <div class="flex flex-col gap-2 xl:flex-row">
+                <x-inputs.input placeholder="/" id="application.base_directory" label="Base Directory"
                     helper="Directory to use as root. Useful for monorepos." />
                 @if ($application->settings->is_static)
-                    <x-inputs.input id="application.publish_directory" label="Publish Directory" required />
+                    <x-inputs.input placeholder="/dist" id="application.publish_directory" label="Publish Directory"
+                        required />
                 @else
-                    <x-inputs.input id="application.publish_directory" label="Publish Directory" />
+                    <x-inputs.input placeholder="/" id="application.publish_directory" label="Publish Directory" />
                 @endif
             </div>
-            <div class="flex gap-2">
+            <div class="flex flex-col gap-2 xl:flex-row">
                 @if ($application->settings->is_static)
                     <x-inputs.input id="application.ports_exposes" label="Ports Exposes" readonly />
                 @else
-                    <x-inputs.input id="application.ports_exposes" label="Ports Exposes" required
-                        helper="A comma separated list of ports you would like to expose for the proxy." />
+                    <x-inputs.input placeholder="3000,3001" id="application.ports_exposes" label="Ports Exposes"
+                        required helper="A comma separated list of ports you would like to expose for the proxy." />
                 @endif
-                <x-inputs.input id="application.ports_mappings" label="Ports Mappings"
+                <x-inputs.input placeholder="3000:3000" id="application.ports_mappings" label="Ports Mappings"
                     helper="A comma separated list of ports you would like to map to the host system. Useful when you do not want to use domains.<br><span class='inline-block font-bold text-warning'>Example</span>3000:3000,3002:3002" />
             </div>
         </div>
diff --git a/resources/views/livewire/project/application/resource-limits.blade.php b/resources/views/livewire/project/application/resource-limits.blade.php
index 5e19204d0..32e77879d 100644
--- a/resources/views/livewire/project/application/resource-limits.blade.php
+++ b/resources/views/livewire/project/application/resource-limits.blade.php
@@ -4,6 +4,11 @@
             <h2>Resource Limits</h2>
             <x-inputs.button type='submit'>Save</x-inputs.button>
         </div>
+        <div>Limit your container resources by CPU & memory.</div>
+        <h3>CPU</h3>
+        <x-inputs.input placeholder="1.5" label="Number of CPUs" id="application.limits_cpus" />
+        <x-inputs.input placeholder="0-2" label="CPU set to use" id="application.limits_cpuset" />
+        <x-inputs.input placeholder="1024" label="CPU Weight" id="application.limits_cpu_shares" />
         <h3>Memory</h3>
         <x-inputs.input placeholder="69b or 420k or 1337m or 1g" label="Limit" id="application.limits_memory" />
         <x-inputs.input placeholder="69b or 420k or 1337m or 1g" label="Swap" id="application.limits_memory_swap" />
@@ -12,9 +17,5 @@
         <x-inputs.input placeholder="69b or 420k or 1337m or 1g" label="Soft Limit"
             id="application.limits_memory_reservation" />
         <x-inputs.checkbox label="Disable OOM kill" id="application.limits_memory_oom_kill" />
-        <h3>CPU</h3>
-        <x-inputs.input placeholder="1.5" label="Number of CPUs" id="application.limits_cpus" />
-        <x-inputs.input placeholder="0-2" label="CPU set to use" id="application.limits_cpuset" />
-        <x-inputs.input placeholder="1024" label="CPU Weight" id="application.limits_cpu_shares" />
     </form>
 </div>
diff --git a/resources/views/livewire/project/application/rollback.blade.php b/resources/views/livewire/project/application/rollback.blade.php
index 869bd97ac..b45458923 100644
--- a/resources/views/livewire/project/application/rollback.blade.php
+++ b/resources/views/livewire/project/application/rollback.blade.php
@@ -1,7 +1,7 @@
 <div x-init="$wire.loadImages">
     <div class="flex gap-2">
         <h2>Rollback</h2>
-        <x-inputs.button isHighlighted wire:click='loadImages'>Refresh Images</x-inputs.button>
+        <x-inputs.button isHighlighted wire:click='loadImages'>Refresh</x-inputs.button>
     </div>
     <div wire:loading wire:target='loadImages'>
         <x-loading />
@@ -30,7 +30,8 @@
                     </div>
                 </div>
             @empty
-                <div>No images found</div>
+                <div>No images found
+                </div>
             @endforelse
         </div>
     </div>
diff --git a/resources/views/livewire/project/application/source.blade.php b/resources/views/livewire/project/application/source.blade.php
index 50a843d4d..b18d53349 100644
--- a/resources/views/livewire/project/application/source.blade.php
+++ b/resources/views/livewire/project/application/source.blade.php
@@ -1,21 +1,22 @@
 <div>
-    <h2>Source</h2>
-    <div class="pb-8">{{ data_get($application, 'source.name') }}
-        @if (data_get($application, 'source.is_public'))
-            <span class="text-xs">public</span>
-        @endif
-    </div>
-    <form wire:submit.prevent='submit' class="flex flex-col gap-2 w-max-fit">
-        <x-inputs.input id="application.git_repository" label="Repository" />
-        <x-inputs.input id="application.git_branch" label=" Branch" />
-        <x-inputs.input id="application.git_commit_sha" placeholder="HEAD" label="Commit SHA" />
-        <div>
+    <form wire:submit.prevent='submit' class="flex flex-col gap-2">
+        <div class="flex gap-4">
+            <h2>Source</h2>
             <x-inputs.button type="submit">Save</x-inputs.button>
             <a target="_blank" href="{{ $application->gitCommits }}">
                 Commits
                 <x-external-link />
             </a>
         </div>
+        {{-- <div>{{ data_get($application, 'source.name') }}
+            @if (data_get($application, 'source.is_public'))
+                <span class="text-xs">public</span>
+            @endif
+        </div> --}}
+        <x-inputs.input placeholder="coollabsio/coolify-example" id="application.git_repository" label="Repository" />
+        <x-inputs.input placeholder="main" id="application.git_branch" label=" Branch" />
+        <x-inputs.input placeholder="HEAD" id="application.git_commit_sha" placeholder="HEAD" label="Commit SHA" />
+
     </form>
 
 </div>
diff --git a/resources/views/livewire/project/application/storages/add.blade.php b/resources/views/livewire/project/application/storages/add.blade.php
index 05e154f6f..d1d80dc66 100644
--- a/resources/views/livewire/project/application/storages/add.blade.php
+++ b/resources/views/livewire/project/application/storages/add.blade.php
@@ -1,8 +1,8 @@
 <form wire:submit.prevent='submit' class="flex flex-col px-2 pt-10 max-w-fit">
     <div class="flex gap-2">
-        <x-inputs.input noDirty id="name" label="Name" required />
-        <x-inputs.input noDirty id="host_path" label="Source Path" />
-        <x-inputs.input noDirty id="mount_path" label="Destination Path" required />
+        <x-inputs.input placeholder="pv-name" noDirty id="name" label="Name" required />
+        <x-inputs.input placeholder="/root" noDirty id="host_path" label="Source Path" />
+        <x-inputs.input placeholder="/tmp/root" noDirty id="mount_path" label="Destination Path" required />
     </div>
     <div class="pt-2">
         <x-inputs.button type="submit">
diff --git a/resources/views/livewire/project/new/public-git-repository.blade.php b/resources/views/livewire/project/new/public-git-repository.blade.php
index d285cf4ce..3e056407d 100644
--- a/resources/views/livewire/project/new/public-git-repository.blade.php
+++ b/resources/views/livewire/project/new/public-git-repository.blade.php
@@ -1,13 +1,16 @@
 <div>
-    <h1>Choose a public repository</h1>
-    <form class="flex flex-col gap-2 w-96" wire:submit.prevent='submit'>
-        <x-inputs.input instantSave type="checkbox" id="is_static" label="Is it a static site?" />
+    <h1>Enter a public repository URL</h1>
+    <form class="flex flex-col gap-2" wire:submit.prevent='submit'>
+        <x-inputs.checkbox instantSave id="is_static" label="Is it a static site?" />
         <div class="flex gap-2">
-            <x-inputs.input class="w-96" id="repository_url" label="Repository URL" />
+            <x-inputs.input id="repository_url" label="Repository URL"
+                helper="<span class='inline-block font-bold text-warning'>Example</span>https://github.com/coollabsio/coolify-examples => main branch will be selected<br>https://github.com/coollabsio/coolify-examples/tree/nodejs-fastify => nodejs-fastify branch will be selected" />
             @if ($is_static)
-                <x-inputs.input id="publish_directory" label="Publish Directory" />
+                <x-inputs.input id="publish_directory" label="Publish Directory"
+                    helper="If there is a build process involved (like Svelte, React, Next, etc..), please specify the output directory for the build assets." />
             @else
-                <x-inputs.input type="number" id="port" label="Port" :readonly="$is_static" />
+                <x-inputs.input type="number" id="port" label="Port" :readonly="$is_static"
+                    helper="The port your application listens on." />
             @endif
         </div>
         <x-inputs.button type="submit">
diff --git a/resources/views/livewire/run-command.blade.php b/resources/views/livewire/run-command.blade.php
index 611477527..da8c4bccb 100755
--- a/resources/views/livewire/run-command.blade.php
+++ b/resources/views/livewire/run-command.blade.php
@@ -1,6 +1,6 @@
 <div>
     <form class="flex items-end justify-center gap-2" wire:submit.prevent='runCommand'>
-        <x-inputs.input class="w-[32rem]" autofocus noDirty noLabel id="command" label="Command" required />
+        <x-inputs.input placeholder="ls -l" autofocus noDirty noLabel id="command" label="Command" required />
         <select wire:model.defer="server">
             @foreach ($servers as $server)
                 @if ($loop->first)
@@ -10,7 +10,7 @@
                 @endif
             @endforeach
         </select>
-        <x-inputs.button type="submit">Run</x-inputs.button>
+        <x-inputs.button class="btn-xl" type="submit">Run</x-inputs.button>
     </form>
     <div class="container w-full pt-10 mx-auto">
         <livewire:activity-monitor />
diff --git a/resources/views/project/application/configuration.blade.php b/resources/views/project/application/configuration.blade.php
index 84d09dccb..0826fb84b 100644
--- a/resources/views/project/application/configuration.blade.php
+++ b/resources/views/project/application/configuration.blade.php
@@ -57,9 +57,7 @@
             <div x-cloak x-show="activeTab === 'danger'">
                 <livewire:project.application.danger :application="$application" />
             </div>
-            {{-- <div x-cloak x-show="activeTab === 'previews'">
-                <livewire:project.application.previews :application="$application" />
-            </div> --}}
+
         </div>
     </div>
 </x-layout>