inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-3126] i18n support for info drawer tabs (#4698)

Browse Source 
* [ADF-3126] i18n support for info drawer tabs

* fix tests

* code fixes
This commit is contained in:
Denys Vuika
2019-05-07 17:31:22 +01:00
committed by Eugenio Romano
parent 58f7a2d0ee
commit 0e2e5e35a0
8 changed files with 27 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
demo-shell/src/app/components/file-view/file-view.component.html
View File

@@ -3,11 +3,11 @@
<ng-template let-node="node" #sidebarRightTemplate>
<adf-info-drawer [title]="'APP.INFO_DRAWER.TITLE' | translate">
<adf-info-drawer-tab [label]="'APP.INFO_DRAWER.COMMENTS' | translate">
<adf-info-drawer-tab label="APP.INFO_DRAWER.COMMENTS">
<adf-comments [nodeId]="nodeId" [readOnly]="!isCommentEnabled"></adf-comments>
</adf-info-drawer-tab>
<adf-info-drawer-tab [label]="'APP.INFO_DRAWER.PROPERTIES' | translate">
<adf-info-drawer-tab label="APP.INFO_DRAWER.PROPERTIES">
<adf-content-metadata-card *ngIf="isPreset" [node]="node"
[multi]="multi"
[preset]="customPreset"
@@ -104,7 +104,7 @@
</adf-info-drawer-tab>
<adf-info-drawer-tab [label]="'APP.INFO_DRAWER.VERSIONS' | translate">
<adf-info-drawer-tab label="APP.INFO_DRAWER.VERSIONS">
<mat-card>
<mat-card-content>
<adf-version-manager [node]="node"
@@ -120,7 +120,7 @@
<ng-template let-node="node" #sidebarLeftTemplate>
<adf-info-drawer [title]="'Viewer Options'">
<adf-info-drawer-tab [label]="'Settings'">
<adf-info-drawer-tab label="Settings">
<p class="toggle">
<mat-slide-toggle
id="adf-switch-custoname"

4
demo-shell/src/app/components/files/files.component.html
View File

@@ -447,13 +447,13 @@
<div info-drawer-content>
<adf-info-drawer [title]="'Details'" *ngIf="documentList.selection[0]">
<adf-info-drawer-tab [label]="'Properties'">
<adf-info-drawer-tab label="Properties">
<adf-content-metadata-card
[node]="documentList.selection[0].entry"
[displayEmpty]="displayEmptyMetadata">
</adf-content-metadata-card>
</adf-info-drawer-tab>
<adf-info-drawer-tab [label]="'Versions'">
<adf-info-drawer-tab label="Versions">
<ng-container *ngIf="hasOneFileSelected();else choose_document_template">
<ng-container *ngIf="userHasPermissionToManageVersions(); else no_permission_to_versions">
<adf-version-manager

2
docs/core/components/info-drawer-tab.component.md
View File

@@ -56,7 +56,7 @@ You can also combine `icon` and `label` properties.
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| icon | `string` | null | Icon to render for the tab. |
| label | `string` | "" | The title of the tab. |
| label | `string` | "" | The title of the tab (string or translation key). |
## Details

2
docs/core/components/info-drawer.component.md
View File

@@ -50,7 +50,7 @@ have any content you like:
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| selectedIndex | `number` | 0 | The selected index tab. |
| title | `string \| null` | null | The title of the info drawer. |
| title | `string \| null` | null | The title of the info drawer (string or translation key). |
### Events

6
lib/core/info-drawer/info-drawer.component.html
View File

@@ -1,5 +1,5 @@
<adf-info-drawer-layout>
<div *ngIf="title" info-drawer-title>{{title}}</div>
<div *ngIf="title" info-drawer-title>{{ title | translate }}</div>
<ng-content *ngIf="!title" info-drawer-title select="[info-drawer-title]"></ng-content>
<ng-content info-drawer-buttons select="[info-drawer-buttons]"></ng-content>
@@ -9,12 +9,12 @@
<ng-template #tabLayout>
<mat-tab-group [(selectedIndex)]="selectedIndex" class="adf-info-drawer-tabs" (selectedTabChange)="onTabChange($event)">
<mat-tab *ngFor="let contentBlock of contentBlocks"
[label]="contentBlock.label"
[label]="contentBlock.label | translate"
class="adf-info-drawer-tab">
<ng-template mat-tab-label>
<mat-icon *ngIf="contentBlock.icon">{{ contentBlock.icon }}</mat-icon>
<span *ngIf="contentBlock.label">{{ contentBlock.label }}</span>
<span *ngIf="contentBlock.label">{{ contentBlock.label | translate }}</span>
</ng-template>
<ng-container *ngTemplateOutlet="contentBlock.content"></ng-container>

10
lib/core/info-drawer/info-drawer.component.spec.ts
View File

@@ -23,11 +23,14 @@ import { InfoDrawerComponent } from './info-drawer.component';
import { setupTestBed } from '../testing/setupTestBed';
import { CoreModule } from '../core.module';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { of } from 'rxjs';
import { TranslateService } from '@ngx-translate/core';
describe('InfoDrawerComponent', () => {
let element: HTMLElement;
let component: InfoDrawerComponent;
let fixture: ComponentFixture<InfoDrawerComponent>;
let translateService: TranslateService;
setupTestBed({
imports: [
@@ -37,6 +40,9 @@ describe('InfoDrawerComponent', () => {
});
beforeEach(() => {
translateService = TestBed.get(TranslateService);
spyOn(translateService, 'get').and.callFake((key) => of(key));
fixture = TestBed.createComponent(InfoDrawerComponent);
element = fixture.nativeElement;
component = fixture.componentInstance;
@@ -87,6 +93,7 @@ class CustomInfoDrawerComponent extends InfoDrawerComponent {
describe('Custom InfoDrawer', () => {
let fixture: ComponentFixture<CustomInfoDrawerComponent>;
let component: CustomInfoDrawerComponent;
let translateService: TranslateService;
setupTestBed({
imports: [
@@ -99,6 +106,9 @@ describe('Custom InfoDrawer', () => {
});
beforeEach(() => {
translateService = TestBed.get(TranslateService);
spyOn(translateService, 'get').and.callFake((key) => of(key));
fixture = TestBed.createComponent(CustomInfoDrawerComponent);
fixture.detectChanges();
component = fixture.componentInstance;

4
lib/core/info-drawer/info-drawer.module.ts
View File

@@ -21,6 +21,7 @@ import { MaterialModule } from '../material.module';
import { InfoDrawerLayoutComponent, InfoDrawerTitleDirective, InfoDrawerButtonsDirective, InfoDrawerContentDirective } from './info-drawer-layout.component';
import { InfoDrawerComponent, InfoDrawerTabComponent } from './info-drawer.component';
import { TranslateModule } from '@ngx-translate/core';
export function declarations() {
return [
@@ -36,7 +37,8 @@ export function declarations() {
@NgModule({
imports: [
CommonModule,
MaterialModule
MaterialModule,
TranslateModule.forChild()
],
declarations: declarations(),
exports: declarations()

6
lib/process-services/task-list/components/task-details.component.html
View File

@@ -79,8 +79,8 @@
</div>
</div>
<div class="adf-task-details-core-sidebar">
<adf-info-drawer *ngIf="showHeaderContent" title="{{ 'ADF_TASK_LIST.DETAILS.LABELS.INFO_DRAWER_TITLE' | translate }}" id="adf-task-details-core-sidebar-drawer" class="adf-task-details-core-sidebar-drawer">
<adf-info-drawer-tab label="{{ 'ADF_TASK_LIST.DETAILS.LABELS.INFO_DRAWER_TAB_DETAILS_TITLE' | translate }}">
<adf-info-drawer *ngIf="showHeaderContent" title="ADF_TASK_LIST.DETAILS.LABELS.INFO_DRAWER_TITLE" id="adf-task-details-core-sidebar-drawer" class="adf-task-details-core-sidebar-drawer">
<adf-info-drawer-tab label="ADF_TASK_LIST.DETAILS.LABELS.INFO_DRAWER_TAB_DETAILS_TITLE">
<div class="adf-assignment-container" *ngIf="showAssignee">
<adf-people-search
(searchPeople)="searchUser($event)"
@@ -107,7 +107,7 @@
</adf-people>
</adf-info-drawer-tab>
<adf-info-drawer-tab label="{{ 'ADF_TASK_LIST.DETAILS.LABELS.INFO_DRAWER_TAB_ACTIVITY_TITLE' | translate }}">
<adf-info-drawer-tab label="ADF_TASK_LIST.DETAILS.LABELS.INFO_DRAWER_TAB_ACTIVITY_TITLE">
<mat-card *ngIf="showComments">
<mat-card-content>
<adf-comments #activitiComments