import 'react-native-gesture-handler';
import React from "react";
import { StyleSheet, useWindowDimensions } from "react-native";
import { NavigationContainer } from "@react-navigation/native";
import { PaperProvider, Text } from "react-native-paper";
import { BottomNavigation } from "./src/BottomNavigation";
import { DrawerNavigation } from "./src/DrawerNavigation";

const linking = {
  prefixes: [
    /* your linking prefixes */
    "musclecat://",
    "https://musclecat.pi.korz.tech",
    "https://musclecat.pi4.korz.tech",
  ],
  config: {
    /* configuration for matching screens with paths */
    screens: {
      Home: {
        screens: {
          List: "lists/:listId?",
          Task: "tasks/:taskId"
        }
      },
      Notifications: "notifications",
      Profile: "profile",
    },
  },
};

export default function App() {
  const dimensions = useWindowDimensions();
  //const NavigationComponent = dimensions.width < 700 ? BottomNavigation : DrawerNavigation;

  return (
    <NavigationContainer linking={linking} fallback={<Text>Loading...</Text>}>
      <PaperProvider>
        <BottomNavigation />
      </PaperProvider>
    </NavigationContainer>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center",
  },
});