From c023fdae8b2270a3c09f4f5931f588ea7d4ee87a Mon Sep 17 00:00:00 2001
From: Andras Bacsai <andras.bacsai@gmail.com>
Date: Mon, 22 May 2023 22:30:33 +0200
Subject: [PATCH] fixes

---
 app/Http/Livewire/Profile/Form.php            |  35 ++++++
 .../Livewire/Project/Application/Deploy.php   |   5 -
 .../Livewire/Project/Application/Status.php   |  15 +++
 app/Models/User.php                           |   5 +-
 resources/css/app.css                         |  10 +-
 resources/views/auth/login.blade.php          |  18 +--
 resources/views/auth/register.blade.php       |   2 +-
 .../components/applications/navbar.blade.php  |   6 +-
 resources/views/components/layout.blade.php   |   6 +-
 .../views/components/naked-modal.blade.php    |   2 +-
 resources/views/components/navbar.blade.php   | 105 +-----------------
 resources/views/dashboard.blade.php           |   4 +-
 .../views/livewire/profile/form.blade.php     |  10 ++
 .../project/application/danger.blade.php      |   2 +-
 .../project/application/deploy.blade.php      |  15 +--
 .../environment-variable/add.blade.php        |   2 +-
 .../environment-variable/show.blade.php       |   2 +-
 .../application/poll-deployment.blade.php     |   2 +-
 .../project/application/status.blade.php      |  15 +++
 .../views/livewire/server/form.blade.php      |  46 ++++----
 .../livewire/server/private-key.blade.php     |   7 +-
 .../views/livewire/server/proxy.blade.php     |  95 ++++++++--------
 .../views/livewire/switch-team.blade.php      |   3 +-
 resources/views/profile.blade.php             |   9 +-
 .../application/configuration.blade.php       |  13 ++-
 .../project/application/deployment.blade.php  |  13 ++-
 .../project/application/deployments.blade.php |  13 ++-
 resources/views/project/resources.blade.php   |  17 ++-
 resources/views/servers.blade.php             |   8 +-
 resources/views/team.blade.php                |   9 +-
 30 files changed, 251 insertions(+), 243 deletions(-)
 create mode 100644 app/Http/Livewire/Profile/Form.php
 create mode 100644 app/Http/Livewire/Project/Application/Status.php
 create mode 100644 resources/views/livewire/profile/form.blade.php
 create mode 100644 resources/views/livewire/project/application/status.blade.php

diff --git a/app/Http/Livewire/Profile/Form.php b/app/Http/Livewire/Profile/Form.php
new file mode 100644
index 000000000..ceefbd4e6
--- /dev/null
+++ b/app/Http/Livewire/Profile/Form.php
@@ -0,0 +1,35 @@
+<?php
+
+namespace App\Http\Livewire\Profile;
+
+use App\Models\User;
+use Livewire\Component;
+
+class Form extends Component
+{
+    public int $userId;
+    public string $name;
+    public string $email;
+
+    protected $rules = [
+        'name' => 'required',
+    ];
+    public function mount()
+    {
+        $this->userId = auth()->user()->id;
+        $this->name = auth()->user()->name;
+        $this->email = auth()->user()->email;
+    }
+    public function submit()
+
+    {
+        try {
+            $this->validate();
+            User::where('id', $this->userId)->update([
+                'name' => $this->name,
+            ]);
+        } catch (\Throwable $error) {
+            return generalErrorHandler($error, $this);
+        }
+    }
+}
diff --git a/app/Http/Livewire/Project/Application/Deploy.php b/app/Http/Livewire/Project/Application/Deploy.php
index 2a655473e..cc3df7e8b 100644
--- a/app/Http/Livewire/Project/Application/Deploy.php
+++ b/app/Http/Livewire/Project/Application/Deploy.php
@@ -72,9 +72,4 @@ class Deploy extends Component
             $this->application->save();
         }
     }
-
-    public function pollingStatus()
-    {
-        $this->application->refresh();
-    }
 }
diff --git a/app/Http/Livewire/Project/Application/Status.php b/app/Http/Livewire/Project/Application/Status.php
new file mode 100644
index 000000000..3f68dc35c
--- /dev/null
+++ b/app/Http/Livewire/Project/Application/Status.php
@@ -0,0 +1,15 @@
+<?php
+
+namespace App\Http\Livewire\Project\Application;
+
+use App\Models\Application;
+use Livewire\Component;
+
+class Status extends Component
+{
+    public Application $application;
+    public function pollingStatus()
+    {
+        $this->application->refresh();
+    }
+}
diff --git a/app/Models/User.php b/app/Models/User.php
index 2df832eeb..768160bce 100644
--- a/app/Models/User.php
+++ b/app/Models/User.php
@@ -74,15 +74,14 @@ class User extends Authenticatable
 
     public function otherTeams()
     {
-        $team_id = data_get(session('currentTeam'), 'id');
-
+        $team_id = session('currentTeam')->id;
         return auth()->user()->teams->filter(function ($team) use ($team_id) {
             return $team->id != $team_id;
         });
     }
     public function resources()
     {
-        $team_id = data_get(session('currentTeam'), 'id');
+        $team_id = session('currentTeam')->id;
         $data = Application::where('team_id', $team_id)->get();
         return $data;
     }
