UI stuffs
This commit is contained in:
@@ -34,7 +34,7 @@
|
||||
</div>
|
||||
@endif
|
||||
<div x-cloak x-show="!showPrivateKey">
|
||||
<x-forms.input cannotPeakPassword type="password" rows="10" id="private_key.private_key" required
|
||||
<x-forms.input allowToPeak="false" type="password" rows="10" id="private_key.private_key" required
|
||||
disabled />
|
||||
</div>
|
||||
<div x-cloak x-show="showPrivateKey">
|
||||
|
||||
@@ -1,11 +1,16 @@
|
||||
<div x-data="{ deleteApplication: false }">
|
||||
<x-naked-modal show="deleteApplication" title="Delete Application"
|
||||
message='This application will be deleted. It is not reversible. <br>Please think again.' />
|
||||
<div>
|
||||
<x-modal yesOrNo modalId="{{ $modalId }}" modalTitle="Delete Application">
|
||||
<x-slot:modalBody>
|
||||
<p>This application will be deleted. It is not reversible. <br>Please think again.</p>
|
||||
</x-slot:modalBody>
|
||||
</x-modal>
|
||||
<h3>Danger Zone</h3>
|
||||
<div class="">Woah. I hope you know what are you doing.</div>
|
||||
<h4 class="pt-4">Delete Application</h4>
|
||||
<div class="pb-4">This will stop your containers, delete all related data, etc. Beware! There is no coming
|
||||
back!
|
||||
</div>
|
||||
<x-forms.button isWarning x-on:click.prevent="deleteApplication = true">Delete</x-forms.button>
|
||||
<x-forms.button isError isModal modalId="{{ $modalId }}">
|
||||
Delete
|
||||
</x-forms.button>
|
||||
</div>
|
||||
|
||||
@@ -1,8 +1,14 @@
|
||||
<form wire:submit.prevent='submit' class="flex flex-col gap-2 xl:items-end xl:flex-row"">
|
||||
<x-forms.input placeholder="NODE_ENV" noDirty id="key" label="Name" required />
|
||||
<x-forms.input placeholder="production" noDirty id="value" label="Value" required />
|
||||
<x-forms.checkbox class="w-96" noDirty id="is_build_time" label="Build Variable?" />
|
||||
<x-forms.button type="submit">
|
||||
Add New Variable
|
||||
</x-forms.button>
|
||||
</form>
|
||||
<dialog id="newVariable" class="modal">
|
||||
<form method="dialog" class="flex flex-col gap-2 rounded modal-box" wire:submit.prevent='submit'>
|
||||
<h3 class="text-lg font-bold">Add Environment Variable</h3>
|
||||
<x-forms.input placeholder="NODE_ENV" id="key" label="Name" required />
|
||||
<x-forms.input placeholder="production" id="value" label="Value" required />
|
||||
<x-forms.checkbox id="is_build_time" label="Build Variable?" />
|
||||
<x-forms.button onclick="newVariable.close()" type="submit">
|
||||
Save
|
||||
</x-forms.button>
|
||||
</form>
|
||||
<form method="dialog" class="modal-backdrop">
|
||||
<button>close</button>
|
||||
</form>
|
||||
</dialog>
|
||||
|
||||
@@ -1,24 +1,26 @@
|
||||
<div class="flex flex-col gap-2">
|
||||
<div>
|
||||
<h2>Environment Variables</h2>
|
||||
<div class="flex items-center gap-2">
|
||||
<h2>Environment Variables</h2>
|
||||
<x-forms.button class="btn" onclick="newVariable.showModal()">+ Add</x-forms.button>
|
||||
<livewire:project.application.environment-variable.add />
|
||||
</div>
|
||||
<div class="">Environment (secrets) variables for normal deployments.</div>
|
||||
</div>
|
||||
@foreach ($application->environment_variables as $env)
|
||||
@forelse ($application->environment_variables as $env)
|
||||
<livewire:project.application.environment-variable.show wire:key="environment-{{ $env->id }}"
|
||||
:env="$env" />
|
||||
@endforeach
|
||||
<div class="pt-2 pb-8">
|
||||
<livewire:project.application.environment-variable.add />
|
||||
</div>
|
||||
<div>
|
||||
<h3>Preview Deployments</h3>
|
||||
<div class="">Environment (secrets) variables for Preview Deployments.</div>
|
||||
</div>
|
||||
@foreach ($application->environment_variables_preview as $env)
|
||||
<livewire:project.application.environment-variable.show wire:key="environment-{{ $env->id }}"
|
||||
:env="$env" />
|
||||
@endforeach
|
||||
<div class="pt-2 pb-8">
|
||||
<livewire:project.application.environment-variable.add is_preview="true" />
|
||||
</div>
|
||||
@empty
|
||||
<div class="text-neutral-500">No environment variables found.</div>
|
||||
@endforelse
|
||||
@if ($application->environment_variables_preview->count() > 0)
|
||||
<div>
|
||||
<h3>Preview Deployments</h3>
|
||||
<div class="">Environment (secrets) variables for Preview Deployments.</div>
|
||||
</div>
|
||||
@foreach ($application->environment_variables_preview as $env)
|
||||
<livewire:project.application.environment-variable.show wire:key="environment-{{ $env->id }}"
|
||||
:env="$env" />
|
||||
@endforeach
|
||||
@endif
|
||||
</div>
|
||||
|
||||
@@ -1,15 +1,19 @@
|
||||
<div x-data="{ deleteEnvironment: false }">
|
||||
<x-naked-modal show="deleteEnvironment" title="Delete Environment"
|
||||
message='This environment will be deleted. It is not reversible. <br>Please think again.' />
|
||||
<form wire:submit.prevent='submit' class="flex flex-col gap-2 xl:items-end xl:flex-row">
|
||||
<x-forms.input id="env.key" label="Name" />
|
||||
<x-forms.input type="password" id="env.value" label="Value" />
|
||||
<x-forms.checkbox class="w-96" disabled id="env.is_build_time" label="Build Variable?" />
|
||||
<div>
|
||||
<x-modal yesOrNo modalId="{{ $modalId }}" modalTitle="Delete Environment Variable">
|
||||
<x-slot:modalBody>
|
||||
<p>Are you sure you want to delete this environment variable <span
|
||||
class="font-bold text-warning">({{ $env->key }})</span>?</p>
|
||||
</x-slot:modalBody>
|
||||
</x-modal>
|
||||
<form wire:submit.prevent='submit' class="flex flex-col items-center gap-2 xl:flex-row">
|
||||
<x-forms.input id="env.key" />
|
||||
<x-forms.input type="password" id="env.value" />
|
||||
<x-forms.checkbox disabled id="env.is_build_time" label="Build Variable?" />
|
||||
<div class="flex gap-2">
|
||||
<x-forms.button type="submit">
|
||||
Update
|
||||
</x-forms.button>
|
||||
<x-forms.button x-on:click.prevent="deleteEnvironment = true">
|
||||
<x-forms.button isError isModal modalId="{{ $modalId }}">
|
||||
Delete
|
||||
</x-forms.button>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<div>
|
||||
<div class="flex items-center gap-2">
|
||||
<h3>Pull Requests on Git</h3>
|
||||
<x-forms.button wire:click="load_prs">Load Pull Requests (Open)
|
||||
<x-forms.button wire:click="load_prs">Load Pull Requests
|
||||
</x-forms.button>
|
||||
</div>
|
||||
@isset($rate_limit_remaining)
|
||||
|
||||
@@ -17,25 +17,24 @@
|
||||
</x-forms.button>
|
||||
</a>
|
||||
@endif
|
||||
</div>
|
||||
<div class="">Code source of your application.</div>
|
||||
<x-forms.input placeholder="coollabsio/coolify-example" id="application.git_repository" label="Repository" />
|
||||
<x-forms.input placeholder="main" id="application.git_branch" label="Branch" />
|
||||
<div class="flex items-end gap-2 w-96">
|
||||
<x-forms.input placeholder="HEAD" id="application.git_commit_sha" placeholder="HEAD" label="Commit SHA" />
|
||||
<a target="_blank" class="flex hover:no-underline" href="{{ $application?->gitCommits }}">
|
||||
<x-forms.button><svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" viewBox="0 0 24 24"
|
||||
stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
|
||||
<path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" />
|
||||
<path d="M12 3l0 6" />
|
||||
<path d="M12 15l0 6" />
|
||||
</svg>Open Commits on Git
|
||||
<x-forms.button>Open Commits on Git
|
||||
<x-external-link />
|
||||
</x-forms.button>
|
||||
</a>
|
||||
</div>
|
||||
<div class="pb-4">Code source of your application.</div>
|
||||
|
||||
<div class="flex gap-2">
|
||||
<x-forms.input placeholder="coollabsio/coolify-example" id="application.git_repository"
|
||||
label="Repository" />
|
||||
<x-forms.input placeholder="main" id="application.git_branch" label="Branch" />
|
||||
</div>
|
||||
<div class="flex items-end gap-2">
|
||||
<x-forms.input placeholder="HEAD" id="application.git_commit_sha" placeholder="HEAD" label="Commit SHA" />
|
||||
|
||||
</div>
|
||||
|
||||
@if ($application->private_key_id)
|
||||
<h4 class="py-2 pt-4">Current Deploy Key: <span
|
||||
class="text-warning">{{ $application->private_key->name }}</span></h4>
|
||||
|
||||
@@ -1,8 +1,14 @@
|
||||
<form wire:submit.prevent='submit' class="flex flex-col gap-2 xl:items-end xl:flex-row">
|
||||
<x-forms.input placeholder="pv-name" noDirty id="name" label="Name" required />
|
||||
<x-forms.input placeholder="/root" noDirty id="host_path" label="Source Path" />
|
||||
<x-forms.input placeholder="/tmp/root" noDirty id="mount_path" label="Destination Path" required />
|
||||
<x-forms.button type="submit">
|
||||
Add New Volume
|
||||
</x-forms.button>
|
||||
</form>
|
||||
<dialog id="newStorage" class="modal">
|
||||
<form method="dialog" class="flex flex-col gap-2 rounded modal-box" wire:submit.prevent='submit'>
|
||||
<h3 class="text-lg font-bold">Add Environment Variable</h3>
|
||||
<x-forms.input placeholder="pv-name" id="name" label="Name" required />
|
||||
<x-forms.input placeholder="/root" id="host_path" label="Source Path" />
|
||||
<x-forms.input placeholder="/tmp/root" id="mount_path" label="Destination Path" required />
|
||||
<x-forms.button onclick="newStorage.close()" type="submit">
|
||||
Save
|
||||
</x-forms.button>
|
||||
</form>
|
||||
<form method="dialog" class="modal-backdrop">
|
||||
<button>close</button>
|
||||
</form>
|
||||
</dialog>
|
||||
|
||||
@@ -6,13 +6,16 @@
|
||||
helper="For Preview Deployments, storage has a <span class='text-helper'>-pr-#PRNumber</span> in their
|
||||
volume
|
||||
name, example: <span class='text-helper'>-pr-1</span>" />
|
||||
<x-forms.button class="btn" onclick="newStorage.showModal()">+ Add</x-forms.button>
|
||||
<livewire:project.application.storages.add />
|
||||
</div>
|
||||
<div class="">Persistent storage to preserve data between deployments.</div>
|
||||
</div>
|
||||
<div class="flex flex-col gap-2 py-4">
|
||||
@foreach ($application->persistentStorages as $storage)
|
||||
@forelse ($application->persistentStorages as $storage)
|
||||
<livewire:project.application.storages.show wire:key="storage-{{ $storage->id }}" :storage="$storage" />
|
||||
@endforeach
|
||||
@empty
|
||||
<div class="text-neutral-500">No storages found.</div>
|
||||
@endforelse
|
||||
</div>
|
||||
<livewire:project.application.storages.add />
|
||||
</div>
|
||||
|
||||
@@ -1,6 +1,10 @@
|
||||
<div x-data="{ deleteStorage: false }">
|
||||
<x-naked-modal show="deleteStorage" title="Delete Storage"
|
||||
message='This storage will be deleted. It is not reversible. <br>Please think again.' />
|
||||
<div>
|
||||
<x-modal yesOrNo modalId="{{ $modalId }}" modalTitle="Delete Storage">
|
||||
<x-slot:modalBody>
|
||||
<p>This storage will be deleted <span class="font-bold text-warning">({{ $storage->name }})</span>. It is not
|
||||
reversible. <br>Please think again.</p>
|
||||
</x-slot:modalBody>
|
||||
</x-modal>
|
||||
<form wire:submit.prevent='submit' class="flex flex-col gap-2 xl:items-end xl:flex-row">
|
||||
<x-forms.input id="storage.name" label="Name" required />
|
||||
<x-forms.input id="storage.host_path" label="Source Path" />
|
||||
@@ -9,7 +13,7 @@
|
||||
<x-forms.button type="submit">
|
||||
Update
|
||||
</x-forms.button>
|
||||
<x-forms.button x-on:click.prevent="deleteStorage = true">
|
||||
<x-forms.button isError isModal modalId="{{ $modalId }}">
|
||||
Delete
|
||||
</x-forms.button>
|
||||
</div>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<div>
|
||||
<form class="flex flex-col justify-center gap-2 xl:items-end xl:flex-row" wire:submit.prevent='runCommand'>
|
||||
<x-forms.input placeholder="ls -l" autofocus noDirty id="command" label="Command" required />
|
||||
<x-forms.input placeholder="ls -l" autofocus id="command" label="Command" required />
|
||||
<x-forms.select label="Server" id="server" required>
|
||||
@foreach ($servers as $server)
|
||||
@if ($loop->first)
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
<div x-data="{ deleteServer: false, changeLocalhost: false }">
|
||||
<x-naked-modal show="deleteServer" title="Delete Server"
|
||||
message='This server will be deleted. It is not reversible. <br>Please think again.' />
|
||||
<div x-data="{ changeLocalhost: false }">
|
||||
<x-modal yesOrNo modalId="{{ $modalId }}" modalTitle="Delete Server">
|
||||
<x-slot:modalBody>
|
||||
<p>This server will be deleted. It is not reversible. <br>Please think again..</p>
|
||||
</x-slot:modalBody>
|
||||
</x-modal>
|
||||
<x-naked-modal show="changeLocalhost" action="submit" title="Change localhost"
|
||||
message='You could lost a lot of functionalities if you change the server details of the server where Coolify is running on.<br>Please think again.' />
|
||||
<form wire:submit.prevent='submit' class="flex flex-col">
|
||||
@@ -35,7 +38,8 @@
|
||||
</div>
|
||||
<h3 class="py-4">Settings</h3>
|
||||
<div class="flex items-center w-64 gap-2">
|
||||
<x-forms.input id="cleanup_after_percentage" label="Disk Cleanup threshold (%)" required helper="Disk cleanup job will be executed if disk usage is more than this number."/>
|
||||
<x-forms.input id="cleanup_after_percentage" label="Disk Cleanup threshold (%)" required
|
||||
helper="Disk cleanup job will be executed if disk usage is more than this number." />
|
||||
</div>
|
||||
<h3 class="py-4">Actions</h3>
|
||||
@if ($server->settings->is_reachable)
|
||||
@@ -80,7 +84,7 @@
|
||||
back!
|
||||
</div>
|
||||
@if ($server->id !== 0 || isDev())
|
||||
<x-forms.button x-on:click.prevent="deleteServer = true">
|
||||
<x-forms.button isError isModal modalId="{{ $modalId }}">
|
||||
Delete
|
||||
</x-forms.button>
|
||||
@endif
|
||||
|
||||
@@ -34,8 +34,8 @@
|
||||
<div wire:loading.remove wire:target="checkProxySettingsInSync">
|
||||
@if ($proxy_settings)
|
||||
<div class="flex flex-col gap-2 pt-2">
|
||||
<x-forms.textarea label="Configuration file: traefik.conf" class="text-xs" noDirty
|
||||
name="proxy_settings" wire:model.defer="proxy_settings" rows="30" />
|
||||
<x-forms.textarea label="Configuration file: traefik.conf" name="proxy_settings"
|
||||
wire:model.defer="proxy_settings" rows="30" />
|
||||
<x-forms.button wire:click.prevent="resetProxy">
|
||||
Reset configuration to default
|
||||
</x-forms.button>
|
||||
|
||||
@@ -12,14 +12,14 @@
|
||||
<li>
|
||||
@if ($server->name === 'localhost')
|
||||
<a target="_blank"
|
||||
class="text-xs text-white rounded-none hover:no-underline hover:bg-coollabs"
|
||||
class="text-xs text-white rounded-none hover:no-underline hover:bg-coollabs hover:text-white"
|
||||
href="{{ base_ip() }}:8080">
|
||||
Traefik Dashboard
|
||||
<x-external-link />
|
||||
</a>
|
||||
@else
|
||||
<a target="_blank"
|
||||
class="text-xs text-white rounded-none hover:no-underline hover:bg-coollabs"
|
||||
class="text-xs text-white rounded-none hover:no-underline hover:bg-coollabs hover:text-white"
|
||||
href="http://{{ $server->ip }}:8080">
|
||||
Traefik Dashboard
|
||||
<x-external-link />
|
||||
@@ -37,7 +37,7 @@
|
||||
<ul tabindex="0"
|
||||
class="relative text-xs text-white normal-case rounded min-w-max menu bg-coolgray-200 -ml-14">
|
||||
<li>
|
||||
<div class="rounded-none hover:bg-coollabs" wire:click='deploy'><svg
|
||||
<div class="rounded-none hover:bg-coollabs hover:text-white" wire:click='deploy'><svg
|
||||
xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" viewBox="0 0 24 24"
|
||||
stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
@@ -49,7 +49,7 @@
|
||||
</svg>Restart</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="rounded-none hover:bg-red-500" wire:click='stop'><svg
|
||||
<div class="rounded-none hover:bg-red-500 hover:text-white" wire:click='stop'><svg
|
||||
xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" viewBox="0 0 24 24"
|
||||
stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
@@ -66,9 +66,10 @@
|
||||
</div>
|
||||
</div>
|
||||
@else
|
||||
<button wire:click='deploy' class="flex items-center gap-2 cursor-pointer hover:text-white"> <svg
|
||||
xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" viewBox="0 0 24 24" stroke-width="1.5"
|
||||
stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
|
||||
<button wire:click='deploy' class="flex items-center gap-2 cursor-pointer hover:text-white">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 text-warning" viewBox="0 0 24 24"
|
||||
stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round"
|
||||
stroke-linejoin="round">
|
||||
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
|
||||
<path d="M7 4v16l13 -8z" />
|
||||
</svg>Start Proxy
|
||||
|
||||
@@ -33,7 +33,7 @@
|
||||
<div class="pt-2 pb-10 ">Your Private GitHub App for private repositories.</div>
|
||||
@if ($github_app->app_id)
|
||||
<div class="w-48">
|
||||
<x-forms.checkbox noDirty label="System Wide?"
|
||||
<x-forms.checkbox label="System Wide?"
|
||||
helper="If checked, this GitHub App will be available for everyone in this Coolify instance."
|
||||
instantSave id="is_system_wide" />
|
||||
</div>
|
||||
@@ -119,7 +119,7 @@
|
||||
@endif
|
||||
</div>
|
||||
<x-forms.checkbox
|
||||
helper="If checked, this GitHub App will be available for everyone in this Coolify instance." noDirty
|
||||
helper="If checked, this GitHub App will be available for everyone in this Coolify instance."
|
||||
label="System Wide?" disabled id="is_system_wide" />
|
||||
<script>
|
||||
function createGithubApp(webhook_endpoint, preview_deployment_permissions) {
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
@else
|
||||
@if (session('currentTeam')->isEmpty())
|
||||
<div class="pb-4">This will delete your team. Beware! There is no coming back!</div>
|
||||
<x-forms.button isWarning x-on:click.prevent="deleteTeam = true">
|
||||
<x-forms.button isError x-on:click.prevent="deleteTeam = true">
|
||||
Delete
|
||||
</x-forms.button>
|
||||
@else
|
||||
|
||||
Reference in New Issue
Block a user