Skip to content

Commit 684bfcd

Browse files
committed
add translation to text field in content
1 parent cd4552e commit 684bfcd

File tree

10 files changed

+139
-50
lines changed

10 files changed

+139
-50
lines changed
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
export interface TranslateData {
22
content: string;
3-
sourceLocale: string;
3+
sourceLocale?: string;
44
targetLocale: string;
55
}

functions/src/translate.ts

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,12 @@ export const translate = onCall<TranslateData>(async request => {
1010
logger.info('[translate] context.auth: ' + JSON.stringify(request.auth));
1111
const { content, sourceLocale, targetLocale } = request.data;
1212
if (!canPerform(UserPermission.TRANSLATION_UPDATE, request.auth)) throw new HttpsError('permission-denied', 'permission-denied');
13-
if (!(SUPPORT_LOCALES.has(sourceLocale) && SUPPORT_LOCALES.has(targetLocale)))
14-
throw new HttpsError('invalid-argument', 'Unsupported language');
13+
if (sourceLocale && !SUPPORT_LOCALES.has(sourceLocale)) {
14+
throw new HttpsError('invalid-argument', `Unsupported source locale : '${sourceLocale}'`);
15+
}
16+
if (!SUPPORT_LOCALES.has(targetLocale)) {
17+
throw new HttpsError('invalid-argument', `Unsupported target locale : '${targetLocale}'`);
18+
}
1519

1620
const projectId = firebaseConfig.projectId;
1721
let locationId; // firebaseConfig.locationId || 'global'

src/app/features/spaces/contents/contents.module.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ import { ContentHistoryService } from '@shared/services/content-history.service'
2626
import { MarkdownModule } from 'ngx-markdown';
2727
import { MoveDialogComponent } from './move-dialog/move-dialog.component';
2828
import { StatusComponent } from '@shared/components/status';
29+
import { TranslateService } from '@shared/services/translate.service';
2930

3031
@NgModule({
3132
declarations: [
@@ -54,6 +55,7 @@ import { StatusComponent } from '@shared/components/status';
5455
AssetService,
5556
TaskService,
5657
TokenService,
58+
TranslateService,
5759
],
5860
})
5961
export class ContentsModule {}

src/app/features/spaces/contents/edit-document-schema/edit-document-schema.component.html

Lines changed: 56 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -4,21 +4,34 @@
44
@switch (field.kind) {
55
<!--TEXT-->
66
@case ('TEXT') {
7-
<mat-form-field [floatLabel]="isDefaultLocale ? 'auto' : 'always'">
7+
<mat-form-field [floatLabel]="isDefaultLocale() ? 'auto' : 'always'">
88
<mat-label>{{ field.displayName || field.name }}</mat-label>
99
<input
1010
matInput
1111
type="text"
1212
[formControlName]="field.name"
1313
[attr.minlength]="field.minLength"
1414
[attr.maxlength]="field.maxLength"
15-
[placeholder]="!isDefaultLocale && data[field.name]"
15+
[placeholder]="!isDefaultLocale() && data[field.name]"
1616
autocomplete="off" />
17-
<!--<span matTextPrefix *ngIf="field.translatable && !isDefaultLocale">
18-
<mat-slide-toggle [checked]="form.controls[field.name].enabled" (change)="markFiledAvailable($event, field)" />
19-
</span>-->
2017
@if (field.translatable) {
21-
<mat-icon matIconSuffix matTooltip="The field is translatable">language</mat-icon>
18+
<button
19+
[matMenuTriggerFor]="tMenu"
20+
[disabled]="isDefaultLocale()"
21+
mat-icon-button
22+
matSuffix
23+
matTooltip="Translate the field with AI">
24+
<mat-icon>translate</mat-icon>
25+
<mat-menu #tMenu="matMenu">
26+
@for (locale of availableLocales(); track locale.id) {
27+
@if (locale.id !== selectedLocaleId()) {
28+
<button mat-menu-item (click)="translate(field.name, locale.id, selectedLocaleId())">
29+
Translate from <b>{{ locale.name }}</b> to <b>{{ selectedLocale().name }}</b>
30+
</button>
31+
}
32+
}
33+
</mat-menu>
34+
</button>
2235
}
2336
@if (field.description) {
2437
<mat-hint>{{ field.description }}</mat-hint>
@@ -33,7 +46,7 @@
3346
}
3447
<!--TEXTAREA-->
3548
@case ('TEXTAREA') {
36-
<mat-form-field [floatLabel]="isDefaultLocale ? 'auto' : 'always'">
49+
<mat-form-field [floatLabel]="isDefaultLocale() ? 'auto' : 'always'">
3750
<mat-label>{{ field.displayName || field.name }}</mat-label>
3851
<textarea
3952
matInput
@@ -43,10 +56,26 @@
4356
[formControlName]="field.name"
4457
[attr.minLength]="field.minLength"
4558
[attr.maxlength]="field.maxLength"
46-
[placeholder]="!isDefaultLocale && data[field.name]"
59+
[placeholder]="!isDefaultLocale() && data[field.name]"
4760
autocomplete="off"></textarea>
4861
@if (field.translatable) {
49-
<mat-icon matIconSuffix matTooltip="The field is translatable">language</mat-icon>
62+
<button
63+
[matMenuTriggerFor]="tMenu"
64+
[disabled]="isDefaultLocale()"
65+
mat-icon-button
66+
matSuffix
67+
matTooltip="Translate the field with AI">
68+
<mat-icon>translate</mat-icon>
69+
<mat-menu #tMenu="matMenu">
70+
@for (locale of availableLocales(); track locale.id) {
71+
@if (locale.id !== selectedLocaleId()) {
72+
<button mat-menu-item (click)="translate(field.name, locale.id, selectedLocaleId())">
73+
Translate from <b>{{ locale.name }}</b> to <b>{{ selectedLocale().name }}</b>
74+
</button>
75+
}
76+
}
77+
</mat-menu>
78+
</button>
5079
}
5180
@if (field.description) {
5281
<mat-hint>{{ field.description }}</mat-hint>
@@ -96,15 +125,15 @@
96125
}
97126
<!--NUMBER-->
98127
@case ('NUMBER') {
99-
<mat-form-field [floatLabel]="isDefaultLocale ? 'auto' : 'always'">
128+
<mat-form-field [floatLabel]="isDefaultLocale() ? 'auto' : 'always'">
100129
<mat-label>{{ field.displayName || field.name }}</mat-label>
101130
<input
102131
matInput
103132
type="number"
104133
[formControlName]="field.name"
105134
[attr.min]="field.minValue"
106135
[attr.max]="field.maxValue"
107-
[placeholder]="!isDefaultLocale && data[field.name]"
136+
[placeholder]="!isDefaultLocale() && data[field.name]"
108137
autocomplete="off" />
109138
@if (field.translatable) {
110139
<mat-icon matIconSuffix matTooltip="The field is translatable">language</mat-icon>
@@ -119,15 +148,15 @@
119148
}
120149
<!--COLOR-->
121150
@case ('COLOR') {
122-
<mat-form-field [floatLabel]="isDefaultLocale ? 'auto' : 'always'">
151+
<mat-form-field [floatLabel]="isDefaultLocale() ? 'auto' : 'always'">
123152
<mat-label>{{ field.displayName || field.name }}</mat-label>
124153
<input
125154
matInput
126155
type="color"
127156
[formControlName]="field.name"
128157
[attr.min]="field.minValue"
129158
[attr.max]="field.maxValue"
130-
[placeholder]="!isDefaultLocale && data[field.name]"
159+
[placeholder]="!isDefaultLocale() && data[field.name]"
131160
autocomplete="off" />
132161
@if (field.translatable) {
133162
<mat-icon matIconSuffix matTooltip="The field is translatable">language</mat-icon>
@@ -142,13 +171,13 @@
142171
}
143172
<!--DATE-->
144173
@case ('DATE') {
145-
<mat-form-field [floatLabel]="isDefaultLocale ? 'auto' : 'always'">
174+
<mat-form-field [floatLabel]="isDefaultLocale() ? 'auto' : 'always'">
146175
<mat-label>{{ field.displayName || field.name }}</mat-label>
147176
<input
148177
matInput
149178
type="date"
150179
[formControlName]="field.name"
151-
[placeholder]="!isDefaultLocale && data[field.name]"
180+
[placeholder]="!isDefaultLocale() && data[field.name]"
152181
autocomplete="off" />
153182
@if (field.translatable) {
154183
<mat-icon matIconSuffix matTooltip="The field is translatable">language</mat-icon>
@@ -163,13 +192,13 @@
163192
}
164193
<!--DATE TIME-->
165194
@case ('DATETIME') {
166-
<mat-form-field [floatLabel]="isDefaultLocale ? 'auto' : 'always'">
195+
<mat-form-field [floatLabel]="isDefaultLocale() ? 'auto' : 'always'">
167196
<mat-label>{{ field.displayName || field.name }}</mat-label>
168197
<input
169198
matInput
170199
type="datetime-local"
171200
[formControlName]="field.name"
172-
[placeholder]="!isDefaultLocale && data[field.name]"
201+
[placeholder]="!isDefaultLocale() && data[field.name]"
173202
autocomplete="off" />
174203
@if (field.translatable) {
175204
<mat-icon matIconSuffix matTooltip="The field is translatable">language</mat-icon>
@@ -202,7 +231,7 @@
202231
}
203232
<!--OPTION-->
204233
@case ('OPTION') {
205-
<mat-form-field [floatLabel]="isDefaultLocale ? 'auto' : 'always'">
234+
<mat-form-field [floatLabel]="isDefaultLocale() ? 'auto' : 'always'">
206235
<mat-label>{{ field.displayName || field.name }}</mat-label>
207236
<mat-select [formControlName]="field.name">
208237
@if (!field.required) {
@@ -234,7 +263,7 @@
234263
}
235264
<!--OPTIONS-->
236265
@case ('OPTIONS') {
237-
<mat-form-field [floatLabel]="isDefaultLocale ? 'auto' : 'always'">
266+
<mat-form-field [floatLabel]="isDefaultLocale() ? 'auto' : 'always'">
238267
<mat-label>{{ field.displayName || field.name }}</mat-label>
239268
<mat-select [formControlName]="field.name" multiple>
240269
<!--Handle source not defined in previous versions-->
@@ -264,7 +293,11 @@
264293
<!--LINK-->
265294
@case ('LINK') {
266295
@if (form.controls[field.name]; as control) {
267-
<ll-link-select [form]="control" [component]="field" [documents]="documents" [default]="!isDefaultLocale && data[field.name]" />
296+
<ll-link-select
297+
[form]="control"
298+
[component]="field"
299+
[documents]="documents"
300+
[default]="!isDefaultLocale() && data[field.name]" />
268301
}
269302
}
270303
<!--REFERENCE-->
@@ -318,7 +351,7 @@
318351
{{ sch.displayName }} <span class="schema-id">#{{ sch.id }}</span>
319352
@if (sch.previewField) {
320353
<div matListItemLine>
321-
{{ previewText(item, sch, locale) }}
354+
{{ previewText(item, sch, selectedLocaleId()) }}
322355
</div>
323356
}
324357
</div>
@@ -371,7 +404,7 @@
371404
{{ sch.displayName }} <span class="schema-id">#{{ sch.id }}</span>
372405
@if (sch.previewField) {
373406
<div matListItemLine>
374-
{{ previewText(item, sch, locale) }}
407+
{{ previewText(item, sch, selectedLocaleId()) }}
375408
</div>
376409
}
377410
</div>
@@ -434,7 +467,7 @@
434467
<mat-expansion-panel-header>
435468
<mat-panel-title>EditDocumentSchema Form => {{ form?.valid }}</mat-panel-title>
436469
</mat-expansion-panel-header>
437-
<pre>isDefaultLocale = {{ isDefaultLocale }}</pre>
470+
<pre>isDefaultLocale = {{ isDefaultLocale() }}</pre>
438471
<pre>{{ form.value | json }}</pre>
439472
<pre>{{ form.errors | json }}</pre>
440473
</mat-expansion-panel>

0 commit comments

Comments
 (0)