Move Review form to seperate component

This commit is contained in:
Ray 2023-11-21 09:31:43 +00:00 committed by GitHub
parent 091d00caf7
commit b7e62e580a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 29 additions and 26 deletions

View File

@ -0,0 +1,29 @@
import Form from "react-bootstrap/Form"
import Button from "react-bootstrap/Button"
export function ReviewForm(props) {
return (
<Form>
<h3>Rewiew this movie</h3>
<Form.Group>
<Form.Label>Star</Form.Label>
<Form.Select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</Form.Select>
</Form.Group>
<Form.Group>
<Form.Label>Title</Form.Label>
<Form.Control type="text" placeholder="I love this movie" />
</Form.Group>
<Form.Group>
<Form.Label>Review</Form.Label>
<Form.Control as="textarea" rows={4} cols={30} placeholder="I could not stop watching!" />
</Form.Group>
<Button type="submit" variant="primary">Submit</Button>
</Form>
)
}

View File

@ -45,32 +45,6 @@ export function Detail(props) {
<p>{movieData.genre}</p> <p>{movieData.genre}</p>
<h3>IMDB Link</h3> <h3>IMDB Link</h3>
<p>{movieData.imdb_link}</p> <p>{movieData.imdb_link}</p>
<Form>
<h3>Review this movie</h3>
<Form.Group>
<Form.Label>Star Rating</Form.Label>
<Form.Select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</Form.Select>
</Form.Group>
<Form.Group>
<Form.Label>Title</Form.Label>
<Form.Control type="text" placeholder="Best movie in ages!" />
</Form.Group>
<Form.Group>
<Form.Label>Review</Form.Label>
<Form.Control as="textarea" rows={4} cols={30} placeholder="This movie had me hooked!" />
</Form.Group>
<Button type="submit" variant="primary">Submit</Button>
<Form.Group>
<h3>Existing reviews of this book</h3>
<p>To be added</p>
</Form.Group>
</Form>
</Col> </Col>
</Row> </Row>
<Row> <Row>