import { createRoot } from 'react-dom/client';
import SaveButton from './components/SaveButton';
import './index.css';

function addSaveButtonToPost(post: Element) {
  if (post.querySelector('.launchr-save-button-container')) {
    return;
  }

  // Criar container para o botão
  const buttonContainer = document.createElement('div');
  buttonContainer.className = 'launchr-save-button-container';
  
  // Criar root para o React
  const root = createRoot(buttonContainer);
  
  // Renderizar o componente SaveButton
  root.render(
    <SaveButton
      onSave={async () => {
        const contentElement = post.querySelector('.feed-shared-update-v2__description, .break-words');
        const authorElement = post.querySelector('.feed-shared-actor__name, .update-components-actor__name');
        const dateElement = post.querySelector('span.feed-shared-actor__sub-description span[aria-hidden="true"], span.update-components-actor__sub-description time');
        const postLinkElement = post.querySelector('a[href*="/feed/update/"], a[data-control-name="share_link"], a[href*="/posts/"]');
        
        const content = contentElement?.textContent?.trim() || '';
        const author = authorElement?.textContent?.trim() || '';
        const date = dateElement?.textContent?.trim() || '';
        const postLink = postLinkElement?.getAttribute('href') || window.location.href;

        return new Promise((resolve) => {
          chrome.runtime.sendMessage({
            type: 'SAVE_POST',
            data: {
              content,
              author,
              date,
              postLink
            }
          }, (response) => {
            resolve(response);
          });
        });
      }}
    />
  );

  // Encontrar onde inserir o botão
  const actionsContainer = post.querySelector('.feed-shared-social-actions, .social-details-social-counts');
  if (actionsContainer) {
    actionsContainer.appendChild(buttonContainer);
  } else {
    post.appendChild(buttonContainer);
  }
}

// Observer para detectar novos posts
const observer = new MutationObserver((mutations) => {
  mutations.forEach((mutation) => {
    mutation.addedNodes.forEach((node) => {
      if (node instanceof Element && node.matches('[data-id]')) {
        addSaveButtonToPost(node);
      }
    });
  });
});

// Iniciar observação
observer.observe(document.body, {
  childList: true,
  subtree: true
});