import { type Page } from '@playwright/test';

/** Wait until the side-panel roster under a voice channel lists the expected user count. */
export async function waitForVoiceRosterCount(
  page: Page,
  channelName: string,
  expectedCount: number,
  timeout = 45_000
): Promise<void> {
  await page.waitForFunction(
    ({ expected, name }) => {
      const buttons = document.querySelectorAll(
        `app-rooms-side-panel button[data-channel-type="voice"][data-channel-name="${name}"]`
      );

      for (const button of buttons) {
        const panel = button.closest('app-rooms-side-panel');

        if (!panel || panel.getBoundingClientRect().width === 0) {
          continue;
        }

        const rosterDiv = button.nextElementSibling;

        if (!rosterDiv) {
          continue;
        }

        const displayNames = new Set<string>();

        rosterDiv.querySelectorAll('[appThemeNode="roomVoiceUserItem"] span.text-sm').forEach((element) => {
          const label = element.textContent?.trim();

          if (label) {
            displayNames.add(label);
          }
        });

        if (displayNames.size === expected) {
          return true;
        }
      }

      return false;
    },
    { expected: expectedCount, name: channelName },
    { timeout }
  );
}