import "@shopify/flash-list/jestSetup";
import type { RenderOptions } from "@testing-library/react-native";
import type { ReactElement } from "react";
import React from "react";
import { GestureHandlerRootView } from "react-native-gesture-handler";
import {
 initialWindowMetrics,
 SafeAreaProvider,
} from "react-native-safe-area-context";
import { ClerkProvider } from "@clerk/clerk-expo";
import { BottomSheetModalProvider } from "@gorhom/bottom-sheet";
import { NavigationContainer } from "@react-navigation/native";
import { render } from "@testing-library/react-native";
import { TRPCProvider } from "~/utils/api";
import { tokenCache } from "~/utils/cache";
// Mock environment variables for testing
process.env.EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY =
 "pk_test_Y2hlZXJmdW...";
const createAppWrapper = () => {
 return ({ children }: { children: React.ReactNode }) => (
 <ClerkProvider
 publishableKey={process.env.EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY ?? ""}
 tokenCache={tokenCache}
 >
 <TRPCProvider>
 <GestureHandlerRootView style={{ flex: 1 }}>
 <SafeAreaProvider initialMetrics={initialWindowMetrics}>
 <BottomSheetModalProvider>
 <NavigationContainer>{children}</NavigationContainer>
 </BottomSheetModalProvider>
 </SafeAreaProvider>
 </GestureHandlerRootView>
 </TRPCProvider>
 </ClerkProvider>
 );
};
const customRender = (
 ui: ReactElement,
 options?: Omit<RenderOptions, "wrapper">,
) => {
 const Wrapper = createAppWrapper(); // make sure we have a new wrapper for each render
 return render(ui, { wrapper: Wrapper, ...options });
};
export * from "@testing-library/react-native";
export { customRender as render };