web client v0.5

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

src/components/Input/ImageUpload.js

@@ -4,14 +4,14 @@ import { useSelector } from "react-redux";
 import axios from "axios";
 
 export default function ImageUpload(props) {
-  const [imagePreviewURL, setPreviewURL] = useState(props.img);
-  let showCircle = false;
+  const { img } = props;
+  const [loading, setLoading] = useState(false);
   const token = useSelector((state) => state.data.userData.jwt);
 
   const handleInputChange = (event) => {
     let data = new FormData();
     data.append("menuiImage", event.target.files[0]);
-
+    setLoading(true);
     axios({
       url: "http://localhost:4000/img",
       method: "POST",
@@ -23,24 +23,25 @@ export default function ImageUpload(props) {
       },
     })
       .then((response) => {
-        setPreviewURL(response.data.imgURL);
         props.onUpload(response.data.imgURL);
+        setLoading(false);
       })
       .catch((error) => {
         console.log("Wystąpił błąd podczas wgrywania pliku.");
+        setLoading(false);
       });
   };
 
   let imagePreview = (
     <div className="image-preview">
-      {showCircle ? <CircularProgress /> : "Proszę wybrać obraz. (max. 2MB)"}
+      {loading ? <CircularProgress /> : "Proszę wybrać obraz. (max. 2MB)"}
     </div>
   );
-  if (imagePreviewURL) {
+  if (img) {
     imagePreview = (
       <div
         className="image-preview"
-        style={{ backgroundImage: `url(${imagePreviewURL})` }}
+        style={{ backgroundImage: `url(${img})` }}
       ></div>
     );
   }