// https://testing-library.com/docs/react-testing-library/setup
import { FC, PropsWithChildren, ReactElement } from 'react';
import { HelmetProvider } from 'react-helmet-async';
import { QueryClientProvider } from 'react-query';
import { BrowserRouter } from 'react-router-dom';

import { GoogleOAuthProvider } from '@react-oauth/google';
import { render, RenderOptions } from '@testing-library/react';

import { queryClient } from 'src/config/react-query';
import { AuthProvider } from 'src/contexts/JWTContext';

import { appsKeys } from './pages/dashboard/Apps/queries';

const MOCKED_ICONS = [
  {
    id: 1,
    name: 'tickets',
    source: 'https://picsum.photos/id/237/200/300',
    custom: false,
  },
];

queryClient.setQueryData(appsKeys.icons(), () => ({ data: MOCKED_ICONS }));

const AllTheProviders: FC<PropsWithChildren> = ({ children }) => (
  <HelmetProvider>
    <BrowserRouter>
      <QueryClientProvider client={queryClient}>
        <GoogleOAuthProvider clientId={import.meta.env.VITE_GOOGLE_CLIENT_ID}>
          <AuthProvider>{children}</AuthProvider>
        </GoogleOAuthProvider>
      </QueryClientProvider>
    </BrowserRouter>
  </HelmetProvider>
);

const customRender = (
  ui: ReactElement,
  options?: Omit<RenderOptions, 'wrapper'>,
) => render(ui, { wrapper: AllTheProviders, ...options });

export * from '@testing-library/react';
export { customRender as render };