user self registration

1 files changed, 27 insertions, 2 deletions

diff --git a/modern/src/LoginPage.js b/modern/src/LoginPage.js
index 2636c807..cbe50fe4 100644
--- a/modern/src/LoginPage.js
+++ b/modern/src/LoginPage.js
@@ -7,6 +7,9 @@ import FormControl from '@material-ui/core/FormControl';
 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';
 
@@ -47,10 +50,19 @@ const LoginPage = () => {
   const [failed, setFailed] = useState(false);
   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 handleEmailChange = (event) => {
     setEmail(event.target.value);
   }
@@ -60,7 +72,14 @@ const LoginPage = () => {
   }
 
   const handleRegister = () => {
-    // TODO: Implement registration
+    setRegisterDialogShown(true);
+  }
+
+  const handleRegisterResult = (resultOk) => {
+    setRegisterDialogShown(false);
+    if (resultOk) {
+      setSnackbarOpen(true);
+    }
   }
 
   const handleLogin = async (event) => {
@@ -109,7 +128,7 @@ const LoginPage = () => {
 
           <FormControl fullWidth margin='normal'>
             <div className={classes.buttons}>
-              <Button type='button' variant='contained' disabled onClick={handleRegister}>
+              <Button type='button' variant='contained' onClick={handleRegister} disabled={!registrationPref}>
                 {t('loginRegister')}
               </Button>
               <Button type='submit' variant='contained' color='primary' disabled={!email || !password}>
@@ -118,6 +137,12 @@ 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')}
+        />
       </Paper>
     </main>
   );