4052d1bd05
- Updated color classes in NotifyDemo.php to use warning colors. - Added new warning color variables in app.css. - Changed warning icon colors in callout.blade.php. - Updated loading spinner and hover states in global-search.blade.php. - Refactored warning messages and styles in project application views. - Adjusted log display colors in get-logs.blade.php. - Updated private key status indicators in index.blade.php. - Changed hover and text colors for documentation links in cloudflare-tunnel.blade.php. - Refactored server creation messages in by-hetzner.blade.php. - Updated proxy warning button colors in proxy.blade.php. - Changed loading spinner colors in show.blade.php. - Updated deployment status colors in deployments.blade.php and show.blade.php.
133 lines
8.7 KiB
PHP
133 lines
8.7 KiB
PHP
<div>
|
|
<x-slot:title>
|
|
{{ data_get_str($server, 'name')->limit(10) }} > Cloudflare Tunnel | Coolify
|
|
</x-slot>
|
|
<livewire:server.navbar :server="$server" />
|
|
<div class="flex flex-col h-full gap-8 sm:flex-row">
|
|
<x-server.sidebar :server="$server" activeMenu="cloudflare-tunnel" />
|
|
<div class="w-full">
|
|
<div class="flex flex-col">
|
|
<div class="flex gap-2 items-center">
|
|
<h2>Cloudflare Tunnel</h2>
|
|
<x-helper class="inline-flex"
|
|
helper="If you are using Cloudflare Tunnel, enable this. It will proxy all SSH requests to your server through Cloudflare.<br> You then can close your server's SSH port in the firewall of your hosting provider.<br><span class='dark:text-warning'>If you choose manual configuration, Coolify does not install or set up Cloudflare (cloudflared) on your server.</span>" />
|
|
@if ($isCloudflareTunnelsEnabled)
|
|
<span
|
|
class="px-2 py-1 text-xs font-semibold text-green-800 bg-green-100 rounded dark:text-green-100 dark:bg-green-800">
|
|
Enabled
|
|
</span>
|
|
@endif
|
|
</div>
|
|
<div>Secure your servers with Cloudflare Tunnel.</div>
|
|
</div>
|
|
<div class="flex flex-col gap-2 pt-6">
|
|
@if ($isCloudflareTunnelsEnabled)
|
|
<div class="flex flex-col gap-4">
|
|
<x-callout type="warning" title="Warning!">
|
|
If you disable Cloudflare Tunnel, you will need to update the server's IP address back
|
|
to its real IP address in the server "General" settings. The server may become inaccessible
|
|
if the IP address is not updated correctly.
|
|
</x-callout>
|
|
<div class="w-64">
|
|
@if ($server->ip_previous)
|
|
<x-modal-confirmation title="Disable Cloudflare Tunnel?"
|
|
buttonTitle="Disable Cloudflare Tunnel" isErrorButton
|
|
submitAction="toggleCloudflareTunnels" :actions="[
|
|
'Cloudflare Tunnel will be disabled for this server.',
|
|
'The server IP address will be updated to its previous IP address.',
|
|
]"
|
|
confirmationText="DISABLE CLOUDFLARE TUNNEL"
|
|
confirmationLabel="Please type the confirmation text to disable Cloudflare Tunnel."
|
|
shortConfirmationLabel="Confirmation text" />
|
|
@else
|
|
<x-modal-confirmation title="Disable Cloudflare Tunnel?"
|
|
buttonTitle="Disable Cloudflare Tunnel" isErrorButton
|
|
submitAction="toggleCloudflareTunnels" :actions="[
|
|
'Cloudflare Tunnel will be disabled for this server.',
|
|
'You will need to update the server IP address to its real IP address.',
|
|
'The server may become inaccessible if the IP address is not updated correctly.',
|
|
'SSH access will revert to the standard port configuration.',
|
|
]"
|
|
confirmationText="DISABLE CLOUDFLARE TUNNEL"
|
|
confirmationLabel="Please type the confirmation text to disable Cloudflare Tunnel."
|
|
shortConfirmationLabel="Confirmation text" />
|
|
@endif
|
|
|
|
</div>
|
|
</div>
|
|
@elseif (!$server->isFunctional())
|
|
<x-callout type="info" title="Configuration Options" class="mb-4">
|
|
To <span class="font-semibold">automatically</span> configure Cloudflare Tunnel, please
|
|
validate your server first. Then you will need a Cloudflare token and an SSH
|
|
domain configured.
|
|
<br />
|
|
To <span class="font-semibold">manually</span> configure Cloudflare Tunnel, please
|
|
click <span wire:click="manualCloudflareConfig" class="underline cursor-pointer">here</span>,
|
|
then you should validate the server.
|
|
<br /><br />
|
|
For more information, please read our <a
|
|
href="https://coolify.io/docs/knowledge-base/cloudflare/tunnels/server-ssh" target="_blank"
|
|
class="underline">documentation</a>.
|
|
</x-callout>
|
|
@endif
|
|
@if (!$isCloudflareTunnelsEnabled && $server->isFunctional())
|
|
<div class="flex flex-col pb-2">
|
|
<h3>Automated </h3>
|
|
<a href="https://coolify.io/docs/knowledge-base/cloudflare/tunnels/server-ssh" target="_blank"
|
|
class="text-xs underline hover:text-warning-600 dark:hover:text-warning-200">Docs<x-external-link /></a>
|
|
</div>
|
|
<div class="flex gap-2">
|
|
<x-slide-over @automated.window="slideOverOpen = true" fullScreen>
|
|
<x-slot:title>Cloudflare Tunnel Configuration</x-slot:title>
|
|
<x-slot:content>
|
|
<livewire:activity-monitor header="Logs" fullHeight />
|
|
</x-slot:content>
|
|
</x-slide-over>
|
|
@can('update', $server)
|
|
<form @submit.prevent="$wire.dispatch('automatedCloudflareConfig')"
|
|
class="flex flex-col gap-2 w-full">
|
|
<x-forms.input id="cloudflare_token" required label="Cloudflare Token" type="password" />
|
|
<x-forms.input id="ssh_domain" label="Configured SSH Domain" required
|
|
helper="The SSH domain you configured in Cloudflare. Make sure there is no protocol like http(s):// so you provide a FQDN not a URL. <a class='underline dark:text-white' href='https://coolify.io/docs/knowledge-base/cloudflare/tunnels/server-ssh' target='_blank'>Documentation</a>" />
|
|
<x-forms.button type="submit" isHighlighted>Continue</x-forms.button>
|
|
</form>
|
|
@else
|
|
<x-callout type="warning" title="Permission Required" class="mb-4">
|
|
You don't have permission to configure Cloudflare Tunnel for this server.
|
|
</x-callout>
|
|
@endcan
|
|
</div>
|
|
@script
|
|
<script>
|
|
$wire.$on('automatedCloudflareConfig', () => {
|
|
try {
|
|
window.dispatchEvent(new CustomEvent('automated'));
|
|
$wire.$call('automatedCloudflareConfig');
|
|
} catch (error) {
|
|
console.error(error);
|
|
}
|
|
});
|
|
</script>
|
|
@endscript
|
|
</div>
|
|
<h3 class="pt-6 pb-2">Manual</h3>
|
|
<div class="pl-2">
|
|
@can('update', $server)
|
|
<x-modal-confirmation buttonFullWidth title="I manually configured Cloudflare Tunnel?"
|
|
buttonTitle="I manually configured Cloudflare Tunnel" submitAction="manualCloudflareConfig"
|
|
:actions="[
|
|
'You set everything up manually, including in Cloudflare and on the server (cloudflared is running).',
|
|
'If you missed something, the connection will not work.',
|
|
]" confirmationText="I manually configured Cloudflare Tunnel"
|
|
confirmationLabel="Please type the confirmation text to confirm that you manually configured Cloudflare Tunnel."
|
|
shortConfirmationLabel="Confirmation text" />
|
|
@else
|
|
<x-callout type="warning" title="Permission Required" class="mb-4">
|
|
You don't have permission to configure Cloudflare Tunnel for this server.
|
|
</x-callout>
|
|
@endcan
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|