feat: moznost skrytia oznamovacej listy

This commit is contained in:
Jakub_Hostacny committed 2026-10-08 09:53:12 +02:00
1 parent 00d681bec2
commit 680883f047
4 files changed
+75 -12

No files matched your search

+54 -12
View File
@@ -651,18 +651,42 @@ export default function Home() {
{mod.title} {mod.title}
</span> </span>
{/* Ak je modul ukotvený (Hlavička / Letáky / Recepty / Pätička), nezobrazujeme tlačidlá na presun a zmazanie */} {/* Ak je modul ukotvený (Hlavička / Letáky / Recepty / Pätička / Oznamovacia lišta) */}
{isAnchored ? ( {isAnchored ? (
<span className="text-[9px] font-bold bg-white/10 text-amber-300 px-2 py-0.5 rounded-full border border-white/10 uppercase flex items-center gap-1"> <div className="flex items-center gap-1.5">
<Lock className="w-2.5 h-2.5" /> {mod.type === 'announcement' && (
{isFooter <button
? 'Ukotvená pätička' type="button"
: isFlyers onClick={(e) => {
? 'Ukotvené letáky' e.stopPropagation();
: isRecipes handleUpdateModule({
? 'Ukotvené recepty' ...mod,
: 'Ukotvená hlavička'} data: { ...mod.data, enabled: mod.data.enabled === false ? true : false }
</span> });
}}
className={`text-[9px] font-bold px-2 py-0.5 rounded-full border transition-all flex items-center gap-1 ${
mod.data.enabled === false
? 'bg-red-500/20 text-red-300 border-red-400/30 hover:bg-red-500/30'
: 'bg-emerald-500/20 text-emerald-300 border-emerald-400/30 hover:bg-emerald-500/30'
}`}
title={mod.data.enabled === false ? 'Aktivovať lištu v e-maile' : 'Skryť lištu v e-maile'}
>
{mod.data.enabled === false ? 'Skrytá (zapnúť)' : 'Zobrazená'}
</button>
)}
<span className="text-[9px] font-bold bg-white/10 text-amber-300 px-2 py-0.5 rounded-full border border-white/10 uppercase flex items-center gap-1">
<Lock className="w-2.5 h-2.5" />
{isFooter
? 'Ukotvená pätička'
: isFlyers
? 'Ukotvené letáky'
: isRecipes
? 'Ukotvené recepty'
: mod.type === 'announcement'
? 'Oznamovacia lišta'
: 'Ukotvená hlavička'}
</span>
</div>
) : ( ) : (
<> <>
<button <button
@@ -712,7 +736,7 @@ export default function Home() {
</div> </div>
)} )}
{/* Vykreslenie modulu: ak je loyalty_club vypnutý, zobrazíme prívetivý placeholder */} {/* Vykreslenie modulu: ak je loyalty_club alebo announcement vypnutý, zobrazíme prívetivý placeholder */}
{mod.type === 'loyalty_club' && mod.data.enabled === false ? ( {mod.type === 'loyalty_club' && mod.data.enabled === false ? (
<div className="p-8 my-4 border-2 border-dashed border-red-500/40 bg-red-950/30 rounded-2xl text-center"> <div className="p-8 my-4 border-2 border-dashed border-red-500/40 bg-red-950/30 rounded-2xl text-center">
<p className="text-xs font-bold text-red-300 uppercase tracking-wider"> <p className="text-xs font-bold text-red-300 uppercase tracking-wider">
@@ -731,6 +755,24 @@ export default function Home() {
Aktivovať vernostné zľavy Aktivovať vernostné zľavy
</button> </button>
</div> </div>
) : mod.type === 'announcement' && mod.data.enabled === false ? (
<div className="p-4 my-2 border-2 border-dashed border-red-500/40 bg-red-950/30 rounded-xl text-center">
<p className="text-xs font-bold text-red-300 uppercase tracking-wider">
Top oznamovacia lišta (Vypnutá / Skrytá)
</p>
<p className="text-[11px] text-gray-300 mt-0.5">
Táto lišta je v e-maile skrytá. Kliknutím sem ju môžete aktivovať.
</p>
<button
onClick={(e) => {
e.stopPropagation();
handleUpdateModule({ ...mod, data: { ...mod.data, enabled: true } });
}}
className="mt-2 px-3 py-1 bg-red-600 hover:bg-red-700 text-white text-xs font-bold rounded-lg transition-colors shadow-sm"
>
Aktivovať oznamovaciu lištu
</button>
</div>
) : ( ) : (
<div <div
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
+17
View File
@@ -68,6 +68,23 @@ export const ConfigPanel: React.FC<ConfigPanelProps> = ({
{/* TOP ANNOUNCEMENT */} {/* TOP ANNOUNCEMENT */}
{module.type === 'announcement' && ( {module.type === 'announcement' && (
<div className="space-y-4"> <div className="space-y-4">
{/* Toggle zapnuté / vypnuté */}
<div className="bg-red-50/60 p-3.5 rounded-xl border border-red-200 flex items-center justify-between">
<div>
<span className="text-xs font-bold text-gray-900 block">Zobraziť v e-maile</span>
<span className="text-[11px] text-gray-500">Top oznamovacia lišta</span>
</div>
<label className="relative inline-flex items-center cursor-pointer">
<input
type="checkbox"
checked={module.data.enabled !== false}
onChange={(e) => updateData({ enabled: e.target.checked })}
className="sr-only peer"
/>
<div className="w-11 h-6 bg-gray-300 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-red-600"></div>
</label>
</div>
<div> <div>
<label className="block text-xs font-semibold text-gray-700 mb-1">Text badge (napr. TIP)</label> <label className="block text-xs font-semibold text-gray-700 mb-1">Text badge (napr. TIP)</label>
<input <input
+3
View File
@@ -205,6 +205,9 @@ export function renderSingleModuleHtml(m: any, campaign: NewsletterCampaign): st
function renderModule(m: any, campaign: NewsletterCampaign): string { function renderModule(m: any, campaign: NewsletterCampaign): string {
switch (m.type) { switch (m.type) {
case 'announcement': case 'announcement':
if (m.data?.enabled === false) {
return '';
}
return ` return `
<!-- 0. TOP OZNAMOVACIA LIŠTA --> <!-- 0. TOP OZNAMOVACIA LIŠTA -->
<table align="center" role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin: 15px 0 20px 0;"> <table align="center" role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin: 15px 0 20px 0;">
+1
View File
@@ -48,6 +48,7 @@ export interface AnnouncementModuleData {
linkText: string; linkText: string;
linkUrl: string; linkUrl: string;
bgColor: string; bgColor: string;
enabled?: boolean;
} }
export interface HeaderModuleData { export interface HeaderModuleData {