import {test, expect} from '../../support/fixtures'
import {ProjectFactory} from '../../factories/project'
import {ProjectViewFactory} from '../../factories/project_view'

test.describe('Project History', () => {
	test('should show a project history on the home page', async ({authenticatedPage: page}) => {
		test.setTimeout(60000)
		const projects = await ProjectFactory.create(7)
		await ProjectViewFactory.truncate()
		await Promise.all(projects.map(p => ProjectViewFactory.create(1, {
			id: p.id,
			project_id: p.id,
		}, false)))

		const loadProjectArrayPromise = page.waitForResponse('**/api/v1/projects*')
		await page.goto('/')
		await loadProjectArrayPromise
		await expect(page.locator('body')).not.toContainText('Last viewed')

		for (let i = 0; i < projects.length; i++) {
			const loadProjectPromise = page.waitForResponse(response =>
				response.url().includes(`/projects/${projects[i].id}`) && response.request().method() === 'GET',
			)
			await page.goto(`/projects/${projects[i].id}/${projects[i].id}`)
			await loadProjectPromise
			// Wait for history to be saved to localStorage
			await page.waitForFunction(
				(projectId) => {
					const history = JSON.parse(localStorage.getItem('projectHistory') || '[]')
					return history.some((h: any) => h.id === projectId)
				},
				projects[i].id,
			)
		}

		await page.locator('nav.menu.top-menu a').filter({hasText: 'Overview'}).click()

		await expect(page.locator('body')).toContainText('Last viewed')
		await expect(page.locator('.project-grid')).not.toContainText(projects[0].title)
		await expect(page.locator('.project-grid')).toContainText(projects[1].title)
		await expect(page.locator('.project-grid')).toContainText(projects[2].title)
		await expect(page.locator('.project-grid')).toContainText(projects[3].title)
		await expect(page.locator('.project-grid')).toContainText(projects[4].title)
		await expect(page.locator('.project-grid')).toContainText(projects[5].title)
		await expect(page.locator('.project-grid')).toContainText(projects[6].title)
	})
})