Skip to content

Commit 1c02074

Browse files
committed
Extract translations from librarian pages
1 parent a24579b commit 1c02074

12 files changed

Lines changed: 143 additions & 56 deletions

public/locales/en/common.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,5 +31,7 @@
3131
"CHILDREN_LIBRARY": "Children Library",
3232
"BORROW": "Borrow",
3333
"RETURN": "Return",
34-
"EXTEND": "Extend"
34+
"EXTEND": "Extend",
35+
"ADMIN": "Admin",
36+
"FACULTY": "Faculty"
3537
}

public/locales/en/librarians.json

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
{
2+
"addLibrarian": "Add new librarian",
3+
"backToDashboard": "Back to dashboard",
4+
"notFound": "No other librarians found",
5+
"details": "Details",
6+
"librarianId": "Librarian ID",
7+
"username": "Username",
8+
"email": "Email",
9+
"role": "Role",
10+
"firstName": "First Name",
11+
"middleName": "Middle Name",
12+
"lastName": "Last Name",
13+
"createPassword": "Create password",
14+
"confirmPassword": "Confirm password",
15+
"changePassword": "Change password",
16+
"editDetails": "Edit details",
17+
"delete": "Delete Librarian",
18+
"add": "Add Librarian",
19+
"edit": "Edit Librarian",
20+
"update": "Update",
21+
"deleteResp": {
22+
"200": "Librarian deleted successfully",
23+
"403": "{{errorMessage}}",
24+
"404": "Librarian not found",
25+
"unspecific": "Something went wrong"
26+
},
27+
"createResp": {
28+
"200": "Librarian added successfully",
29+
"400": "{{errorMessage}}",
30+
"unspecific": "Something went wrong"
31+
},
32+
"updateResp": {
33+
"200": "Librarian updated successfully",
34+
"400": "{{errorMessage}}",
35+
"404": "Librarian not found",
36+
"unspecific": "Something went wrong"
37+
},
38+
"passUpdateResp": {
39+
"200": "Password updated successfully",
40+
"400": "{{errorMessage}}",
41+
"404": "Librarian not found",
42+
"unspecific": "Something went wrong"
43+
},
44+
"passwordMismatch": "Password don't match"
45+
}

src/components/LibrarianAddForm.js

Lines changed: 21 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
11
import React, { useState } from 'react';
22
import { useNavigate } from 'react-router-dom';
33
import { postCall } from '../helpers/postCall';
4+
import { useTranslation } from 'react-i18next';
45

56
const 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>

src/components/LibrarianEditForm.js

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@ import React, { useEffect, useState } from 'react';
22
import { useNavigate, useParams } from 'react-router-dom';
33
import { putCall } from '../helpers/putCall';
44
import { useFetch } from '../helpers/useFetch';
5+
import { useTranslation } from 'react-i18next';
56

