Add AuthContext to FormReview and adjust image detail
This commit is contained in:
parent
b7e62e580a
commit
642aad60af
|
@ -1,29 +1,39 @@
|
||||||
import Form from "react-bootstrap/Form"
|
import Form from "react-bootstrap/Form"
|
||||||
import Button from "react-bootstrap/Button"
|
import Button from "react-bootstrap/Button"
|
||||||
|
|
||||||
|
import { AuthContext } from "../contexts/AuthContext"
|
||||||
|
import { useContext } from "react"
|
||||||
|
|
||||||
|
|
||||||
export function ReviewForm(props) {
|
export function ReviewForm(props) {
|
||||||
return (
|
const auth = useContext(AuthContext)
|
||||||
<Form>
|
if (auth) {
|
||||||
<h3>Rewiew this movie</h3>
|
return (
|
||||||
<Form.Group>
|
<Form>
|
||||||
<Form.Label>Star</Form.Label>
|
<h3>Review this movie</h3>
|
||||||
<Form.Select>
|
<Form.Group>
|
||||||
<option value="1">1</option>
|
<Form.Label>Star</Form.Label>
|
||||||
<option value="2">2</option>
|
<Form.Select>
|
||||||
<option value="3">3</option>
|
<option value="1">1</option>
|
||||||
<option value="4">4</option>
|
<option value="2">2</option>
|
||||||
<option value="5">5</option>
|
<option value="3">3</option>
|
||||||
</Form.Select>
|
<option value="4">4</option>
|
||||||
</Form.Group>
|
<option value="5">5</option>
|
||||||
<Form.Group>
|
</Form.Select>
|
||||||
<Form.Label>Title</Form.Label>
|
</Form.Group>
|
||||||
<Form.Control type="text" placeholder="I love this movie" />
|
<Form.Group>
|
||||||
</Form.Group>
|
<Form.Label>Title</Form.Label>
|
||||||
<Form.Group>
|
<Form.Control type="text" placeholder="I love this movie" />
|
||||||
<Form.Label>Review</Form.Label>
|
</Form.Group>
|
||||||
<Form.Control as="textarea" rows={4} cols={30} placeholder="I could not stop watching!" />
|
<Form.Group>
|
||||||
</Form.Group>
|
<Form.Label>Review</Form.Label>
|
||||||
<Button type="submit" variant="primary">Submit</Button>
|
<Form.Control as="textarea" rows={4} cols={30} placeholder="I could not stop watching!" />
|
||||||
</Form>
|
</Form.Group>
|
||||||
)
|
<Button type="submit" variant="primary">Submit</Button>
|
||||||
}
|
</Form>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -27,10 +27,10 @@ export function Detail(props) {
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
<Row>
|
<Row>
|
||||||
<Col md={6}>
|
<Col md={4}>
|
||||||
<ItemImage source={movieData.cover_image} />
|
<ItemImage source={movieData.cover_image} />
|
||||||
</Col>
|
</Col>
|
||||||
<Col md={6}>
|
<Col md={8}>
|
||||||
<h2>More Information</h2>
|
<h2>More Information</h2>
|
||||||
<h3>Synopsis</h3>
|
<h3>Synopsis</h3>
|
||||||
<p>{movieData.synopsis}</p>
|
<p>{movieData.synopsis}</p>
|
||||||
|
@ -55,6 +55,6 @@ export function Detail(props) {
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
return null;
|
return null;
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
Loading…
Reference in New Issue