Caddy Dashboard

Manage your Caddy server configurations, upstreams, and CA information easily.

handleTabChange('config')} title="Configuration" /> handleTabChange('upstreams')} title="Upstreams" /> handleTabChange('ca_management')} title="CA Management" /> {#if activeTab === 'config'}

Current Configuration

{#if loadingConfig}

{:else}

            {JSON.stringify(config, null, 2)}

{/if}

{/if} {#if activeTab === 'upstreams'}

Upstreams

{#if loadingUpstreams}

{:else} Address Requests Fails {#each upstreams as upstream} {upstream.address} {upstream.num_requests} {upstream.fails} {/each}

{/if}

{/if} {#if activeTab === 'ca_management'}

CA Management

{/if}

Update Configuration

<div class="flex justify-end gap-4">
		<Button on:click={() => (showConfigModal = false)}>Cancel</Button>
		<Button color="green" on:click={handleUpdateConfig}>Update</Button>
		<Button color="blue" on:click={handleLoadConfig}>Load Full Config</Button>
	</div>
</Modal>

<Modal bind:open={showCAModal} size="xl" autoclose={false}>
	<h2 class="text-caddy-blue mb-4 text-2xl font-semibold">CA Information</h2>
	{#if caInfo}
		<div class="space-y-4">
			<p><strong>ID:</strong> {caInfo.id}</p>
			<p><strong>Name:</strong> {caInfo.name}</p>
			<p><strong>Root CN:</strong> {caInfo.root_common_name}</p>
			<p><strong>Intermediate CN:</strong> {caInfo.intermediate_common_name}</p>
		</div>
		<h3 class="text-caddy-blue mt-4 text-lg font-semibold">Certificates</h3>
		<Textarea readonly rows={10} value={caCertificates} />
	{:else}
		<p>No CA information available.</p>
	{/if}
	<div class="mt-4 flex justify-end">
		<Button on:click={() => (showCAModal = false)}>Close</Button>
	</div>
</Modal>

<style>
	:global(body) {
		background-color: #f3f4f6;
	}
	:global(.text-caddy-green) {
		color: #00add8;
	}
	:global(.text-caddy-blue) {
		color: #0097b7;
	}
</style>