import React from 'react';
import { createStackNavigator } from '@react-navigation/stack';
import { NavigatorScreenParams } from '@react-navigation/native';
import { MainTabNavigator, MainTabParamList } from './mainTabNavigator';
import {
  ProviderListScreen,
  ProviderDetailsScreen,
  CartScreen,
  CheckoutAddressScreen,
  CheckoutPaymentScreen,
  OrderConfirmedScreen,
  OrderTrackingScreen,
  LiveTrackingScreen,
  OrderDeliveredScreen,
  HelpSupportScreen,
  WriteReviewScreen,
  OrderDetailsScreen,
} from '@features/screens';

export type AppStackParamList = {
  MainTabs: NavigatorScreenParams<MainTabParamList> | undefined;
  ProviderListScreen: { category?: string } | undefined;
  ProviderDetailsScreen: { providerId: string; providerName?: string };
  CartScreen: undefined;
  CheckoutAddressScreen: undefined;
  CheckoutPaymentScreen: { selectedAddressId?: string } | undefined;
  OrderConfirmedScreen: { orderId?: string } | undefined;
  OrderTrackingScreen: { orderId?: string } | undefined;
  LiveTrackingScreen: { orderId?: string } | undefined;
  OrderDeliveredScreen: { orderId?: string } | undefined;
  HelpSupportScreen: undefined;
  WriteReviewScreen: { productId: string } | undefined;
  OrderDetailsScreen: { orderId: string } | undefined;
};

const Stack = createStackNavigator<AppStackParamList>();

export const AppStack: React.FC = () => {
  return (
    <Stack.Navigator screenOptions={{ headerShown: false }}>
      <Stack.Screen name="MainTabs" component={MainTabNavigator} />
      <Stack.Screen name="ProviderListScreen" component={ProviderListScreen} />
      <Stack.Screen
        name="ProviderDetailsScreen"
        component={ProviderDetailsScreen}
      />
      <Stack.Screen name="CartScreen" component={CartScreen} />
      <Stack.Screen
        name="CheckoutAddressScreen"
        component={CheckoutAddressScreen}
      />
      <Stack.Screen
        name="CheckoutPaymentScreen"
        component={CheckoutPaymentScreen}
      />
      <Stack.Screen
        name="OrderConfirmedScreen"
        component={OrderConfirmedScreen}
      />
      <Stack.Screen
        name="OrderTrackingScreen"
        component={OrderTrackingScreen}
      />
      <Stack.Screen name="LiveTrackingScreen" component={LiveTrackingScreen} />
      <Stack.Screen
        name="OrderDeliveredScreen"
        component={OrderDeliveredScreen}
      />
      <Stack.Screen name="HelpSupportScreen" component={HelpSupportScreen} />
      <Stack.Screen name="WriteReviewScreen" component={WriteReviewScreen} />
      <Stack.Screen
        name="OrderDetailsScreen"
        component={OrderDetailsScreen}
      />
    </Stack.Navigator>
  );
};
