import { type Locator, type Page, expect, test } from '@playwright/test';
import { BasePage } from './BasePage';
import { IVehicleDetails } from 'safelite-playwright-core';
import { TestSuccessAlert } from 'safelite-playwright-core';
import { step } from 'framework/localTypes/Step';
import { ITestData } from 'framework/TestData';
import { ProgressBarPercentages } from 'framework/localTypes/Enums';

export class VehicleSelectionPage extends BasePage {
    readonly page: Page;
    readonly yearDropdown: Locator;
    readonly makeDropdown: Locator;
    readonly modelDropdown: Locator;
    readonly styleDropdown: Locator;
    readonly zipCodeTextBox: Locator;
    readonly discontinuedServiceAlert: Locator;

    constructor(page: Page) {
        super(page);
        this.page = page;
        this.yearDropdown = this.page.locator('#yearQuestionField');
        this.makeDropdown = this.page.locator('#makeQuestionField');
        this.modelDropdown = this.page.locator('#modelQuestionField');
        this.styleDropdown = this.page.locator('#styleQuestionField');
        this.zipCodeTextBox = this.page.getByRole('textbox', { name: 'Zip code' });
        this.discontinuedServiceAlert = this.page.locator('.alert-danger.widget-name-AlertNoServiceWidget');
    }

    async selectVehicle(vehicleDetails: IVehicleDetails) {
        await this.yearDropdown.selectOption(vehicleDetails.year);
        await this.yearDropdown.press('Tab');
        await this.makeDropdown.selectOption(vehicleDetails.make);
        await this.yearDropdown.press('Tab');
        await this.modelDropdown.selectOption(vehicleDetails.model);
        await this.yearDropdown.press('Tab');
        if (vehicleDetails.style != undefined) {
            await this.styleDropdown.selectOption(vehicleDetails.style);
        }
    }

    async checkForAlertMessages() {
        await expect(this.discontinuedServiceAlert).toBeVisible();
        const alertMessage = await this.discontinuedServiceAlert.textContent();
        await console.log(`Alert encountered: ${alertMessage}`);
        await expect(alertMessage).toContain('Service not available in your areaWe do not offer glass service for your vehicle in your ZIP code. We apologize for the inconvenience.');
    }

    @step("VehicleSelectionPage >> Select Vehicle: ")
    async handleVehicleSelectionPage(testData: Partial<ITestData>) {
        await this.validateProgressBar(ProgressBarPercentages.VehicleSelectionPage);
        const { vehicleDetails, isHeavyTruck, customerDetails } = testData;
        const { isHeavyTruckVehicleAlert, isSplitWindshield } = testData.alertFlags || {};
         
        await this.selectVehicle(vehicleDetails!);

        if (isHeavyTruck) {
            await this.zipCodeTextBox.fill(customerDetails?.address.postalCode!);
        }
        
        // Handle alert conditions for vehicle selection
        if (isHeavyTruckVehicleAlert) {
            await this.continueButton.click();
            await this.checkForAlertMessages();
            throw new TestSuccessAlert('Both assertions are met successfully.');
        }
        
        await this.nextPage();
    }
}