feat: proxy logs on the ui

This commit is contained in:
Andras Bacsai 2023-10-11 11:00:40 +02:00
parent 2552cb2208
commit 5541c135df
8 changed files with 160 additions and 69 deletions

View File

@ -0,0 +1,28 @@
<?php
namespace App\Http\Livewire\Server\Proxy;
use App\Models\Server;
use Livewire\Component;
class Logs extends Component
{
public ?Server $server = null;
public $parameters = [];
public function mount()
{
$this->parameters = get_route_parameters();
try {
$this->server = Server::ownedByCurrentTeam(['name', 'proxy'])->whereUuid(request()->server_uuid)->first();
if (is_null($this->server)) {
return redirect()->route('server.all');
}
} catch (\Throwable $e) {
return handleError($e, $this);
}
}
public function render()
{
return view('livewire.server.proxy.logs');
}
}

View File

@ -9,6 +9,11 @@ class Show extends Component
{
public ?Server $server = null;
public $parameters = [];
protected $listeners = ['proxyStatusUpdated'];
public function proxyStatusUpdated()
{
$this->server->refresh();
}
public function mount()
{
$this->parameters = get_route_parameters();

View File

@ -0,0 +1,27 @@
<?php
namespace App\View\Components\Server;
use App\Models\Server;
use Closure;
use Illuminate\Contracts\View\View;
use Illuminate\View\Component;
class Sidebar extends Component
{
/**
* Create a new component instance.
*/
public function __construct(public Server $server, public $parameters)
{
//
}
/**
* Get the view / contents that represent the component.
*/
public function render(): View|Closure|string
{
return view('components.server.sidebar');
}
}

View File

@ -0,0 +1,20 @@
<div>
@if ($server->isFunctional())
<div class="flex h-full pr-4">
<div class="flex flex-col gap-4 min-w-fit">
<a class="{{ request()->routeIs('server.proxy') ? 'text-white' : '' }}"
href="{{ route('server.proxy', $parameters) }}">
<button>Configuration</button>
</a>
@if (data_get($server, 'proxy.type') !== 'NONE')
<a class="{{ request()->routeIs('server.proxy.logs') ? 'text-white' : '' }}"
href="{{ route('server.proxy.logs', $parameters) }}">
<button>Logs</button>
</a>
@endif
</div>
</div>
@else
<div>Server is not validated. Validate first.</div>
@endif
</div>

View File

@ -1,75 +1,71 @@
<div>
@if ($server->isFunctional())
@if (data_get($server, 'proxy.type'))
<div x-init="$wire.loadProxyConfiguration">
@if ($selectedProxy === 'TRAEFIK_V2')
<form wire:submit.prevent='submit'>
<div class="flex items-center gap-2">
<h2>Proxy</h2>
<x-forms.button type="submit">Save</x-forms.button>
@if ($server->proxy->status === 'exited')
<x-forms.button wire:click.prevent="change_proxy">Switch Proxy</x-forms.button>
@endif
@if (data_get($server, 'proxy.type'))
<div x-init="$wire.loadProxyConfiguration">
@if ($selectedProxy === 'TRAEFIK_V2')
<form wire:submit.prevent='submit'>
<div class="flex items-center gap-2">
<h2>Configuration</h2>
<x-forms.button type="submit">Save</x-forms.button>
@if ($server->proxy->status === 'exited')
<x-forms.button wire:click.prevent="change_proxy">Switch Proxy</x-forms.button>
@endif
</div>
<div class="pt-3 pb-4 ">Traefik v2</div>
@if (
$server->proxy->last_applied_settings &&
$server->proxy->last_saved_settings !== $server->proxy->last_applied_settings)
<div class="text-red-500 ">Configuration out of sync. Restart the proxy to apply the new
configurations.
</div>
<div class="pt-3 pb-4 ">Traefik v2</div>
@if (
$server->proxy->last_applied_settings &&
$server->proxy->last_saved_settings !== $server->proxy->last_applied_settings)
<div class="text-red-500 ">Configuration out of sync. Restart the proxy to apply the new
configurations.
@endif
<x-forms.input placeholder="https://app.coolify.io" id="redirect_url" label="Default Redirect 404"
helper="All urls that has no service available will be redirected to this domain." />
<div wire:loading wire:target="loadProxyConfiguration" class="pt-4">
<x-loading text="Loading proxy configuration..." />
</div>
<div wire:loading.remove wire:target="loadProxyConfiguration">
@if ($proxy_settings)
<div class="flex flex-col gap-2 pt-2">
<x-forms.textarea label="Configuration file: traefik.conf" name="proxy_settings"
wire:model.defer="proxy_settings" rows="30" />
<x-forms.button wire:click.prevent="reset_proxy_configuration">
Reset configuration to default
</x-forms.button>
</div>
@endif
<x-forms.input placeholder="https://app.coolify.io" id="redirect_url" label="Default Redirect 404"
helper="All urls that has no service available will be redirected to this domain." />
<div wire:loading wire:target="loadProxyConfiguration" class="pt-4">
<x-loading text="Loading proxy configuration..." />
</div>
<div wire:loading.remove wire:target="loadProxyConfiguration">
@if ($proxy_settings)
<div class="flex flex-col gap-2 pt-2">
<x-forms.textarea label="Configuration file: traefik.conf" name="proxy_settings"
wire:model.defer="proxy_settings" rows="30" />
<x-forms.button wire:click.prevent="reset_proxy_configuration">
Reset configuration to default
</x-forms.button>
</div>
@endif
</div>
</form>
@elseif($selectedProxy === 'NONE')
<div class="flex items-center gap-2">
<h2>Proxy</h2>
<x-forms.button wire:click.prevent="change_proxy">Switch Proxy</x-forms.button>
</div>
<div class="pt-3 pb-4">None</div>
@else
<div class="flex items-center gap-2">
<h2>Proxy</h2>
<x-forms.button wire:click.prevent="change_proxy">Switch Proxy</x-forms.button>
</div>
@endif
@else
<div>
<h2>Proxy</h2>
<div class="subtitle">Select a proxy you would like to use on this server.</div>
<div class="grid gap-4">
<x-forms.button class="box" wire:click="select_proxy('NONE')">
Custom (None)
</x-forms.button>
<x-forms.button class="box" wire:click="select_proxy('TRAEFIK_V2')">
Traefik
v2
</x-forms.button>
<x-forms.button disabled class="box">
Nginx
</x-forms.button>
<x-forms.button disabled class="box">
Caddy
</x-forms.button>
</div>
</form>
@elseif($selectedProxy === 'NONE')
<div class="flex items-center gap-2">
<h2>Configuration</h2>
<x-forms.button wire:click.prevent="change_proxy">Switch Proxy</x-forms.button>
</div>
@endif
@else
<div>Server is not validated. Validate first.</div>
<div class="pt-3 pb-4">Custom (None) Proxy Selected</div>
@else
<div class="flex items-center gap-2">
<h2>Configuration</h2>
<x-forms.button wire:click.prevent="change_proxy">Switch Proxy</x-forms.button>
</div>
@endif
@else
<div>
<h2>Configuration</h2>
<div class="subtitle">Select a proxy you would like to use on this server.</div>
<div class="grid gap-4">
<x-forms.button class="box" wire:click="select_proxy('NONE')">
Custom (None)
</x-forms.button>
<x-forms.button class="box" wire:click="select_proxy('TRAEFIK_V2')">
Traefik
v2
</x-forms.button>
<x-forms.button disabled class="box">
Nginx
</x-forms.button>
<x-forms.button disabled class="box">
Caddy
</x-forms.button>
</div>
</div>
@endif
</div>

View File

@ -0,0 +1,9 @@
<div>
<x-server.navbar :server="$server" :parameters="$parameters" />
<div class="flex gap-2">
<x-server.sidebar :server="$server" :parameters="$parameters" />
<div class="w-full">
<livewire:project.shared.get-logs :server="$server" container="coolify-proxy" />
</div>
</div>
</div>

View File

@ -1,4 +1,9 @@
<div>
<x-server.navbar :server="$server" :parameters="$parameters" />
<livewire:server.proxy :server="$server" />
<div class="flex gap-2">
<x-server.sidebar :server="$server" :parameters="$parameters" />
<div class="w-full">
<livewire:server.proxy :server="$server" />
</div>
</div>
</div>

View File

@ -5,7 +5,6 @@
use App\Http\Controllers\DatabaseController;
use App\Http\Controllers\MagicController;
use App\Http\Controllers\ProjectController;
use App\Http\Controllers\ServerController;
use App\Http\Livewire\Boarding\Index as BoardingIndex;
use App\Http\Livewire\Project\Service\Index as ServiceIndex;
use App\Http\Livewire\Project\Service\Show as ServiceShow;
@ -17,6 +16,7 @@
use App\Http\Livewire\Server\Destination\Show as DestinationShow;
use App\Http\Livewire\Server\PrivateKey\Show as PrivateKeyShow;
use App\Http\Livewire\Server\Proxy\Show as ProxyShow;
use App\Http\Livewire\Server\Proxy\Logs as ProxyLogs;
use App\Http\Livewire\Server\Show;
use App\Http\Livewire\Subscription\Show as SubscriptionShow;
use App\Http\Livewire\Waitlist\Index as WaitlistIndex;
@ -123,6 +123,7 @@
Route::get('/server/new', Create::class)->name('server.create');
Route::get('/server/{server_uuid}', Show::class)->name('server.show');
Route::get('/server/{server_uuid}/proxy', ProxyShow::class)->name('server.proxy');
Route::get('/server/{server_uuid}/proxy/logs', ProxyLogs::class)->name('server.proxy.logs');
Route::get('/server/{server_uuid}/private-key', PrivateKeyShow::class)->name('server.private-key');
Route::get('/server/{server_uuid}/destinations', DestinationShow::class)->name('server.destinations');
});