/*
 * SPDX-License-Identifier: Apache-2.0
 *
 * The OpenSearch Contributors require contributions made to
 * this file be licensed under the Apache-2.0 license or a
 * compatible open source license.
 *
 * Modifications Copyright OpenSearch Contributors. See
 * GitHub history for details.
 */

import React from 'react';
import { render } from '@testing-library/react';
import { DetectorDetail, DetectorRouterProps } from '../DetectorDetail';
import { Provider } from 'react-redux';
import {
  HashRouter as Router,
  RouteComponentProps,
  Route,
  Switch,
  Redirect,
} from 'react-router-dom';
// @ts-ignore
import configureStore from '../../../../redux/configureStore';
import { httpClientMock, coreServicesMock } from '../../../../../test/mocks';
import { CoreServicesContext } from '../../../../components/CoreServices/CoreServices';

jest.mock('../../hooks/useFetchMonitorInfo');
jest.mock('../../../CreateDetectorSteps/hooks/useFetchDetectorInfo');

const detectorId = '4QY4YHEB5W9C7vlb3Mou';

const renderWithRouter = (detectorId: string) => ({
  ...render(
    <Provider store={configureStore(httpClientMock)}>
      <Router>
        <Switch>
          <Route
            path={`/detectors/${detectorId}/results`}
            render={(props: RouteComponentProps<DetectorRouterProps>) => {
              const testProps = {
                ...props,
                match: {
                  params: { detectorId: detectorId },
                  isExact: false,
                  path: '',
                  url: '',
                },
              };
              return (
                <CoreServicesContext.Provider value={coreServicesMock}>
                  <DetectorDetail {...testProps} />
                </CoreServicesContext.Provider>
              );
            }}
          />
          <Redirect from="/" to={`/detectors/${detectorId}/results`} />
        </Switch>
      </Router>
    </Provider>
  ),
});

describe('<DetectorDetail /> spec', () => {
  beforeEach(() => {
    jest.clearAllMocks();
  });
  describe('detector detail', () => {
    test.skip('renders detector detail component', () => {
      const { container } = renderWithRouter(detectorId);
      expect(container).toMatchSnapshot();
    });
  });
});