florian/codiki-hexagonal
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

i18n

Browse Source
This commit is contained in:
Florian THIERRY
2024-09-21 21:34:16 +02:00
parent 208b935ffa
commit f8d73c9ed0
12 changed files with 110 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/app/components/publication-edition/code-block-dialog/code-block-dialog.component.html
View File

@@ -2,12 +2,12 @@
<mat-icon>close</mat-icon>
</button>
<header>
<h1>Add a code block</h1>
<h1 i18n>Add a code block</h1>
</header>
<form [formGroup]="formGroup" (submit)="closeAndValidate()" ngNativeValidate>
<div class="form-content">
<mat-form-field>
<mat-label>Programming language</mat-label>
<mat-label i18n>Programming language</mat-label>
<mat-select #programmingLanguageSelect formControlName="programmingLanguage">
@for(programmingLanguage of programmingLanguages; track programmingLanguage) {
<mat-option [value]="programmingLanguage.code">
@@ -17,15 +17,15 @@
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-label>Code block</mat-label>
<mat-label i18n>Code block</mat-label>
<textarea matInput formControlName="codeBlock"></textarea>
</mat-form-field>
</div>
<div class="actions">
<button type="submit">
<button type="submit" i18n>
Validate
</button>
<button type="button" (click)="closeDialog()" class="secondary">
<button type="button" (click)="closeDialog()" class="secondary" i18n>
Cancel
</button>
</div>

12
frontend/src/app/components/publication-edition/picture-selection-dialog/picture-selection-dialog.component.html
View File

@@ -2,27 +2,27 @@
<mat-icon>close</mat-icon>
</button>
<header>
<h1>Select an illustration:</h1>
<h1 i18n>Select an illustration</h1>
</header>
<div class="picture-container">
@if (isLoading) {
<h2>Pictures loading...</h2>
<h2 i18n>Pictures loading...</h2>
<mat-spinner></mat-spinner>
} @else {
@if (pictures.length) {
@for(picture of pictures; track picture) {
<img src="/api/pictures/{{picture.id}}" (click)="selectPicture(picture)" matTooltip="Choose this illustration"/>
<img src="/api/pictures/{{picture.id}}" (click)="selectPicture(picture)" matTooltip="Choose this illustration" i18n-matTooltip/>
}
} @else {
<h2>There is no any picture.</h2>
<h2 i18n>There is no any picture.</h2>
}
}
</div>
<footer>
<button type="button" class="secondary" matRipple (click)="closeDialog()">
<button type="button" class="secondary" matRipple (click)="closeDialog()" i18n>
Cancel
</button>
<button type="button" (click)="fileUpload.click()" matRipple>
<button type="button" (click)="fileUpload.click()" matRipple i18n>
<mat-icon>upload_file</mat-icon>
Add new picture
</button>

8
frontend/src/app/components/publication-edition/picture-selection-dialog/picture-selection-dialog.component.ts
View File

@@ -34,9 +34,9 @@ export class PictureSelectionDialog implements OnInit {
if (error.status === 401) {
this.dialogRef.close();
} else {
const errorMessage = 'An error occured while loading pictures.';
const errorMessage = $localize`An error occured while loading pictures.`;
console.error(errorMessage, error);
this.snackBar.open(errorMessage, 'Close', { duration: 5000 });
this.snackBar.open(errorMessage, $localize`Close`, { duration: 5000 });
}
})
.finally(() => {
@@ -61,9 +61,9 @@ export class PictureSelectionDialog implements OnInit {
this.dialogRef.close(pictureId);
})
.catch(error => {
const errorMessage = 'A technical error occured while uploading your picture.';
const errorMessage = $localize`A technical error occured while uploading your picture.`;
console.error(errorMessage, error);
this.snackBar.open(errorMessage, 'Close', { duration: 5000 });
this.snackBar.open(errorMessage, $localize`Close`, { duration: 5000 });
});
}
}

4
frontend/src/app/components/publication-edition/picture-selection-dialog/picture-selection-dialog.service.ts
View File

@@ -16,9 +16,9 @@ export class PictureSelectionDialogService {
this.dialogRef.close(pictureId);
})
.catch(error => {
const errorMessage = 'An error occured while uploading a picture...';
const errorMessage = $localize`An error occured while uploading a picture...`;
console.error(errorMessage, error);
this.snackBar.open(errorMessage, 'Close', { duration: 5000 });
this.snackBar.open(errorMessage, $localize`Close`, { duration: 5000 });
});
}
}

