@@ -28,6 +28,7 @@ interface WidgetSettings {
2828 max_messages_per_session ?: number ;
2929 max_sessions_per_day ?: number ;
3030 whitelisted_domains ?: string [ ] ;
31+ is_active ?: boolean ;
3132}
3233
3334type Tab = 'business' | 'appearance' | 'installation' ;
@@ -98,7 +99,8 @@ export default function WidgetSettingsPage() {
9899 whatsapp_number : settings . whatsapp_number ,
99100 max_messages_per_session : settings . max_messages_per_session ,
100101 max_sessions_per_day : settings . max_sessions_per_day ,
101- whitelisted_domains : settings . whitelisted_domains
102+ whitelisted_domains : settings . whitelisted_domains ,
103+ is_active : settings . is_active
102104 } ) ,
103105 } ) ;
104106 if ( res . ok ) {
@@ -279,6 +281,24 @@ export default function WidgetSettingsPage() {
279281 </ div >
280282
281283 < div className = "grid grid-cols-1 md:grid-cols-2 gap-8" >
284+ < div className = "md:col-span-2 bg-[var(--bg-secondary)] p-6 rounded-[var(--radius-md)] border border-[var(--border-subtle)] flex items-center justify-between" >
285+ < div >
286+ < h3 className = "text-sm font-bold text-[var(--text-primary)]" > Widget Status</ h3 >
287+ < p className = "text-sm text-[var(--text-secondary)] mt-1" >
288+ { settings ?. is_active ? 'Widget is currently active and visible on your site.' : 'Widget is disabled and hidden from your site.' }
289+ </ p >
290+ </ div >
291+ < label className = "relative inline-flex items-center cursor-pointer" >
292+ < input
293+ type = "checkbox"
294+ className = "sr-only peer"
295+ checked = { settings ?. is_active ?? true }
296+ onChange = { ( e ) => settings && setSettings ( { ...settings , is_active : e . target . checked } ) }
297+ />
298+ < div className = "w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-green-300 dark:peer-focus:ring-green-800 rounded-full peer dark:bg-gray-700 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 dark:border-gray-600 peer-checked:bg-[var(--brand-primary)]" > </ div >
299+ </ label >
300+ </ div >
301+
282302 < div >
283303 < label className = "block text-sm font-medium text-[var(--text-secondary)] mb-2" > Primary Brand Color</ label >
284304 < div className = "flex gap-3 items-center" >
0 commit comments