diff --git a/resources/css/app.css b/resources/css/app.css
index f7983c87a..1503638de 100644
--- a/resources/css/app.css
+++ b/resources/css/app.css
@@ -33,10 +33,10 @@ select {
 }
 
 button[type="button"] {
-    @apply btn btn-xs btn-ghost no-animation normal-case text-white rounded;
+    @apply btn btn-xs bg-coolgray-200 no-animation normal-case text-white rounded-none;
 }
 button[type="submit"] {
-    @apply btn btn-xs no-animation normal-case text-white btn-primary rounded;
+    @apply btn btn-xs no-animation normal-case text-white btn-primary rounded-none;
 }
 button[isWarning] {
     @apply text-error;
@@ -58,7 +58,7 @@ a {
 }
 
 main {
-    @apply h-full w-full min-h-screen px-32 xl:px-10 pt-4 mx-auto max-w-7xl;
+    @apply h-full w-full pb-10 px-32 xl:px-14 pt-8 mx-auto max-w-screen-xl;
 }
 .main-navbar {
     @apply fixed top-0 left-0 min-h-screen overflow-hidden;
@@ -70,7 +70,7 @@ main {
     @apply text-white;
 }
 .box {
-    @apply flex items-center justify-center text-sm rounded cursor-pointer h-14 bg-coolgray-200 hover:bg-coollabs-100 hover:text-white p-2 hover:no-underline transition-colors;
+    @apply flex items-center justify-center text-sm rounded-none cursor-pointer h-14 bg-coolgray-200 hover:bg-coollabs-100 hover:text-white p-2 hover:no-underline transition-colors;
 }
 
 .main-menu {
@@ -84,7 +84,7 @@ main {
     @apply min-w-fit px-2 rounded text-center border border-dotted border-primary text-white text-xs;
 }
 .magic-input {
-    @apply input input-sm w-96 placeholder:text-neutral-700 text-sm rounded-none;
+    @apply input input-sm w-80 xl:w-96 placeholder:text-neutral-700 text-sm rounded-none;
 }
 .magic-items {
     @apply absolute top-12 mt-2 w-[24rem] bg-coolgray-200 rounded  z-50;
diff --git a/resources/views/auth/login.blade.php b/resources/views/auth/login.blade.php
index 11a58e975..f7e72b629 100644
--- a/resources/views/auth/login.blade.php
+++ b/resources/views/auth/login.blade.php
@@ -1,22 +1,23 @@
 <x-layout-simple>
     <div class="flex items-center justify-center h-screen">
         <div>
-            <div>
+            <div class="pb-8 text-5xl font-bold tracking-tight text-center text-white">Coolify</div>
+            <div class="w-96">
                 <form action="/login" method="POST" class="flex flex-col gap-2">
                     @csrf
                     <input type="email" name="email" placeholder="{{ __('input.email') }}"
                         @env('local') value="test@example.com" @endenv autofocus />
                     <input type="password" name="password" placeholder="{{ __('input.password') }}"
                         @env('local') value="password" @endenv />
+                    @if ($errors->any())
+                        <div class="text-center text-error">
+                            <span>{{ __('auth.failed') }}</span>
+                        </div>
+                    @endif
                     <x-inputs.button type="submit">{{ __('auth.login') }}</x-inputs.button>
+
                 </form>
-                @if ($errors->any())
-                    <div class="alert alert-danger">
-                        <ul>
-                            <li>{{ __('auth.failed') }}</li>
-                        </ul>
-                    </div>
-                @endif
+
             </div>
             @if ($is_registration_enabled)
                 <a href="/register" class="flex justify-center pt-2">
@@ -25,6 +26,7 @@
             @else
                 <div class="text-sm text-center">{{ __('auth.registration_disabled') }}</div>
             @endif
+
         </div>
     </div>
 </x-layout-simple>
diff --git a/resources/views/auth/register.blade.php b/resources/views/auth/register.blade.php
index 884fbdc82..ec30adad6 100644
--- a/resources/views/auth/register.blade.php
+++ b/resources/views/auth/register.blade.php
@@ -14,7 +14,7 @@
                 <x-inputs.button type="submit">{{ __('auth.register') }}</x-inputs.button>
             </form>
             @if ($errors->any())
-                <div class="alert alert-danger">
+                <div class="fixed top-0 alert alert-error">
                     <ul>
                         <li>{{ __('auth.failed') }}</li>
                     </ul>
diff --git a/resources/views/components/applications/navbar.blade.php b/resources/views/components/applications/navbar.blade.php
index 8b85decea..735792080 100644
--- a/resources/views/components/applications/navbar.blade.php
+++ b/resources/views/components/applications/navbar.blade.php
@@ -5,7 +5,7 @@
             'application_uuid' => Route::current()->parameters()['application_uuid'],
             'environment_name' => Route::current()->parameters()['environment_name'],
         ]) }}">
-        Configuration
+        <button>Configuration</button>
     </a>
     <a class="{{ request()->routeIs('project.application.deployments') ? 'text-white' : '' }}"
         href="{{ route('project.application.deployments', [