33
frontend/src/app/components/publication-edition/publication-edition.component.html
View File

@@ -9,15 +9,15 @@
<div class="first-part">
<div>
<mat-form-field>
<mat-label>Title</mat-label>
<mat-label i18n>Title</mat-label>
<input matInput type="text" formControlName="title" />
</mat-form-field>
<mat-form-field>
<mat-label>Description</mat-label>
<mat-label i18n>Description</mat-label>
<input matInput type="text" formControlName="description" />
</mat-form-field>
<mat-form-field>
<mat-label>Category</mat-label>
<mat-label i18n>Category</mat-label>
<mat-select formControlName="categoryId">
@for (category of categories$ | async; track category) {
<mat-option [value]="category.id">
@@ -31,35 +31,36 @@
<div class="picture-container">
<img [src]="publication.illustrationId.length ? '/api/pictures/' + publication.illustrationId : '/assets/images/default-picture.png'"
(click)="displayPictureSectionDialog()"
matTooltip="Click to change illustration"/>
matTooltip="Click to change illustration"
i18n-matTooltip/>
</div>
</div>
<div class="actions">
<button type="button" matTooltip="Click to insert a title 1 section" (click)="insertTitle(1)">
<button type="button" matTooltip="Click to insert a title 1 section" (click)="insertTitle(1)" i18n-matTooltip>
H1
</button>
<button type="button" matTooltip="Click to insert a title 2 section" (click)="insertTitle(2)">
<button type="button" matTooltip="Click to insert a title 2 section" (click)="insertTitle(2)" i18n-matTooltip>
H2
</button>
<button type="button" matTooltip="Click to insert a title 1 section" (click)="insertTitle(3)">
<button type="button" matTooltip="Click to insert a title 1 section" (click)="insertTitle(3)" i18n-matTooltip>
H3
</button>
<button type="button" matTooltip="Click to insert a picture" (click)="selectAPicture()">
<button type="button" matTooltip="Click to insert a picture" (click)="selectAPicture()" i18n-matTooltip>
<mat-icon>image</mat-icon>
</button>
<button type="button" matTooltip="Click to insert a link" (click)="insertLink()">
<button type="button" matTooltip="Click to insert a link" (click)="insertLink()" i18n-matTooltip>
<mat-icon>link</mat-icon>
</button>
<button type="button" matTooltip="Click to insert a code block" (click)="displayCodeBlockDialog()">
<button type="button" matTooltip="Click to insert a code block" (click)="displayCodeBlockDialog()" i18n-matTooltip>
<mat-icon>code</mat-icon>
</button>
<button type="button" disabled matTooltip="Click to display editor help">
<button type="button" disabled matTooltip="Click to display editor help" i18n-matTooltip>
<mat-icon>help</mat-icon>
</button>
</div>
<mat-form-field class="example-form-field">
<mat-label>Content</mat-label>
<mat-form-field>
<mat-label i18n>Content</mat-label>
<textarea
#textArea
matInput
@@ -76,7 +77,7 @@
<div class="preview">
@if ((isPreviewing$ | async) === true) {
<div class="preview-loading">
<h2>Preview is loading...</h2>
<h2 i18n>Preview is loading...</h2>
<mat-spinner></mat-spinner>
</div>
} @else {
@@ -91,8 +92,8 @@
</mat-tab>
</mat-tab-group>
<footer>
<app-submit-button label="Save" [requestPending]="!!(isSaving$ | async)"></app-submit-button>
<button type="button" class="secondary" (click)="goPreviousLocation()">
<app-submit-button label="Save" [requestPending]="!!(isSaving$ | async)" i18n-label></app-submit-button>
<button type="button" class="secondary" (click)="goPreviousLocation()" i18n>
Cancel
</button>
</footer>

2
frontend/src/app/components/publication-edition/publication-edition.component.ts
View File

@@ -178,8 +178,6 @@ export class PublicationEditionComponent implements OnChanges, OnDestroy {
const positionStart = textarea.selectionStart;
const positionEnd = textarea.selectionEnd;
const selectedCharacterCount = positionEnd - positionStart;
console.log(`cursor position updated: [${positionStart}, ${positionEnd}] (${selectedCharacterCount})`);
this.publicationEditionService.editCursorPosition(positionStart, positionEnd);
}
}

6
frontend/src/app/components/publication-edition/publication-edition.service.ts
View File

@@ -101,7 +101,7 @@ export class PublicationEditionService implements OnDestroy {
this.activatedRoute.paramMap.subscribe(params => {
const publicationId = params.get('publicationId');
if (publicationId == undefined) {
this.snackBar.open('A technical error occurred while loading publication data.', 'Close', {duration: 5000});
this.snackBar.open($localize`A technical error occurred while loading publication data.`, $localize`Close`, { duration: 5000 });
this.location.back();
} else {
this.publicationRestService.getById(publicationId)
@@ -111,8 +111,8 @@ export class PublicationEditionService implements OnDestroy {
this.stateSubject.next(state);
})
.catch(error => {
const errorMessage = 'A technical error occurred while loading publication data.';
this.snackBar.open(errorMessage, 'Close', {duration: 5000});
const errorMessage = $localize`A technical error occurred while loading publication data.`;
this.snackBar.open(errorMessage, $localize`Close`, {duration: 5000});
console.error(errorMessage, error)
})
.finally(() => this.isLoadingSubject.next(false));

4
frontend/src/app/components/side-menu/side-menu.component.html
View File

@@ -4,11 +4,11 @@
<img src="assets/images/codiki.png" alt="logo"/>
Codiki
</a>
<button type="button" (click)="close()" matTooltip="Close the menu">
<button type="button" (click)="close()" matTooltip="Close the menu" i18n-matTooltip>
<mat-icon>close</mat-icon>
</button>
</h1>
<h2>Catégories</h2>
<h2 i18n>Categories</h2>
<app-categories-menu (categoryClicked)="close()"></app-categories-menu>
</div>
<div class="overlay {{ isOpenned ? 'displayed' : ''}}" (click)="close()"></div>

33
frontend/src/app/components/side-menu/side-menu.service.ts
View File

@@ -1,9 +1,8 @@
import { Injectable, OnDestroy, inject } from '@angular/core';
import { CategoryService } from '../../core/service/category.service';
import { BehaviorSubject, Observable, Subscription, map } from 'rxjs';
import { Category } from '../../core/rest-services/category/model/category';
import { CategoryRestService } from '../../core/rest-services/category/category.rest-service';
import { Injectable, inject } from '@angular/core';
import { MatSnackBar } from '@angular/material/snack-bar';
import { BehaviorSubject, Observable } from 'rxjs';
import { CategoryRestService } from '../../core/rest-services/category/category.rest-service';
import { Category } from '../../core/rest-services/category/model/category';
export interface DisplayableCategory {
id: string;
@@ -20,31 +19,13 @@ export interface DisplayableSubCategory {
@Injectable({
providedIn: 'root'
})
export class SideMenuService implements OnDestroy {
export class SideMenuService {
private categoryRestService = inject(CategoryRestService);
private snackBar = inject(MatSnackBar);
private categoriesSubject = new BehaviorSubject<DisplayableCategory[]>([]);
private isLoadingSubject = new BehaviorSubject<boolean>(false);
private isLoadedSubject = new BehaviorSubject<boolean>(false);
constructor() {
// this.categoriesSubscription = this.categoryService.categories$
// .pipe(
// map(categories =>
// categories
// .filter(category => category.subCategories?.length)
// .map(category =>
// this.mapToDisplayableCategory(category)
// )
// )
// )
// .subscribe(categories => this.categoriesSubject.next(categories));
}
ngOnDestroy(): void {
// this.categoriesSubscription?.unsubscribe();
}
private mapToDisplayableCategory(category: Category): DisplayableCategory {
return {
id: category.id,
@@ -89,9 +70,9 @@ export class SideMenuService implements OnDestroy {
this.categoriesSubject.next(displayableCategories);
})
.catch(error => {
const errorMessage = "An error occured while loading categories.";
const errorMessage = $localize`An error occured while loading categories.`;
console.error(errorMessage, error);
this.snackBar.open(errorMessage, 'Close', { duration: 5000 });
this.snackBar.open(errorMessage, $localize`Close`, { duration: 5000 });
})
.finally(() => {
this.isLoadingSubject.next(false);