async function pollGenerationStatus(generationId, bearer) {
  const maxAttempts = 120; // 10 minutes max
  let attempts = 0;
  let interval = 5000; // Start with 5 seconds
  
  while (attempts < maxAttempts) {
    try {
      const response = await fetch(`/api/v1/generate/${generationId}/`, {
        headers: {
          'Authorization': `Bearer ${bearer}`
        }
      });
      
      if (!response.ok) {
        throw new Error(`HTTP ${response.status}`);
      }
      
      const data = await response.json();
      
      // Update UI with progress
      updateProgress(data.progress);
      
      // Check if completed
      if (data.status === 'COMPLETED') {
        displayImage(data.image_url);
        return data;
      }
      
      // Check if failed
      if (data.status === 'FAILED') {
        displayError(data.error);
        return data;
      }
      
      // Increase interval gradually
      attempts++;
      if (attempts > 12) interval = 10000; // 10 seconds after 1 minute
      if (attempts > 30) interval = 30000; // 30 seconds after 5 minutes
      
      await new Promise(resolve => setTimeout(resolve, interval));
      
    } catch (error) {
      console.error('Polling error:', error);
      attempts++;
      await new Promise(resolve => setTimeout(resolve, interval));
    }
  }
  
  throw new Error('Generation timed out');
}

function updateProgress(progress) {
  const percentage = Math.round(progress * 100);
  document.getElementById('progress').textContent = `${percentage}%`;
  document.getElementById('progress-bar').style.width = `${percentage}%`;
}

function displayImage(imageUrl) {
  const img = document.getElementById('generated-image');
  img.src = imageUrl;
  img.style.display = 'block';
}

function displayError(error) {
  const errorDiv = document.getElementById('error-message');
  errorDiv.textContent = error.message;
  errorDiv.style.display = 'block';
}