@@ -13,9 +13,10 @@
             'application_uuid' => Route::current()->parameters()['application_uuid'],
             'environment_name' => Route::current()->parameters()['environment_name'],
         ]) }}">
-        Deployments
+        <button>Deployments</button>
     </a>
     <div class="flex-1"></div>
+
     <div class="dropdown dropdown-bottom">
         <button tabindex="0"
             class="flex items-center justify-center h-full text-white normal-case bg-transparent border-none rounded btn btn-xs no-animation">
@@ -53,4 +54,5 @@
     </div>
     </div>
     <livewire:project.application.deploy :applicationId="$application->id" />
+    <livewire:project.application.status :application="$application" />
 </nav>
diff --git a/resources/views/components/layout.blade.php b/resources/views/components/layout.blade.php
index d25f87392..ccba26fe9 100644
--- a/resources/views/components/layout.blade.php
+++ b/resources/views/components/layout.blade.php
@@ -29,10 +29,10 @@
     @auth
         <x-navbar />
     @endauth
+    <div class="flex justify-center w-full pt-4">
+        <x-magic-bar />
+    </div>
     <main>
-        <div class="flex justify-center w-full">
-            <x-magic-bar />
-        </div>
         {{ $slot }}
     </main>
     <a
diff --git a/resources/views/components/naked-modal.blade.php b/resources/views/components/naked-modal.blade.php
index 390a238d7..1f1ee0be6 100644
--- a/resources/views/components/naked-modal.blade.php
+++ b/resources/views/components/naked-modal.blade.php
@@ -7,7 +7,7 @@
     <div class="relative modal-box">
         <div class="pb-8 text-base font-bold text-white">{{ $message }}</div>
         <div class="flex justify-end gap-4 text-xs">
-            <x-inputs.button isWarning wire:click='{{ $action }}' x-on:click="{{ $show }} = false">
+            <x-inputs.button wire:click='{{ $action }}' x-on:click="{{ $show }} = false">
                 Yes
             </x-inputs.button>
             <x-inputs.button x-on:click="{{ $show }} = false">No</x-inputs.button>
diff --git a/resources/views/components/navbar.blade.php b/resources/views/components/navbar.blade.php
index b45da5b14..aa06d00b6 100644
--- a/resources/views/components/navbar.blade.php
+++ b/resources/views/components/navbar.blade.php
@@ -59,21 +59,20 @@
                     </a>
                 </li>
             @endif
-
         </ul>
-
     </nav>
     <div class="absolute top-0 right-0 pt-2">
         <div class="dropdown dropdown-left">
             <label tabindex="0" class="btn btn-ghost no-animation hover:bg-transparent">
                 <div class="flex items-center justify-center gap-2 avatar placeholder">
-                    <div class="w-8 rounded-full bg-coolgray-300 text-neutral-content">
+                    <div class="w-10 border border-dotted rounded-full border-neutral-600 text-warning">
                         <span class="text-xs">{{ Str::of(auth()->user()->name)->substr(0, 2)->upper() }}</span>
                     </div>
                     <x-chevron-down />
                 </div>
             </label>
-            <ul tabindex="0" class="p-2 mt-3 shadow menu menu-compact dropdown-content bg-base-100 rounded-box w-52">
+            <ul tabindex="0"
+                class="p-2 mt-3 text-white rounded shadow menu menu-compact dropdown-content bg-coolgray-200 w-52">
                 <li>
                     <a href="/profile">
                         Profile
@@ -98,102 +97,4 @@
             </ul>
         </div>
     </div>
-    {{-- <div class="navbar">
-        <div class="navbar-start">
-            <div class="dropdown">
-                <label tabindex="0" class="btn btn-ghost xl:hidden">
-                    <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" fill="none" viewBox="0 0 24 24"
-                        stroke="currentColor">
-                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h8m-8 6h16" />
-                    </svg>
-                </label>
-                <ul tabindex="0" class="p-2 mt-3 shadow menu menu-compact dropdown-content bg-base-100 rounded-box w-52">
-                    <li>
-                        <a href="/">
-                            Dashboard
-                        </a>
-                    </li>
-                    @if (auth()->user()->isPartOfRootTeam())
-                        <li>
-                            <a href="/settings">
-                                Settings
-                            </a>
-                        </li>
-                    @endif
-                    <li>
-                        <a href="/profile">
-                            Profile
-                        </a>
-                    </li>
-                    <li>
-                        <a href="/profile/team">
-                            Team
-                        </a>
-                    </li>
-                    <li>
-                        <a href="/command-center">
-                            Command Center
-                        </a>
-                    </li>
-                    @if (auth()->user()->isPartOfRootTeam())
-                        <li>
-                            <livewire:force-upgrade />
-                        </li>
-                    @endif
-                    <li>
-                        <form action="/logout" method="POST">
-                            @csrf
-                            <button>Logout</button>
-                        </form>
-                    </li>
-                </ul>
-            </div>
-            <div class="px-2 text-xl font-bold text-white normal-case">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()->isPartOfRootTeam())
-                    <li>
-                        <a href="/settings">
-                            Settings
-                        </a>
-                    </li>
-                @endif
-                <li>
-                    <a href="/profile">
-                        Profile
-                    </a>
-                </li>
-                <li>
-                    <a href="/profile/team">
-                        Team
-                    </a>
-                </li>
-                <li>
-                    <a href="/command-center">
-                        Command Center
-                    </a>
-                </li>
-                @if (auth()->user()->isPartOfRootTeam())
-                    <li>
-                        <livewire:force-upgrade />
-                    </li>
-                @endif
-                <li>
-                    <form action="/logout" method="POST" class="hover:bg-transparent">
-                        @csrf
-                        <button class="text-sm link link-hover hover:text-white">Logout</button>
-                    </form>
-                </li>
-            </ul>
-        </div>
-    </div> --}}
 @endauth
