feat(ui): Add CA cert UI
- brief instructions and recommendations - copy button to copy the CA file mount - ability to display the CA certificate - ability to save your own CA Cert or generate a new one
This commit is contained in:
@@ -38,6 +38,82 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-4 pt-8">
|
||||
<h3>CA SSL Certificate</h3>
|
||||
<div class="flex gap-2">
|
||||
<x-modal-confirmation
|
||||
title="Confirm changing of CA Certificate?"
|
||||
buttonTitle="Save Certificate"
|
||||
submitAction="saveCaCertificate"
|
||||
:actions="[
|
||||
'This will overwrite the existing CA certificate at /data/coolify/ca/coolify-ca.crt with your custom CA certificate.',
|
||||
'This will regenerate all SSL certificates for databases on this server and it will sign them with your custom CA.',
|
||||
'You must manually redeploy all your databases to use the new SSL certificate.',
|
||||
'You proabley also need to redeploy all your resources using the CA certificate.'
|
||||
]"
|
||||
confirmationText="/data/coolify/ca/coolify-ca.crt"
|
||||
shortConfirmationLabel="CA Certificate Path"
|
||||
step3ButtonText="Save Certificate">
|
||||
</x-modal-confirmation>
|
||||
<x-modal-confirmation
|
||||
title="Confirm Regenerate Certificate?"
|
||||
buttonTitle="Regenerate Certificate"
|
||||
submitAction="regenerateCaCertificate"
|
||||
:actions="[
|
||||
'This will generate a new CA certificate at /data/coolify/ca/coolify-ca.crt and replace the existing one.',
|
||||
'This will regenerate all SSL certificates for databases on this server and it will sign them with your custom CA.',
|
||||
'You must manually redeploy all your databases to use the new SSL certificate.',
|
||||
'You proabley also need to redeploy all your resources using the CA certificate.'
|
||||
]"
|
||||
confirmationText="/data/coolify/ca/coolify-ca.crt"
|
||||
shortConfirmationLabel="CA Certificate Path"
|
||||
step3ButtonText="Regenerate Certificate">
|
||||
</x-modal-confirmation>
|
||||
</div>
|
||||
<div class="space-y-4">
|
||||
<div class="text-sm">
|
||||
<p class="font-medium mb-2">Recommended Configuration:</p>
|
||||
<ul class="list-disc pl-5 space-y-1">
|
||||
<li>Mount this Coolify CA certificate into all containers that need to connect to a database over SSL.</li>
|
||||
<li>Use verify-full (recommended) or verify-ca when connecting to a database over SSL.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="relative">
|
||||
<x-forms.copy-button
|
||||
text="- /data/coolify/ca/coolify-ca.crt:/etc/ssl/certs/coolify-ca.crt:ro"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="flex items-center justify-between mb-2">
|
||||
<span class="text-sm">CA Certificate Content</span>
|
||||
<x-forms.button
|
||||
wire:click="toggleCertificate"
|
||||
type="button"
|
||||
class="!py-1 !px-2 text-sm">
|
||||
{{ $showCertificate ? 'Hide' : 'Show' }}
|
||||
</x-forms.button>
|
||||
</div>
|
||||
@if($showCertificate)
|
||||
<textarea
|
||||
class="w-full h-[370px] input"
|
||||
wire:model="certificateContent"
|
||||
placeholder="Paste or edit CA certificate content here..."></textarea>
|
||||
@else
|
||||
<div class="w-full h-[370px] input">
|
||||
<div class="h-full flex flex-col items-center justify-center text-gray-300">
|
||||
<div class="mb-2">
|
||||
━━━━━━━━ CERTIFICATE CONTENT ━━━━━━━━
|
||||
</div>
|
||||
<div class="text-sm">
|
||||
Click "Show" to view or edit
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user