From f70882e49d3cd6deeec75be967365535db2f93b3 Mon Sep 17 00:00:00 2001
From: zirops <zirops@gmail.com>
Date: Wed, 27 Jan 2021 15:49:43 +0100
Subject: user self registration code review 1

---
 modern/src/LoginPage.js      | 27 ++++++++------------------
 modern/src/RegisterDialog.js | 45 +++++++++++++++++++++-----------------------
 2 files changed, 29 insertions(+), 43 deletions(-)

(limited to 'modern/src')

diff --git a/modern/src/LoginPage.js b/modern/src/LoginPage.js
index cbe50fe..14960f8 100644
--- a/modern/src/LoginPage.js
+++ b/modern/src/LoginPage.js
@@ -8,7 +8,6 @@ import Paper from '@material-ui/core/Paper';
 import { makeStyles } from '@material-ui/core';
 import TextField from '@material-ui/core/TextField';
 import RegisterDialog from './RegisterDialog';
-import Snackbar from '@material-ui/core/Snackbar';
 import { useSelector } from 'react-redux';
 
 import t from './common/localization';
@@ -51,18 +50,12 @@ const LoginPage = () => {
   const [email, setEmail] = useState('');
   const [password, setPassword] = useState('');
   const [registerDialogShown, setRegisterDialogShown] = useState(false);
-  const [snackbarOpen, setSnackbarOpen] = useState(false);
 
   const classes = useStyles();
   const history = useHistory();
 
-  const server = useSelector(state => state.session.server);
-
-  let registrationPref = false;
-  if (server) {
-    registrationPref = server['registration']
-  }
-
+  const registrationPref =  useSelector(state => state.session.server ? state.session.server['registration'] : false);
+ 
   const handleEmailChange = (event) => {
     setEmail(event.target.value);
   }
@@ -75,11 +68,8 @@ const LoginPage = () => {
     setRegisterDialogShown(true);
   }
 
-  const handleRegisterResult = (resultOk) => {
+  const handleRegisterResult = () => {
     setRegisterDialogShown(false);
-    if (resultOk) {
-      setSnackbarOpen(true);
-    }
   }
 
   const handleLogin = async (event) => {
@@ -137,12 +127,11 @@ const LoginPage = () => {
             </div>
           </FormControl>
         </form>
-        {registerDialogShown && <RegisterDialog open={registerDialogShown} onResult={handleRegisterResult} />}
-        <Snackbar
-          anchorOrigin={{ vertical: 'bottom', horizontal: 'center', }}
-          open={snackbarOpen} autoHideDuration={6000}
-          onClose={()=>{setSnackbarOpen(false);}} message={t('loginCreated')}
-        />
+
+        {registerDialogShown && 
+          <RegisterDialog showDialog={true} onResult={handleRegisterResult} />
+        }
+      
       </Paper>
     </main>
   );
diff --git a/modern/src/RegisterDialog.js b/modern/src/RegisterDialog.js
index ecd07ac..5be0a24 100644
--- a/modern/src/RegisterDialog.js
+++ b/modern/src/RegisterDialog.js
@@ -6,12 +6,12 @@ import DialogActions from '@material-ui/core/DialogActions';
 import DialogContent from '@material-ui/core/DialogContent';
 import DialogContentText from '@material-ui/core/DialogContentText';
 import TextField from '@material-ui/core/TextField';
-import Alert from '@material-ui/lab/Alert';
+import Snackbar from '@material-ui/core/Snackbar';
 
-const RegisterDialog = ({ open, onResult }) => {
+const RegisterDialog = ({ showDialog, onResult }) => {
   const [formFields, setFormFields] = useState({});
   const [validationErrors, setValidationErrors] = useState({});
-  const [errorResponse, setErrorResponse] = useState(null);
+  const [snackbarOpen, setSnackbarOpen] = useState(false);
 
   const handleChange = (event) => {
     setFormFields({ ...formFields, [event.target.name]: event.target.value });
@@ -19,14 +19,11 @@ const RegisterDialog = ({ open, onResult }) => {
   }
 
   const handleRegister = async (event) => {
-    event.preventDefault();
-    setErrorResponse(null);
     let objErrors = {};
     if (formFields.name.trim() === '') {
       objErrors.name = true;
     }
-    if (!
-      /^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/.test(formFields.email)) {
+    if (!/(.+)@(.+)\.(.{2,})/.test(formFields.email)) {
       objErrors.email = true;
     }
     if (formFields.password.trim() === '') {
@@ -44,21 +41,23 @@ const RegisterDialog = ({ open, onResult }) => {
     });
 
     if (response.ok) {
-      onResult(true)
-    } else {
-      setErrorResponse(t('errorGeneral'));
+      showDialog = false;
+      setSnackbarOpen(true);
     }
   }
 
-  return (
-    <Dialog
-      open={open}
+  if (snackbarOpen) {
+    return <Snackbar
+      anchorOrigin={{ vertical: 'bottom', horizontal: 'center', }}
+      open={snackbarOpen} autoHideDuration={6000}
+      onClose={() => { onResult(true) }} message={t('loginCreated')}
+    />
+  } else if (showDialog) {
+    return <Dialog
+      open={true}
       onClose={() => { onResult(false) }}>
       <DialogContent>
         <DialogContentText>{t('loginRegister')}</DialogContentText>
-
-        {errorResponse && <Alert severity="error">{errorResponse}</Alert>}
-
         <TextField
           margin='normal'
           required
@@ -70,8 +69,7 @@ const RegisterDialog = ({ open, onResult }) => {
           autoComplete='name'
           autoFocus
           onChange={handleChange}
-          helperText={validationErrors.name && 'Name is required'} />
-
+          helperText={validationErrors.name && t('sharedRequired')} />
         <TextField
           margin='normal'
           required
@@ -82,8 +80,7 @@ const RegisterDialog = ({ open, onResult }) => {
           value={formFields.email || ''}
           autoComplete='email'
           onChange={handleChange}
-          helperText={validationErrors.email && 'Invalid e-mail'} />
-
+          helperText={validationErrors.email && t('sharedRequired')} />
         <TextField
           margin='normal'
           required
@@ -95,15 +92,15 @@ const RegisterDialog = ({ open, onResult }) => {
           type='password'
           autoComplete='current-password'
           onChange={handleChange}
-          helperText={validationErrors.password && 'Password is required'} />
-
+          helperText={validationErrors.password && t('sharedRequired')} />
       </DialogContent>
       <DialogActions>
         <Button color="primary" onClick={handleRegister} disabled={!formFields.name || !formFields.email || !formFields.password}>{t('loginRegister')}</Button>
         <Button autoFocus onClick={() => onResult(false)}>{t('sharedCancel')}</Button>
       </DialogActions>
-    </Dialog>
-  );
+    </Dialog>;
+  } else return null;
+
 };
 
 export default RegisterDialog;
-- 
cgit v1.2.3