// @vitest-environment jsdom
import {afterEach, beforeEach, describe, expect, it, vi} from 'vitest';
import {cleanup, render, screen} from '@testing-library/react';
import {MemoryRouter, Route, Routes} from 'react-router-dom';
import {switchLanguage} from '../test/i18n-mock.js';
import {fetchRoutes, json} from '../test/fetchRoutes.js';
import {PreferencesProvider} from '../context/PreferencesContext.jsx';
import {CurrentUserProvider} from '../context/CurrentUserContext.jsx';
import Dashboard from './Dashboard.jsx';
import GameDetail from './GameDetail.jsx';
import GameLibrary from './GameLibrary.jsx';
import PublicProfilePage from './PublicProfilePage.jsx';
import SettingsPage from './SettingsPage.jsx';
import WishlistPage from './WishlistPage.jsx';

vi.mock('react-i18next', () => import('../test/i18n-mock.js'));

// The last column: what the page loads besides GET /api/users/me of the provider.
const pages = [
    ['Dashboard', '/', '/', Dashboard, 'INFO.ERROR.LOAD_PROFILE', []],
    ['GameDetail', '/games/:appid', '/games/220', GameDetail, 'GAME_DETAIL.ERROR_LOAD', ['/api/library/games/220']],
    ['GameLibrary', '/library', '/library', GameLibrary, 'LIBRARY.ERROR_LOAD',
        ['/api/library/games', '/api/library/games-count', '/api/library/sync-status']],
    ['PublicProfilePage', '/u/:name', '/u/Lobo', PublicProfilePage, 'PROFILE.ERROR_LOAD', ['/api/public/profiles/Lobo']],
    ['SettingsPage', '/settings', '/settings', SettingsPage, 'INFO.ERROR.LOAD_PROFILE', []],
    ['WishlistPage', '/wishlist', '/wishlist', WishlistPage, 'WISHLIST.ERROR_LOAD', ['/api/library/wishlist']],
];

beforeEach(() => {
    localStorage.setItem('tbp_session', '1');
    switchLanguage('de');
});

afterEach(() => {
    cleanup();
    localStorage.clear();
});

describe('a language change', () => {
    it.each(pages)('%s: loads nothing again and shows the error in the new language', async (name, path, url, Page, errorKey, loads) => {
        fetchRoutes(Object.fromEntries(['/api/users/me', ...loads].map((load) => [`GET ${load}`, json(500, {})])));
        const tree = () => (
            <MemoryRouter initialEntries={[url]}>
                <PreferencesProvider><CurrentUserProvider><Routes><Route path={path} element={<Page/>}/></Routes></CurrentUserProvider></PreferencesProvider>
            </MemoryRouter>
        );
        const {rerender} = render(tree());
        await screen.findByText(`de:${errorKey}`);
        const requests = fetch.mock.calls.length;

        switchLanguage('en');
        rerender(tree());

        expect(await screen.findByText(`en:${errorKey}`)).toBeTruthy();
        await new Promise((resolve) => setTimeout(resolve, 50));
        expect(fetch.mock.calls.length).toBe(requests);
    });
});