web client v 0.1

src/components/Dialogs/RegisterDialog.js

@@ -9,20 +9,17 @@ import IconButton from "@material-ui/core/IconButton";
 import TextField from "@material-ui/core/TextField";
 import CloseIcon from "@material-ui/icons/Close";
 import { useSelector, useDispatch } from "react-redux";
-import {
-  hideRegisterDialog,
-  showRegulaminDialog,
-  setRegisterResult,
-  showLoginDialog,
-} from "../../actions/toggles";
+import { setRegisterResult, showRegulamin } from "../../actions/toggles";
 import { tryRegister } from "../../actions";
 import InputAdornment from "@material-ui/core/InputAdornment";
 import AccountCircle from "@material-ui/icons/AccountCircle";
+import BusinessIcon from "@material-ui/icons/Business";
 import EmailIcon from "@material-ui/icons/Email";
 import LockIcon from "@material-ui/icons/Lock";
 import Link from "@material-ui/core/Link";
 import validator from "validator";
 import CircularProgress from "@material-ui/core/CircularProgress";
+import { useHistory } from "react-router-dom";
 
 export default function RegisterDialog(props) {
   // SETUP
@@ -30,17 +27,22 @@ export default function RegisterDialog(props) {
   const initialFormData = {
     firstname: "",
     lastname: "",
+    companyName: "",
+    adress: "",
+    NIP: "",
     email: "",
     password: "",
     repeatPassword: "",
     firstnameError: false,
     lastnameError: false,
+    companyNameError: false,
+    adressError: false,
+    NIPError: false,
     emailError: false,
     passwordError: false,
     repeatPasswordError: false,
   };
   const [formData, setFormData] = useState(initialFormData);
-  var registerDialog = useSelector((state) => state.data.dialogs.register);
   var circularProgress = useSelector(
     (state) => state.data.dialogs.registerCircularProgress
   );
@@ -49,6 +51,7 @@ export default function RegisterDialog(props) {
     (state) => state.data.dialogs.registerResult
   );
   const dispatch = useDispatch();
+  const history = useHistory();
 
   // STYLES
 
@@ -88,7 +91,7 @@ export default function RegisterDialog(props) {
 
   const handleRegulaminClick = (event) => {
     event.preventDefault();
-    dispatch(showRegulaminDialog());
+    dispatch(showRegulamin());
   };
 
   const validateForm = () => {
@@ -96,6 +99,9 @@ export default function RegisterDialog(props) {
     const validations = {
       firstname: !validator.isEmpty(formData.firstname),
       lastname: !validator.isEmpty(formData.lastname),
+      companyName: !validator.isEmpty(formData.companyName),
+      adress: !validator.isEmpty(formData.adress),
+      NIP: !validator.isEmpty(formData.NIP),
       email: validator.isEmail(formData.email),
       password: validator.isLength(formData.password, {
         min: 8,
@@ -108,6 +114,9 @@ export default function RegisterDialog(props) {
       ...formData,
       firstnameError: !validations.firstname,
       lastnameError: !validations.lastname,
+      companyNameError: !validations.companyName,
+      adressError: !validations.adress,
+      NIPError: !validations.NIP,
       emailError: !validations.email,
       passwordError: !validations.password,
       repeatPasswordError: !validations.repeatPassword,
@@ -117,7 +126,10 @@ export default function RegisterDialog(props) {
       validations.lastname &&
       validations.email &&
       validations.password &&
-      validations.repeatPassword;
+      validations.repeatPassword &&
+      validations.companyName &&
+      validations.adress &&
+      validations.NIP;
 
     return valid;
   };
@@ -126,29 +138,24 @@ export default function RegisterDialog(props) {
     if (validateForm()) {
       dispatch(tryRegister(form));
     } else {
-      dispatch(setRegisterResult("Proszę poprawić poprawić formularz."));
+      dispatch(setRegisterResult("Proszę poprawić formularz."));
     }
   };
 
-  const openLogin = () => {
-    dispatch(hideRegisterDialog());
-    dispatch(showLoginDialog());
-  };
-
   // CODE
 
   return (
     <div>
       <Dialog
         className={loginClass.root}
-        onClose={() => dispatch(hideRegisterDialog())}
-        open={registerDialog}
+        onClose={() => history.goBack()}
+        open={true}
         aria-labelledby="login-title"
       >
         <DialogTitle id="login-title">Rejestracja</DialogTitle>
         <IconButton
           className={loginClass.closeButton}
-          onClick={() => dispatch(hideRegisterDialog())}
+          onClick={() => history.goBack()}
           aria-label="close"
         >
           <CloseIcon />
@@ -191,6 +198,59 @@ export default function RegisterDialog(props) {
                 error={formData.lastnameError}
                 onChange={(event) => (formData.lastname = event.target.value)}
               />
+              <TextField
+                className={loginClass.textInput}
+                required
+                id="companyName"
+                label="Nazwa firmy"
+                type="name"
+                variant="outlined"
+                InputProps={{
+                  startAdornment: (
+                    <InputAdornment position="start">
+                      <BusinessIcon color="primary" />
+                    </InputAdornment>
+                  ),
+                }}
+                error={formData.companyNameError}
+                onChange={(event) =>
+                  (formData.companyName = event.target.value)
+                }
+              />
+              <TextField
+                className={loginClass.textInput}
+                required
+                id="adress"
+                label="Adres firmy"
+                type="name"
+                variant="outlined"
+                InputProps={{
+                  startAdornment: (
+                    <InputAdornment position="start">
+                      <BusinessIcon color="primary" />
+                    </InputAdornment>
+                  ),
+                }}
+                error={formData.adressError}
+                onChange={(event) => (formData.adress = event.target.value)}
+              />
+              <TextField
+                className={loginClass.textInput}
+                required
+                id="NIP"
+                label="NIP"
+                type="name"
+                variant="outlined"
+                InputProps={{
+                  startAdornment: (
+                    <InputAdornment position="start">
+                      <BusinessIcon color="primary" />
+                    </InputAdornment>
+                  ),
+                }}
+                error={formData.NIPError}
+                onChange={(event) => (formData.NIP = event.target.value)}
+              />
               <TextField
                 className={loginClass.textInput}
                 required
@@ -270,7 +330,10 @@ export default function RegisterDialog(props) {
                   text="Zarejestruj"
                 />
               ) : (
-                <ButtonSecondary onClick={() => openLogin()} text="Logowanie" />
+                <ButtonSecondary
+                  onClick={() => history.push("/login")}
+                  text="Logowanie"
+                />
               )}
             </div>
           </div>