diff --git a/resources/views/dashboard.blade.php b/resources/views/dashboard.blade.php
index 8b6808f27..0f521ea31 100644
--- a/resources/views/dashboard.blade.php
+++ b/resources/views/dashboard.blade.php
@@ -1,6 +1,6 @@
 <x-layout>
     <h1>Dashboard</h1>
-    <div class="container w-full pt-10 mx-auto">
-        Something useful will be here
+    <div class="">
+        Something useful will be here.
     </div>
 </x-layout>
diff --git a/resources/views/livewire/profile/form.blade.php b/resources/views/livewire/profile/form.blade.php
new file mode 100644
index 000000000..158a7409d
--- /dev/null
+++ b/resources/views/livewire/profile/form.blade.php
@@ -0,0 +1,10 @@
+<div>
+    <form wire:submit.prevent='submit'>
+        <div class="flex items-center gap-2">
+            <h3>Profile</h3>
+            <x-inputs.button type="submit" label="Save">Save</x-inputs.button>
+        </div>
+        <x-inputs.input id="name" label="Name" required />
+        <x-inputs.input id="email" label="Email" readonly />
+    </form>
+</div>
diff --git a/resources/views/livewire/project/application/danger.blade.php b/resources/views/livewire/project/application/danger.blade.php
index 66afc3b73..5e5f17724 100644
--- a/resources/views/livewire/project/application/danger.blade.php
+++ b/resources/views/livewire/project/application/danger.blade.php
@@ -1,5 +1,5 @@
 <div x-data="{ deleteApplication: false }">
     <h2>Danger Zone</h2>
     <x-naked-modal show="deleteApplication" />
-    <x-inputs.button isWarning x-on:click.prevent="deleteApplication = true">Delete this application</x-inputs.button>
+    <x-inputs.button x-on:click.prevent="deleteApplication = true">Delete this application</x-inputs.button>
 </div>
diff --git a/resources/views/livewire/project/application/deploy.blade.php b/resources/views/livewire/project/application/deploy.blade.php
index 1d1923590..44abfc75d 100644
--- a/resources/views/livewire/project/application/deploy.blade.php
+++ b/resources/views/livewire/project/application/deploy.blade.php
@@ -2,7 +2,7 @@
     @if ($application->status === 'running')
         <div class="dropdown dropdown-bottom">
             <button tabindex="0"
-                class="flex items-center justify-center h-full text-white normal-case rounded bg-primary btn btn-xs hover:bg-primary no-animation">
+                class="flex items-center justify-center h-full text-white normal-case rounded-none bg-primary btn btn-xs hover:bg-primary no-animation">
                 Actions
                 <x-chevron-down />
             </button>
@@ -16,11 +16,10 @@
                 </li>
             </ul>
         </div>
-        running
     @else
         <div class="dropdown dropdown-bottom">
             <button tabindex="0"
-                class="flex items-center justify-center h-full text-white normal-case rounded bg-primary btn btn-xs hover:bg-primary no-animation">
+                class="flex items-center justify-center h-full text-white normal-case rounded-none bg-primary btn btn-xs hover:bg-primary no-animation">
                 Actions
                 <x-chevron-down />
             </button>
@@ -34,15 +33,5 @@
                 </li>
             </ul>
         </div>
-        stopped
     @endif
-    <span wire:poll.5000ms='pollingStatus'>
-        {{-- @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 --}}
-    </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 b966e0249..7e5e85ef8 100644
--- a/resources/views/livewire/project/application/environment-variable/add.blade.php
+++ b/resources/views/livewire/project/application/environment-variable/add.blade.php
@@ -1,4 +1,4 @@
-<form wire:submit.prevent='submit' class="flex flex-col px-2 max-w-fit">
+<form wire:submit.prevent='submit' class="flex flex-col max-w-fit">
     <div class="flex gap-2">
         <x-inputs.input placeholder="NODE_ENV" noDirty id="key" label="Name" required />
         <x-inputs.input placeholder="production" noDirty id="value" label="Value" required />
diff --git a/resources/views/livewire/project/application/environment-variable/show.blade.php b/resources/views/livewire/project/application/environment-variable/show.blade.php
index 4b1a2ff75..8cba3ad1e 100644
--- a/resources/views/livewire/project/application/environment-variable/show.blade.php
+++ b/resources/views/livewire/project/application/environment-variable/show.blade.php
@@ -1,5 +1,5 @@
 <div x-data="{ deleteEnvironment: false }">
