74 lines
2 KiB
TypeScript
74 lines
2 KiB
TypeScript
import { StatusBar } from "expo-status-bar";
|
|
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";
|
|
import { NewPostContainer } from "./src/components/NewPostContainer";
|
|
import { NativeStackNavigationProp } from "@react-navigation/native-stack";
|
|
|
|
/**
|
|
* RootStackParamList defines the possible screens in the app.
|
|
* @typedef {object} RootStackParamList
|
|
* @property {undefined} Home - Home screen.
|
|
* @property {undefined} New - New post screen.
|
|
*/
|
|
|
|
type RootStackParamList = {
|
|
Home: undefined;
|
|
New: undefined;
|
|
};
|
|
|
|
/**
|
|
* HomeScreenNavigationProp represents the navigation prop for the Home screen.
|
|
* @typedef {object} HomeScreenNavigationProp
|
|
* @property {Function} navigate - Function to navigate to a different screen.
|
|
*/
|
|
|
|
export type HomeScreenNavigationProp = NativeStackNavigationProp<
|
|
RootStackParamList,
|
|
"Home"
|
|
>;
|
|
|
|
const Stack = createNativeStackNavigator();
|
|
|
|
/**
|
|
* App function represents the main application component.
|
|
* @returns {JSX.Element} - The rendered App component.
|
|
*/
|
|
export default function App(): JSX.Element {
|
|
return (
|
|
<>
|
|
{/* Sets the status bar style */}
|
|
<StatusBar style="light" />
|
|
|
|
{/* Navigation container for the app */}
|
|
<NavigationContainer>
|
|
{/* Stack navigator for different screens */}
|
|
<Stack.Navigator>
|
|
{/* Home screen */}
|
|
<Stack.Screen
|
|
name="Home"
|
|
component={PostsContainer}
|
|
options={options}
|
|
/>
|
|
|
|
{/* New post screen */}
|
|
<Stack.Screen
|
|
name="New"
|
|
options={options}
|
|
component={NewPostContainer}
|
|
/>
|
|
</Stack.Navigator>
|
|
</NavigationContainer>
|
|
</>
|
|
);
|
|
}
|
|
|
|
// Header options for the screens
|
|
const options = {
|
|
headerStyle: style.header,
|
|
headerTitleStyle: style.headerTitle,
|
|
headerTintColor: "#fff",
|
|
};
|
|
|