Added comments to NewPostContainer

This commit is contained in:
dDogge 2023-12-15 12:07:24 +01:00
parent 39833cabf2
commit 7b01c9e69a

View file

@ -3,12 +3,30 @@ import { View, Text, TextInput, Button } from "react-native";
import { style } from "../util/style"; import { style } from "../util/style";
import { createPost, NewPost, submitLogin } from "../util/api"; import { createPost, NewPost, submitLogin } from "../util/api";
/**
* NewPostContainer component for handling new post creation.
*
* @component
* @param {object} props - React component props.
* @param {object} props.navigation - Navigation object for navigating between screens.
* @returns {JSX.Element} - Rendered NewPostContainer component.
*/
export function NewPostContainer({ navigation }): JSX.Element { export function NewPostContainer({ navigation }): JSX.Element {
/**
* State hook for managing the current input text.
* @type {[string, React.Dispatch<React.SetStateAction<string>>]}
*/
const [currentInput, setCurrentInput] = React.useState<string>(""); const [currentInput, setCurrentInput] = React.useState<string>("");
/**
* State hook for managing the current input error message.
* @type {[string, React.Dispatch<React.SetStateAction<string>>]}
*/
const [currentInputError, setCurrentInputError] = React.useState<string>(""); const [currentInputError, setCurrentInputError] = React.useState<string>("");
return ( return (
<View style={style.newPostContainer}> <View style={style.newPostContainer}>
{/* Input field for the new post */}
<TextInput <TextInput
style={style.newPostInput} style={style.newPostInput}
placeholder="New Post" placeholder="New Post"
@ -18,28 +36,50 @@ export function NewPostContainer({ navigation }): JSX.Element {
}} }}
value={currentInput} value={currentInput}
/> />
{/* Button to submit the new post */}
<Button <Button
title="Post" title="Post"
onPress={() => { onPress={() => {
/**
* Asynchronously submits the new post.
*
* @async
* @function
* @returns {Promise<void>} - A Promise that resolves when the post is successfully submitted.
*/
async function submit(): Promise<void> { async function submit(): Promise<void> {
// Submit login to obtain user token
const user = (await submitLogin("demouser", "demopw")) ?? { const user = (await submitLogin("demouser", "demopw")) ?? {
token: "", token: "",
}; };
const p: NewPost = {
// Create new post object
const newPost: NewPost = {
content: currentInput, content: currentInput,
token: user.token, token: user.token,
}; };
await createPost(p);
// Call API to create the post
await createPost(newPost);
// Reset the input field
setCurrentInput(""); setCurrentInput("");
} }
// Check if the input is not empty before submitting
if (currentInput.length > 0) { if (currentInput.length > 0) {
submit(); submit();
// Navigate to the Home screen after successful post submission
navigation.navigate("Home"); navigation.navigate("Home");
} else { } else {
// Set an error message if the input is empty
setCurrentInputError("Post must not be empty!"); setCurrentInputError("Post must not be empty!");
} }
}} }}
/> />
{/* Display error message if there's any */}
<Text style={style.errorText}>{currentInputError}</Text> <Text style={style.errorText}>{currentInputError}</Text>
</View> </View>
); );