diff --git a/src/pages/SignUp.js b/src/pages/SignUp.js index a3d59644f56f58fe4cda3bd95537571815df47a6..ab39dee7c72b7cb1d5c0e7cc587da4e4a56edc74 100644 --- a/src/pages/SignUp.js +++ b/src/pages/SignUp.js @@ -110,9 +110,9 @@ export default function SignUp() { function checkPasswordString() { return values.password - ? /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&+_ ():;/?\|"'-])[A-Za-z\d@$!%*?&+_ ():;/?\|"'-]{8,24}$/.test( - values.password - ) + ? /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&+_ ():;/?\|"'-])[A-Za-z\d@$!%*?&+_ ():;/\|"'-]{8,24}$/.test( + values.password + ) : true; } @@ -182,6 +182,7 @@ export default function SignUp() { handleSubmit(); } } + const theme = createMuiTheme({ overrides: { root: { @@ -199,80 +200,83 @@ export default function SignUp() { }, }, }); + let msg = + "Sua senha deve conter entre 8 e 24 caracteres, uma letra maiúscula, uma minúscula, um número e um caractere dentre @$!%*?&+_ ():;/|\"'-"; return isLoged ? ( <Redirect to="/signin" /> ) : ( - <MuiThemeProvider theme={theme}> - <Paper className={classes.register} justify="center"> - <strong className={classes.custom_strong}> - Cadastro de Usuário + <MuiThemeProvider theme={theme}> + <Paper className={classes.register} justify="center"> + <strong className={classes.custom_strong}> + Cadastro de Usuário <p className={classes.strong_description}> - Insira as informações abaixo + Insira as informações abaixo </p> - </strong> - <form className={classes.form} autocomplete="off"> - <Grid> - <FormInput - label="Nome Completo" - param="name" - onUpdate={handleChange} - error={!checkName()} - /> - </Grid> - <Grid> - <FormInput - label="E-mail" - param="email" - onUpdate={handleChange} - error={!checkEmail()} - /> - </Grid> - <Grid> - <FormInput - label="Senha" - param="password" - onUpdate={handleChange} - error={!checkPasswordString()} - /> - {(!checkPasswordString() || !values.password) && ( - <Grid className={classes.errorGridOpts}> - Sua senha deve conter entre 8 e 24 caracteres, uma letra - maiúscula, uma minúscula e um número + </strong> + <form className={classes.form} autocomplete="off"> + <Grid> + <FormInput + label="Nome Completo" + param="name" + onUpdate={handleChange} + error={!checkName()} + /> + </Grid> + <Grid> + <FormInput + label="E-mail" + param="email" + onUpdate={handleChange} + error={!checkEmail()} + /> + </Grid> + <Grid> + <FormInput + label="Senha" + param="password" + onUpdate={handleChange} + error={!checkPasswordString()} + /> + {(!checkPasswordString() || !values.password) && ( + <Grid className={classes.errorGridOpts}> + Sua senha deve conter entre 8 e 24 caracteres, uma letra + maiúscula, uma minúscula, um número e um caractere dentre + @$!%*?+_ ():;/?\|"'- </Grid> - )} - </Grid> - <Grid> - <FormInput - label="Confirmar Senha" - param="password_confirm" - onUpdate={handleChange} - error={ - values.password_confirm - ? values.password === values.password_confirm - ? false - : true - : false - } - /> - </Grid> - <Grid className={classes.alreadyAcc}> - <a href="https://genforms.c3sl.ufpr.br/#/signin"> - Já é cadastrado? + )} + </Grid> + <Grid> + <FormInput + label="Confirmar Senha" + param="password_confirm" + onUpdate={handleChange} + error={ + values.password_confirm + ? values.password === values.password_confirm + ? false + : true + : false + } + /> + </Grid> + <Grid className={classes.alreadyAcc}> + <a href="https://genforms.c3sl.ufpr.br/#/signin"> + Já é cadastrado? </a> - </Grid> - <Grid> - <IconButton - size="medium" - className={classes.button} - id="whiteTextedButton" - onClick={() => submit()} - > - <KeyboardArrowRightIcon /> - Cadastre-se + </Grid> + <Grid> + <IconButton + size="medium" + className={classes.button} + id="whiteTextedButton" + onClick={() => submit()} + > + <KeyboardArrowRightIcon /> + Cadastre-se </IconButton> - </Grid> - </form> - </Paper> - </MuiThemeProvider> - ); + </Grid> + </form> + </Paper> + </MuiThemeProvider> + ); }