const toggle = document.getElementById('toggle');
const status = document.getElementById('status');

chrome.runtime.sendMessage({ action: 'getBlockingState' }, (response) => {
  if (response && response.enabled !== undefined) {
    const blockingEnabled = response.enabled;

    if (blockingEnabled) {
      toggle.classList.add('active');
      status.textContent = 'Blocking is ON';
    } else {
      toggle.classList.remove('active');
      status.textContent = 'Blocking is OFF';
    }
  }
});

toggle.addEventListener('click', function () {
  const isActive = toggle.classList.toggle('active');

  if (isActive) {
    status.textContent = 'Blocking is ON';
  } else {
    status.textContent = 'Blocking is OFF';
  }

  chrome.runtime.sendMessage({
    action: 'toggleBlocking',
    enabled: isActive
  });
});