SBCanvas.panel.register({
  actions: [
    { name: 'reset', label: 'Reset Counter', confirm: true },
    { name: 'test', label: 'Send Test Alert' },
    { name: 'clear', label: 'Clear Queue', confirm: true }
  ]
});

SBCanvas.panel.onAction('reset', () => {
  SBCanvas.vars.set('counter', 0);
  SBCanvas.store.set('counter', 0);
});

SBCanvas.panel.onAction('test', () => {
  SBCanvas.preview.injectTestEvent('activity:tip', {
    username: 'TestUser',
    amount: 10,
    currency: 'USD',
    provider: 'kick'
  });
});

SBCanvas.panel.onAction('clear', () => {
  SBCanvas.queue.clear();
});

function handleReset() {
  SBCanvas.vars.set('counter', 0);
}

SBCanvas.panel.onAction('reset', handleReset);
SBCanvas.panel.offAction('reset', handleReset);

// Remove all handlers for an action
SBCanvas.panel.offAction('reset');

SBCanvas.panel.register({
  actions: [
    { name: 'delete-all', label: 'Delete All Data', confirm: true }
  ]
});

SBCanvas.panel.onAction('delete-all', async () => {
  await SBCanvas.store.delete('leaderboard');
  await SBCanvas.store.delete('counters');
  SBCanvas.vars.clear();
});

SBCanvas.panel.register({
  fields: [
    { key: 'goal', type: 'number', label: 'Sub Goal', min: 1, max: 1000, default: 100 },
    { key: 'message', type: 'text', label: 'Goal Message', placeholder: 'We did it!' }
  ],
  actions: [
    { name: 'reset-progress', label: 'Reset Progress', confirm: true },
    { name: 'celebrate', label: 'Trigger Celebration' }
  ]
});

SBCanvas.panel.onAction('reset-progress', () => {
  SBCanvas.vars.set('progress', 0);
  SBCanvas.store.set('progress', 0);
});

SBCanvas.panel.onAction('celebrate', () => {
  SBCanvas.confetti({ count: 200, spread: 90 });
  SBCanvas.sound('/sounds/celebrate.mp3', 0.8);
});