67
const LibrarianEditForm = () => {
8+
const { t } = useTranslation('librarians');
79
const { id } = useParams();
810
let navigate = useNavigate();
911

@@ -38,9 +40,13 @@ const LibrarianEditForm = () => {
3840
e.preventDefault();
3941

4042
putCall(librarianDetailUrl, details).then((result) => {
41-
window.alert(result['data']['message']);
43+
const status = result['status'];
44+
window.alert(t(
45+
[`updateResp.${status}`, 'updateResp.unspecific'],
46+
{errorMessage: result['data']['message']}
47+
));
4248

43-
if (result['status'] === 200) {
49+
if (status === 200) {
4450
if (id === loggedId) {
4551
window.localStorage.setItem('role', details['role']);
4652
window.localStorage.setItem('username', details['userName']);
@@ -58,7 +64,7 @@ const LibrarianEditForm = () => {
5864
<form id='librarianForm' onSubmit={handleSubmit}>
5965
<div className='form-group row'>
6066
<label className='col-sm-4 col-form-label font-weight-bold' htmlFor='formLibrarianType'>
61-
Role
67+
{t('role')}
6268
</label>
6369
<div className='col-sm-8'>
6470
<select
@@ -70,14 +76,14 @@ const LibrarianEditForm = () => {
7076
setDetails({ ...details, role: e.target.value });
7177
}}
7278
>
73-
<option value='ADMIN'>ADMIN</option>
74-
<option value='FACULTY'>FACULTY</option>
79+
<option value='ADMIN'>{t('ADMIN')}</option>
80+
<option value='FACULTY'>{t('FACULTY')}</option>
7581
</select>
7682
</div>
7783
</div>
7884
<div className='form-group row'>
7985
<label className='col-sm-4 col-form-label font-weight-bold' htmlFor='formFirstName'>
80-
Username
86+
{t('username')}
8187
</label>
8288
<div className='col-sm-8'>
8389
<input
@@ -97,7 +103,7 @@ const LibrarianEditForm = () => {
97103
</div>
98104
<div className='form-group row'>
99105
<label className='col-sm-4 col-form-label font-weight-bold' htmlFor='formEmail'>
100-
Email
106+
{t('email')}
101107
</label>
102108
<div className='col-sm-8'>
103109
<input
@@ -116,7 +122,7 @@ const LibrarianEditForm = () => {
116122
</div>
117123
<div className='form-group row'>
118124
<label className='col-sm-4 col-form-label font-weight-bold' htmlFor='formFirstName'>
119-
First name
125+
{t('firstName')}
120126
</label>
121127
<div className='col-sm-8'>
122128
<input
@@ -136,7 +142,7 @@ const LibrarianEditForm = () => {
136142
</div>
137143
<div className='form-group row'>
138144
<label className='col-sm-4 col-form-label font-weight-bold' htmlFor='formMiddleName'>
139-
Middle name
145+
{t('middleName')}
140146
</label>
141147
<div className='col-sm-8'>
142148
<input
@@ -155,7 +161,7 @@ const LibrarianEditForm = () => {
155161
</div>
156162
<div className='form-group row'>
157163
<label className='col-sm-4 col-form-label font-weight-bold' htmlFor='formLastName'>
158-
Last name
164+
{t('lastName')}
159165
</label>
160166
<div className='col-sm-8'>
161167
<input
@@ -174,7 +180,7 @@ const LibrarianEditForm = () => {
174180
</div>
175181

176182
<button type='submit' className='btn btn-primary my-2'>
177-
Update
183+
{t('update')}
178184
</button>
179185
<button
180186
type='button'
@@ -184,7 +190,7 @@ const LibrarianEditForm = () => {
184190
navigate(path);
185191
}}
186192
>
187-
Cancel
193+
{t('cancel')}
188194
</button>
189195
</form>
190196
</div>

src/components/LibrarianList.js

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
11
import React from 'react';
22
import { Link } from 'react-router-dom';
33
import { useFetch } from '../helpers/useFetch';
4+
import { useTranslation } from 'react-i18next';
45

56
const LibrarianList = (props) => {
7+
const { t } = useTranslation('librarians');
68
const thisurl = '/api/librarian';
79
const { data } = useFetch(thisurl);
810

@@ -13,15 +15,15 @@ const LibrarianList = (props) => {
1315
<div className='card-body'>
1416
<div className='table-responsive'>
1517
{data.length === 1 ? (
16-
'No other librarians found'
18+
t('notFound')
1719
) : (
1820
<table className='table table-bordered table-hover' id='dataTable' width='100%' cellSpacing='0'>
1921
<thead className='table-secondary text-dark'>
2022
<tr>
21-
<th>Librarian ID</th>
22-
<th>Username</th>
23-
<th>Email</th>
24-
<th>Role</th>
23+
<th>{t('librarianId')}</th>
24+
<th>{t('username')}</th>
25+
<th>{t('email')}</th>
26+
<th>{t('role')}</th>
2527
</tr>
2628
</thead>
2729
<tbody>
@@ -45,7 +47,7 @@ const LibrarianList = (props) => {
4547
</td>
4648
<td>{userName}</td>
4749
<td>{email}</td>
48-
<td>{role}</td>
50+
<td>{t(role)}</td>
4951
</tr>
5052
);
5153
}

src/components/LibrarianPasswordChangeForm.js

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
11
import React, { useState } from 'react';
22
import { useNavigate, useParams } from 'react-router-dom';
33
import { putCall } from '../helpers/putCall';
4+
import { useTranslation } from 'react-i18next';
45

56
const LibrarianEditForm = () => {
7+
const { t } = useTranslation('librarians');
68
const { id } = useParams();
79
let navigate = useNavigate();
810

@@ -19,14 +21,18 @@ const LibrarianEditForm = () => {
1921
let password2 = document.getElementById('formConfirmPassword').value;
2022

2123
if (password1 !== password2) {
22-
window.alert("Password don't match");
24+
window.alert(t('passwordMismatch'));
2325
return;
2426
}
2527

2628
putCall(librarianPasswordUrl, details).then((result) => {
27-
window.alert(result['data']['message']);
29+
const status = result['status'];
30+
window.alert(t(
31+
[`passUpdateResp.${status}`, 'passUpdateResp.unspecific'],
32+
{errorMessage: result['data']['message']}
33+
));
2834

29-
if (result['status'] === 200) {
35+
if (status === 200) {
3036
let path = `/dashboard/librarian/${id}/view`;
3137
navigate(path);
3238
}

0 commit comments

Comments
 (0)