feat: remove optional services step from setup wizard

Services are now installed post-setup from the Store page, so the
wizard step that let users pre-select email/calendar/files is removed.
Reduces wizard from 5 steps to 4 (Step4Services deleted, Step5Review
renamed to Step4Review). Backend drops services_enabled validation,
background install thread, and service_store_manager dependency.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-05-29 18:33:43 -04:00
parent 3d594025d2
commit 62b31b072b
5 changed files with 13 additions and 254 deletions
+10 -73
View File
@@ -5,7 +5,7 @@ import { setupAPI } from '../services/api';
// ── constants ─────────────────────────────────────────────────────────────────
const TOTAL_STEPS = 5;
const TOTAL_STEPS = 4;
const CELL_NAME_RE = /^[a-z][a-z0-9-]{1,30}$/;
const DOMAIN_RE = /^[a-z0-9]([a-z0-9-]*[a-z0-9])?(\.[a-z0-9]([a-z0-9-]*[a-z0-9])?)+$/i;
@@ -38,19 +38,6 @@ const DOMAIN_OPTIONS = [
},
];
const OPTIONAL_SERVICES = [
{ key: 'email', label: 'Email', description: 'Postfix + Dovecot IMAP/SMTP server.' },
{ key: 'calendar', label: 'Calendar & Contacts', description: 'CalDAV/CardDAV via Radicale.' },
{ key: 'files', label: 'Files (WebDAV)', description: 'WebDAV file storage accessible from any device.' },
{ key: 'webmail', label: 'Webmail UI', description: 'Browser-based email client (Roundcube).' },
];
const ALWAYS_ON_SERVICES = [
{ key: 'vpn', label: 'VPN (WireGuard)' },
{ key: 'dns', label: 'DNS (CoreDNS)' },
{ key: 'api', label: 'API (cell-api)' },
];
// ── helpers ───────────────────────────────────────────────────────────────────
function getAllTimezones() {
@@ -513,48 +500,7 @@ function Step3Timezone({ value, onChange, onNext, onBack }) {
);
}
// ── step 4: services ──────────────────────────────────────────────────────────
function Step4Services({ selected, onChange, onNext, onBack }) {
const toggle = key => onChange(selected.includes(key) ? selected.filter(k => k !== key) : [...selected, key]);
return (
<div>
<StepHeader step={4} title="Optional services" description="Choose which services to enable. You can change this later in Settings." />
<div className="space-y-2 mb-6">
{OPTIONAL_SERVICES.map(svc => {
const checked = selected.includes(svc.key);
return (
<label key={svc.key} className={`flex items-start gap-3 p-3 rounded-lg border cursor-pointer transition-colors ${
checked ? 'border-blue-500 bg-blue-950/40' : 'border-gray-700 hover:border-gray-500'
}`}>
<input type="checkbox" className="mt-0.5 accent-blue-500" checked={checked} onChange={() => toggle(svc.key)} />
<div>
<div className="text-sm font-medium text-white">{svc.label}</div>
<div className="text-xs text-gray-400 mt-0.5">{svc.description}</div>
</div>
</label>
);
})}
</div>
<div>
<p className="text-xs font-medium text-gray-500 uppercase tracking-wider mb-2">Always enabled</p>
<div className="space-y-1.5">
{ALWAYS_ON_SERVICES.map(svc => (
<div key={svc.key} className="flex items-center gap-3 p-3 rounded-lg border border-gray-800 bg-gray-900/40 opacity-60">
<input type="checkbox" checked readOnly disabled className="mt-0 accent-blue-500" />
<span className="text-sm text-gray-400">{svc.label}</span>
<span className="ml-auto text-xs text-gray-600">always enabled</span>
</div>
))}
</div>
</div>
<NavButtons onBack={onBack} onNext={onNext} />
</div>
);
}
// ── step 5: review ────────────────────────────────────────────────────────────
// ── step 4: review ────────────────────────────────────────────────────────────
function ReviewRow({ label, value }) {
return (
@@ -565,23 +511,19 @@ function ReviewRow({ label, value }) {
);
}
function Step5Review({ domainType, domainName, services, timezone, onBack, onSubmit, submitting, submitError }) {
function Step4Review({ domainType, domainName, timezone, onBack, onSubmit, submitting, submitError }) {
const domainDisplay = domainName || 'LAN only (no public domain)';
const providerLabel = DOMAIN_OPTIONS.find(o => o.value === domainType)?.label || domainType;
const serviceLabels = services.length
? services.map(k => OPTIONAL_SERVICES.find(s => s.key === k)?.label || k).join(', ')
: 'None selected';
return (
<div>
<StepHeader step={5} title="Review and finish"
<StepHeader step={4} title="Review and finish"
description="Check your choices. You can go back to change anything." />
<div className="bg-gray-800/50 border border-gray-700 rounded-lg px-4 py-1 mb-2">
<ReviewRow label="Admin password" value="••••••••••••" />
<ReviewRow label="Domain" value={domainDisplay} />
<ReviewRow label="Provider" value={providerLabel} />
<ReviewRow label="Timezone" value={timezone} />
<ReviewRow label="Optional services" value={serviceLabels} />
</div>
{submitError && (
<div className="mt-4 p-3 bg-red-950/50 border border-red-700 rounded-lg flex items-start gap-2">
@@ -614,7 +556,6 @@ export default function Setup() {
const [timezone, setTimezone] = useState(
(() => { try { return Intl.DateTimeFormat().resolvedOptions().timeZone || 'UTC'; } catch { return 'UTC'; } })()
);
const [services, setServices] = useState([]);
const [submitting, setSubmitting] = useState(false);
const [submitError, setSubmitError] = useState('');
@@ -648,13 +589,12 @@ export default function Setup() {
const ddnsProvider = domainType === 'lan' ? 'none' : domainType === 'http01' ? 'none' : domainType;
const payload = {
cell_name: cellName,
cell_name: cellName,
password,
domain_mode: domainType,
domain_name: domainName,
domain_mode: domainType,
domain_name: domainName,
timezone,
services_enabled: services,
ddns_provider: ddnsProvider,
ddns_provider: ddnsProvider,
...(domainType === 'cloudflare' && { cloudflare_api_token: cloudflareToken }),
...(domainType === 'duckdns' && { duckdns_token: duckdnsToken }),
};
@@ -720,12 +660,9 @@ export default function Setup() {
<Step3Timezone value={timezone} onChange={setTimezone} onNext={goNext} onBack={goBack} />
)}
{step === 4 && (
<Step4Services selected={services} onChange={setServices} onNext={goNext} onBack={goBack} />
)}
{step === 5 && (
<Step5Review
<Step4Review
domainType={domainType} domainName={domainName}
services={services} timezone={timezone}
timezone={timezone}
onBack={goBack} onSubmit={handleSubmit}
submitting={submitting} submitError={submitError}
/>