-    <form wire:submit.prevent='submit' class="flex flex-col px-2 max-w-fit">
+    <form wire:submit.prevent='submit' class="flex flex-col max-w-fit">
         <div class="flex gap-2">
             <x-inputs.input label="Name" id="env.key" />
             <x-inputs.input label="Value" id="env.value" />
diff --git a/resources/views/livewire/project/application/poll-deployment.blade.php b/resources/views/livewire/project/application/poll-deployment.blade.php
index c66f96871..27e1c1953 100644
--- a/resources/views/livewire/project/application/poll-deployment.blade.php
+++ b/resources/views/livewire/project/application/poll-deployment.blade.php
@@ -1,4 +1,4 @@
 <div
-    class="flex flex-col-reverse w-full overflow-y-auto border border-solid rounded border-coolgray-300 max-h-[32rem] p-4 text-xs text-white">
+    class="flex flex-col-reverse w-full overflow-y-auto border border-solid rounded border-coolgray-300 max-h-[32rem] p-4 mt-4 text-xs text-white">
     <pre class="font-mono whitespace-pre-wrap" @if ($isKeepAliveOn) wire:poll.1000ms="polling" @endif>{{ \App\Actions\CoolifyTask\RunRemoteProcess::decodeOutput($activity) }}</pre>
 </div>
diff --git a/resources/views/livewire/project/application/status.blade.php b/resources/views/livewire/project/application/status.blade.php
new file mode 100644
index 000000000..27279fb38
--- /dev/null
+++ b/resources/views/livewire/project/application/status.blade.php
@@ -0,0 +1,15 @@
+<div wire:poll.5000ms='pollingStatus'>
+    @if ($application->status === 'running')
+        <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
+        <div class="flex items-center gap-2 text-sm" wire:loading.remove.delay.longer>
+            <span class="flex w-3 h-3 rounded-full bg-success"></span>
+            <span class="text-green-500">Running</span>
+        </div>
+    @else
+        <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
+        <div class="flex items-center gap-2 text-sm" wire:loading.remove.delay.longer>
+            <span class="flex w-3 h-3 rounded-full bg-error"></span>
+            <span class="text-error">Stopped</span>
+        </div>
+    @endif
+</div>
diff --git a/resources/views/livewire/server/form.blade.php b/resources/views/livewire/server/form.blade.php
index ef70c569b..c88ae75b3 100644
--- a/resources/views/livewire/server/form.blade.php
+++ b/resources/views/livewire/server/form.blade.php
@@ -5,7 +5,7 @@
             <h2>General</h2>
             <x-inputs.button type="submit">Save</x-inputs.button>
             @if ($server_id !== 0)
-                <x-inputs.button isWarning x-on:click.prevent="deleteServer = true">
+                <x-inputs.button x-on:click.prevent="deleteServer = true">
                     Delete
                 </x-inputs.button>
             @endif
@@ -17,32 +17,32 @@
                 {{-- <x-inputs.checkbox disabled type="checkbox" id="server.settings.is_part_of_swarm"
                     label="Is it part of a Swarm cluster?" /> --}}
             </div>
-            <div class="flex flex-col w-96">
+            <div class="flex flex-col">
                 @if ($server->id === 0)
                     <x-inputs.input id="server.ip" label="IP Address" readonly />
                     <x-inputs.input id="server.user" label="User" readonly />
                     <x-inputs.input type="number" id="server.port" label="Port" readonly />
                 @else
                     <x-inputs.input id="server.ip" label="IP Address" required readonly />
-                    <x-inputs.input id="server.user" label="User" required />
-                    <x-inputs.input type="number" id="server.port" label="Port" required />
+                    <div class="flex gap-2">
+                        <x-inputs.input id="server.user" label="User" required />
+                        <x-inputs.input type="number" id="server.port" label="Port" required />
+                    </div>
                 @endif
             </div>
         </div>
-
+        <h3>Quick Actions</h3>
         <div class="flex items-center gap-2">
-            <x-inputs.button isHighlighted wire:click.prevent='validateServer'>
+            <x-inputs.button wire:click.prevent='validateServer'>
                 @if ($server->settings->is_validated)
                     Check Connection
                 @else
                     Validate Server
                 @endif
             </x-inputs.button>
-
-            {{-- <x-inputs.button  wire:click.prevent='installDocker'>Install Docker</x-inputs.button> --}}
-
+            {{-- <x-inputs.button wire:click.prevent='installDocker'>Install Docker</x-inputs.button> --}}
         </div>
-        <div class="pt-3">
+        <div class="pt-3 text-sm">
             @isset($uptime)
                 <p>Uptime: {{ $uptime }}</p>
             @endisset
@@ -55,27 +55,25 @@
         </div>
     </form>
     <div class="flex items-center gap-2 py-4">
