Added comments to NewPostContainer
This commit is contained in:
parent
39833cabf2
commit
7b01c9e69a
1 changed files with 42 additions and 2 deletions
|
@ -3,12 +3,30 @@ import { View, Text, TextInput, Button } from "react-native";
|
|||
import { style } from "../util/style";
|
||||
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 {
|
||||
/**
|
||||
* State hook for managing the current input text.
|
||||
* @type {[string, React.Dispatch<React.SetStateAction<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>("");
|
||||
|
||||
return (
|
||||
<View style={style.newPostContainer}>
|
||||
{/* Input field for the new post */}
|
||||
<TextInput
|
||||
style={style.newPostInput}
|
||||
placeholder="New Post"
|
||||
|
@ -18,28 +36,50 @@ export function NewPostContainer({ navigation }): JSX.Element {
|
|||
}}
|
||||
value={currentInput}
|
||||
/>
|
||||
|
||||
{/* Button to submit the new post */}
|
||||
<Button
|
||||
title="Post"
|
||||
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> {
|
||||
// Submit login to obtain user token
|
||||
const user = (await submitLogin("demouser", "demopw")) ?? {
|
||||
token: "",
|
||||
};
|
||||
const p: NewPost = {
|
||||
|
||||
// Create new post object
|
||||
const newPost: NewPost = {
|
||||
content: currentInput,
|
||||
token: user.token,
|
||||
};
|
||||
await createPost(p);
|
||||
|
||||
// Call API to create the post
|
||||
await createPost(newPost);
|
||||
|
||||
// Reset the input field
|
||||
setCurrentInput("");
|
||||
}
|
||||
|
||||
// Check if the input is not empty before submitting
|
||||
if (currentInput.length > 0) {
|
||||
submit();
|
||||
// Navigate to the Home screen after successful post submission
|
||||
navigation.navigate("Home");
|
||||
} else {
|
||||
// Set an error message if the input is empty
|
||||
setCurrentInputError("Post must not be empty!");
|
||||
}
|
||||
}}
|
||||
/>
|
||||
|
||||
{/* Display error message if there's any */}
|
||||
<Text style={style.errorText}>{currentInputError}</Text>
|
||||
</View>
|
||||
);
|
||||
|
|
Loading…
Reference in a new issue