(function (global) {
  const SAVE_STEPS = [
    'Writing profile',
    'Updating school index',
    'Refreshing search'
  ];

  function createActionButton(label, className, onClick) {
    const button = document.createElement('button');
    button.type = 'button';
    button.className = className;
    button.textContent = label;
    button.addEventListener('click', event => {
      event.preventDefault();
      if (typeof onClick === 'function') {
        onClick();
      }
    });
    return button;
  }

  function createGenerationActions(options) {
    const container = document.createElement('div');
    container.className = 'ai-generation-actions';

    const status = options && options.status ? options.status : 'preview';

    if (status === 'saving') {
      const heading = document.createElement('div');
      heading.className = 'ai-generation-save-state';

      const title = document.createElement('h4');
      title.textContent = 'Saving...';
      heading.appendChild(title);

      const list = document.createElement('ol');
      list.className = 'ai-generation-save-steps';
      const completed = Math.max(0, Math.min(SAVE_STEPS.length, Number(options.savePhase) || 0));

      SAVE_STEPS.forEach((step, index) => {
        const item = document.createElement('li');
        const isDone = index < completed;
        item.textContent = `${isDone ? '✓' : '○'} ${step}`;
        item.className = isDone ? 'done' : 'pending';
        list.appendChild(item);
      });

      heading.appendChild(list);
      container.appendChild(heading);
      return container;
    }

    if (status === 'complete') {
      container.appendChild(createActionButton('Save Profile', 'ai-action-button ai-action-primary', options.onSave));
      container.appendChild(createActionButton('Regenerate', 'ai-action-button ai-action-secondary', options.onRegenerate));
      container.appendChild(createActionButton('Discard', 'ai-action-button ai-action-ghost', options.onDiscard));
      return container;
    }

    if (status === 'saved') {
      const savedState = document.createElement('div');
      savedState.className = 'ai-generation-save-state ai-generation-save-success';

      const title = document.createElement('h4');
      title.textContent = options.saveMessage || 'School added successfully.';
      savedState.appendChild(title);

      savedState.appendChild(createActionButton('Close', 'ai-action-button ai-action-primary', options.onClose));
      container.appendChild(savedState);
      return container;
    }

    if (status === 'duplicate') {
      const duplicateState = document.createElement('div');
      duplicateState.className = 'ai-generation-save-state ai-generation-save-duplicate';

      const title = document.createElement('h4');
      title.textContent = options.saveMessage || 'School already exists.';
      duplicateState.appendChild(title);

      duplicateState.appendChild(createActionButton('Cancel', 'ai-action-button ai-action-ghost', options.onCancelDuplicate));
      duplicateState.appendChild(createActionButton('Replace Existing', 'ai-action-button ai-action-secondary', options.onReplaceExisting));
      duplicateState.appendChild(createActionButton('Save As New Version', 'ai-action-button ai-action-primary', options.onSaveAsNewVersion));
      container.appendChild(duplicateState);
      return container;
    }

    if (status === 'validation-error') {
      container.appendChild(createActionButton('Regenerate', 'ai-action-button ai-action-secondary', options.onRegenerate));
      container.appendChild(createActionButton('Fix Issues', 'ai-action-button ai-action-primary', options.onFixIssues));
      return container;
    }

    container.appendChild(createActionButton('Discard', 'ai-action-button ai-action-ghost', options.onDiscard));
    return container;
  }

  global.CollegePlaybookAIGenerationActions = {
    createGenerationActions
  };
})(window);