Skip to content

Commit ddb6564

Browse files
ani-ibDouglas-SarahMoSchmidtaz108
authored
Development: Add translation to tables, buttons, and button groups (#270)
* add translation in dynamic table component * add translation to job states * add translation functionality for buttons and button groups * remove translation instant for job detail page * remove pipes in my positions page * remove pipes and translation.instant in job creation form * add translation for job overview page * feat: translation for step component, applicant table translation * fix: client-style * add translation keys for evaluation table * fix: parts of client-test fix * fix: client style * fix job.json * fix: client tests * fix: client style * add tooltip for job creation form * fix: client style * add tooltip for job creation form * Delete src/main/webapp/i18n/de.json * Delete src/main/webapp/i18n/en.json --------- Co-authored-by: Sarah Douglas <sarah.douglas@gmx.de> Co-authored-by: Moritz <moritzschmidt1@gmail.com> Co-authored-by: Aniruddh Zaveri <92953467+az108@users.noreply.github.com>
1 parent 887fca5 commit ddb6564

30 files changed

Lines changed: 374 additions & 115 deletions

src/main/webapp/app/application/application-creation/application-creation-form/application-creation-form.component.ts

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -117,8 +117,9 @@ export default class ApplicationCreationFormComponent {
117117
const updateDocumentInformation = this.updateDocumentInformation;
118118
if (panel1) {
119119
steps.push({
120-
name: 'Personal Information',
120+
name: 'entity.applicationSteps.personalInformation',
121121
panelTemplate: panel1,
122+
shouldTranslate: true,
122123
buttonGroupPrev: [
123124
{
124125
variant: 'outlined',
@@ -129,8 +130,9 @@ export default class ApplicationCreationFormComponent {
129130
location.back();
130131
},
131132
disabled: false,
132-
label: 'Cancel',
133+
label: 'entity.applicationSteps.buttons.cancel',
133134
changePanel: false,
135+
shouldTranslate: true,
134136
},
135137
],
136138
buttonGroupNext: [
@@ -148,8 +150,9 @@ export default class ApplicationCreationFormComponent {
148150
}
149151
if (panel2) {
150152
steps.push({
151-
name: 'Education',
153+
name: 'entity.applicationSteps.education',
152154
panelTemplate: panel2,
155+
shouldTranslate: true,
153156
buttonGroupPrev: [
154157
{
155158
variant: 'outlined',
@@ -159,7 +162,8 @@ export default class ApplicationCreationFormComponent {
159162
updateDocumentInformation();
160163
},
161164
disabled: false,
162-
label: 'Prev',
165+
label: 'entity.applicationSteps.buttons.prev',
166+
shouldTranslate: true,
163167
changePanel: true,
164168
},
165169
],
@@ -171,7 +175,8 @@ export default class ApplicationCreationFormComponent {
171175
updateDocumentInformation();
172176
},
173177
disabled: false,
174-
label: 'Next',
178+
label: 'entity.applicationSteps.buttons.next',
179+
shouldTranslate: true,
175180
changePanel: true,
176181
},
177182
],
@@ -180,7 +185,8 @@ export default class ApplicationCreationFormComponent {
180185
}
181186
if (panel3) {
182187
steps.push({
183-
name: 'Application Details',
188+
name: 'entity.applicationSteps.applicationDetails',
189+
shouldTranslate: true,
184190
panelTemplate: panel3,
185191
buttonGroupPrev: [
186192
{
@@ -191,7 +197,8 @@ export default class ApplicationCreationFormComponent {
191197
updateDocumentInformation();
192198
},
193199
disabled: false,
194-
label: 'Prev',
200+
label: 'entity.applicationSteps.buttons.prev',
201+
shouldTranslate: true,
195202
changePanel: true,
196203
},
197204
],
@@ -203,7 +210,8 @@ export default class ApplicationCreationFormComponent {
203210
sendData('SENT');
204211
},
205212
disabled: this.allPagesValid(),
206-
label: 'Send',
213+
label: 'entity.applicationSteps.buttons.send',
214+
shouldTranslate: true,
207215
changePanel: false,
208216
},
209217
],

src/main/webapp/app/application/application-overview-for-applicant/application-overview-for-applicant.component.spec.ts

Lines changed: 29 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
import { ComponentFixture, TestBed } from '@angular/core/testing';
22
import { ApplicationForApplicantDTO, ApplicationOverviewDTO, ApplicationResourceService } from 'app/generated';
3-
import { Observable, of } from 'rxjs';
3+
import { Observable, Subject, of } from 'rxjs';
44
import { HttpResponse } from '@angular/common/http';
55
import { AccountService } from 'app/core/auth/account.service';
6+
import { MissingTranslationHandler, TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core';
67

78
import ApplicationOverviewForApplicantComponent from './application-overview-for-applicant.component';
89

@@ -21,6 +22,20 @@ class MockApplicationResourceService {
2122
}
2223
}
2324

25+
class FakeLoader implements TranslateLoader {
26+
getTranslation(): Observable<{}> {
27+
return of({}); // return an empty object or mock translations
28+
}
29+
}
30+
31+
class MockTranslateService {
32+
onLangChange = new Subject();
33+
onTranslationChange = new Subject();
34+
onDefaultLangChange = new Subject();
35+
36+
get = jest.fn().mockImplementation((key: string) => of(key));
37+
}
38+
2439
const mockApplications: ApplicationOverviewDTO[] = [
2540
{
2641
applicationId: 'app-001',
@@ -72,7 +87,14 @@ describe('ApplicationOverviewForApplicantComponent', () => {
7287

7388
beforeEach(async () => {
7489
await TestBed.configureTestingModule({
75-
imports: [ApplicationOverviewForApplicantComponent],
90+
imports: [
91+
ApplicationOverviewForApplicantComponent,
92+
TranslateModule.forRoot({
93+
loader: { provide: TranslateLoader, useClass: FakeLoader },
94+
defaultLanguage: 'en',
95+
useDefaultLang: true,
96+
}),
97+
],
7698
providers: [
7799
{
78100
provide: ApplicationResourceService,
@@ -84,6 +106,11 @@ describe('ApplicationOverviewForApplicantComponent', () => {
84106
loadedUser: jest.fn().mockReturnValue(of({ id: 'id_for_test' })),
85107
},
86108
},
109+
{
110+
provide: MissingTranslationHandler,
111+
useValue: { handle: jest.fn() },
112+
},
113+
{ provide: TranslateService, useClass: MockTranslateService },
87114
],
88115
}).compileComponents();
89116

src/main/webapp/app/application/application-overview-for-applicant/application-overview-for-applicant.component.ts

Lines changed: 27 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -42,11 +42,33 @@ export default class ApplicationOverviewForApplicantComponent {
4242
const actionTemplate = this.actionTemplate();
4343
const badgeTemplate = this.badgeTemplate();
4444
return [
45-
{ field: 'jobTitle', header: 'Position Title', width: '34rem' },
46-
{ field: 'researchGroup', header: 'Research Group', width: '20rem' },
47-
{ field: 'badges', header: 'Status', width: '10rem', template: badgeTemplate },
48-
{ field: 'timeSinceCreation', header: 'Created', width: '10rem' },
49-
{ field: 'actions', header: '', width: '15rem', template: actionTemplate },
45+
{
46+
field: 'jobTitle',
47+
header: 'entity.applicationOverview.columns.positionTitle',
48+
width: '34rem',
49+
},
50+
{
51+
field: 'researchGroup',
52+
header: 'entity.applicationOverview.columns.researchGroup',
53+
width: '20rem',
54+
},
55+
{
56+
field: 'badges',
57+
header: 'entity.applicationOverview.columns.status',
58+
width: '10rem',
59+
template: badgeTemplate,
60+
},
61+
{
62+
field: 'timeSinceCreation',
63+
header: 'entity.applicationOverview.columns.created',
64+
width: '10rem',
65+
},
66+
{
67+
field: 'actions',
68+
header: '',
69+
width: '15rem',
70+
template: actionTemplate,
71+
},
5072
];
5173
});
5274

src/main/webapp/app/evaluation/application-overview/application-overview.component.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -49,17 +49,17 @@ export class ApplicationOverviewComponent {
4949
const tpl = this.actionTemplate();
5050
const stateTpl = this.stateTemplate();
5151
return [
52-
{ field: 'name', header: 'Name', width: '12rem' },
52+
{ field: 'name', header: 'evaluation.tableHeaders.name', width: '12rem' },
5353
{
5454
field: 'state',
55-
header: 'Status',
55+
header: 'evaluation.tableHeaders.status',
5656
width: '10rem',
5757
alignCenter: true,
5858
template: stateTpl,
5959
},
60-
{ field: 'jobName', header: 'Job', width: '26rem' },
60+
{ field: 'jobName', header: 'evaluation.tableHeaders.job', width: '26rem' },
6161
// { field: 'rating', header: 'Rating', width: '10rem' },
62-
{ field: 'appliedAt', header: 'Applied at', type: 'date', width: '10rem' },
62+
{ field: 'appliedAt', header: 'evaluation.tableHeaders.appliedAt', type: 'date', width: '10rem' },
6363
{ field: 'actions', header: '', width: '5rem', template: tpl },
6464
];
6565
});

src/main/webapp/app/job/job-detail/job-detail.component.html

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,11 @@ <h1 class="job-title">{{ jobDetails()?.title }}</h1>
88
@if (jobDetails()?.jobState) {
99
<jhi-tag
1010
class="job-state-badge"
11-
[text]="stateTextMap()[jobDetails()?.jobState!] || 'Unknown'"
11+
[text]="
12+
stateTextMap()[jobDetails()?.jobState!]
13+
? (stateTextMap()[jobDetails()?.jobState!] | translate)
14+
: ('jobState.unknown' | translate)
15+
"
1216
[color]="stateSeverityMap()[jobDetails()?.jobState!] || 'info'"
1317
/>
1418
} @else {
@@ -178,12 +182,12 @@ <h2 class="section-title" jhiTranslate="jobDetailPage.dataPrivacy.dataProtection
178182
<div class="button-wrapper">
179183
<!-- Left-aligned Back button -->
180184
<div class="left-buttons">
181-
<jhi-button label="Back" severity="info" variant="outlined" (click)="onBack()" />
185+
<jhi-button label="jobActionButton.back" severity="info" variant="outlined" (click)="onBack()" [shouldTranslate]="true" />
182186
</div>
183187
<!-- Right-aligned dynamic button group -->
184188
<div class="right-buttons">
185189
@if (rightActionButtons()) {
186-
<jhi-button-group [data]="rightActionButtons()!" />
190+
<jhi-button-group [data]="rightActionButtons()!" [shouldTranslate]="true" />
187191
}
188192
</div>
189193
</div>

src/main/webapp/app/job/job-detail/job-detail.component.ts

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -72,10 +72,11 @@ export class JobDetailComponent {
7272
direction: 'horizontal',
7373
buttons: [
7474
{
75-
label: this.translate.instant('jobActionButton.apply'),
75+
label: 'jobActionButton.apply',
7676
severity: 'primary',
7777
onClick: () => this.onApply(),
7878
disabled: false,
79+
shouldTranslate: true,
7980
},
8081
],
8182
};
@@ -86,17 +87,19 @@ export class JobDetailComponent {
8687
direction: 'horizontal',
8788
buttons: [
8889
{
89-
label: this.translate.instant('jobActionButton.edit'),
90+
label: 'jobActionButton.edit',
9091
severity: 'primary',
9192
variant: 'outlined',
9293
onClick: () => this.onEditJob(),
9394
disabled: false,
95+
shouldTranslate: true,
9496
},
9597
{
96-
label: this.translate.instant('jobActionButton.delete'),
98+
label: 'jobActionButton.delete',
9799
severity: 'danger',
98100
onClick: () => void this.onDeleteJob(),
99101
disabled: false,
102+
shouldTranslate: true,
100103
},
101104
],
102105
};
@@ -107,11 +110,12 @@ export class JobDetailComponent {
107110
direction: 'horizontal',
108111
buttons: [
109112
{
110-
label: this.translate.instant('jobActionButton.close'),
113+
label: 'jobActionButton.close',
111114
severity: 'danger',
112115
variant: 'outlined',
113116
onClick: () => void this.onCloseJob(),
114117
disabled: false,
118+
shouldTranslate: true,
115119
},
116120
],
117121
};
@@ -121,10 +125,10 @@ export class JobDetailComponent {
121125
});
122126

123127
readonly stateTextMap = computed<Record<string, string>>(() => ({
124-
DRAFT: this.translate.instant('jobState.draft'),
125-
PUBLISHED: this.translate.instant('jobState.published'),
126-
CLOSED: this.translate.instant('jobState.closed'),
127-
APPLICANT_FOUND: this.translate.instant('jobState.applicantFound'),
128+
DRAFT: 'jobState.draft',
129+
PUBLISHED: 'jobState.published',
130+
CLOSED: 'jobState.closed',
131+
APPLICANT_FOUND: 'jobState.applicantFound',
128132
}));
129133

130134
readonly stateSeverityMap = signal<Record<string, 'success' | 'warn' | 'danger' | 'info'>>({

src/main/webapp/app/job/job-overview/job-card-list/job-card-list.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
}
2222
</div>
2323
} @else {
24-
<p class="no-jobs-text">No jobs found.</p>
24+
<p class="no-jobs-text" jhiTranslate="jobOverviewPage.noJobsFound"></p>
2525
}
2626
<p-table
2727
[value]="jobs()"

src/main/webapp/app/job/job-overview/job-card-list/job-card-list.component.spec.ts

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,15 @@ import { FaIconLibrary } from '@fortawesome/angular-fontawesome';
44
import { faArrowDown19, faArrowDownAZ, faArrowUp19, faArrowUpAZ, faChevronDown, faGraduationCap } from '@fortawesome/free-solid-svg-icons';
55
import { of } from 'rxjs';
66
import { JobResourceService, PageJobCardDTO } from 'app/generated';
7-
import { TranslateModule } from '@ngx-translate/core';
7+
import {
8+
MissingTranslationHandler,
9+
TranslateCompiler,
10+
TranslateLoader,
11+
TranslateModule,
12+
TranslateParser,
13+
TranslateService,
14+
TranslateStore,
15+
} from '@ngx-translate/core';
816

917
import { JobCardListComponent } from './job-card-list.component';
1018

@@ -24,7 +32,19 @@ describe('JobCardListComponent', () => {
2432
beforeEach(async () => {
2533
await TestBed.configureTestingModule({
2634
imports: [JobCardListComponent, TranslateModule.forRoot()],
27-
providers: [{ provide: JobResourceService, useValue: mockJobService }, provideHttpClientTesting()],
35+
providers: [
36+
{ provide: JobResourceService, useValue: mockJobService },
37+
provideHttpClientTesting(),
38+
TranslateStore,
39+
TranslateLoader,
40+
TranslateCompiler,
41+
TranslateParser,
42+
{
43+
provide: MissingTranslationHandler,
44+
useValue: { handle: jest.fn() },
45+
},
46+
TranslateService,
47+
],
2848
}).compileComponents();
2949

3050
const library = TestBed.inject(FaIconLibrary);
@@ -66,6 +86,6 @@ describe('JobCardListComponent', () => {
6686
fixture.detectChanges();
6787
const noJobsText = fixture.nativeElement.querySelector('.no-jobs-text');
6888
expect(noJobsText).toBeTruthy();
69-
expect(noJobsText.textContent).toContain('No jobs found');
89+
expect(noJobsText.textContent).toContain('jobOverviewPage.noJobsFound');
7090
});
7191
});

src/main/webapp/app/job/job-overview/job-card/job-card.component.html

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,15 @@
2222
</ul>
2323

2424
<div class="card-actions">
25-
<jhi-button severity="primary" variant="outlined" label="View Details" (click)="onViewDetails()" class="view-button" />
26-
<jhi-button severity="primary" label="Apply" (click)="onApply()" class="apply-button" />
25+
<jhi-button
26+
severity="primary"
27+
variant="outlined"
28+
label="jobActionButton.view"
29+
(click)="onViewDetails()"
30+
class="view-button"
31+
[shouldTranslate]="true"
32+
/>
33+
<jhi-button severity="primary" label="jobActionButton.apply" (click)="onApply()" class="apply-button" [shouldTranslate]="true" />
2734
</div>
2835
</div>
2936
</p-card>

0 commit comments

Comments
 (0)