Skip to content

Commit 2d8febe

Browse files
author
Jovert Lota Palonpon
committed
Fix wrong element nesting in Auth pages
1 parent 1b537b9 commit 2d8febe

File tree

4 files changed

+192
-196
lines changed

4 files changed

+192
-196
lines changed

resources/js/views/auth/SignIn.js

Lines changed: 140 additions & 154 deletions
Original file line numberDiff line numberDiff line change
@@ -170,12 +170,7 @@ class SignIn extends Component {
170170
message: {
171171
type: 'error',
172172
title: 'Something went wrong',
173-
body: (
174-
<h4>
175-
Oops? Something went wrong here.
176-
<br /> Please try again.
177-
</h4>
178-
),
173+
body: 'Oops? Something went wrong here. Please try again.',
179174
action: () => window.location.reload(),
180175
},
181176
});
@@ -196,7 +191,7 @@ class SignIn extends Component {
196191
}
197192

198193
render() {
199-
const { classes, setErrors, errors: formErrors } = this.props;
194+
const { classes, ...other } = this.props;
200195

201196
const {
202197
loading,
@@ -208,7 +203,7 @@ class SignIn extends Component {
208203

209204
return (
210205
<AuthLayout
211-
{...this.props}
206+
{...other}
212207
title={
213208
identified
214209
? Lang.get('navigation.signin_identified_title')
@@ -236,9 +231,6 @@ class SignIn extends Component {
236231
password: '',
237232
}}
238233
onSubmit={this.handleSigninSubmit}
239-
validate={values => {
240-
setErrors({});
241-
}}
242234
validationSchema={Yup.object().shape({
243235
[!identified
244236
? 'username'
@@ -249,153 +241,147 @@ class SignIn extends Component {
249241
),
250242
})}
251243
>
252-
{({ values, handleChange, errors, isSubmitting }) => {
253-
if (formErrors && Object.keys(formErrors).length > 0) {
254-
errors = formErrors;
255-
}
256-
257-
return (
258-
<Form>
259-
<Grid container direction="column">
260-
{!identified ? (
261-
<>
262-
<Grid
263-
item
264-
className={classes.formGroup}
265-
>
266-
<TextField
267-
id="username"
268-
name="username"
269-
label="Username"
270-
placeholder="jovert123"
271-
value={values.username}
272-
onChange={handleChange}
273-
variant="outlined"
274-
fullWidth
275-
error={errors.hasOwnProperty(
244+
{({ values, handleChange, errors, isSubmitting }) => (
245+
<Form>
246+
<Grid container direction="column">
247+
{!identified ? (
248+
<>
249+
<Grid
250+
item
251+
className={classes.formGroup}
252+
>
253+
<TextField
254+
id="username"
255+
name="username"
256+
label="Username"
257+
placeholder="jovert123"
258+
value={values.username}
259+
onChange={handleChange}
260+
variant="outlined"
261+
fullWidth
262+
error={errors.hasOwnProperty(
263+
'username',
264+
)}
265+
helperText={
266+
errors.hasOwnProperty(
276267
'username',
277-
)}
278-
helperText={
279-
errors.hasOwnProperty(
280-
'username',
281-
) && errors.username
282-
}
283-
/>
284-
</Grid>
285-
286-
<Grid
287-
item
288-
className={classes.formGroup}
289-
>
290-
<Link to="#">
291-
{Lang.get(
292-
'navigation.forgot_email',
293-
)}
294-
</Link>
295-
</Grid>
296-
</>
297-
) : (
298-
<>
299-
<Grid
300-
item
301-
className={classes.formGroup}
302-
>
303-
<TextField
304-
type={
305-
showPassword
306-
? 'text'
307-
: 'password'
308-
}
309-
id="password"
310-
name="password"
311-
label="Password"
312-
placeholder="secret"
313-
value={values.password}
314-
onChange={handleChange}
315-
variant="outlined"
316-
fullWidth
317-
error={errors.hasOwnProperty(
268+
) && errors.username
269+
}
270+
/>
271+
</Grid>
272+
273+
<Grid
274+
item
275+
className={classes.formGroup}
276+
>
277+
<Link to="#">
278+
{Lang.get(
279+
'navigation.forgot_email',
280+
)}
281+
</Link>
282+
</Grid>
283+
</>
284+
) : (
285+
<>
286+
<Grid
287+
item
288+
className={classes.formGroup}
289+
>
290+
<TextField
291+
type={
292+
showPassword
293+
? 'text'
294+
: 'password'
295+
}
296+
id="password"
297+
name="password"
298+
label="Password"
299+
placeholder="secret"
300+
value={values.password}
301+
onChange={handleChange}
302+
variant="outlined"
303+
fullWidth
304+
error={errors.hasOwnProperty(
305+
'password',
306+
)}
307+
helperText={
308+
errors.hasOwnProperty(
318309
'password',
319-
)}
320-
helperText={
321-
errors.hasOwnProperty(
322-
'password',
323-
) && errors.password
324-
}
325-
InputProps={{
326-
endAdornment: (
327-
<InputAdornment position="end">
328-
<IconButton
329-
aria-label="Toggle password visibility"
330-
onClick={
331-
this
332-
.handleShowPasswordClick
333-
}
334-
>
335-
{showPassword ? (
336-
<VisibilityOffIcon />
337-
) : (
338-
<VisibilityIcon />
339-
)}
340-
</IconButton>
341-
</InputAdornment>
342-
),
343-
}}
344-
/>
345-
</Grid>
346-
347-
<Grid
348-
item
349-
className={classes.formGroup}
350-
>
351-
<Link
352-
component={props => (
353-
<RouterLink
354-
{...props}
355-
to={{
356-
search: UrlUtils._queryString(
357-
{
358-
username,
359-
},
360-
),
361-
pathname: NavigationUtils._route(
362-
'auth.passwords.request',
363-
),
364-
}}
365-
/>
366-
)}
367-
>
368-
{Lang.get(
369-
'navigation.forgot_password',
370-
)}
371-
</Link>
372-
</Grid>
373-
</>
374-
)}
375-
</Grid>
376-
377-
<Grid container justify="space-between">
378-
<Grid item />
379-
380-
<Grid item className={classes.formGroup}>
381-
<Button
382-
type="submit"
383-
variant="contained"
384-
color="primary"
385-
disabled={
386-
(errors &&
387-
Object.keys(errors).length >
388-
0) ||
389-
isSubmitting
390-
}
310+
) && errors.password
311+
}
312+
InputProps={{
313+
endAdornment: (
314+
<InputAdornment position="end">
315+
<IconButton
316+
aria-label="Toggle password visibility"
317+
onClick={
318+
this
319+
.handleShowPasswordClick
320+
}
321+
>
322+
{showPassword ? (
323+
<VisibilityOffIcon />
324+
) : (
325+
<VisibilityIcon />
326+
)}
327+
</IconButton>
328+
</InputAdornment>
329+
),
330+
}}
331+
/>
332+
</Grid>
333+
334+
<Grid
335+
item
336+
className={classes.formGroup}
391337
>
392-
{Lang.get('navigation.next')}
393-
</Button>
394-
</Grid>
338+
<Link
339+
component={props => (
340+
<RouterLink
341+
{...props}
342+
to={{
343+
search: UrlUtils._queryString(
344+
{
345+
username,
346+
},
347+
),
348+
pathname: NavigationUtils._route(
349+
'auth.passwords.request',
350+
),
351+
}}
352+
/>
353+
)}
354+
>
355+
{Lang.get(
356+
'navigation.forgot_password',
357+
)}
358+
</Link>
359+
</Grid>
360+
</>
361+
)}
362+
</Grid>
363+
364+
<Grid container justify="space-between">
365+
<Grid item />
366+
367+
<Grid item className={classes.formGroup}>
368+
<Button
369+
type="submit"
370+
variant="contained"
371+
color="primary"
372+
disabled={
373+
(errors &&
374+
Object.keys(errors).length >
375+
0) ||
376+
isSubmitting
377+
}
378+
>
379+
{Lang.get('navigation.next')}
380+
</Button>
395381
</Grid>
396-
</Form>
397-
);
398-
}}
382+
</Grid>
383+
</Form>
384+
)}
399385
</Formik>
400386
</AuthLayout>
401387
);

resources/js/views/auth/passwords/Request.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ class PasswordRequest extends Component {
3939
const { email } = values;
4040
const routeSuffix = NavigationUtils._route('auth.passwords.reset');
4141

42-
const response = await axios.post('api/v1/auth/password/request', {
42+
await axios.post('api/v1/auth/password/request', {
4343
email,
4444
routeSuffix,
4545
});
@@ -90,12 +90,13 @@ class PasswordRequest extends Component {
9090
}
9191

9292
render() {
93-
const { classes, location } = this.props;
93+
const { classes, ...other } = this.props;
94+
const { location } = this.props;
9495
const { loading, message, email } = this.state;
9596

9697
return (
9798
<AuthLayout
98-
{...this.props}
99+
{...other}
99100
title={Lang.get('navigation.password_request_title')}
100101
subTitle={Lang.get('navigation.password_request_subtitle')}
101102
loading={loading}

0 commit comments

Comments
 (0)