n8n/packages/testing/playwright/pages/components/ResourceMoveModal.ts

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

import { FloatingUiHelper } from './FloatingUiHelper';

/**
 * Page object for interacting with move resource modals (MoveToFolderModal for workflows, ProjectMoveResourceModal for credentials).
 */
export class ResourceMoveModal extends FloatingUiHelper {
	getProjectSelect(): Locator {
		return this.page.getByTestId('project-sharing-select');
	}

	getProjectSelectCredential(): Locator {
		return this.page.getByTestId('project-move-resource-modal-select');
	}

	getMoveConfirmButton(): Locator {
		return this.page.getByTestId('confirm-move-folder-button');
	}

	getMoveCredentialButton(): Locator {
		return this.page.getByRole('button', { name: 'Move credential' });
	}

	getFolderSelect(): Locator {
		return this.page.getByTestId('move-to-folder-dropdown');
	}

	getFolderOption(folderName: string): Locator {
		// move-to-folder options teleport out of the modal root (el-select popper), so resolve page-scoped
		return this.page.getByTestId('move-to-folder-option').filter({ hasText: folderName });
	}

	async openProjectSelect(): Promise<void> {
		await this.getProjectSelectCredential().locator('input').click();
	}

	getProjectOptions(): Locator {
		return this.getVisiblePopoverOption();
	}

	async selectProjectOption(projectNameOrEmail: string): Promise<void> {
		const options = this.getVisiblePopoverOption();
		// Try to find by exact text (project name or email)
		const byExact = options.filter({ hasText: projectNameOrEmail });
		if ((await byExact.count()) > 0) {
			await byExact.click();
		} else {
			// For personal projects, the email is not shown, so try matching by name part of email
			const namePart = projectNameOrEmail.split('@')[0].replace(/[.-]/g, ' ');
			await options
				.filter({ hasText: new RegExp(namePart, 'i') })
				.first()
				.click();
		}
	}

	async clickMoveCredentialButton(): Promise<void> {
		await this.getMoveCredentialButton().click();
	}

	async clickConfirmMoveButton(): Promise<void> {
		await this.getMoveConfirmButton().click();
	}

	/**
	 * Waits for the project select's remote search to settle after typing.
	 * The search is debounced twice — element-plus's own remote-method
	 * debounce and this component's own search debounce, 300ms each — so up
	 * to ~600ms can pass between the last keystroke and the option list
	 * actually reflecting it.
	 */
	async waitForDebounce(): Promise<void> {
		// eslint-disable-next-line playwright/no-wait-for-timeout
		await this.page.waitForTimeout(800);
	}
}