YaltopiaTech/Yaltopia-Hotel-Emails
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix template switching

Browse Source 
Made-with: Cursor
This commit is contained in:
“kirukib” 2026-04-02 11:13:27 +03:00
parent c5b868e201
commit 3ade515398
1 changed files with 15 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/App.tsx
View File

@ -28,10 +28,13 @@ export default function App() {
return initDataForTemplate(template?.variables ?? []) return initDataForTemplate(template?.variables ?? [])
}) })
useEffect(() => { const handleTemplateChange = (nextId: string) => {
if (!template) return setTemplateId(nextId)
setData(initDataForTemplate(template.variables))
}, [templateId]) // Update variables immediately so the preview/exports switch reliably.
const nextTemplate = templates.find((t) => t.id === nextId)
if (nextTemplate) setData(initDataForTemplate(nextTemplate.variables))
}
const subject = useMemo(() => { const subject = useMemo(() => {
if (!template) return '' if (!template) return ''
@ -116,12 +119,16 @@ export default function App() {
</div> </div>
</header> </header>
<div style={{ ...styles.card, padding: 12 }}>
<TemplatePicker templates={templates} value={templateId} onChange={handleTemplateChange} />
</div>
<div style={styles.grid}> <div style={styles.grid}>
<aside style={styles.card}> <aside style={styles.card}>
<div style={{ display: 'grid', gap: 14 }}> <div style={{ display: 'grid', gap: 14 }}>
<BrandEditor brand={brand} onChange={setBrand} /> <BrandEditor brand={brand} onChange={setBrand} />
<TemplatePicker templates={templates} value={templateId} onChange={setTemplateId} /> <TemplatePicker templates={templates} value={templateId} onChange={handleTemplateChange} />
{template ? <VariablesForm template={template} data={data} onChange={setData} /> : null} {template ? <VariablesForm key={templateId} template={template} data={data} onChange={setData} /> : null}
<div style={{ display: 'grid', gap: 8 }}> <div style={{ display: 'grid', gap: 8 }}>
<div style={{ ...styles.sectionTitle, fontSize: 14 }}>Status</div> <div style={{ ...styles.sectionTitle, fontSize: 14 }}>Status</div>
@ -139,9 +146,9 @@ export default function App() {
<main style={styles.card}> <main style={styles.card}>
{template ? ( {template ? (
<div style={{ display: 'grid', gap: 16 }}> <div style={{ display: 'grid', gap: 16 }}>
<EmailPreview html={html} loading={loading} /> <EmailPreview key={templateId} html={html} loading={loading} />
<ExportPanel subject={subject} html={html} text={text} loading={loading} /> <ExportPanel key={templateId} subject={subject} html={html} text={text} loading={loading} />
</div> </div>
) : ( ) : (
<div>No template selected.</div> <div>No template selected.</div>