dave/coolify
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Merge pull request #6667 from ShadowArcanist/shadow/proxy-visual-improvements

Browse Source 
chore(ui): improve proxy configuration page
This commit is contained in:
Andras Bacsai
2025-09-22 09:48:19 +02:00
committed by GitHub
parent b1ad24eecf 4ea4846124
commit 5933df2ed4
2 changed files with 52 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
resources/views/components/modal-confirmation.blade.php
View File

@@ -11,6 +11,7 @@
'content' => null, 'content' => null,
'checkboxes' => [], 'checkboxes' => [],
'actions' => [], 'actions' => [],
'warningMessage' => null,
'confirmWithText' => true, 'confirmWithText' => true,
'confirmationText' => 'Confirm Deletion', 'confirmationText' => 'Confirm Deletion',
'confirmationLabel' => 'Please confirm the execution of the actions by entering the Name below', 'confirmationLabel' => 'Please confirm the execution of the actions by entering the Name below',
@@ -228,7 +229,7 @@
<div x-show="step === 2"> <div x-show="step === 2">
<div class="p-4 mb-4 text-white border-l-4 border-red-500 bg-error" role="alert"> <div class="p-4 mb-4 text-white border-l-4 border-red-500 bg-error" role="alert">
<p class="font-bold">Warning</p> <p class="font-bold">Warning</p>
<p>This operation is permanent and cannot be undone. Please think again before proceeding! <p>{!! $warningMessage ?: 'This operation is permanent and cannot be undone. Please think again before proceeding!' !!}
</p> </p>
</div> </div>
<div class="mb-4">The following actions will be performed:</div> <div class="mb-4">The following actions will be performed:</div>

95
resources/views/livewire/server/proxy.blade.php
View File

