/* eslint-disable import/no-named-default */
/* eslint-disable react/destructuring-assignment */
/* eslint-disable react/jsx-props-no-spreading */
import * as React from "react";
import * as eva from "@eva-design/eva";
import {
  ApplicationProvider,
  Layout,
  IconRegistry,
} from "@ui-kitten/components";
import { Provider } from "@ant-design/react-native";
import { ThemeProvider } from "react-native-magnus";
import { EvaIconsPack } from "@ui-kitten/eva-icons";
import { SplashScreen } from "expo";
import * as Font from "expo-font";
import { Ionicons } from "@expo/vector-icons";
import { NavigationContainer, CommonActions } from "@react-navigation/native";
import {
  createStackNavigator,
  CardStyleInterpolators,
} from "@react-navigation/stack";
import { useModel } from "flooks";
import { useUpdateEffect, useMount } from "@umijs/hooks";
// import { enableScreens } from "react-native-screens";
// eslint-disable-next-line no-unused-vars
import * as model from "./models";
import { default as theme } from "./theme.json"; // <-- Import app theme
import { default as customMapping } from "./mapping.json"; // <-- Import app theme
import Matheme from "./constants/Theme";
import Dialog from "./components/Dialog";

import BottomTabNavigator from "./navigation/BottomTabNavigator";
import LoginStackNavigator from "./navigation/LoginStackNavigator";
import GuideScreens from "./navigation/GuideStackNavigator";
import BasicScreens from "./navigation/BasicNavigator";
import { navigationRef } from "./navigation/RootNavigation";

// enableScreens();

const Stack = createStackNavigator();

const fontFile = require("./assets/fonts/SpaceMono-Regular.ttf");

export default function App(props) {
  const [isLoadingComplete, setLoadingComplete] = React.useState(false);
  const { getWords, local } = useModel("wordsModel");
  const { clearLoading } = useModel("loadingModel", true);
  const {
    mid,
    guideStep,
    getUserInfo,
    checkNowGuideStep,
    setinitRoute,
  } = useModel("userModel");

  useMount(() => {
    SplashScreen.preventAutoHide();
    Font.loadAsync({
      ...Ionicons.font,
      "space-mono": fontFile,
    })
      .then(() => {
        return Font.loadAsync(
          "antoutline",
          // eslint-disable-next-line
          require("@ant-design/icons-react-native/fonts/antoutline.ttf")
        );
      })
      .then(() => {
        return Font.loadAsync(
          "antfill",
          // eslint-disable-next-line
          require("@ant-design/icons-react-native/fonts/antfill.ttf")
        );
      })
      .then(() => {
        return getUserInfo();
      })
      .catch(e => {
        console.log(e);
      });
    //   .finally(() => {
    //     setLoadingComplete(true);
    //     SplashScreen.hide();
    //   });
  });

  React.useEffect(() => {
    getWords();
  }, [local]);

  const [initRouteName, setInit] = React.useState("");

  useUpdateEffect(() => {
    if (mid === 0) {
      // 未登录
      setinitRoute("Login");
      setInit("Login");
    }
    // else if (__DEV__) {
    //   setInit("GoodsDetailMore");
    // }
    else if (mid !== 0) {
      checkNowGuideStep();
    }
  }, [mid]);

  useUpdateEffect(() => {
    console.log(guideStep);
    switch (guideStep) {
      case "finish":
        setInit("Root");
        break;
      case "ComeBack":
        setinitRoute("RegisterSe");
        setInit("Login");
        break;
      case "1":
        setInit("Guide1");
        break;
      case "2":
        setInit("Guide2");
        break;
      case "3":
        setInit("Guide3");
        break;
      case "4":
        setInit("Guide4");
        break;
      case "5":
        setInit("StoreAudit");
        break;
      default:
        setInit("Login");
        break;
    }
  }, [guideStep]);

  useUpdateEffect(() => {
    if (!isLoadingComplete) {
      setLoadingComplete(true);
      SplashScreen.hide();
    } else {
      navigationRef.current.dispatch(
        CommonActions.reset({
          index: 0,
          routes: [
            {
              name: initRouteName,
            },
          ],
        })
      );
      clearLoading();
    }
  }, [initRouteName]);

  if (!isLoadingComplete && !props.skipLoadingScreen && !initRouteName) {
    return null;
  }

  return (
    <>
      <IconRegistry icons={EvaIconsPack} />
      <ThemeProvider theme={Matheme}>
        <Provider>
          <ApplicationProvider
            {...eva}
            theme={{ ...eva.light, ...theme }}
            customMapping={customMapping}
          >
            <Dialog />
            <Layout style={{ flex: 1 }}>
              <NavigationContainer ref={navigationRef}>
                <Stack.Navigator
                  headerMode="none"
                  screenOptions={{
                    gestureEnabled: true,
                    cardStyleInterpolator:
                      CardStyleInterpolators.forHorizontalIOS,
                  }}
                  initialRouteName={initRouteName}
                >
                  {GuideScreens(Stack.Screen)}

                  <Stack.Screen
                    name="Root"
                    component={BottomTabNavigator}
                    options={{}}
                  />

                  <Stack.Screen name="Login" component={LoginStackNavigator} />

                  {/* 基础功能页面 */}
                  {BasicScreens(Stack.Screen)}
                </Stack.Navigator>
              </NavigationContainer>
            </Layout>
          </ApplicationProvider>
        </Provider>
      </ThemeProvider>
    </>
  );
}