// renderer.jsx window.addEventListener('DOMContentLoaded', async () => { const folderList = document.getElementById('folderList'); const addBtn = document.getElementById('addFolderBtn'); const titleEl = document.getElementById('currentTitle'); const contentList = document.getElementById('contentList'); window.addEventListener('repo-updated', e => { const updatedFolder = e.detail; const current = titleEl.textContent; if (current === updatedFolder) { renderContent(current); } }); function basename(fullPath) { return fullPath.replace(/.*[\\/]/, ''); } async function renderSidebar() { const folders = await window.electronAPI.getFolders(); const selected = await window.electronAPI.getSelected(); folderList.innerHTML = ''; folders.forEach(folder => { const li = document.createElement('li'); li.className = [ 'flex items-center justify-between px-3 py-2 rounded cursor-pointer text-[#9f1239]', folder === selected ? 'bg-[#fecdd3]' : '' ].join(' '); li.innerHTML = ` ${basename(folder)} `; li.addEventListener('click', async e => { if (e.target.closest('.remove-btn')) return; await window.electronAPI.setSelected(folder); await renderSidebar(); await renderContent(folder); }); li.querySelector('.remove-btn').addEventListener('click', async () => { await window.electronAPI.removeFolder(folder); await renderSidebar(); titleEl.textContent = 'No folder selected'; contentList.innerHTML = ''; }); folderList.appendChild(li); }); } async function renderContent(folder) { const currentFolder = folder; titleEl.textContent = folder; const { head, commits } = await window.electronAPI.getCommits(folder); contentList.innerHTML = commits.map(c => `
  • ${c.hash} ${new Date(c.date).toLocaleString()}
    ${c.message}
    
        
    
      
    • 
    `).join('');

    // Erst mal alle Diff-Buttons prüfen und ggf. deaktivieren
    contentList.querySelectorAll('.diff-btn').forEach(async btn => {
      const hash      = btn.dataset.hash;
      const diffText  = await window.electronAPI.diffCommit(folder, hash);
      if (!diffText.trim()) {
        btn.disabled = true;
        btn.classList.add('disabled');
      }
    });

    // Diff-Toggle & Highlighting
    contentList.querySelectorAll('.diff-btn').forEach(btn => {
      btn.addEventListener('click', async () => {
        const li        = btn.closest('li');
        const hash      = btn.dataset.hash;
        const svg       = btn.querySelector('svg');
        const container = li.querySelector('.diff-container');
        const pre       = container.querySelector('pre');

        if (!pre.innerHTML.trim()) {
          // fetch und HTML-Snippet bauen
          const diff = await window.electronAPI.diffCommit(folder, hash);
          const escaped = diff
            .replace(/&/g, '&')
            .replace(//g, '>');
          pre.innerHTML = escaped
            .split('\n')
            .map(line => {
              const cls = line.startsWith('+')
                ? 'diff-line addition'
                : line.startsWith('-')
                  ? 'diff-line deletion'
                  : 'diff-line';
              return `
    ${line}
    `;
            })
            .join('');
        }

        const isOpen = container.classList.toggle('open');
        if (isOpen) { 
          container.style.maxHeight = container.scrollHeight + 'px';
        } else {
          container.style.maxHeight = '0';
        }
        svg.classList.toggle('open', isOpen);
      });
    });

    // Snapshot-Button
    contentList.querySelectorAll('.snapshot-btn').forEach(btn => {
      btn.addEventListener('click', async () => {
        const hash = btn.dataset.hash;
        try {
          // verwende jetzt currentFolder statt einer undefinierten Variable
          const savedPath = await window.electronAPI.snapshotCommit(currentFolder, hash);
          if (savedPath) {
            alert(`Snapshot gespeichert unter:\n${savedPath}`);
          }
        } catch (err) {
          console.error(err);
          alert('Snapshot fehlgeschlagen');
        }
      });
    });

    // Revert-Button
    contentList.querySelectorAll('.revert-btn').forEach(btn => {
      btn.addEventListener('click', async () => {
        const hash = btn.dataset.hash;
        if (confirm(`Commit ${hash} wirklich revertieren?`)) {
          await window.electronAPI.revertCommit(folder, hash);
          await renderContent(folder);
        }
      });
    });

    // Checkout-Button
    contentList.querySelectorAll('.checkout-btn').forEach(btn => {
      btn.addEventListener('click', async () => {
        const hash = btn.dataset.hash;
        //if (!confirm(`Jump here? Ungestagte Änderungen werden verworfen.`)) return;
        // currentFolder hast du oben in renderContent gespeichert
        await window.electronAPI.checkoutCommit(currentFolder, hash);
        await renderContent(currentFolder);
      });
    });
    const currentEl = contentList.querySelector('li.current-commit');
    if (currentEl) {
      // weich scrollen und zentriert in den Viewport bringen
      currentEl.scrollIntoView({ behavior: 'smooth', block: 'center' });
    }
  }

  // initial
  await renderSidebar();
  const initial = await window.electronAPI.getSelected();
  if (initial) await renderContent(initial);

  // Add-Folder
  addBtn.addEventListener('click', async () => {
    await window.electronAPI.addFolder();
    await renderSidebar();
    const sel = await window.electronAPI.getSelected();
    if (sel) await renderContent(sel);
  });
});