const { test } = require('@playwright/test');
const USER = process.env.FD_USER || 'e2e@flowdeck.local';
const PASS = process.env.FD_PASS || 'e2e-secret-123';
const WS = 'Workspace E2E ' + Date.now();

async function uiLogin(page) {
  await page.goto('/auth/login?provider=local');
  await page.fill('#email', USER);
  await page.fill('#password', PASS);
  await page.click('.btn-primary');
  await page.waitForTimeout(1500);
}

async function enterWorkspace(page, wsName) {
  await uiLogin(page);
  await page.waitForSelector('.ws-card.btn-new');
  await page.click('.ws-card.btn-new');
  await page.fill('.dialog-input', wsName);
  await page.click('.dialog-box .btn-primary');
  await page.waitForTimeout(1200);
  await page.click(`.ws-card:has-text("${wsName}")`);
  await page.waitForTimeout(1500);
}

test('explore: Ctrl+K palette pour voir actions création', async ({ page }) => {
  await enterWorkspace(page, WS);
  console.log('URL:', page.url());

  // Open command palette with Ctrl+K
  await page.keyboard.press('Control+KeyK');
  await page.waitForTimeout(600);

  // Capture palette content
  const palette = await page.evaluate(() => {
    const pal = document.querySelector('.cmd-palette, [x-show*="palette"], .command-palette, [data-testid="palette"]');
    if (!pal) return null;
    const items = [...pal.querySelectorAll('li, button, [role=option], .palette-item, .result-item')];
    return items.map(i => ({
      cls: (i.className||'').slice(0,50),
      text: (i.innerText||'').trim().slice(0,80),
    }));
  });
  console.log('PALETTE ITEMS:', JSON.stringify(palette, null, 1));

  // Also check what's in the sidebar
  const sidebar = await page.evaluate(() => {
    const sb = document.querySelector('#sidebar, aside, .sidebar, [data-sidebar]');
    if (!sb) return null;
    const btns = [...sb.querySelectorAll('button, a, [role=button], .btn')];
    return btns.map(b => ({
      cls: (b.className||'').slice(0,50),
      text: (b.innerText||'').trim().slice(0,40),
    }));
  });
  console.log('SIDEBAR BTNS:', JSON.stringify(sidebar, null, 1));

  await page.screenshot({ path: 'shots/palette.png' });
});