@@ -4,26 +4,26 @@
<div x-init="$wire.loadProxyConfiguration"> <div x-init="$wire.loadProxyConfiguration">
@if ($selectedProxy !== 'NONE') @if ($selectedProxy !== 'NONE')
<form wire:submit='submit'> <form wire:submit='submit'>
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<h2>Configuration</h2> <h2>Configuration</h2>
@if ($server->proxy->status === 'exited' || $server->proxy->status === 'removing') @if ($server->proxy->status === 'exited' || $server->proxy->status === 'removing')
<x-forms.button canGate="update" :canResource="$server" wire:click.prevent="changeProxy">Switch @can('update', $server)
Proxy</x-forms.button> <x-modal-confirmation title="Confirm Proxy Switching?"
@else buttonTitle="Switch Proxy"
<x-forms.button canGate="update" :canResource="$server" disabled submitAction="changeProxy" :actions="[
wire:click.prevent="changeProxy">Switch Proxy</x-forms.button> 'Custom proxy configurations may be reset to their default settings.'
@endif ]" warningMessage="This operation may cause issues. Please refer to the guide <a href='https://coolify.io/docs/knowledge-base/server/proxies#switch-between-proxies' target='_blank' class='underline text-white'>switching between proxies</a> before proceeding!" step2ButtonText="Switch Proxy" :confirmWithText="false" :confirmWithPassword="false">
<x-forms.button canGate="update" :canResource="$server" type="submit">Save</x-forms.button> </x-modal-confirmation>
</div> @endcan
<div class="pb-4 "> <svg class="inline-flex w-6 h-6 mr-2 dark:text-warning" viewBox="0 0 256 256" @else
xmlns="http://www.w3.org/2000/svg"> <x-forms.button canGate="update" :canResource="$server"
<path fill="currentColor" wire:click="$dispatch('error', 'Currently running proxy must be stopped before switching proxy')">Switch Proxy</x-forms.button>
d="M240.26 186.1L152.81 34.23a28.74 28.74 0 0 0-49.62 0L15.74 186.1a27.45 27.45 0 0 0 0 27.71A28.31 28.31 0 0 0 40.55 228h174.9a28.31 28.31 0 0 0 24.79-14.19a27.45 27.45 0 0 0 .02-27.71m-20.8 15.7a4.46 4.46 0 0 1-4 2.2H40.55a4.46 4.46 0 0 1-4-2.2a3.56 3.56 0 0 1 0-3.73L124 46.2a4.77 4.77 0 0 1 8 0l87.44 151.87a3.56 3.56 0 0 1 .02 3.73M116 136v-32a12 12 0 0 1 24 0v32a12 12 0 0 1-24 0m28 40a16 16 0 1 1-16-16a16 16 0 0 1 16 16" /> @endif
</svg>Before switching proxies, please read <a class="underline dark:text-white" <x-forms.button canGate="update" :canResource="$server" type="submit">Save</x-forms.button>
href="https://coolify.io/docs/knowledge-base/server/proxies#switch-between-proxies">this</a>. </div>
</div> <div class="subtitle">Configure your proxy settings and advanced options.</div>
<h3>Advanced</h3> <h3>Advanced</h3>
<div class="pb-4 w-96"> <div class="pb-6 w-96">
<x-forms.checkbox canGate="update" :canResource="$server" <x-forms.checkbox canGate="update" :canResource="$server"
helper="If set, all resources will only have docker container labels for {{ str($server->proxyType())->title() }}.<br>For applications, labels needs to be regenerated manually. <br>Resources needs to be restarted." helper="If set, all resources will only have docker container labels for {{ str($server->proxyType())->title() }}.<br>For applications, labels needs to be regenerated manually. <br>Resources needs to be restarted."
id="server.settings.generate_exact_labels" id="server.settings.generate_exact_labels"
@@ -36,11 +36,30 @@
id="redirectUrl" label="Redirect to (optional)" /> id="redirectUrl" label="Redirect to (optional)" />
@endif @endif
</div> </div>
@if ($server->proxyType() === ProxyTypes::TRAEFIK->value) @php
<h3>Traefik</h3> $proxyTitle = $server->proxyType() === ProxyTypes::TRAEFIK->value ? 'Traefik (Coolify Proxy)' : 'Caddy (Coolify Proxy)';
@elseif ($server->proxyType() === 'CADDY') @endphp
<h3>Caddy</h3> @if ($server->proxyType() === ProxyTypes::TRAEFIK->value || $server->proxyType() === 'CADDY')
@endif <div class="flex items-center gap-2">
<h3>{{ $proxyTitle }}</h3>
@if($proxySettings)
@can('update', $server)
<x-modal-confirmation title="Reset Proxy Configuration?"
buttonTitle="Reset Configuration"
submitAction="resetProxyConfiguration" :actions="[
'Reset proxy configuration to default settings',
'All custom configurations will be lost',
'Custom ports and entrypoints will be removed',
]"
confirmationText="{{ $server->name }}"
confirmationLabel="Please confirm by entering the server name below"
shortConfirmationLabel="Server Name" step2ButtonText="Reset Configuration"
:confirmWithPassword="false" :confirmWithText="true">
</x-modal-confirmation>
@endcan
@endif
</div>
@endif
@if ( @if (
$server->proxy->last_applied_settings && $server->proxy->last_applied_settings &&
$server->proxy->last_saved_settings !== $server->proxy->last_applied_settings) $server->proxy->last_saved_settings !== $server->proxy->last_applied_settings)
@@ -53,26 +72,12 @@
</div> </div>
<div wire:loading.remove wire:target="loadProxyConfiguration"> <div wire:loading.remove wire:target="loadProxyConfiguration">
@if ($proxySettings) @if ($proxySettings)
<div class="flex flex-col gap-2 pt-4"> <div class="flex flex-col gap-2 pt-2">
<x-forms.textarea canGate="update" :canResource="$server" useMonacoEditor <x-forms.textarea canGate="update" :canResource="$server" useMonacoEditor
monacoEditorLanguage="yaml" monacoEditorLanguage="yaml"
label="Configuration file ({{ $this->configurationFilePath }})" name="proxySettings" label="Configuration file ({{ $this->configurationFilePath }})" name="proxySettings"
id="proxySettings" rows="30" /> id="proxySettings" rows="30" />
@can('update', $server) </div>
<x-modal-confirmation title="Reset Proxy Configuration?"
buttonTitle="Reset configuration to default" isErrorButton
submitAction="resetProxyConfiguration" :actions="[
'Reset proxy configuration to default settings',
'All custom configurations will be lost',
'Custom ports and entrypoints will be removed',
]"
confirmationText="{{ $server->name }}"
confirmationLabel="Please confirm by entering the server name below"
shortConfirmationLabel="Server Name" step2ButtonText="Reset Configuration"
:confirmWithPassword="false" :confirmWithText="true">
</x-modal-confirmation>
@endcan
</div>
@endif @endif
</div> </div>
</form> </form>