-        <div class="font-bold">Private Key</div>
-        <a class="px-2"
-            href="{{ route('private-key.show', ['private_key_uuid' => data_get($server, 'privateKey.uuid')]) }}">
-            {{ data_get($server, 'privateKey.uuid') }}
-        </a>
+        <h3>Private Key</h3>
         <a href="{{ route('server.private-key', ['server_uuid' => $server->uuid]) }}">
             <x-inputs.button>Change</x-inputs.button>
         </a>
     </div>
+    <a href="{{ route('private-key.show', ['private_key_uuid' => data_get($server, 'privateKey.uuid')]) }}">
+        <button class="text-white btn-link">{{ data_get($server, 'privateKey.name') }}</button>
+    </a>
     <div class="flex items-center gap-2 py-4">
-        <div class="font-bold">Destinations</div>
-        <div>
-            @foreach ($server->standaloneDockers as $docker)
-                <a class="px-2"
-                    href="{{ route('destination.show', ['destination_uuid' => data_get($docker, 'uuid')]) }}">
-                    {{ data_get($docker, 'network') }}
-                </a>
-            @endforeach
-        </div>
+        <h3>Destinations</h3>
         <a href="{{ route('destination.new', ['server_id' => $server->id]) }}">
             <x-inputs.button>Add</x-inputs.button>
         </a>
     </div>
+    <div>
+        @foreach ($server->standaloneDockers as $docker)
+            <a href="{{ route('destination.show', ['destination_uuid' => data_get($docker, 'uuid')]) }}">
+                <button class="text-white btn-link">{{ data_get($docker, 'network') }}</button>
+            </a>
+        @endforeach
+    </div>
 </div>
diff --git a/resources/views/livewire/server/private-key.blade.php b/resources/views/livewire/server/private-key.blade.php
index 473b3054f..3e15f3dc9 100644
--- a/resources/views/livewire/server/private-key.blade.php
+++ b/resources/views/livewire/server/private-key.blade.php
@@ -1,6 +1,9 @@
-<div>
+<div class="flex flex-wrap gap-2">
     @forelse ($private_keys as $private_key)
-        <x-inputs.button wire:click='setPrivateKey({{ $private_key->id }})'>{{ $private_key->name }}</x-inputs.button>
+        <div class="w-64 box">
+            <button wire:click='setPrivateKey({{ $private_key->id }})'>{{ $private_key->name }}
+            </button>
+        </div>
     @empty
         <p>No private keys found</p>
     @endforelse
diff --git a/resources/views/livewire/server/proxy.blade.php b/resources/views/livewire/server/proxy.blade.php
index bf8aff14e..090a0dbd4 100644
--- a/resources/views/livewire/server/proxy.blade.php
+++ b/resources/views/livewire/server/proxy.blade.php
@@ -2,54 +2,61 @@
     <x-naked-modal show="stopProxy" action="stopProxy"
         message='Are you sure you would like to stop the proxy? All resources will be unavailable.' />
     @if ($server->settings->is_validated)
-        <div class="flex items-center gap-2 mb-4">
-            <h2>Proxy</h2>
-            <div>{{ $server->extra_attributes->proxy_status }}</div>
+        <div class="flex items-center gap-2 mb-2">
+            <h2 class="pb-0">Proxy</h2>
+            @if ($server->extra_attributes->proxy_type)
+                <x-inputs.button isHighlighted wire:click.prevent="installProxy">
+                    Start/Reconfigure Proxy
+                </x-inputs.button>
+                <x-inputs.button x-on:click.prevent="stopProxy = true">Stop
+                </x-inputs.button>
+                <div wire:poll="proxyStatus">
+                    @if (
+                        $server->extra_attributes->last_applied_proxy_settings &&
+                            $server->extra_attributes->last_saved_proxy_settings !== $server->extra_attributes->last_applied_proxy_settings)
+                        <div class="text-red-500">Configuration out of sync.</div>
+                    @endif
+
+
+                </div>
+            @endif
+            @if ($server->extra_attributes->proxy_status === 'running')
+                <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
+                <div class="flex items-center gap-2 text-sm" wire:loading.remove.delay.longer>
+                    <span class="flex w-3 h-3 rounded-full bg-success"></span>
+                    <span class="text-green-500">Running</span>
+                </div>
+            @else
+                <span class="text-xs text-pink-600" wire:loading.delay.longer>Loading current status...</span>
+                <div class="flex items-center gap-2 text-sm" wire:loading.remove.delay.longer>
+                    <span class="flex w-3 h-3 rounded-full bg-error"></span>
+                    <span class="text-error">Stopped</span>
+                </div>
+            @endif
         </div>
 
+        <livewire:activity-monitor />
         @if ($server->extra_attributes->proxy_type)
