refactor application advanced view

This commit is contained in:
Andras Bacsai
2024-11-05 12:28:33 +01:00
parent c8a3519796
commit a07605205e
2 changed files with 217 additions and 117 deletions

View File

@@ -3,120 +3,221 @@
namespace App\Livewire\Project\Application; namespace App\Livewire\Project\Application;
use App\Models\Application; use App\Models\Application;
use Livewire\Attributes\Validate;
use Livewire\Component; use Livewire\Component;
class Advanced extends Component class Advanced extends Component
{ {
public Application $application; public Application $application;
public bool $is_force_https_enabled; #[Validate(['boolean'])]
public bool $isForceHttpsEnabled = false;
public bool $is_gzip_enabled; #[Validate(['boolean'])]
public bool $isGitSubmodulesEnabled = false;
public bool $is_stripprefix_enabled; #[Validate(['boolean'])]
public bool $isGitLfsEnabled = false;
protected $rules = [ #[Validate(['boolean'])]
'application.settings.is_git_submodules_enabled' => 'boolean|required', public bool $isPreviewDeploymentsEnabled = false;
'application.settings.is_git_lfs_enabled' => 'boolean|required',
'application.settings.is_preview_deployments_enabled' => 'boolean|required', #[Validate(['boolean'])]
'application.settings.is_auto_deploy_enabled' => 'boolean|required', public bool $isAutoDeployEnabled = true;
'is_force_https_enabled' => 'boolean|required',
'application.settings.is_log_drain_enabled' => 'boolean|required', #[Validate(['boolean'])]
'application.settings.is_gpu_enabled' => 'boolean|required', public bool $isLogDrainEnabled = false;
'application.settings.is_build_server_enabled' => 'boolean|required',
'application.settings.is_consistent_container_name_enabled' => 'boolean|required', #[Validate(['boolean'])]
'application.settings.custom_internal_name' => 'string|nullable', public bool $isGpuEnabled = false;
'application.settings.is_gzip_enabled' => 'boolean|required',
'application.settings.is_stripprefix_enabled' => 'boolean|required', #[Validate(['string'])]
'application.settings.gpu_driver' => 'string|required', public string $gpuDriver = '';
'application.settings.gpu_count' => 'string|required',
'application.settings.gpu_device_ids' => 'string|required', #[Validate(['string', 'nullable'])]
'application.settings.gpu_options' => 'string|required', public ?string $gpuCount = null;
'application.settings.is_raw_compose_deployment_enabled' => 'boolean|required',
'application.settings.connect_to_docker_network' => 'boolean|required', #[Validate(['string', 'nullable'])]
]; public ?string $gpuDeviceIds = null;
#[Validate(['string', 'nullable'])]
public ?string $gpuOptions = null;
#[Validate(['boolean'])]
public bool $isBuildServerEnabled = false;
#[Validate(['boolean'])]
public bool $isConsistentContainerNameEnabled = false;
#[Validate(['string', 'nullable'])]
public ?string $customInternalName = null;
#[Validate(['boolean'])]
public bool $isGzipEnabled = true;
#[Validate(['boolean'])]
public bool $isStripprefixEnabled = true;
#[Validate(['boolean'])]
public bool $isRawComposeDeploymentEnabled = false;
#[Validate(['boolean'])]
public bool $isConnectToDockerNetworkEnabled = false;
// protected $rules = [
// 'application.settings.is_git_submodules_enabled' => 'boolean|required',
// 'application.settings.is_git_lfs_enabled' => 'boolean|required',
// 'application.settings.is_preview_deployments_enabled' => 'boolean|required',
// 'application.settings.is_auto_deploy_enabled' => 'boolean|required',
// 'is_force_https_enabled' => 'boolean|required',
// 'application.settings.is_log_drain_enabled' => 'boolean|required',
// 'application.settings.is_gpu_enabled' => 'boolean|required',
// 'application.settings.gpu_driver' => 'string|required',
// 'application.settings.gpu_count' => 'string|required',
// 'application.settings.gpu_device_ids' => 'string|required',
// 'application.settings.gpu_options' => 'string|required',
// 'application.settings.is_build_server_enabled' => 'boolean|required',
// 'application.settings.is_consistent_container_name_enabled' => 'boolean|required',
// 'application.settings.custom_internal_name' => 'string|nullable',
// 'application.settings.is_gzip_enabled' => 'boolean|required',
// 'application.settings.is_stripprefix_enabled' => 'boolean|required',
// 'application.settings.is_raw_compose_deployment_enabled' => 'boolean|required',
// 'application.settings.connect_to_docker_network' => 'boolean|required',
// ];
public function mount() public function mount()
{ {
$this->is_force_https_enabled = $this->application->isForceHttpsEnabled(); try {
$this->is_gzip_enabled = $this->application->isGzipEnabled(); $this->syncData();
$this->is_stripprefix_enabled = $this->application->isStripprefixEnabled(); } catch (\Throwable $e) {
return handleError($e, $this);
}
}
public function syncData(bool $toModel = false)
{
if ($toModel) {
$this->validate();
$this->application->settings->is_force_https_enabled = $this->isForceHttpsEnabled;
$this->application->settings->is_git_submodules_enabled = $this->isGitSubmodulesEnabled;
$this->application->settings->is_git_lfs_enabled = $this->isGitLfsEnabled;
$this->application->settings->is_preview_deployments_enabled = $this->isPreviewDeploymentsEnabled;
$this->application->settings->is_auto_deploy_enabled = $this->isAutoDeployEnabled;
$this->application->settings->is_log_drain_enabled = $this->isLogDrainEnabled;
$this->application->settings->is_gpu_enabled = $this->isGpuEnabled;
$this->application->settings->gpu_driver = $this->gpuDriver;
$this->application->settings->gpu_count = $this->gpuCount;
$this->application->settings->gpu_device_ids = $this->gpuDeviceIds;
$this->application->settings->gpu_options = $this->gpuOptions;
$this->application->settings->is_build_server_enabled = $this->isBuildServerEnabled;
$this->application->settings->is_consistent_container_name_enabled = $this->isConsistentContainerNameEnabled;
$this->application->settings->custom_internal_name = $this->customInternalName;
$this->application->settings->is_gzip_enabled = $this->isGzipEnabled;
$this->application->settings->is_stripprefix_enabled = $this->isStripprefixEnabled;
$this->application->settings->is_raw_compose_deployment_enabled = $this->isRawComposeDeploymentEnabled;
$this->application->settings->connect_to_docker_network = $this->isConnectToDockerNetworkEnabled;
$this->application->settings->save();
} else {
$this->isForceHttpsEnabled = $this->application->isForceHttpsEnabled();
$this->isGzipEnabled = $this->application->isGzipEnabled();
$this->isStripprefixEnabled = $this->application->isStripprefixEnabled();
$this->isLogDrainEnabled = $this->application->isLogDrainEnabled();
$this->isGitSubmodulesEnabled = $this->application->settings->is_git_submodules_enabled;
$this->isGitLfsEnabled = $this->application->settings->is_git_lfs_enabled;
$this->isPreviewDeploymentsEnabled = $this->application->settings->is_preview_deployments_enabled;
$this->isAutoDeployEnabled = $this->application->settings->is_auto_deploy_enabled;
$this->isGpuEnabled = $this->application->settings->is_gpu_enabled;
$this->gpuDriver = $this->application->settings->gpu_driver;
$this->gpuCount = $this->application->settings->gpu_count;
$this->gpuDeviceIds = $this->application->settings->gpu_device_ids;
$this->gpuOptions = $this->application->settings->gpu_options;
$this->isBuildServerEnabled = $this->application->settings->is_build_server_enabled;
$this->isConsistentContainerNameEnabled = $this->application->settings->is_consistent_container_name_enabled;
$this->customInternalName = $this->application->settings->custom_internal_name;
$this->isRawComposeDeploymentEnabled = $this->application->settings->is_raw_compose_deployment_enabled;
$this->isConnectToDockerNetworkEnabled = $this->application->settings->connect_to_docker_network;
}
} }
public function instantSave() public function instantSave()
{ {
if ($this->application->isLogDrainEnabled()) { try {
if (! $this->application->destination->server->isLogDrainEnabled()) { if ($this->isLogDrainEnabled) {
$this->application->settings->is_log_drain_enabled = false; if (! $this->application->destination->server->isLogDrainEnabled()) {
$this->dispatch('error', 'Log drain is not enabled on this server.'); $this->isLogDrainEnabled = false;
$this->syncData(true);
$this->dispatch('error', 'Log drain is not enabled on this server.');
return; return;
}
} }
if ($this->application->isForceHttpsEnabled() !== $this->isForceHttpsEnabled ||
$this->application->isGzipEnabled() !== $this->isGzipEnabled ||
$this->application->isStripprefixEnabled() !== $this->isStripprefixEnabled
) {
$this->dispatch('resetDefaultLabels', false);
}
if ($this->application->settings->is_raw_compose_deployment_enabled) {
$this->application->oldRawParser();
} else {
$this->application->parse();
}
$this->syncData(true);
$this->dispatch('success', 'Settings saved.');
$this->dispatch('configurationChanged');
} catch (\Throwable $e) {
return handleError($e, $this);
} }
if ($this->application->settings->is_force_https_enabled !== $this->is_force_https_enabled) {
$this->application->settings->is_force_https_enabled = $this->is_force_https_enabled;
$this->dispatch('resetDefaultLabels', false);
}
if ($this->application->settings->is_gzip_enabled !== $this->is_gzip_enabled) {
$this->application->settings->is_gzip_enabled = $this->is_gzip_enabled;
$this->dispatch('resetDefaultLabels', false);
}
if ($this->application->settings->is_stripprefix_enabled !== $this->is_stripprefix_enabled) {
$this->application->settings->is_stripprefix_enabled = $this->is_stripprefix_enabled;
$this->dispatch('resetDefaultLabels', false);
}
if ($this->application->settings->is_raw_compose_deployment_enabled) {
$this->application->oldRawParser();
} else {
$this->application->parse();
}
$this->application->settings->save();
$this->dispatch('success', 'Settings saved.');
$this->dispatch('configurationChanged');
} }
public function submit() public function submit()
{ {
if ($this->application->settings->gpu_count && $this->application->settings->gpu_device_ids) { try {
$this->dispatch('error', 'You cannot set both GPU count and GPU device IDs.'); if ($this->gpuCount && $this->gpuDeviceIds) {
$this->application->settings->gpu_count = null; $this->dispatch('error', 'You cannot set both GPU count and GPU device IDs.');
$this->application->settings->gpu_device_ids = null; $this->gpuCount = null;
$this->application->settings->save(); $this->gpuDeviceIds = null;
$this->syncData(true);
return; return;
}
$this->syncData(true);
$this->dispatch('success', 'Settings saved.');
} catch (\Throwable $e) {
return handleError($e, $this);
} }
$this->application->settings->save();
$this->dispatch('success', 'Settings saved.');
} }
public function saveCustomName() public function saveCustomName()
{ {
if (str($this->application->settings->custom_internal_name)->isNotEmpty()) { if (str($this->customInternalName)->isNotEmpty()) {
$this->application->settings->custom_internal_name = str($this->application->settings->custom_internal_name)->slug()->value(); $this->customInternalName = str($this->customInternalName)->slug()->value();
} else { } else {
$this->application->settings->custom_internal_name = null; $this->customInternalName = null;
} }
if (is_null($this->application->settings->custom_internal_name)) { if (is_null($this->customInternalName)) {
$this->application->settings->save(); $this->syncData(true);
$this->dispatch('success', 'Custom name saved.'); $this->dispatch('success', 'Custom name saved.');
return; return;
} }
$customInternalName = $this->application->settings->custom_internal_name; $customInternalName = $this->customInternalName;
$server = $this->application->destination->server; $server = $this->application->destination->server;
$allApplications = $server->applications(); $allApplications = $server->applications();
$foundSameInternalName = $allApplications->filter(function ($application) { $foundSameInternalName = $allApplications->filter(function ($application) {
return $application->id !== $this->application->id && $application->settings->custom_internal_name === $this->application->settings->custom_internal_name; return $application->id !== $this->application->id && $application->settings->custom_internal_name === $this->customInternalName;
}); });
if ($foundSameInternalName->isNotEmpty()) { if ($foundSameInternalName->isNotEmpty()) {
$this->dispatch('error', 'This custom container name is already in use by another application on this server.'); $this->dispatch('error', 'This custom container name is already in use by another application on this server.');
$this->application->settings->custom_internal_name = $customInternalName; $this->customInternalName = $customInternalName;
$this->application->settings->refresh(); $this->syncData(true);
return; return;
} }
$this->application->settings->save(); $this->syncData(true);
$this->dispatch('success', 'Custom name saved.'); $this->dispatch('success', 'Custom name saved.');
} }

View File

@@ -8,90 +8,89 @@
<h3>General</h3> <h3>General</h3>
@if ($application->git_based()) @if ($application->git_based())
<x-forms.checkbox helper="Automatically deploy new commits based on Git webhooks." instantSave <x-forms.checkbox helper="Automatically deploy new commits based on Git webhooks." instantSave
id="application.settings.is_auto_deploy_enabled" label="Auto Deploy" /> id="isAutoDeployEnabled" label="Auto Deploy" />
<x-forms.checkbox <x-forms.checkbox
helper="Allow to automatically deploy Preview Deployments for all opened PR's.<br><br>Closing a PR will delete Preview Deployments." helper="Allow to automatically deploy Preview Deployments for all opened PR's.<br><br>Closing a PR will delete Preview Deployments."
instantSave id="application.settings.is_preview_deployments_enabled" label="Preview Deployments" /> instantSave id="isPreviewDeploymentsEnabled" label="Preview Deployments" />
@endif @endif
<x-forms.checkbox <x-forms.checkbox
helper="Your application will be available only on https if your domain starts with https://..." helper="Your application will be available only on https if your domain starts with https://..."
instantSave id="is_force_https_enabled" label="Force Https" /> instantSave id="isForceHttpsEnabled" label="Force Https" />
<x-forms.checkbox label="Enable Gzip Compression" <x-forms.checkbox label="Enable Gzip Compression"
helper="You can disable gzip compression if you want. Some services are compressing data by default. In this case, you do not need this." helper="You can disable gzip compression if you want. Some services are compressing data by default. In this case, you do not need this."
instantSave id="is_gzip_enabled" /> instantSave id="isGzipEnabled" />
<x-forms.checkbox helper="Strip Prefix is used to remove prefixes from paths. Like /api/ to /api." <x-forms.checkbox helper="Strip Prefix is used to remove prefixes from paths. Like /api/ to /api."
instantSave id="is_stripprefix_enabled" label="Strip Prefixes" /> instantSave id="isStripprefixEnabled" label="Strip Prefixes" />
@if ($application->build_pack === 'dockercompose') @if ($application->build_pack === 'dockercompose')
<h3>Docker Compose</h3> <h3>Docker Compose</h3>
<x-forms.checkbox instantSave id="application.settings.is_raw_compose_deployment_enabled" <x-forms.checkbox instantSave id="isRawComposeDeploymentEnabled" label="Raw Compose Deployment"
label="Raw Compose Deployment"
helper="WARNING: Advanced use cases only. Your docker compose file will be deployed as-is. Nothing is modified by Coolify. You need to configure the proxy parts. More info in the <a class='underline dark:text-white' href='https://coolify.io/docs/knowledge-base/docker/compose#raw-docker-compose-deployment'>documentation.</a>" /> helper="WARNING: Advanced use cases only. Your docker compose file will be deployed as-is. Nothing is modified by Coolify. You need to configure the proxy parts. More info in the <a class='underline dark:text-white' href='https://coolify.io/docs/knowledge-base/docker/compose#raw-docker-compose-deployment'>documentation.</a>" />
@endif @endif
<h3>Container Names</h3> <h3 class="pt-4">Container Names</h3>
<x-forms.checkbox <x-forms.checkbox
helper="The deployed container will have the same name ({{ $application->uuid }}). <span class='font-bold dark:text-warning'>You will lose the rolling update feature!</span>" helper="The deployed container will have the same name ({{ $application->uuid }}). <span class='font-bold dark:text-warning'>You will lose the rolling update feature!</span>"
instantSave id="application.settings.is_consistent_container_name_enabled" instantSave id="isConsistentContainerNameEnabled" label="Consistent Container Names" />
label="Consistent Container Names" /> @if (!$isConsistentContainerNameEnabled)
@if (!$application->settings->is_consistent_container_name_enabled) <form class="flex items-end gap-2 " wire:submit.prevent='saveCustomName'>
<form class="flex items-end gap-2 pl-2" wire:submit.prevent='saveCustomName'>
<x-forms.input <x-forms.input
helper="You can add a custom name for your container.<br><br>The name will be converted to slug format when you save it. <span class='font-bold dark:text-warning'>You will lose the rolling update feature!</span>" helper="You can add a custom name for your container.<br><br>The name will be converted to slug format when you save it. <span class='font-bold dark:text-warning'>You will lose the rolling update feature!</span>"
instantSave id="application.settings.custom_internal_name" label="Custom Container Name" /> instantSave id="customInternalName" label="Custom Container Name" />
<x-forms.button type="submit">Save</x-forms.button> <x-forms.button type="submit">Save</x-forms.button>
</form> </form>
@endif @endif
@if ($application->build_pack === 'dockercompose') @if ($application->build_pack === 'dockercompose')
<h3>Network</h3> <h3 class="pt-4">Network</h3>
<x-forms.checkbox instantSave id="application.settings.connect_to_docker_network" <x-forms.checkbox instantSave id="isConnectToDockerNetworkEnabled" label="Connect To Predefined Network"
label="Connect To Predefined Network"
helper="By default, you do not reach the Coolify defined networks.<br>Starting a docker compose based resource will have an internal network. <br>If you connect to a Coolify defined network, you maybe need to use different internal DNS names to connect to a resource.<br><br>For more information, check <a class='underline dark:text-white' target='_blank' href='https://coolify.io/docs/knowledge-base/docker/compose#connect-to-predefined-networks'>this</a>." /> helper="By default, you do not reach the Coolify defined networks.<br>Starting a docker compose based resource will have an internal network. <br>If you connect to a Coolify defined network, you maybe need to use different internal DNS names to connect to a resource.<br><br>For more information, check <a class='underline dark:text-white' target='_blank' href='https://coolify.io/docs/knowledge-base/docker/compose#connect-to-predefined-networks'>this</a>." />
@endif @endif
@if (!$application->settings->is_raw_compose_deployment_enabled) @if (!$isRawComposeDeploymentEnabled)
<h3>Logs</h3> <h3 class="pt-4">Logs</h3>
<x-forms.checkbox helper="Drain logs to your configured log drain endpoint in your Server settings." <x-forms.checkbox helper="Drain logs to your configured log drain endpoint in your Server settings."
instantSave id="application.settings.is_log_drain_enabled" label="Drain Logs" /> instantSave id="isLogDrainEnabled" label="Drain Logs" />
@endif @endif
@if ($application->git_based()) @if ($application->git_based())
<h3>Git</h3> <h3>Git</h3>
<x-forms.checkbox instantSave id="application.settings.is_git_submodules_enabled" label="Submodules" <x-forms.checkbox instantSave id="isGitSubmodulesEnabled" label="Submodules"
helper="Allow Git Submodules during build process." /> helper="Allow Git Submodules during build process." />
<x-forms.checkbox instantSave id="application.settings.is_git_lfs_enabled" label="LFS" <x-forms.checkbox instantSave id="isGitLfsEnabled" label="LFS"
helper="Allow Git LFS during build process." /> helper="Allow Git LFS during build process." />
@endif @endif
{{-- <x-forms.checkbox disabled instantSave id="is_dual_cert" label="Dual Certs?" /> {{-- <x-forms.checkbox disabled instantSave id="is_dual_cert" label="Dual Certs?" />
<x-forms.checkbox disabled instantSave id="is_custom_ssl" label="Is Custom SSL?" /> <x-forms.checkbox disabled instantSave id="is_custom_ssl" label="Is Custom SSL?" />
<x-forms.checkbox disabled instantSave id="is_http2" label="Is Http2?" /> --}} <x-forms.checkbox disabled instantSave id="is_http2" label="Is Http2?" /> --}}
</div> </div>
@if ($application->build_pack !== 'dockercompose')
<h3>GPU</h3>
@endif
<form wire:submit="submit">
@if ($application->build_pack !== 'dockercompose')
<x-forms.checkbox
helper="Enable GPU usage for this application. More info <a href='https://docs.docker.com/compose/gpu-support/' class='underline dark:text-white' target='_blank'>here</a>."
instantSave id="application.settings.is_gpu_enabled" label="Attach GPU" />
@if ($application->settings->is_gpu_enabled)
<h5>GPU Settings</h5>
</div>
<form wire:submit="submit" class="flex flex-col gap-2">
@if ($application->build_pack !== 'dockercompose')
<div class="flex gap-2 items-end pt-4">
<h3>GPU</h3>
@if ($isGpuEnabled)
<x-forms.button type="submit">Save</x-forms.button> <x-forms.button type="submit">Save</x-forms.button>
@endif @endif
@endif </div>
@if ($application->settings->is_gpu_enabled) @endif
<div class="flex flex-col w-full gap-2 p-2 xl:flex-row"> @if ($application->build_pack !== 'dockercompose')
<x-forms.input label="GPU Driver" id="application.settings.gpu_driver"> </x-forms.input> <div class="md:w-96 pb-4">
<x-forms.input label="GPU Count" placeholder="empty means use all GPUs" <x-forms.checkbox
id="application.settings.gpu_count"> </x-forms.input> helper="Enable GPU usage for this application. More info <a href='https://docs.docker.com/compose/gpu-support/' class='underline dark:text-white' target='_blank'>here</a>."
<x-forms.input label="GPU Device Ids" placeholder="0,2" instantSave id="isGpuEnabled" label="Enable GPU" />
helper="Comma separated list of device ids. More info <a href='https://docs.docker.com/compose/gpu-support/#access-specific-devices' class='underline dark:text-white' target='_blank'>here</a>." </div>
id="application.settings.gpu_device_ids"> </x-forms.input> @endif
@if ($isGpuEnabled)
<div class="flex flex-col w-full gap-2 ">
<div class="flex gap-2 items-end">
<x-forms.input label="GPU Driver" id="gpuDriver"> </x-forms.input>
<x-forms.input label="GPU Count" placeholder="empty means use all GPUs" id="gpuCount">
</x-forms.input>
</div>
</div> <x-forms.input label="GPU Device Ids" placeholder="0,2"
<div class="px-2"> helper="Comma separated list of device ids. More info <a href='https://docs.docker.com/compose/gpu-support/#access-specific-devices' class='underline dark:text-white' target='_blank'>here</a>."
<x-forms.textarea label="GPU Options" id="application.settings.gpu_options"> id="gpuDeviceIds"> </x-forms.input>
</x-forms.textarea> <x-forms.textarea rows="10" label="GPU Options" id="gpuOptions"> </x-forms.textarea>
</div> </div>
@endif @endif
</form> </form>
</div>
</div> </div>