import { Stack, type NativeStackNavigationOptions } from "expo-router";
import { Platform } from "react-native";

import { FeedbackBodyProvider } from "../../shared/context/FeedbackBodyProvider.js";
import { FeedbackProvider } from "../../shared/context/FeedbackProvider.js";
import { kinds } from "../../shared/helpers.js";
import { mergeFeedbackMessages } from "../../shared/messages.js";
import { mergeFeedbackTheme } from "../../shared/theme.js";
import { collectExpoMetadata } from "./metadata.js";
import { RoutedFeedbackProvider } from "./RoutedFeedbackContext.js";
import { resolveFeedbackRoutes } from "./routes.js";
import type { FeedbackStackLayoutProps } from "./types.js";

export function FeedbackStackLayout({
  hooks,
  messages,
  theme,
  unstyled,
  entrySort = "top",
  commentSort = "top",
  enabledKinds = kinds,
  maxCommentDepth = 5,
  debounceDuration = 300,
  collectMetadata,
  emptyState,
  loading,
  transformComments,
  renderActor,
  onUnauthenticated,
  routes: routeOverrides,
  screenOptions,
  boardOptions,
  entryOptions,
  editOptions,
  createOptions,
  androidToolbarIcons = {},
  BottomToolbarWrapper,
  primaryColor,
  primaryForeground,
  backgroundColor,
  surfaceColor,
  inputColor,
  textColor,
  mutedColor,
  borderColor,
  dangerColor,
}: FeedbackStackLayoutProps) {
  const routes = resolveFeedbackRoutes(routeOverrides);
  const resolvedMessages = mergeFeedbackMessages(messages);
  const resolvedTheme = mergeFeedbackTheme(theme);
  const colors = {
    primaryColor,
    primaryForeground,
    backgroundColor,
    surfaceColor,
    inputColor,
    textColor,
    mutedColor,
    borderColor,
    dangerColor,
  };
  const background = backgroundColor ?? resolvedTheme.colors.background;
  const boardTitle =
    enabledKinds.length === 1
      ? resolvedMessages.kindsPlural[enabledKinds.at(0)!]
      : resolvedMessages.board.title;
  const defaults: NativeStackNavigationOptions = {
    headerShown: true,
    headerBackButtonDisplayMode: "minimal",
    headerTintColor: textColor ?? resolvedTheme.colors.text,
    contentStyle: { backgroundColor: background },
  };

  return (
    <FeedbackProvider messages={messages} theme={theme} unstyled={unstyled}>
      <FeedbackBodyProvider
        hooks={hooks}
        entrySort={entrySort}
        commentSort={commentSort}
        enabledKinds={enabledKinds}
        maxCommentDepth={maxCommentDepth}
        debounceDuration={debounceDuration}
        collectMetadata={collectMetadata}
        emptyState={emptyState}
        loading={loading}
        collectStandardMetadata={collectExpoMetadata}
        transformComments={transformComments}
        renderActor={renderActor}
        onUnauthenticated={onUnauthenticated}
      >
        <RoutedFeedbackProvider
          value={{
            routes,
            colors,
            androidToolbarIcons,
            bottomToolbarWrapper: BottomToolbarWrapper,
          }}
        >
          <Stack>
            <Stack.Screen
              name={routes.board}
              options={{
                ...defaults,
                headerTitle: boardTitle,
                headerTransparent: true,
                headerShadowVisible: true,
                ...screenOptions,
                ...boardOptions,
              }}
            />
            <Stack.Screen
              name={routes.entry}
              options={{
                ...defaults,
                headerTitle: boardTitle,
                ...screenOptions,
                ...entryOptions,
              }}
            />
            <Stack.Screen
              name={routes.edit}
              options={{
                ...defaults,
                headerTitle: resolvedMessages.form.editTitle,
                presentation: Platform.OS === "ios" ? "formSheet" : "modal",
                sheetAllowedDetents: [0.6, 1.0],
                ...screenOptions,
                ...editOptions,
              }}
            />
            <Stack.Screen
              name={routes.create}
              options={{
                ...defaults,
                headerShown: false,
                presentation: "modal",
                ...screenOptions,
                ...createOptions,
              }}
            />
          </Stack>
        </RoutedFeedbackProvider>
      </FeedbackBodyProvider>
    </FeedbackProvider>
  );
}