82 lines
3.4 KiB
TypeScript
82 lines
3.4 KiB
TypeScript
|
import { useParams } from '@solidjs/router';
|
||
|
|
import { createSignal, onMount } from 'solid-js';
|
||
|
|
import AdminShell from '~/components/AdminShell';
|
||
|
|
import { getRuntimeConfig, saveRuntimeConfig } from '~/lib/runtime/storage';
|
||
|
|
import type { RuntimeOnboardingConfig } from '~/lib/runtime/types';
|
||
|
|
|
||
|
|
export default function EditOnboardingPage() {
|
||
|
|
const params = useParams();
|
||
|
|
const [config, setConfig] = createSignal<RuntimeOnboardingConfig | null>(null);
|
||
|
|
const [statusMessage, setStatusMessage] = createSignal('');
|
||
|
|
|
||
|
|
onMount(() => {
|
||
|
|
const existing = getRuntimeConfig<RuntimeOnboardingConfig>('onboarding', params.schemaId);
|
||
|
|
setConfig(existing?.payload || null);
|
||
|
|
});
|
||
|
|
|
||
|
|
const persist = (status: 'draft' | 'published') => {
|
||
|
|
const payload = config();
|
||
|
|
if (!payload) return;
|
||
|
|
saveRuntimeConfig('onboarding', payload.schemaId, payload, status);
|
||
|
|
setStatusMessage(status === 'draft' ? 'Draft saved in runtime storage.' : 'Onboarding schema published in runtime storage.');
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<AdminShell>
|
||
|
|
<h1 class="page-title">Edit Onboarding Flow</h1>
|
||
|
|
<p class="page-subtitle">Update this runtime onboarding schema without changing source code.</p>
|
||
|
|
{!config() ? (
|
||
|
|
<section class="card"><p class="notice">Onboarding schema not found in local runtime storage.</p></section>
|
||
|
|
) : (
|
||
|
|
<div class="grid">
|
||
|
|
<section class="card">
|
||
|
|
<h2>Onboarding Builder</h2>
|
||
|
|
<div class="field">
|
||
|
|
<label>Schema ID</label>
|
||
|
|
<input value={config()!.schemaId} onInput={(e) => setConfig({ ...config()!, schemaId: e.currentTarget.value })} />
|
||
|
|
</div>
|
||
|
|
<div class="field">
|
||
|
|
<label>Role Key</label>
|
||
|
|
<input value={config()!.roleKey} onInput={(e) => setConfig({ ...config()!, roleKey: e.currentTarget.value.toUpperCase() })} />
|
||
|
|
</div>
|
||
|
|
<div class="field">
|
||
|
|
<label>Version</label>
|
||
|
|
<input type="number" value={config()!.version} onInput={(e) => setConfig({ ...config()!, version: Number(e.currentTarget.value || 1) })} />
|
||
|
|
</div>
|
||
|
|
<div class="field">
|
||
|
|
<label>Steps (one title per line, quick mode)</label>
|
||
|
|
<textarea
|
||
|
|
rows={8}
|
||
|
|
value={config()!.steps.map((s) => s.title).join('\n')}
|
||
|
|
onInput={(e) =>
|
||
|
|
setConfig({
|
||
|
|
...config()!,
|
||
|
|
steps: e.currentTarget.value
|
||
|
|
.split('\n')
|
||
|
|
.map((line) => line.trim())
|
||
|
|
.filter(Boolean)
|
||
|
|
.map((title, index) => ({
|
||
|
|
id: `step_${index + 1}`,
|
||
|
|
title,
|
||
|
|
fields: [{ id: `field_${index + 1}`, label: 'Sample Field', type: 'text', required: true }],
|
||
|
|
})),
|
||
|
|
})
|
||
|
|
}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
<div class="actions">
|
||
|
|
<button class="btn" onClick={() => persist('draft')}>Save Draft</button>
|
||
|
|
<button class="btn primary" onClick={() => persist('published')}>Publish</button>
|
||
|
|
</div>
|
||
|
|
{statusMessage() && <p class="inline-note">{statusMessage()}</p>}
|
||
|
|
</section>
|
||
|
|
<section class="card">
|
||
|
|
<h2>Runtime Config Preview</h2>
|
||
|
|
<pre class="json">{JSON.stringify(config(), null, 2)}</pre>
|
||
|
|
</section>
|
||
|
|
</div>
|
||
|
|
)}
|
||
|
|
</AdminShell>
|
||
|
|
);
|
||
|
|
}
|