-
Notifications
You must be signed in to change notification settings - Fork 37
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* make_parts_page * formatting fixes * shows owner email instead of id * fix bg where user is created twice * view your robots page * view your parts * part ids too * formatting * commutativity strikes again move catchall to end --------- Co-authored-by: Isaac Light <[email protected]>
- Loading branch information
1 parent
6b8c7d1
commit d40eb7d
Showing
16 changed files
with
490 additions
and
10 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,130 @@ | ||
| import { api, Image, Part } from "hooks/api"; | ||
| import { useAuthentication } from "hooks/auth"; | ||
| import React, { ChangeEvent, FormEvent, useState } from "react"; | ||
| import { Button, Col, Form, Row } from "react-bootstrap"; | ||
|
|
||
| const PartForm: React.FC = () => { | ||
| const auth = useAuthentication(); | ||
| const auth_api = new api(auth.api); | ||
| const [message, setMessage] = useState<string | null>(null); | ||
| const [part_name, setName] = useState<string>(""); | ||
| const [part_description, setDescription] = useState<string>(""); | ||
| const [part_images, setImages] = useState<Image[]>([]); | ||
|
|
||
| const handleImageChange = ( | ||
| index: number, | ||
| e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>, | ||
| ) => { | ||
| const { name, value } = e.target; | ||
| const newImages = [...part_images]; | ||
| newImages[index][name as keyof Image] = value; | ||
| setImages(newImages); | ||
| }; | ||
|
|
||
| const handleAddImage = () => { | ||
| setImages([...part_images, { url: "", caption: "" }]); | ||
| }; | ||
|
|
||
| const handleRemoveImage = (index: number) => { | ||
| const newImages = part_images.filter((_, i) => i !== index); | ||
| setImages(newImages); | ||
| }; | ||
|
|
||
| const handleSubmit = async (event: FormEvent<HTMLFormElement>) => { | ||
| event.preventDefault(); | ||
| if (part_images.length === 0) { | ||
| setMessage("Please upload at least one image."); | ||
| return; | ||
| } | ||
| const newFormData: Part = { | ||
| part_id: "", | ||
| part_name: part_name, | ||
| description: part_description, | ||
| owner: "Bob", | ||
| images: part_images, | ||
| }; | ||
| try { | ||
| await auth_api.addPart(newFormData); | ||
| setMessage(`Part added successfully.`); | ||
| } catch (error) { | ||
| setMessage("Error adding Part "); | ||
| } | ||
| }; | ||
|
|
||
| return ( | ||
| <Row> | ||
| <h2>Add a New Part</h2> | ||
| {message && <p>{message}</p>} | ||
| <Form onSubmit={handleSubmit} className="mb-3"> | ||
| Name: | ||
| <Form.Control | ||
| className="mb-3" | ||
| type="text" | ||
| placeholder="Part Name:" | ||
| onChange={(e) => { | ||
| setName(e.target.value); | ||
| }} | ||
| value={part_name} | ||
| required | ||
| /> | ||
| Description: | ||
| <Form.Control | ||
| className="mb-3" | ||
| type="text" | ||
| placeholder="Part Description:" | ||
| onChange={(e) => { | ||
| setDescription(e.target.value); | ||
| }} | ||
| value={part_description} | ||
| required | ||
| /> | ||
| Images: | ||
| {part_images.map((image, index) => ( | ||
| <Row key={index} className="mb-3"> | ||
| <Col md={12}> | ||
| <Form.Control | ||
| className="mb-1" | ||
| type="text" | ||
| placeholder="Image URL" | ||
| name="url" | ||
| value={image.url} | ||
| onChange={(e) => handleImageChange(index, e)} | ||
| required | ||
| /> | ||
| <Form.Control | ||
| className="mb-1" | ||
| type="text" | ||
| placeholder="Image Caption" | ||
| name="caption" | ||
| value={image.caption} | ||
| onChange={(e) => handleImageChange(index, e)} | ||
| required | ||
| /> | ||
| </Col> | ||
| <Col md={12}> | ||
| <Button | ||
| className="mb-3" | ||
| size="sm" | ||
| variant="danger" | ||
| onClick={() => handleRemoveImage(index)} | ||
| > | ||
| Remove | ||
| </Button> | ||
| </Col> | ||
| </Row> | ||
| ))} | ||
| <Col md={6}> | ||
| <Button className="mb-3" variant="primary" onClick={handleAddImage}> | ||
| Add Image | ||
| </Button> | ||
| </Col> | ||
| Submit: | ||
| <Col md={6}> | ||
| <Button type="submit">Add Part!</Button> | ||
| </Col> | ||
| </Form> | ||
| </Row> | ||
| ); | ||
| }; | ||
|
|
||
| export default PartForm; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.