@@ -22,6 +22,7 @@ export default function Registration(): ReactElement {
22
22
const handleSubmit = ( event : FormEvent ) => {
23
23
event . preventDefault ( ) ;
24
24
25
+ setErrorMessage ( "test" ) ;
25
26
}
26
27
27
28
const handlePasswordChange = ( event : ChangeEvent < HTMLInputElement > ) => {
@@ -61,22 +62,22 @@ export default function Registration(): ReactElement {
61
62
value = { password }
62
63
onChange = { ( event : ChangeEvent < HTMLInputElement > ) => handlePasswordChange ( event ) } />
63
64
< div >
64
- < img alt = { "status image password length" } src = { passwordInformationLength ? check_svg : info_svg } />
65
+ < img alt = { "status icon password length" } src = { passwordInformationLength ? check_svg : info_svg } />
65
66
< span className = { "sr-only" } > { passwordInformationLength ? "Done: " : "Missing: " } </ span >
66
67
< span className = { passwordInformationLength ? "text-success" : "text-muted" } > Passwords must be at least 8 characters.</ span >
67
68
</ div >
68
69
< div >
69
- < img alt = { "status image password contains uppercase character" } src = { passwordInformationUppercase ? check_svg : info_svg } />
70
+ < img alt = { "status icon password contains uppercase character" } src = { passwordInformationUppercase ? check_svg : info_svg } />
70
71
< span className = { "sr-only" } > { passwordInformationUppercase ? "Done: " : "Missing: " } </ span >
71
72
< span className = { passwordInformationUppercase ? "text-success" : "text-muted" } > Passwords must be at least contain 1 uppercase character.</ span >
72
73
</ div >
73
74
< div >
74
- < img alt = { "status image password contains lowercase character" } src = { passwordInformationLowercase ? check_svg : info_svg } />
75
+ < img alt = { "status icon password contains lowercase character" } src = { passwordInformationLowercase ? check_svg : info_svg } />
75
76
< span className = { "sr-only" } > { passwordInformationLowercase ? "Done: " : "Missing: " } </ span >
76
77
< span className = { passwordInformationLowercase ? "text-success" : "text-muted" } > Passwords must be at least contain 1 lowercase character.</ span >
77
78
</ div >
78
79
< div >
79
- < img alt = { "status image password contains number" } src = { passwordInformationNumber ? check_svg : info_svg } />
80
+ < img alt = { "status icon password contains number" } src = { passwordInformationNumber ? check_svg : info_svg } />
80
81
< span className = { "sr-only" } > { passwordInformationNumber ? "Done: " : "Missing: " } </ span >
81
82
< span className = { passwordInformationNumber ? "text-success" : "text-muted" } > Passwords must be at least contain 1 number.</ span >
82
83
</ div >
@@ -87,7 +88,7 @@ export default function Registration(): ReactElement {
87
88
value = { passwordConfirmation }
88
89
onChange = { ( event : ChangeEvent < HTMLInputElement > ) => handlePasswordConfirmationChange ( event ) } />
89
90
< div >
90
- < img alt = { "status image passwords match" } src = { ! passwordConfirmation ? info_svg : passwordsMatch ? check_svg : error_svg } />
91
+ < img alt = { "status icon passwords match" } src = { ! passwordConfirmation ? info_svg : passwordsMatch ? check_svg : error_svg } />
91
92
< span className = { "sr-only" } > { passwordsMatch ? "Done: " : "Missing: " } </ span >
92
93
< span className = { ! passwordConfirmation ? "text-muted" : passwordsMatch ? "text-success" : "text-danger" } > Passwords must match.</ span >
93
94
</ div >
0 commit comments