web client v0.5

//notifications
//delete restaurant
//change picture
//redesigned data store

src/components/Dialogs/NewRestaurant.js

@@ -18,10 +18,11 @@ import ImageUpload from "../Input/ImageUpload";
 import validator from "validator";
 import { useHistory } from "react-router-dom";
 import InputGoogleMaps from "../Input/InputGoogleMaps";
-import InfoDialog from "../Output/InfoDialog";
 import { prepareTags } from "../../Services.js";
 import axios from "axios";
-import { useSelector } from "react-redux";
+import { useSelector, useDispatch } from "react-redux";
+import { notification, refreshUserData } from "../../actions";
+import { showBackdrop, hideBackdrop } from "../../actions/toggles.js";
 import InputWorkingHours from "../Input/InputWorkingHours";
 // ICONS
 import FastfoodIcon from "@material-ui/icons/Fastfood";
@@ -84,13 +85,14 @@ const useStyles = makeStyles((theme) => ({
 }));
 
 export default function NewRestaurant() {
+  const dispatch = useDispatch();
   const initialState = {
     name: "",
     city: "",
     adress: "",
     coordinates: [52.354293, 19.42377],
     placesId: "",
-    imgURL: "",
+    imgUrl: "",
     workingHours: {
       pn: "8:00 - 22:00",
       wt: "8:00 - 22:00",
@@ -113,12 +115,9 @@ export default function NewRestaurant() {
     adressError: false,
     descriptionError: false,
     charLeft: 400,
-    response: "Dodawanie lokalu, prosimy o chwilę cierpliwości...",
   };
   const steps = ["Informacje", "Zdjęcie", "Lokalizacja"];
   const [state, setState] = useState(initialState);
-  const [open, setOpen] = useState(true);
-  const [loading, setLoading] = useState(true);
   const [activeStep, setActiveStep] = React.useState(0);
   const styles = useStyles();
   const availableTags = [
@@ -131,7 +130,7 @@ export default function NewRestaurant() {
     "Dowozimy",
   ];
   const history = useHistory();
-  const token = useSelector((state) => state.data.jwt);
+  const token = useSelector((state) => state.data.userData.jwt);
 
   // HANDLERS
 
@@ -143,7 +142,7 @@ export default function NewRestaurant() {
       adress: state.adress,
       coordinates: state.coordinates,
       placesId: state.placesId,
-      imgURL: state.imgURL,
+      imgUrl: state.imgUrl,
       workingHours: state.workingHours,
       description: state.description,
       tags: formattedTags,
@@ -151,7 +150,7 @@ export default function NewRestaurant() {
       phone: state.phone,
       hidden: false,
     };
-    setOpen(false);
+    dispatch(showBackdrop());
     axios({
       url: "http://localhost:4000/restaurant",
       method: "POST",
@@ -161,26 +160,26 @@ export default function NewRestaurant() {
       },
     })
       .then((response) => {
-        setLoading(false);
-        setState({
-          ...state,
-          response:
+        dispatch(hideBackdrop());
+        dispatch(
+          notification(
             "Lokal został dodany, aktywuj subskrypcję, aby był widoczny w wynikach wyszukiwania.",
-        });
-        setTimeout(() => {
-          history.push("/");
-        }, 5000);
+            "success"
+          )
+        );
+        dispatch(refreshUserData(token));
+        history.push("/");
       })
       .catch((error) => {
-        setLoading(false);
-        setState({
-          ...state,
-          response:
+        dispatch(hideBackdrop());
+        console.log(error);
+        dispatch(
+          notification(
             "Wystąpił nieoczekiwany błąd, przepraszamy za utrudnienia. Spróbuj ponownie za chwilę.",
-        });
-        setTimeout(() => {
-          history.push("/");
-        }, 5000);
+            "error"
+          )
+        );
+        history.push("/");
       });
   };
 
@@ -200,7 +199,7 @@ export default function NewRestaurant() {
         }
         break;
       case 1:
-        if (!validator.isEmpty(state.imgURL)) {
+        if (!validator.isEmpty(state.imgUrl)) {
           setActiveStep(2);
         }
         break;
@@ -213,7 +212,7 @@ export default function NewRestaurant() {
   };
 
   const handleImageUploaded = (link) => {
-    setState({ ...state, imgURL: link });
+    setState({ ...state, imgUrl: link });
   };
 
   const handleDescriptionChange = (event) => {
@@ -256,16 +255,9 @@ export default function NewRestaurant() {
 
   return (
     <div>
-      {!open && (
-        <InfoDialog
-          title={"Dodawanie lokalu"}
-          text={state.response}
-          loading={loading}
-        />
-      )}
       <Dialog
         className={styles.root}
-        open={open}
+        open={true}
         aria-labelledby="newRestaurant-title"
       >
         <DialogTitle id="newRestaurant-title">Dodaj Lokal</DialogTitle>
@@ -469,7 +461,7 @@ export default function NewRestaurant() {
             <Paper>
               <h4>Dodaj zdjęcie lokalu.</h4>
               <ImageUpload
-                img={state.imgURL}
+                img={state.imgUrl}
                 onUpload={(link) => handleImageUploaded(link)}
               />
             </Paper>