95 lines
6.1 KiB
Svelte
95 lines
6.1 KiB
Svelte
<script lang="ts">
|
|
import { timeFormat, timeZone, timeZonePersistenceError } from '$ui/stores/time-zone.js';
|
|
import { availableTimeZones, DEFAULT_TIME_ZONE } from '$lib/time-zone.js';
|
|
import { onMount } from 'svelte';
|
|
import SectionHeader from '$ui/components/primitives/SectionHeader.svelte';
|
|
import Button from '$ui/components/primitives/Button.svelte';
|
|
import type { FleetSettings } from '$lib/fleet-settings.js';
|
|
let exampleDate = $state<Date | null>(null);
|
|
let settings = $state<FleetSettings | null>(null);
|
|
let loading = $state(true);
|
|
let saving = $state(false);
|
|
let error = $state('');
|
|
let notice = $state('');
|
|
const zones = $derived([...new Set([...availableTimeZones(), $timeZone])].sort());
|
|
onMount(() => { exampleDate = new Date(); void loadSettings(); });
|
|
|
|
async function loadSettings() {
|
|
loading = true; error = '';
|
|
try {
|
|
const response = await fetch('/api/settings');
|
|
if (!response.ok) throw new Error('Could not load fleet settings.');
|
|
settings = await response.json();
|
|
} catch (cause) { error = (cause as Error).message; }
|
|
finally { loading = false; }
|
|
}
|
|
|
|
async function saveSettings(event: SubmitEvent) {
|
|
event.preventDefault();
|
|
saving = true; error = ''; notice = '';
|
|
try {
|
|
const response = await fetch('/api/settings', { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(settings) });
|
|
const result = await response.json();
|
|
if (!response.ok) throw new Error(result.error ?? 'Could not save fleet settings.');
|
|
settings = result;
|
|
notice = 'Fleet settings saved. Changes apply to the next queue or cleanup check.';
|
|
} catch (cause) { error = (cause as Error).message; }
|
|
finally { saving = false; }
|
|
}
|
|
</script>
|
|
|
|
<svelte:head><title>Settings · Electric Cherry</title></svelte:head>
|
|
<section class="page">
|
|
<SectionHeader title="Settings" subtitle="Manage fleet limits, history retention, and display preferences." />
|
|
<section class="guide" aria-labelledby="fleet-heading">
|
|
<h2 id="fleet-heading">Fleet settings</h2>
|
|
<p>Saved for everyone using this Electric Cherry instance. Changes apply without restarting the app.</p>
|
|
{#if error}<p class="ui-error" role="alert">{error}</p>{/if}
|
|
{#if notice}<p role="status">{notice}</p>{/if}
|
|
{#if loading}
|
|
<p role="status">Loading fleet settings…</p>
|
|
{:else if settings}
|
|
<form onsubmit={saveSettings}>
|
|
<fieldset disabled={saving}>
|
|
<label for="retention">Campaign history retention (days)</label>
|
|
<input id="retention" type="number" min="1" max="36500" step="1" required bind:value={settings.deployKeepDays} aria-describedby="retention-help" />
|
|
<p id="retention-help">Default: 7 days. Removes eligible old campaign records and file diffs on the next cleanup check. Pending, failed, held, and health-recovery-linked campaigns are kept. Provisioning history is retained.</p>
|
|
<label for="restarts">Concurrent restarts</label>
|
|
<input id="restarts" type="number" min="1" step="1" required bind:value={settings.restartConcurrency} aria-describedby="restarts-help" />
|
|
<p id="restarts-help">Default: 1 across the fleet. Campaigns, betas, maintenance, and lifecycle actions share recovery slots until container and game health are verified.</p>
|
|
<label for="startups">Concurrent server startups</label>
|
|
<input id="startups" type="number" min="1" step="1" required bind:value={settings.createConcurrency} aria-describedby="startups-help" />
|
|
<p id="startups-help">Default: 1 across collections and individual launches. Each startup holds its slot through container, game health, and selected-map verification.</p>
|
|
<p>Lowering a limit lets active operations finish; queued work waits for capacity. Player safety checks still apply.</p>
|
|
<Button type="submit" disabled={saving}>{saving ? 'Saving…' : 'Save fleet settings'}</Button>
|
|
</fieldset>
|
|
</form>
|
|
{:else}
|
|
<Button onclick={loadSettings}>Retry loading</Button>
|
|
{/if}
|
|
</section>
|
|
<section class="guide" aria-labelledby="display-heading">
|
|
<h2 id="display-heading">Display preferences</h2>
|
|
<label class="timezone">Timezone
|
|
<select bind:value={$timeZone} aria-describedby="timezone-help">
|
|
{#each zones as zone}<option value={zone}>{zone.replaceAll('_', ' ')}{zone === DEFAULT_TIME_ZONE ? ' (default)' : ''}</option>{/each}
|
|
</select>
|
|
</label>
|
|
<p id="timezone-help">Dates and times throughout the app use this timezone, including daylight saving changes. Saved automatically in this browser.</p>
|
|
{#if exampleDate}<p>Example: {$timeFormat.dateTime(exampleDate)}</p>{/if}
|
|
{#if $timeZonePersistenceError}<p role="status">Browser storage is unavailable. Your timezone applies for this visit but cannot be saved.</p>{/if}
|
|
</section>
|
|
</section>
|
|
|
|
<style>
|
|
.page { display: grid; gap: 20px; }
|
|
.guide { padding: 20px; border: 1px solid var(--border-strong); border-radius: var(--radius-md); background: var(--surface); }
|
|
h2 { font-size: var(--text-md); margin: 0; }
|
|
p { font-size: var(--text-sm); color: var(--text-secondary); line-height: 1.65; }
|
|
.timezone { display: grid; gap: 8px; margin-top: 16px; font-size: var(--text-sm); max-width: 420px; }
|
|
.timezone select { width: 100%; padding: 10px 12px; font: inherit; color: var(--text-primary); background: var(--surface-sunken); border: 1px solid var(--border-control); border-radius: var(--radius-sm); }
|
|
fieldset { border: 0; padding: 0; margin: 20px 0 0; min-width: 0; }
|
|
fieldset label { display: block; margin: 20px 0 8px; font-size: var(--text-sm); }
|
|
fieldset input { width: 160px; padding: 10px 12px; font: inherit; color: var(--text-primary); background: var(--surface-sunken); border: 1px solid var(--border-control); border-radius: var(--radius-sm); }
|
|
</style>
|