Skip to content

Commit c1f8b49

Browse files
Merge pull request #47 from CivicTechAtlanta/final-translations
final translations
2 parents 92bffcf + 89415da commit c1f8b49

File tree

3 files changed

+74
-30
lines changed

3 files changed

+74
-30
lines changed

src/app/configurations/page.tsx

Lines changed: 30 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
"use client";
22

33
import React, { useEffect, useRef, useState } from "react";
4+
import { useTranslation } from "react-i18next";
45

56
import Home from "../components/Home/Home";
67

@@ -78,6 +79,7 @@ const fromDraft = (d: DraftConfig): ConfigurationsPageProps => ({
7879
const formatNum = formatSig2;
7980

8081
export default function ConfigurationsPage() {
82+
const { t } = useTranslation();
8183
const [configurations, setConfigurations] = useState<StoredConfig[]>([]);
8284
const [index, setIndex] = useState(0);
8385
const [dragX, setDragX] = useState(0);
@@ -179,7 +181,7 @@ export default function ConfigurationsPage() {
179181
if (typeof window === 'undefined') return;
180182
const item = configurations[i];
181183
if (!item) return;
182-
const confirmed = window.confirm('Delete this configuration? This cannot be undone.');
184+
const confirmed = window.confirm(t('configurations.delete_confirmation'));
183185
if (!confirmed) return;
184186
try {
185187
window.localStorage.removeItem(item.key);
@@ -219,8 +221,8 @@ export default function ConfigurationsPage() {
219221
{configurations.length === 0 ? (
220222
<section className="card" key="empty">
221223
<div className="card-inner">
222-
<h2>No configurations</h2>
223-
<p>Add a configuration to see it here.</p>
224+
<h2>{t('configurations.no_configurations')}</h2>
225+
<p>{t('configurations.add_configuration_message')}</p>
224226
</div>
225227
</section>
226228
) : (
@@ -229,35 +231,35 @@ export default function ConfigurationsPage() {
229231
<div className="card-inner">
230232
<div style={{ display: 'flex', width: '100%', alignItems: 'center' }}>
231233
<h2 style={{ flex: 1 }}>
232-
{cfg.chlorinationConfigName ?? `Configuration ${i + 1}`}
234+
{cfg.chlorinationConfigName ?? `${t('configurations.configuration')} ${i + 1}`}
233235
</h2>
234236
{editingIndex === i ? (
235237
<></>
236238
) : (
237-
<button onClick={() => beginEdit(i)} className="blue-btn">Edit</button>
239+
<button onClick={() => beginEdit(i)} className="blue-btn">{t('configurations.edit')}</button>
238240
)}
239241
</div>
240242

241243
{editingIndex === i ? (
242244
<div style={{ marginTop: 12, display: 'flex', flexDirection: 'column', gap: 12, width: '100%', flex: 1 }}>
243245
<label style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
244-
<span>Name</span>
246+
<span>{t('configurations.name')}</span>
245247
<input
246248
value={draft?.chlorinationConfigName ?? ''}
247249
onChange={(e) => setDraft((d) => ({ ...(d as DraftConfig), chlorinationConfigName: e.target.value }))}
248250
style={{ background: '#111', color: '#fff', border: '1px solid #fff', padding: 6, borderRadius: 4, width: '100%', textAlign: 'left' }}
249251
/>
250252
</label>
251253
<label style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
252-
<span>Description</span>
254+
<span>{t('configurations.description')}</span>
253255
<input
254256
value={draft?.chlorinationConfigDescription ?? ''}
255257
onChange={(e) => setDraft((d) => ({ ...(d as DraftConfig), chlorinationConfigDescription: e.target.value }))}
256258
style={{ background: '#111', color: '#fff', border: '1px solid #fff', padding: 6, borderRadius: 4, width: '100%', textAlign: 'left' }}
257259
/>
258260
</label>
259261
<label style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
260-
<span>MS Volume</span>
262+
<span>{t('configurations.ms_volume')}</span>
261263
<input
262264
type="number"
263265
step="any"
@@ -267,7 +269,7 @@ export default function ConfigurationsPage() {
267269
/>
268270
</label>
269271
<label style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
270-
<span>Chlorine %</span>
272+
<span>{t('configurations.chlorine_percentage')}</span>
271273
<input
272274
type="number"
273275
step="any"
@@ -277,7 +279,7 @@ export default function ConfigurationsPage() {
277279
/>
278280
</label>
279281
<label style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
280-
<span>Reservoir Ingress</span>
282+
<span>{t('configurations.reservoir_ingress')}</span>
281283
<input
282284
type="number"
283285
step="any"
@@ -287,7 +289,7 @@ export default function ConfigurationsPage() {
287289
/>
288290
</label>
289291
<label style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
290-
<span>Chlorine Weight</span>
292+
<span>{t('configurations.chlorine_weight')}</span>
291293
<input
292294
type="number"
293295
step="any"
@@ -297,7 +299,7 @@ export default function ConfigurationsPage() {
297299
/>
298300
</label>
299301
<label style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
300-
<span>Desired Drip Rate</span>
302+
<span>{t('configurations.desired_drip_rate')}</span>
301303
<input
302304
type="number"
303305
step="any"
@@ -307,7 +309,7 @@ export default function ConfigurationsPage() {
307309
/>
308310
</label>
309311
<label style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
310-
<span>MS Concentration</span>
312+
<span>{t('configurations.ms_concentration')}</span>
311313
<input
312314
type="number"
313315
step="any"
@@ -317,7 +319,7 @@ export default function ConfigurationsPage() {
317319
/>
318320
</label>
319321
<label style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
320-
<span>Desired Concentration</span>
322+
<span>{t('configurations.desired_concentration')}</span>
321323
<input
322324
type="number"
323325
step="any"
@@ -327,7 +329,7 @@ export default function ConfigurationsPage() {
327329
/>
328330
</label>
329331
<label style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start' }}>
330-
<span>Refill Time</span>
332+
<span>{t('configurations.refill_time')}</span>
331333
<input
332334
type="number"
333335
step="any"
@@ -337,9 +339,9 @@ export default function ConfigurationsPage() {
337339
/>
338340
</label>
339341
<div style={{ marginTop: 'auto', display: 'flex', flexDirection: 'column', gap: 10, width: '100%' }}>
340-
<button onClick={saveEdit} className="success-btn" style={{ width: '100%' }}>Save</button>
341-
<button onClick={() => deleteConfig(i)} className="danger-btn" style={{ width: '100%' }}>Delete</button>
342-
<button onClick={cancelEdit} className="blue-btn" style={{ width: '100%' }}>Cancel</button>
342+
<button onClick={saveEdit} className="success-btn" style={{ width: '100%' }}>{t('configurations.save')}</button>
343+
<button onClick={() => deleteConfig(i)} className="danger-btn" style={{ width: '100%' }}>{t('configurations.delete')}</button>
344+
<button onClick={cancelEdit} className="blue-btn" style={{ width: '100%' }}>{t('configurations.cancel')}</button>
343345
</div>
344346
</div>
345347
) : (
@@ -351,7 +353,7 @@ export default function ConfigurationsPage() {
351353
)}
352354
{cfg.chlorinationConfigTimeCreated && (
353355
<p style={{ marginTop: 8, opacity: 0.8 }}>
354-
Created: {new Date(cfg.chlorinationConfigTimeCreated).toLocaleString()}
356+
{t('configurations.created')}: {new Date(cfg.chlorinationConfigTimeCreated).toLocaleString()}
355357
</p>
356358
)}
357359
<div
@@ -366,28 +368,28 @@ export default function ConfigurationsPage() {
366368
}}
367369
>
368370
<div>
369-
<strong>MS Volume:</strong> {formatNum(cfg.msVolume)}
371+
<strong>{t('configurations.ms_volume')}:</strong> {formatNum(cfg.msVolume)}
370372
</div>
371373
<div>
372-
<strong>Chlorine %:</strong> {formatNum(cfg.chlorinePercentage)}
374+
<strong>{t('configurations.chlorine_percentage')}:</strong> {formatNum(cfg.chlorinePercentage)}
373375
</div>
374376
<div>
375-
<strong>Reservoir Ingress:</strong> {formatNum(cfg.reservoirIngress)}
377+
<strong>{t('configurations.reservoir_ingress')}:</strong> {formatNum(cfg.reservoirIngress)}
376378
</div>
377379
<div>
378-
<strong>Chlorine Weight:</strong> {formatNum(cfg.chlorineWeight)}
380+
<strong>{t('configurations.chlorine_weight')}:</strong> {formatNum(cfg.chlorineWeight)}
379381
</div>
380382
<div>
381-
<strong>Desired Drip Rate:</strong> {formatNum(cfg.desiredDripRate)}
383+
<strong>{t('configurations.desired_drip_rate')}:</strong> {formatNum(cfg.desiredDripRate)}
382384
</div>
383385
<div>
384-
<strong>MS Concentration:</strong> {formatNum(cfg.msConcentration)}
386+
<strong>{t('configurations.ms_concentration')}:</strong> {formatNum(cfg.msConcentration)}
385387
</div>
386388
<div>
387-
<strong>Desired Concentration:</strong> {formatNum(cfg.desiredConcentration)}
389+
<strong>{t('configurations.desired_concentration')}:</strong> {formatNum(cfg.desiredConcentration)}
388390
</div>
389391
<div>
390-
<strong>Refill Time:</strong> {formatNum(cfg.refillTime)}
392+
<strong>{t('configurations.refill_time')}:</strong> {formatNum(cfg.refillTime)}
391393
</div>
392394
</div>
393395
</>
@@ -403,7 +405,7 @@ export default function ConfigurationsPage() {
403405
<button
404406
key={i}
405407
className={"dot" + (i === index ? " active" : "")}
406-
aria-label={`Go to slide ${i + 1}`}
408+
aria-label={`${t('configurations.go_to_slide')} ${i + 1}`}
407409
onClick={() => { if (editingIndex === null) setIndex(i); }}
408410
/>
409411
))}

src/app/locales/en.json

Lines changed: 22 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,5 +80,26 @@
8080

8181
"mother solution max weight header 1" : "The Max Weight of the Mother Tank",
8282

83-
"mother solution max weight text 1" : "There is a recommended maximum weight of the mother tank, which is 50 kilograms. This is to ensure that the tank is manageable and the water is not strongly chlorinated."
83+
"mother solution max weight text 1" : "There is a recommended maximum weight of the mother tank, which is 50 kilograms. This is to ensure that the tank is manageable and the water is not strongly chlorinated.",
84+
85+
"configurations.no_configurations": "No configurations",
86+
"configurations.add_configuration_message": "Add a configuration to see it here.",
87+
"configurations.configuration": "Configuration",
88+
"configurations.edit": "Edit",
89+
"configurations.name": "Name",
90+
"configurations.description": "Description",
91+
"configurations.ms_volume": "MS Volume",
92+
"configurations.chlorine_percentage": "Chlorine %",
93+
"configurations.reservoir_ingress": "Reservoir Ingress",
94+
"configurations.chlorine_weight": "Chlorine Weight",
95+
"configurations.desired_drip_rate": "Desired Drip Rate",
96+
"configurations.ms_concentration": "MS Concentration",
97+
"configurations.desired_concentration": "Desired Concentration",
98+
"configurations.refill_time": "Refill Time",
99+
"configurations.save": "Save",
100+
"configurations.delete": "Delete",
101+
"configurations.cancel": "Cancel",
102+
"configurations.created": "Created",
103+
"configurations.delete_confirmation": "Delete this configuration? This cannot be undone.",
104+
"configurations.go_to_slide": "Go to slide"
84105
}

src/app/locales/es.json

Lines changed: 22 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -81,5 +81,26 @@
8181
"flow rate header 2" : "Contenedores",
8282

8383
"flow rate text 1" : "El caudal de entrada del reservorio es la tasa a la que el agua entra en el reservorio en litros por segundo. Se recomienda medir regularmente este caudal, ya que diferentes factores, como el clima o la época del año, pueden afectar la entrada de agua.",
84-
"flow rate text 2" : "Siempre que tenga el tamaño del contenedor y el tiempo que tarda en llenarse, puede usar cualquier contenedor para medir el caudal."
84+
"flow rate text 2" : "Siempre que tenga el tamaño del contenedor y el tiempo que tarda en llenarse, puede usar cualquier contenedor para medir el caudal.",
85+
86+
"configurations.no_configurations": "Sin configuraciones",
87+
"configurations.add_configuration_message": "Agregue una configuración para verla aquí.",
88+
"configurations.configuration": "Configuración",
89+
"configurations.edit": "Editar",
90+
"configurations.name": "Nombre",
91+
"configurations.description": "Descripción",
92+
"configurations.ms_volume": "Volumen MS",
93+
"configurations.chlorine_percentage": "% de Cloro",
94+
"configurations.reservoir_ingress": "Entrada del Reservorio",
95+
"configurations.chlorine_weight": "Peso del Cloro",
96+
"configurations.desired_drip_rate": "Tasa de Goteo Deseada",
97+
"configurations.ms_concentration": "Concentración MS",
98+
"configurations.desired_concentration": "Concentración Deseada",
99+
"configurations.refill_time": "Tiempo de Recarga",
100+
"configurations.save": "Guardar",
101+
"configurations.delete": "Eliminar",
102+
"configurations.cancel": "Cancelar",
103+
"configurations.created": "Creado",
104+
"configurations.delete_confirmation": "¿Eliminar esta configuración? Esto no se puede deshacer.",
105+
"configurations.go_to_slide": "Ir a la diapositiva"
85106
}

0 commit comments

Comments
 (0)