import { StatusBar } from "expo-status-bar";
import { View } from "react-native";
import { style } from "./src/util/style";

import { PostsContainer } from "./src/components/PostsContainer";
import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";

const Stack = createNativeStackNavigator();

export default function App(): JSX.Element {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen
          name="Home"
          component={HomeScreen}
          options={{
            headerStyle: style.header,
            headerTitleStyle: style.headerTitle,
            headerTintColor: "#fff",
          }}
        />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

function HomeScreen(): JSX.Element {
  return (
    <View style={style.app}>
      <StatusBar style="light" />
      <PostsContainer />
    </View>
  );
}