From c67f88130584519578cedc3a131270f1c29ae607 Mon Sep 17 00:00:00 2001 From: "Rayyan (Rayy)" Date: Tue, 28 Nov 2023 08:47:12 +0000 Subject: [PATCH] Final finishing touches on Firestore Component --- src/components/ReviewForm.js | 32 ++++++++++++++++++++++++++------ 1 file changed, 26 insertions(+), 6 deletions(-) diff --git a/src/components/ReviewForm.js b/src/components/ReviewForm.js index 8361189..5b370e3 100644 --- a/src/components/ReviewForm.js +++ b/src/components/ReviewForm.js @@ -3,20 +3,35 @@ import Button from "react-bootstrap/Button" import { AuthContext } from "../contexts/AuthContext" import { FSContext } from "../contexts/FSContext" -import { useContext, useState } from "react" +import { useContext, useState, useEffect } from "react" import { collection, addDoc } from "firebase/firestore"; -const submitHandler = (event) => { +const submitHandler = async (event) => { event.preventDefault() +const userReview = {title: title, star: star, body: review } +const col = collection(db, `movies/${props.movieId}/reviews`) +const ref = await addDoc(col, userReview ) +console.log( ref ) } export function ReviewForm(props) { const auth = useContext(AuthContext) const db = useContext(FSContext) - const[star, setStar ] = useState() - const[title, setTitle ] = useState() - const[review, setReview ] = useState() + const[star, setStar ] = useState(5) + const[title, setTitle ] = useState('') + const[review, setReview ] = useState('') + const[valid, setValid] = useState(false) + + useEffect(() => { + if( title.length > 4 && review.length > 4 ) { + setValid( true ) + } + else { + setValid( false ) + } + }, [star, title, review]) + if (auth) { return (
@@ -56,7 +71,12 @@ export function ReviewForm(props) { onChange={(evt) => setReview(evt.target.value) } /> -