import React from "react";
import { createStackNavigator } from "@react-navigation/stack";

import { Palette } from "../styles";
import { Routes } from "./Routes";

import { BottomTabScreen } from "./BottomTab";

import Splash from "../screens/Splash";
import Onboarding from "../screens/Onboarding";
import Login from "../screens/Login";
import ForgotPassword from "../screens/ForgotPassword";

import Notifications from "../screens/Notifications";

import TermsOfUse from "../screens/TermsOfUse";
import PrivacyPolicy from "../screens/PrivacyPolicy";
import Writing from "../screens/Writing/Writing";
import WritingLyrics from "../screens/Writing/WritingLyrics";
import CreateLyricsWithAi from "../screens/Writing/CreateLyricsWithAi";
import Lyrics from "../screens/Writing/Lyrics";
import FinishedWriting from "../screens/Writing/FinishedWriting";
import Studio from "../screens/Studio/Studio";
import ComposeSong from "../screens/Studio/ComposeSong";
import Compose from "../screens/Studio/Compose";
import CustomizeVoice from "../screens/Studio/CustomizeVoice";
import SongReady from "../screens/Studio/SongReady";
import Regenerate from "../screens/Studio/Regenerate";
import PouchReady from "../screens/Studio/PouchReady";
import PhotoCover from "../screens/Studio/PhotoCover";
import AddPhotoCover from "../screens/Studio/AddPhotoCover";
import FinishCompose from "../screens/Studio/FinishCompose";
import Production from "../screens/Production/Production";
import ProductionOnboarding from "../screens/Production/ProductionOnboarding";

const screenOptions = {
  headerShown: false,
  cardOverlayEnabled: true,
  headerStyle: {
    backgroundColor: Palette.background,
  },
  headerTitleStyle: {},
  headerTitleAlign: "center",
  headerBackTitleVisible: false,
};

const MainStack = createStackNavigator();

const screens = [
  { name: Routes.Splash, component: Splash },
  { name: Routes.Onboarding, component: Onboarding },
  { name: Routes.Login, component: Login, title: "Connexion" },
  {
    name: Routes.ForgotPassword,
    component: ForgotPassword,
    title: "Mot de passe oublié",
  },
  {
    name: Routes.BottomTab,
    component: BottomTabScreen,
    options: { animationEnabled: false },
  },
  {
    name: Routes.Notifications,
    component: Notifications,
    title: "Notifications",
  },
  {
    name: Routes.TermsOfUse,
    component: TermsOfUse,
    title: "Conditions d'utilisation",
  },
  {
    name: Routes.PrivacyPolicy,
    component: PrivacyPolicy,
    title: "Politique de confidentialité",
  },
  {
    name: Routes.Writing,
    component: Writing,
  },
  {
    name: Routes.WritingLyrics,
    component: WritingLyrics,
  },
  {
    name: Routes.CreateLyricsWithAi,
    component: CreateLyricsWithAi,
  },
  {
    name: Routes.Lyrics,
    component: Lyrics,
  },
  {
    name: Routes.FinishedWriting,
    component: FinishedWriting,
  },
  {
    name: Routes.Studio,
    component: Studio,
  },
  {
    name: Routes.ComposeSong,
    component: ComposeSong,
  },
  {
    name: Routes.Compose,
    component: Compose,
  },
  {
    name: Routes.CustomizeVoice,
    component: CustomizeVoice,
  },
  {
    name: Routes.SongReady,
    component: SongReady,
  },
  {
    name: Routes.Regenerate,
    component: Regenerate,
  },
  {
    name: Routes.PouchReady,
    component: PouchReady,
  },
  {
    name: Routes.PhotoCover,
    component: PhotoCover,
  },
  {
    name: Routes.AddPhotoCover,
    component: AddPhotoCover,
  },
  {
    name: Routes.FinishCompose,
    component: FinishCompose,
  },
  {
    name: Routes.ProductionOnboarding,
    component: ProductionOnboarding,
  },
  {
    name: Routes.Production,
    component: Production,
  },
];

export default function Main() {
  return (
    <MainStack.Navigator
      initialRouteName={Routes.Splash}
      screenOptions={[
        {
          contentStyle: {
            backgroundColor: Palette.white,
          },
        },
        screenOptions,
      ]}
    >
      {screens.map((screen) => (
        <MainStack.Screen
          key={screen.name}
          name={screen.name}
          component={screen.component}
          title={screen.title}
          options={{ headerShown: false, ...screen.options }}
        />
      ))}
    </MainStack.Navigator>
  );
}
