11import React , { useState } from 'react' ;
22import { useNavigate } from 'react-router-dom' ;
33import { postCall } from '../helpers/postCall' ;
4+ import { useTranslation } from 'react-i18next' ;
45
56const LibrarianAddForm = ( ) => {
7+ const { t } = useTranslation ( 'librarians' ) ;
68 let navigate = useNavigate ( ) ;
79
810 const [ details , setDetails ] = useState ( {
@@ -22,14 +24,18 @@ const LibrarianAddForm = () => {
2224 let password2 = document . getElementById ( 'formConfirmPassword' ) . value ;
2325
2426 if ( password1 !== password2 ) {
25- window . alert ( "Password don't match" ) ;
27+ window . alert ( t ( 'passwordMismatch' ) ) ;
2628 return ;
2729 }
2830
2931 postCall ( '/api/librarian' , details ) . then ( ( result ) => {
30- window . alert ( result [ 'data' ] [ 'message' ] ) ;
32+ const status = result [ 'status' ] ;
33+ window . alert ( t (
34+ [ `createResp.${ status } ` , 'createResp.unspecific' ] ,
35+ { errorMessage : result [ 'data' ] [ 'message' ] }
36+ ) ) ;
3137
32- if ( result [ ' status' ] === 200 ) {
38+ if ( status === 200 ) {
3339 navigate ( `/dashboard/librarian/search` ) ;
3440 }
3541 } ) ;
@@ -41,7 +47,7 @@ const LibrarianAddForm = () => {
4147 < form id = 'librarianForm' onSubmit = { handleSubmit } >
4248 < div className = 'form-group row' >
4349 < label className = 'col-sm-4 col-form-label font-weight-bold' htmlFor = 'formLibrarianType' >
44- Role
50+ { t ( 'role' ) }
4551 </ label >
4652 < div className = 'col-sm-8' >
4753 < select
@@ -53,14 +59,14 @@ const LibrarianAddForm = () => {
5359 setDetails ( { ...details , role : e . target . value } ) ;
5460 } }
5561 >
56- < option value = 'ADMIN' > ADMIN</ option >
57- < option value = 'FACULTY' > FACULTY</ option >
62+ < option value = 'ADMIN' > { t ( ' ADMIN' ) } </ option >
63+ < option value = 'FACULTY' > { t ( ' FACULTY' ) } </ option >
5864 </ select >
5965 </ div >
6066 </ div >
6167 < div className = 'form-group row' >
6268 < label className = 'col-sm-4 col-form-label font-weight-bold' htmlFor = 'formUserName' >
63- Username
69+ { t ( 'username' ) }
6470 </ label >
6571 < div className = 'col-sm-8' >
6672 < input
@@ -80,7 +86,7 @@ const LibrarianAddForm = () => {
8086 </ div >
8187 < div className = 'form-group row' >
8288 < label className = 'col-sm-4 col-form-label font-weight-bold' htmlFor = 'formEmail' >
83- Email
89+ { t ( 'email' ) }
8490 </ label >
8591 < div className = 'col-sm-8' >
8692 < input
@@ -100,7 +106,7 @@ const LibrarianAddForm = () => {
100106 </ div >
101107 < div className = 'form-group row' >
102108 < label className = 'col-sm-4 col-form-label font-weight-bold' htmlFor = 'formFirstName' >
103- First name
109+ { t ( 'firstName' ) }
104110 </ label >
105111 < div className = 'col-sm-8' >
106112 < input
@@ -120,7 +126,7 @@ const LibrarianAddForm = () => {
120126 </ div >
121127 < div className = 'form-group row' >
122128 < label className = 'col-sm-4 col-form-label font-weight-bold' htmlFor = 'formMiddleName' >
123- Middle name
129+ { t ( 'middleName' ) }
124130 </ label >
125131 < div className = 'col-sm-8' >
126132 < input
@@ -139,7 +145,7 @@ const LibrarianAddForm = () => {
139145 </ div >
140146 < div className = 'form-group row' >
141147 < label className = 'col-sm-4 col-form-label font-weight-bold' htmlFor = 'formLastName' >
142- Last name
148+ { t ( 'lastName' ) }
143149 </ label >
144150 < div className = 'col-sm-8' >
145151 < input
@@ -158,7 +164,7 @@ const LibrarianAddForm = () => {
158164 </ div >
159165 < div className = 'form-group row' >
160166 < label className = 'col-sm-4 col-form-label font-weight-bold' htmlFor = 'formCreatePassword' >
161- Create password
167+ { t ( 'createPassword' ) }
162168 </ label >
163169 < div className = 'col-sm-8' >
164170 < input
@@ -177,15 +183,15 @@ const LibrarianAddForm = () => {
177183 </ div >
178184 < div className = 'form-group row' >
179185 < label className = 'col-sm-4 col-form-label font-weight-bold' htmlFor = 'formConfirmPassword' >
180- Confirm password
186+ { t ( 'confirmPassword' ) }
181187 </ label >
182188 < div className = 'col-sm-8' >
183189 < input type = 'password' className = 'form-control' id = 'formConfirmPassword' name = 'formConfirmPassword' placeholder = 'Confirm password' required />
184190 </ div >
185191 </ div >
186192
187193 < button type = 'submit' className = 'btn btn-primary my-2' >
188- Add Librarian
194+ { t ( 'add' ) }
189195 </ button >
190196 < button
191197 type = 'button'
@@ -194,7 +200,7 @@ const LibrarianAddForm = () => {
194200 navigate ( `/dashboard/librarian/search` ) ;
195201 } }
196202 >
197- Cancel
203+ { t ( 'cancel' ) }
198204 </ button >
199205 </ form >
200206 </ div >
0 commit comments