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…
	
	Add table
		Add a link
		
	
		Reference in a new issue
	
	 dDogge
						dDogge