jest.mock("@/app/i18n/api", () => require("../../__mocks__/api.ts"));
import { renderRouter} from 'expo-router/testing-library';
import React from "react";
import {
  act,
  fireEvent,
  render,
  screen,
  waitFor,
} from "@testing-library/react-native";
import {
  NavigationContainer,
  createNavigationContainerRef,
} from "@react-navigation/native";
import TTNavStack from "../TTNavStack";

describe("Navigation", () => {
  beforeEach(() => {
    // Reset the navigation state before each test
    jest.clearAllMocks();
    jest.useFakeTimers();
  });

  it("Navigates to ConversationThread on language selection", async () => {
    const MockComponent = jest.fn(() => <TTNavStack />);
    renderRouter(
      {
        index: MockComponent,
      },
      {
        initialUrl: '/',
      }
    );
    const languageSelectionText = await waitFor(() =>
      screen.getByText(/.*I Speak French.*/i)
    );
    act(() => {
      fireEvent.press(languageSelectionText);
    });
    expect(await screen.findByText("Conversation Thread")).toBeOnTheScreen();
  });

  it("Navigates to Settings on settings selection", async () => {
    const MockComponent = jest.fn(() => <TTNavStack />);
    renderRouter(
      {
        index: MockComponent,
      },
      {
        initialUrl: '/',
      }
    );
    const settingsButton = await waitFor(() =>
      screen.getByText(/.*Settings.*/i)
    );
    fireEvent.press(settingsButton);
    expect(await waitFor(() => screen.getByText(/Settings/i))).toBeOnTheScreen();
    // expect(waitFor(() => screen.getByText(/Settings/i))).toBeTruthy()
    expect(screen.getByText("Settings")).toBeOnTheScreen();
  });
});
