diff --git a/src/App.tsx b/src/App.tsx index 5830a12..a074381 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,4 +1,4 @@ -import { Alert, Grow, Rating, Slide, Typography } from "@mui/material"; +import { Alert, Grow, Rating, Typography } from "@mui/material"; import "./App.css"; import ButtonRow, { ActionProps } from "./components/ButtonRow"; import ReviewField, { ReviewFieldProps } from "./components/ReviewField"; @@ -15,17 +15,17 @@ function App() { const fields: ReviewFieldProps[] = [ { name: "Name", - dynamicState: useState("") + dynamicState: useState(""), }, { name: "Title", - dynamicState: useState("") + dynamicState: useState(""), }, { name: "Content", dynamicState: useState(""), - expandable: true - } + expandable: true, + }, ]; const clearValues = () => { @@ -34,7 +34,7 @@ function App() { }); setNewRating(null); - } + }; const showThenHide = async () => { await fetch("http://localhost:8080/post", { @@ -43,65 +43,59 @@ function App() { rating: rating, username: fields[0].dynamicState[0], title: fields[1].dynamicState[0], - content: fields[2].dynamicState[0] + content: fields[2].dynamicState[0], + }), + }) + .then(async (response) => { + const result = await response.json(); + + changeInfoText( + result.error + ? `${result.error.type}: ${result.error.message}` + : `Success: ${result.message}`, + ); + + changeInfo(true); + + setTimeout(() => { + changeInfo(false); + }, 2000); }) - }) - .then(async (response) => { - const result = await response.json(); + .catch((err) => { + changeAlertText(err.toString()); - changeInfoText(result.error ? `${result.error.type}: ${result.error.message}` : `Success: ${result.message}`); + changeAlert(true); - changeInfo(true); - - setTimeout(() => { - changeInfo(false); - }, 2000); - }) - .catch((err) => { - changeAlertText(err.toString()); - - changeAlert(true); - - setTimeout(() => { - changeAlert(false); - }, 2500); - }); - } + setTimeout(() => { + changeAlert(false); + }, 2500); + }); + }; const buttons: ActionProps[] = [ { name: "Clear", type: "outlined", - action: clearValues + action: clearValues, }, { name: "Submit", type: "contained", - action: showThenHide + action: showThenHide, }, ]; - const info = ( - - {infoText} - - ); + const info = {infoText}; - const alert = ( - - {alertText} - - ); + const alert = {alertText}; return ( <> - - Simple Review Client - + Simple Review Client
- { return ( {buttons.map((button) => { - return ( -