Fix null reference error in EmailTemplatePreview

- Add conditional rendering for previewTemplate to prevent null reference
- Add null checks in EmailTemplatePreview component for template properties
- Fix shortcodes filtering to handle null template properties
- Remove non-null assertion operator and use proper conditional rendering

Fixes: "Cannot read properties of null (reading 'email_subject')" error

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
dwindown
2025-12-22 21:01:04 +07:00
parent 1982033ac4
commit 4bb6e8d08c
2 changed files with 15 additions and 10 deletions

View File

@@ -47,8 +47,10 @@ export function EmailTemplatePreview({
// Generate preview with dummy shortcode data
const generatePreview = () => {
const processedSubject = ShortcodeProcessor.process(template.email_subject);
const processedContent = ShortcodeProcessor.process(template.email_body_html);
if (!template) return '<div>No template selected</div>';
const processedSubject = ShortcodeProcessor.process(template.email_subject || '');
const processedContent = ShortcodeProcessor.process(template.email_body_html || '');
if (previewMode === 'master') {
const fullHtml = EmailTemplateRenderer.render({
@@ -190,7 +192,8 @@ export function EmailTemplatePreview({
{['{nama}', '{email}', '{order_id}', '{tanggal_pesanan}', '{total}', '{metode_pembayaran}',
'{produk}', '{link_akses}', '{tanggal_konsultasi}', '{jam_konsultasi}', '{link_meet}',
'{judul_event}', '{tanggal_event}', '{jam_event}', '{link_event}'].filter(shortcode =>
template.email_subject.includes(shortcode) || template.email_body_html.includes(shortcode)
(template.email_subject && template.email_subject.includes(shortcode)) ||
(template.email_body_html && template.email_body_html.includes(shortcode))
).map(shortcode => (
<code key={shortcode} className="bg-blue-100 px-2 py-1 rounded text-xs">
{shortcode}

View File

@@ -679,13 +679,15 @@ export function NotifikasiTab() {
</Card>
{/* Modal Email Preview */}
{previewTemplate && (
<EmailTemplatePreview
template={previewTemplate!}
template={previewTemplate}
open={isPreviewOpen}
onClose={() => setIsPreviewOpen(false)}
onTest={sendTestEmail}
isTestSending={testingTemplate === previewTemplate?.id}
isTestSending={testingTemplate === previewTemplate.id}
/>
)}
</div>
);
}