-            <h3>Actions</h3>
-            <div wire:poll="proxyStatus">
-                @if (
-                    $server->extra_attributes->last_applied_proxy_settings &&
-                        $server->extra_attributes->last_saved_proxy_settings !== $server->extra_attributes->last_applied_proxy_settings)
-                    <div class="text-red-500">Configuration out of sync.</div>
-                    <x-inputs.button isHighlighted wire:click="installProxy">
-                        Reconfigure
-                    </x-inputs.button>
-                @endif
-                @if ($server->extra_attributes->proxy_status !== 'running')
-                    <x-inputs.button isHighlighted wire:click="installProxy">
-                        Start
-                    </x-inputs.button>
-                @else
-                    <x-inputs.button isWarning x-on:click.prevent="stopProxy = true">Stop
-                    </x-inputs.button>
-                @endif
-                <div class="py-4">
-                    <livewire:activity-monitor />
-                </div>
-                <div x-init="$wire.checkProxySettingsInSync">
-                    <div wire:loading wire:target="checkProxySettingsInSync">
-                        <x-loading />
-                    </div>
-                    @isset($proxy_settings)
-                        @if ($selectedProxy->value === 'TRAEFIK_V2')
-                            <form wire:submit.prevent='saveConfiguration'>
-                                <div class="flex items-center gap-2">
-                                    <h3>Configuration</h3>
-                                    <x-inputs.button type="submit">Save</x-inputs.button>
-                                    <x-inputs.button wire:click.prevent="resetProxy">
-                                        Reset Configuration
-                                    </x-inputs.button>
-                                </div>
-                                <h4>traefik.conf</h4>
-                                <x-inputs.textarea noDirty name="proxy_settings" wire:model.defer="proxy_settings"
-                                    rows="30" />
-                            </form>
-                        @endif
-                    @endisset
+            <div x-init="$wire.checkProxySettingsInSync">
+                <div wire:loading wire:target="checkProxySettingsInSync">
+                    <x-loading />
                 </div>
+                @isset($proxy_settings)
+                    @if ($selectedProxy->value === 'TRAEFIK_V2')
+                        <form wire:submit.prevent='saveConfiguration'>
+                            <div class="flex items-center gap-2">
+                                <h3>Configuration</h3>
+                                <x-inputs.button type="submit">Save</x-inputs.button>
+                                <x-inputs.button wire:click.prevent="resetProxy">
+                                    Reset Configuration
+                                </x-inputs.button>
+                            </div>
+                            <h4>traefik.conf</h4>
+                            <x-inputs.textarea class="text-xs" noDirty name="proxy_settings"
+                                wire:model.defer="proxy_settings" rows="30" />
+                        </form>
+                    @endif
+                @endisset
             </div>
         @else
             <select wire:model="selectedProxy">
diff --git a/resources/views/livewire/switch-team.blade.php b/resources/views/livewire/switch-team.blade.php
index 9a5e79ec1..4ad26393a 100644
--- a/resources/views/livewire/switch-team.blade.php
+++ b/resources/views/livewire/switch-team.blade.php
@@ -1,6 +1,6 @@
 <div class="pt-4">
+    <h3>Switch Team</h3>
     @if (auth()->user()->otherTeams()->count() > 0)
-        <p>Switch to:</p>
         <div class="flex gap-2">
             @foreach (auth()->user()->otherTeams() as $team)
                 <x-inputs.button isHighlighted wire:key="{{ $team->id }}"
@@ -9,5 +9,4 @@
             @endforeach
         </div>
     @endif
-
 </div>
diff --git a/resources/views/profile.blade.php b/resources/views/profile.blade.php
index 6827ef272..59238f3bd 100644
--- a/resources/views/profile.blade.php
+++ b/resources/views/profile.blade.php
@@ -1,10 +1,3 @@
 <x-layout>
-    <div>
-        <div>
-            <h3>User</h3>
-            <p>Name: {{ auth()->user()->name }}</p>
-            <p>Id: {{ auth()->user()->id }}</p>
-            <p>Uuid: {{ auth()->user()->uuid }}</p>
-        </div>
-    </div>
+    <livewire:profile.form />
 </x-layout>
diff --git a/resources/views/project/application/configuration.blade.php b/resources/views/project/application/configuration.blade.php
index 0826fb84b..1a8c53fb1 100644
--- a/resources/views/project/application/configuration.blade.php
+++ b/resources/views/project/application/configuration.blade.php
@@ -1,6 +1,17 @@
 <x-layout>
+    <h1 class="pb-0">Configuration</h1>
+    <div class="pb-10 text-sm breadcrumbs">
+        <ul>
+            <li><a
+                    href="{{ route('project.show', ['project_uuid' => request()->route('project_uuid')]) }}">{{ request()->route('project_uuid') }}</a>
+            </li>
+            <li><a
+                    href="{{ route('project.resources', ['environment_name' => request()->route('environment_name'), 'project_uuid' => request()->route('project_uuid')]) }}">{{ request()->route('environment_name') }}</a>
+            </li>
+            <li>{{ data_get($application, 'name') }}</li>
+        </ul>
+    </div>
     <x-applications.navbar :application="$application" />
-    <h1 class="py-10">Configuration</h1>
     <div x-data="{ activeTab: window.location.hash ? window.location.hash.substring(1) : 'general' }" class="flex h-full pt-6">
         <div class="flex flex-col gap-4 min-w-fit">
             <a :class="activeTab === 'general' && 'text-white'"
diff --git a/resources/views/project/application/deployment.blade.php b/resources/views/project/application/deployment.blade.php
index f10fd38f7..ba473db78 100644
--- a/resources/views/project/application/deployment.blade.php
+++ b/resources/views/project/application/deployment.blade.php
@@ -1,5 +1,16 @@
 <x-layout>
