import { UiTester } from "@fernir2/saas-kit/test/fd-test-ui-tester";
import { LoginPo } from "./page-objects/staging-login-po";
import { ListPo, TablePo, EditPo } from "@fernir2/saas-kit/fd-meta-tester-ui/page-objects";
import { resourceNames } from "@fernir2/saas-kit/fd-toolbox/resources";
import { MaterialUiTester } from "@fernir2/saas-kit/fd-meta-tester-ui/materials";
import test, { Page } from "@playwright/test";
import { personProps } from "@fernir2/saas-kit/dev/props";
import { elementSuffixes } from "@fernir2/saas-kit/meta/constants";
import { expect } from "@playwright/test";

const baseUrl = process.env["BASE_URL"] ?? "https://saas-kit-staging.fernir.biz";

const person = {
    id: "2e300f29-11c8-4429-8f63-63b5d53348e4",
    name: "EricTest",
    age: 69,
    imageUrl: "",
    description: "This is a test description",
    isMarried: false,
    maritalStatus: 0,
    workspaceId: "",
    createdDate: new Date(),
    favoriteNumber: 0,
    hasKids: false,
    areKidsVaccinated: false,
    firstbornName: "",
    education: "",
    bio: "",
    createdByUserId: "",
    modifiedDate: new Date(),
    modifiedByUserId: "",
};

const personsTable = "#ResourceListPersonTable";

export async function assertInputValue(page: Page, propertyName: string, expectedValue: string) {
    const elementId = propertyName + elementSuffixes.edit;
    await expect(page.locator(`#${elementId}`)).toHaveValue(expectedValue);
}

test("Edit person test", async ({ page }) => {
    //Arrange
    const uiTester = new UiTester(page);
    const loginPo = new LoginPo(page);
    const listPo = new ListPo(uiTester);
    const tablePo = new TablePo(uiTester);
    const materialUiTester = new MaterialUiTester(uiTester);
    const editPo = new EditPo(uiTester, materialUiTester);
    await loginPo.login();

    //Act

    await page.goto(`${baseUrl}/view?resource=Person`);
    await page.waitForURL("**/view?resource=Person");

    await tablePo.clickEditButton(person.id);
    await editPo.setInputValue(personProps.name, person.name);
    await editPo.setInputValue(personProps.age, person.age.toString());
    await editPo.clickBackButton(resourceNames.person);
    await page.waitForURL("**/view?resource=Person");

    // const rowIndex = await tablePo.getResourceIndexByResourceId(person.id);
    const row = page.locator(`${personsTable} [id^=\"ResourceListPersonTableRow\"]`, {
        hasText: person.name,
    });
    await expect(row).toBeVisible();
    await expect(row.locator("p", { hasText: `${person.name} Malone` })).toBeVisible();
});