Skip to content

Commit

Permalink
Fix wrong element nesting in Auth pages
Browse files Browse the repository at this point in the history
  • Loading branch information
Jovert Lota Palonpon committed Apr 13, 2019
1 parent 1b537b9 commit 2d8febe
Show file tree
Hide file tree
Showing 4 changed files with 192 additions and 196 deletions.
294 changes: 140 additions & 154 deletions resources/js/views/auth/SignIn.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -170,12 +170,7 @@ class SignIn extends Component {
message: {
type: 'error',
title: 'Something went wrong',
body: (
<h4>
Oops? Something went wrong here.
<br /> Please try again.
</h4>
),
body: 'Oops? Something went wrong here. Please try again.',
action: () => window.location.reload(),
},
});
Expand All @@ -196,7 +191,7 @@ class SignIn extends Component {
}

render() {
const { classes, setErrors, errors: formErrors } = this.props;
const { classes, ...other } = this.props;

const {
loading,
Expand All @@ -208,7 +203,7 @@ class SignIn extends Component {

return (
<AuthLayout
{...this.props}
{...other}
title={
identified
? Lang.get('navigation.signin_identified_title')
Expand Down Expand Up @@ -236,9 +231,6 @@ class SignIn extends Component {
password: '',
}}
onSubmit={this.handleSigninSubmit}
validate={values => {
setErrors({});
}}
validationSchema={Yup.object().shape({
[!identified
? 'username'
Expand All @@ -249,153 +241,147 @@ class SignIn extends Component {
),
})}
>
{({ values, handleChange, errors, isSubmitting }) => {
if (formErrors && Object.keys(formErrors).length > 0) {
errors = formErrors;
}

return (
<Form>
<Grid container direction="column">
{!identified ? (
<>
<Grid
item
className={classes.formGroup}
>
<TextField
id="username"
name="username"
label="Username"
placeholder="jovert123"
value={values.username}
onChange={handleChange}
variant="outlined"
fullWidth
error={errors.hasOwnProperty(
{({ values, handleChange, errors, isSubmitting }) => (
<Form>
<Grid container direction="column">
{!identified ? (
<>
<Grid
item
className={classes.formGroup}
>
<TextField
id="username"
name="username"
label="Username"
placeholder="jovert123"
value={values.username}
onChange={handleChange}
variant="outlined"
fullWidth
error={errors.hasOwnProperty(
'username',
)}
helperText={
errors.hasOwnProperty(
'username',
)}
helperText={
errors.hasOwnProperty(
'username',
) && errors.username
}
/>
</Grid>

<Grid
item
className={classes.formGroup}
>
<Link to="#">
{Lang.get(
'navigation.forgot_email',
)}
</Link>
</Grid>
</>
) : (
<>
<Grid
item
className={classes.formGroup}
>
<TextField
type={
showPassword
? 'text'
: 'password'
}
id="password"
name="password"
label="Password"
placeholder="secret"
value={values.password}
onChange={handleChange}
variant="outlined"
fullWidth
error={errors.hasOwnProperty(
) && errors.username
}
/>
</Grid>

<Grid
item
className={classes.formGroup}
>
<Link to="#">
{Lang.get(
'navigation.forgot_email',
)}
</Link>
</Grid>
</>
) : (
<>
<Grid
item
className={classes.formGroup}
>
<TextField
type={
showPassword
? 'text'
: 'password'
}
id="password"
name="password"
label="Password"
placeholder="secret"
value={values.password}
onChange={handleChange}
variant="outlined"
fullWidth
error={errors.hasOwnProperty(
'password',
)}
helperText={
errors.hasOwnProperty(
'password',
)}
helperText={
errors.hasOwnProperty(
'password',
) && errors.password
}
InputProps={{
endAdornment: (
<InputAdornment position="end">
<IconButton
aria-label="Toggle password visibility"
onClick={
this
.handleShowPasswordClick
}
>
{showPassword ? (
<VisibilityOffIcon />
) : (
<VisibilityIcon />
)}
</IconButton>
</InputAdornment>
),
}}
/>
</Grid>

<Grid
item
className={classes.formGroup}
>
<Link
component={props => (
<RouterLink
{...props}
to={{
search: UrlUtils._queryString(
{
username,
},
),
pathname: NavigationUtils._route(
'auth.passwords.request',
),
}}
/>
)}
>
{Lang.get(
'navigation.forgot_password',
)}
</Link>
</Grid>
</>
)}
</Grid>

<Grid container justify="space-between">
<Grid item />

<Grid item className={classes.formGroup}>
<Button
type="submit"
variant="contained"
color="primary"
disabled={
(errors &&
Object.keys(errors).length >
0) ||
isSubmitting
}
) && errors.password
}
InputProps={{
endAdornment: (
<InputAdornment position="end">
<IconButton
aria-label="Toggle password visibility"
onClick={
this
.handleShowPasswordClick
}
>
{showPassword ? (
<VisibilityOffIcon />
) : (
<VisibilityIcon />
)}
</IconButton>
</InputAdornment>
),
}}
/>
</Grid>

<Grid
item
className={classes.formGroup}
>
{Lang.get('navigation.next')}
</Button>
</Grid>
<Link
component={props => (
<RouterLink
{...props}
to={{
search: UrlUtils._queryString(
{
username,
},
),
pathname: NavigationUtils._route(
'auth.passwords.request',
),
}}
/>
)}
>
{Lang.get(
'navigation.forgot_password',
)}
</Link>
</Grid>
</>
)}
</Grid>

<Grid container justify="space-between">
<Grid item />

<Grid item className={classes.formGroup}>
<Button
type="submit"
variant="contained"
color="primary"
disabled={
(errors &&
Object.keys(errors).length >
0) ||
isSubmitting
}
>
{Lang.get('navigation.next')}
</Button>
</Grid>
</Form>
);
}}
</Grid>
</Form>
)}
</Formik>
</AuthLayout>
);
Expand Down
7 changes: 4 additions & 3 deletions resources/js/views/auth/passwords/Request.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ class PasswordRequest extends Component {
const { email } = values;
const routeSuffix = NavigationUtils._route('auth.passwords.reset');

const response = await axios.post('api/v1/auth/password/request', {
await axios.post('api/v1/auth/password/request', {
email,
routeSuffix,
});
Expand Down Expand Up @@ -90,12 +90,13 @@ class PasswordRequest extends Component {
}

render() {
const { classes, location } = this.props;
const { classes, ...other } = this.props;
const { location } = this.props;
const { loading, message, email } = this.state;

return (
<AuthLayout
{...this.props}
{...other}
title={Lang.get('navigation.password_request_title')}
subTitle={Lang.get('navigation.password_request_subtitle')}
loading={loading}
Expand Down
Loading

0 comments on commit 2d8febe

Please sign in to comment.