+    <h1 class="py-0">Deployment</h1>
+    <div class="pb-10 text-sm breadcrumbs">
+        <ul>
+            <li><a
+                    href="{{ route('project.show', ['project_uuid' => request()->route('project_uuid')]) }}">{{ request()->route('project_uuid') }}</a>
+            </li>
+            <li><a
+                    href="{{ route('project.resources', ['environment_name' => request()->route('environment_name'), 'project_uuid' => request()->route('project_uuid')]) }}">{{ request()->route('environment_name') }}</a>
+            </li>
+            <li>{{ data_get($application, 'name') }}</li>
+        </ul>
+    </div>
     <x-applications.navbar :application="$application" />
-    <h1 class="py-10">Deployment</h1>
     <livewire:project.application.poll-deployment :activity="$activity" :deployment_uuid="$deployment_uuid" />
 </x-layout>
diff --git a/resources/views/project/application/deployments.blade.php b/resources/views/project/application/deployments.blade.php
index c4842d4db..97cc3c85b 100644
--- a/resources/views/project/application/deployments.blade.php
+++ b/resources/views/project/application/deployments.blade.php
@@ -1,6 +1,17 @@
 <x-layout>
+    <h1 class="pb-0">Deployments</h1>
+    <div class="pb-10 text-sm breadcrumbs">
+        <ul>
+            <li><a
+                    href="{{ route('project.show', ['project_uuid' => request()->route('project_uuid')]) }}">{{ request()->route('project_uuid') }}</a>
+            </li>
+            <li><a
+                    href="{{ route('project.resources', ['environment_name' => request()->route('environment_name'), 'project_uuid' => request()->route('project_uuid')]) }}">{{ request()->route('environment_name') }}</a>
+            </li>
+            <li>{{ data_get($application, 'name') }}</li>
+        </ul>
+    </div>
     <x-applications.navbar :application="$application" />
-    <h1 class="py-10">Deployments</h1>
     <div class="pt-2">
         @forelse ($deployments as $deployment)
             <livewire:project.application.get-deployments :deployment_uuid="data_get($deployment->properties, 'type_uuid')" :created_at="data_get($deployment, 'created_at')" :status="data_get($deployment->properties, 'status')" />
diff --git a/resources/views/project/resources.blade.php b/resources/views/project/resources.blade.php
index 0df8ac7a6..63f4095bf 100644
--- a/resources/views/project/resources.blade.php
+++ b/resources/views/project/resources.blade.php
@@ -1,7 +1,18 @@
 <x-layout>
-    <div class="flex items-center gap-2">
-        <h1>Resources</h1>
-        <livewire:project.delete :project_id="$project->id" :resource_count="$project->applications->count()" />
+    <div class="flex flex-col">
+        <div class="flex items-center gap-2">
+            <h1 class="pb-0">Resources</h1>
+            <livewire:project.delete :project_id="$project->id" :resource_count="$project->applications->count()" />
+        </div>
+        <div class="pb-10 text-sm breadcrumbs">
+            <ul>
+                <li><a
+                        href="{{ route('project.show', ['project_uuid' => request()->route('project_uuid')]) }}">{{ request()->route('project_uuid') }}</a>
+                </li>
+                <li>
+                    {{ request()->route('environment_name') }} </li>
+            </ul>
+        </div>
     </div>
     @if ($environment->applications->count() === 0)
         <p>No resources yet.</p>
diff --git a/resources/views/servers.blade.php b/resources/views/servers.blade.php
index 4b64e455d..13008fca6 100644
--- a/resources/views/servers.blade.php
+++ b/resources/views/servers.blade.php
@@ -4,10 +4,10 @@
         <a href="{{ route('server.show', ['server_uuid' => data_get($server, 'uuid')]) }}"
             class="box">{{ $server->name }}</a>
     @empty
-        <div class="flex flex-col items-center justify-center h-full pt-32">
-            <div class="">Without a server, you won't be able to do much...</div>
-            <div>Let's create <a class="underline text-warning" href="{{ route('server.new') }}">your
-                    first</a> one!</div>
+        <div class="flex flex-col">
+            <div>Without a server, you won't be able to do much.</div>
+            <div>Let's <a class="text-lg underline text-warning" href="{{ route('server.new') }}">create</a> your
+                first one.</div>
         </div>
     @endforelse
 </x-layout>
diff --git a/resources/views/team.blade.php b/resources/views/team.blade.php
index c1ca0c8c9..01c89f164 100644
--- a/resources/views/team.blade.php
+++ b/resources/views/team.blade.php
@@ -1,7 +1,8 @@
 <x-layout>
-    <div>
-        <h3>Current Team</h3>
-        <p>{{ session('currentTeam')->name }}</p>
-        <livewire:switch-team>
+    <h1>Teams</h1>
+    <div class="flex gap-2">
+        <div>Currently Active Team:</div>
+        <div class='text-white'>{{ session('currentTeam')->name }}</div>
     </div>
+    <livewire:switch-team>
 </x-layout>