added lunch hours | added restaurant type

src/components/Dialogs/NewRestaurant.js

@@ -24,6 +24,7 @@ import { useSelector, useDispatch } from "react-redux";
 import { notification, refreshUserData } from "../../actions";
 import { showBackdrop, hideBackdrop } from "../../actions/toggles.js";
 import InputWorkingHours from "../Input/InputWorkingHours";
+import InputWorkingHoursSingle from "../Input/InputWorkingHoursSingle";
 import { backend } from "../../config";
 // ICONS
 import FastfoodIcon from "@material-ui/icons/Fastfood";
@@ -96,6 +97,7 @@ export default function NewRestaurant() {
     adress: "",
     coordinates: [52.354293, 19.42377],
     placesId: "",
+    type: "",
     imgUrl: "",
     workingHours: {
       pn: "8:00 - 22:00",
@@ -106,6 +108,7 @@ export default function NewRestaurant() {
       sb: "8:00 - 22:00",
       nd: "8:00 - 22:00",
     },
+    lunchHours: "12:30 - 13:30",
     description: "",
     tags: [],
     phone: "",
@@ -118,6 +121,7 @@ export default function NewRestaurant() {
     cityError: false,
     adressError: false,
     descriptionError: false,
+    typeError: false,
     charLeft: 400,
   };
   const steps = ["Informacje", "Zdjęcie", "Lokalizacja"];
@@ -146,6 +150,8 @@ export default function NewRestaurant() {
       adress: state.adress,
       coordinates: state.coordinates,
       placesId: state.placesId,
+      lunchHours: state.lunchHours,
+      type: state.type,
       imgUrl: state.imgUrl,
       workingHours: state.workingHours,
       description: state.description,
@@ -187,6 +193,10 @@ export default function NewRestaurant() {
       });
   };
 
+  const setLunchHours = (hours) => {
+    setState({ ...state, lunchHours: hours });
+  }
+
   const setCoordinatesAndPlacesID = (coordinates, placesID) => {
     if (!placesID) {
       setState({ ...state, coordinates: coordinates });
@@ -234,6 +244,7 @@ export default function NewRestaurant() {
       nameValid: validator.isLength(state.name, { min: 1, max: 40 }),
       cityValid: validator.isLength(state.city, { min: 1, max: 40 }),
       adressValid: validator.isLength(state.name, { min: 1, max: 40 }),
+      typeValid: validator.isLength(state.type, { min: 1, max: 40 }),
       descriptionValid: validator.isLength(state.description, {
         min: 1,
         max: 400,
@@ -243,6 +254,7 @@ export default function NewRestaurant() {
       ...state,
       nameError: !validation.nameValid,
       cityError: !validation.cityValid,
+      typeError: !validation.typeValid,
       adressError: !validation.adressValid,
       descriptionError: !validation.descriptionValid,
     });
@@ -251,7 +263,8 @@ export default function NewRestaurant() {
       validation.nameValid &&
       validation.cityValid &&
       validation.adressValid &&
-      validation.descriptionValid
+      validation.descriptionValid &&
+      validation.typeValid
     );
   };
 
@@ -292,6 +305,7 @@ export default function NewRestaurant() {
                   error={state.nameError}
                   value={state.name}
                   label="Nazwa lokalu"
+                  placeholder="np. Pierożek"
                   variant="outlined"
                   onChange={(event) =>
                     setState({ ...state, name: event.target.value })
@@ -305,11 +319,33 @@ export default function NewRestaurant() {
                   }}
                 />
               </div>
+              <div className="newRestaurant-content-fullwidth">
+                <TextField
+                  className={styles.textInputFullWidth}
+                  fullWidth
+                  value={state.type}
+                  error={state.typeError}
+                  label="Kuchnia"
+                  placeholder="np. Meksykańska"
+                  variant="outlined"
+                  onChange={(event) =>
+                    setState({ ...state, type: event.target.value })
+                  }
+                  InputProps={{
+                    startAdornment: (
+                      <InputAdornment position="start">
+                        <FastfoodIcon color="primary" />
+                      </InputAdornment>
+                    ),
+                  }}
+                />
+              </div>
               <div className="newRestaurant-content">
                 <TextField
                   className={styles.textInput}
                   required
                   label="Miasto"
+                  placeholder="np. Ciechanów"
                   error={state.cityError}
                   value={state.city}
                   variant="outlined"
@@ -328,6 +364,7 @@ export default function NewRestaurant() {
                   className={styles.textInput}
                   required
                   label="Adres"
+                  placeholder="np. Akacjowa 13"
                   variant="outlined"
                   error={state.adressError}
                   value={state.adress}
@@ -348,6 +385,10 @@ export default function NewRestaurant() {
                     setState({ ...state, workingHours: hours })
                   }
                 />
+                 <div className="newRestaurant-content-fullwidth">
+                 <div className="workingHours-container" style={{ marginTop: 14 }}>
+                <InputWorkingHoursSingle nieczynne={!state.lunchHours} hours={state.lunchHours} changeValue={(value) => setLunchHours(value)} day="Lunch hours" /></div>
+              </div>
                 <div className="newRestaurant-content-fullwidth">
                   <TextField
                     className={styles.textInputFullWidth}

src/components/EditRestaurant/EditRestaurantInfo.js

@@ -13,6 +13,7 @@ import InstagramIcon from "@material-ui/icons/Instagram";
 import LanguageIcon from "@material-ui/icons/Language";
 import FastfoodIcon from "@material-ui/icons/Fastfood";
 import LocationCityIcon from "@material-ui/icons/LocationCity";
+import InputWorkingHoursSingle from "../Input/InputWorkingHoursSingle";
 import Divider from "@material-ui/core/Divider";
 import Link from "@material-ui/core/Link";
 import { decodeTags } from "../../Services";
@@ -65,6 +66,7 @@ export default function EditRestaurantInfo(props) {
     city: props.restaurant.city,
     adress: props.restaurant.adress,
     description: props.restaurant.description,
+    type: props.restaurant.type,
     phone: props.restaurant.phone,
     hidden: props.restaurant.hidden,
     links: props.restaurant.links,
@@ -76,6 +78,7 @@ export default function EditRestaurantInfo(props) {
     cityError: false,
     adressError: false,
     descriptionError: false,
+    typeError: false
   };
   const [state, setState] = useState(initialState);
   const [passwordDialog, setPasswordDialog] = useState(false);
@@ -102,6 +105,7 @@ export default function EditRestaurantInfo(props) {
     const validation = {
       nameValid: validator.isLength(state.name, { min: 1, max: 40 }),
       cityValid: validator.isLength(state.city, { min: 1, max: 40 }),
+      typeValid: validator.isLength(state.type, { min: 1, max: 40 }),
       adressValid: validator.isLength(state.name, { min: 1, max: 40 }),
       descriptionValid: validator.isLength(state.description, {
         min: 1,
@@ -113,6 +117,7 @@ export default function EditRestaurantInfo(props) {
       nameError: !validation.nameValid,
       cityError: !validation.cityValid,
       adressError: !validation.adressValid,
+      typeError: !validation.typeValid,
       descriptionError: !validation.descriptionValid,
     });
 
@@ -120,7 +125,8 @@ export default function EditRestaurantInfo(props) {
       validation.nameValid &&
       validation.cityValid &&
       validation.adressValid &&
-      validation.descriptionValid
+      validation.descriptionValid &&
+      validation.typeValid
     );
   };
 
@@ -154,6 +160,10 @@ export default function EditRestaurantInfo(props) {
       });
   };
 
+  const setLunchHours = (hours) => {
+    setState({ ...state, lunchHours: hours });
+  }
+
   const handleSendForm = () => {
     if (validateForm()) {
       const formattedTags = prepareTags(state.tags);
@@ -167,6 +177,7 @@ export default function EditRestaurantInfo(props) {
         adress: state.adress,
         coordinates: props.restaurant.location.coordinates,
         placesId: props.restaurant.placesId,
+        type: state.type,
         imgUrl: props.restaurant.imgUrl,
         workingHours: state.workingHours,
         lunchHours: state.lunchHours,
@@ -231,6 +242,28 @@ export default function EditRestaurantInfo(props) {
             variant="outlined"
           />
         </div>
+        <div className="editRestaurant-fullWidth">
+          <TextField
+            className={styles.textInputFullWidth}
+            fullWidth
+            value={state.type}
+            error={state.typeError}
+            onChange={(event) =>
+              setState({ ...state, type: event.target.value })
+            }
+            InputLabelProps={{ shrink: true }}
+            InputProps={{
+              startAdornment: (
+                <InputAdornment position="start">
+                  <FastfoodIcon color="primary" />
+                </InputAdornment>
+              ),
+            }}
+            label="Kuchnia"
+            placeholder="np. Meksykańska"
+            variant="outlined"
+          />
+        </div>
 
         <TextField
           className={styles.textInput}
@@ -308,6 +341,10 @@ export default function EditRestaurantInfo(props) {
           setHours={(hours) => setState({ ...state, workingHours: hours })}
           hours={state.workingHours}
         />
+        <div className="newRestaurant-content-fullwidth">
+                 <div className="workingHours-container" style={{ marginTop: 14 }}>
+                <InputWorkingHoursSingle nieczynne={!state.lunchHours} hours={state.lunchHours} changeValue={(value) => setLunchHours(value)} day="Lunch hours" /></div>
+              </div>
         <div className="editRestaurant-sectiontitle">
           <h4>Dane kontaktowe</h4>
           <Divider />

src/components/Output/AppBackdrop.js

@@ -6,7 +6,7 @@ import { makeStyles } from "@material-ui/core/styles";
 
 const useStyles = makeStyles((theme) => ({
   backdrop: {
-    zIndex: theme.zIndex.drawer + 1,
+    zIndex: theme.zIndex.drawer + 15,
     color: "#fff",
   },
 }));