inteligr8/alfresco-content-app
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-content-app.git synced 2025-05-12 17:04:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-5611] Add custom metadata side panels as new extension feature (#3466)

Browse Source 
* [ACS-5611] Add custom metadata panels as new extensions feature

* [ACS-5611] Add custom metadata panels unit tests

* [ACS-5611] Minor fixes

* [ACS-5611] Text ellipsis for name column to always display badges

* [ACS-5611] Use latest ADF and JS-API

* [ACS-5611] Unit test fix

* [ACS-5611] Click action only if exists
This commit is contained in:
MichalKinas 2023-10-16 10:43:04 +02:00 committed by GitHub
parent bc98af0968
commit 928c6b5731
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 166 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
extension.schema.json
View File

@ -641,6 +641,12 @@
}
]
},
"customMetadataPanels": {
"description": "List of cutom metadata panels to display in metadata card component",
"type": "array",
"items": { "ref": "#/definitions/contentActionRef" },
"minItems": 1
},
"badges": {
"description": "List of badges to display in the name column",
"type": "array",

78
package-lock.json generated
View File

@ -10,11 +10,11 @@
"hasInstallScript": true,
"license": "LGPL-3.0",
"dependencies": {
"@alfresco/adf-content-services": "6.4.0-6377399867",
"@alfresco/adf-core": "6.4.0-6377399867",
"@alfresco/adf-extensions": "6.4.0-6377399867",
"@alfresco/eslint-plugin-eslint-angular": "6.4.0-6377399867",
"@alfresco/js-api": "7.1.0-1371",
"@alfresco/adf-content-services": "6.4.0-6497510485",
"@alfresco/adf-core": "6.4.0-6497510485",
"@alfresco/adf-extensions": "6.4.0-6497510485",
"@alfresco/eslint-plugin-eslint-angular": "6.4.0-6497510485",
"@alfresco/js-api": "7.1.0-1384",
"@angular/animations": "14.1.3",
"@angular/cdk": "14.1.3",
"@angular/common": "14.1.3",
@ -46,8 +46,8 @@
"zone.js": "0.11.8"
},
"devDependencies": {
"@alfresco/adf-cli": "6.4.0-6377399867",
"@alfresco/adf-testing": "6.4.0-6377399867",
"@alfresco/adf-cli": "6.4.0-6497510485",
"@alfresco/adf-testing": "6.4.0-6497510485",
"@angular-devkit/build-angular": "14.2.11",
"@angular-devkit/core": "14.1.2",
"@angular-devkit/schematics": "14.1.2",
@ -120,12 +120,12 @@
"dev": true
},
"node_modules/@alfresco/adf-cli": {
"version": "6.4.0-6377399867",
"resolved": "https://registry.npmjs.org/@alfresco/adf-cli/-/adf-cli-6.4.0-6377399867.tgz",
"integrity": "sha512-PtPtUdP1p3r7QH3iNA6s+haCfYHt60afKZ9HQ5ka1xVt5XvQ0MLSuVn/YCOD2YfVxbpAdJ43lLzhvWkurh7FPA==",
"version": "6.4.0-6497510485",
"resolved": "https://registry.npmjs.org/@alfresco/adf-cli/-/adf-cli-6.4.0-6497510485.tgz",
"integrity": "sha512-WcAuQNigrqM2piHYrxrZ/Qr5zFaA5dHjsmxe77a3R7jx9buLIFCml/93JaRsG5MMpswVEy/4cyFo3MpP4Ic+wg==",
"dev": true,
"dependencies": {
"@alfresco/js-api": ">=7.1.0-1349",
"@alfresco/js-api": ">=7.1.0-1372",
"commander": "^6.2.1",
"ejs": "^3.1.9",
"license-checker": "^25.0.1",
@ -140,15 +140,15 @@
}
},
"node_modules/@alfresco/adf-content-services": {
"version": "6.4.0-6377399867",
"resolved": "https://registry.npmjs.org/@alfresco/adf-content-services/-/adf-content-services-6.4.0-6377399867.tgz",
"integrity": "sha512-MssW0eKSh0Af0/oldEijw96CswqhQZRXpoK45vWdRueBncoTE976mYlk//sjHKjo+p4tehVHSv0I+ihE/Q9N/Q==",
"version": "6.4.0-6497510485",
"resolved": "https://registry.npmjs.org/@alfresco/adf-content-services/-/adf-content-services-6.4.0-6497510485.tgz",
"integrity": "sha512-WSjQ24MiXler6in10jDoEheRPiPllizV5JE1FlRpMCwmrKM06sYBF4Xr8gtf1z3dLIzfXJAiqHsqvExYKWksQg==",
"dependencies": {
"tslib": "^2.3.0"
},
"peerDependencies": {
"@alfresco/adf-core": ">=6.4.0-6377399867",
"@alfresco/js-api": ">=7.1.0-1349",
"@alfresco/adf-core": ">=6.4.0-6497510485",
"@alfresco/js-api": ">=7.1.0-1372",
"@angular/animations": ">=14.1.3",
"@angular/cdk": ">=14.1.2",
"@angular/common": ">=14.1.3",
@ -164,9 +164,9 @@
}
},
"node_modules/@alfresco/adf-core": {
"version": "6.4.0-6377399867",
"resolved": "https://registry.npmjs.org/@alfresco/adf-core/-/adf-core-6.4.0-6377399867.tgz",
"integrity": "sha512-SJw7Yk4vGXXQeol15jpkhrSgHhsOHOpgtng/qyzn/4C5B5BjylqZtlctSqdQ5cu/2VbGQetrOyqNACwWXTWvzA==",
"version": "6.4.0-6497510485",
"resolved": "https://registry.npmjs.org/@alfresco/adf-core/-/adf-core-6.4.0-6497510485.tgz",
"integrity": "sha512-ksjN7Jeu0OEat7RDpCkYq0kJcoKGjq3YqwwPW9e/1+p0eSQhDzPbMX4pl6fRu5tg9VsxarI1BgZkGAJDxlyJ5g==",
"dependencies": {
"angular-oauth2-oidc": "^13.0.1",
"angular-oauth2-oidc-jwks": "^13.0.1",
@ -174,8 +174,8 @@
"tslib": "^2.3.0"
},
"peerDependencies": {
"@alfresco/adf-extensions": ">=6.4.0-6377399867",
"@alfresco/js-api": ">=7.1.0-1349",
"@alfresco/adf-extensions": ">=6.4.0-6497510485",
"@alfresco/js-api": ">=7.1.0-1372",
"@angular/animations": ">=14.1.3",
"@angular/cdk": ">=14.1.2",
"@angular/common": ">=14.1.3",
@ -193,25 +193,25 @@
}
},
"node_modules/@alfresco/adf-extensions": {
"version": "6.4.0-6377399867",
"resolved": "https://registry.npmjs.org/@alfresco/adf-extensions/-/adf-extensions-6.4.0-6377399867.tgz",
"integrity": "sha512-qx2+3QuVuYNnO9cKNTzHl9IQeLJGLJqXX3i61tm4U07l5SppxubQ3eSvXhcJebN3sXcE0KbbtA9aDH82Isd4DQ==",
"version": "6.4.0-6497510485",
"resolved": "https://registry.npmjs.org/@alfresco/adf-extensions/-/adf-extensions-6.4.0-6497510485.tgz",
"integrity": "sha512-lbX+tZeFYgLPojQmz09tLWF0qEts7MQSgeTGuDvkioa/JjF0lfMxBHc6c0PRJjyrEWFPn9lgmf1dhAXjdDrpAA==",
"dependencies": {
"tslib": "^2.3.0"
},
"peerDependencies": {
"@alfresco/js-api": ">=7.1.0-1349",
"@alfresco/js-api": ">=7.1.0-1372",
"@angular/common": ">=14.1.3",
"@angular/core": ">=14.1.3"
}
},
"node_modules/@alfresco/adf-testing": {
"version": "6.4.0-6377399867",
"resolved": "https://registry.npmjs.org/@alfresco/adf-testing/-/adf-testing-6.4.0-6377399867.tgz",
"integrity": "sha512-7x02FfsQAzpkfTRr/Eg98K20YpchAlPxhEvtiF8uDT9IlbeDzqwROcRt9l78+Fmf1inrryrO4HKKQEwoVCLZQg==",
"version": "6.4.0-6497510485",
"resolved": "https://registry.npmjs.org/@alfresco/adf-testing/-/adf-testing-6.4.0-6497510485.tgz",
"integrity": "sha512-l6xP+KZUQzNE9SoZfp9e7RDnTR+4RTa4Cg9pPoEl1MQdIKws0zO4m8d4cPZ3i7Ut0Ja+uZAMtJyMKwNJzFioJg==",
"dev": true,
"dependencies": {
"@alfresco/js-api": "7.1.0-1349",
"@alfresco/js-api": "7.1.0-1372",
"@angular/compiler": "14.1.3",
"@angular/core": "14.1.3",
"rxjs": "6.6.6",
@ -219,13 +219,13 @@
"zone.js": "~0.11.4"
},
"peerDependencies": {
"@alfresco/js-api": ">=7.1.0-1349"
"@alfresco/js-api": ">=7.1.0-1372"
}
},
"node_modules/@alfresco/adf-testing/node_modules/@alfresco/js-api": {
"version": "7.1.0-1349",
"resolved": "https://registry.npmjs.org/@alfresco/js-api/-/js-api-7.1.0-1349.tgz",
"integrity": "sha512-p0qfoF8mTmaj8BCJ2EhNedOv60uqc2kOFEVByX/VxxTCYrMbG/OHRRNorYWoybI896AqJI5ytqJaKAtGqBKeuQ==",
"version": "7.1.0-1372",
"resolved": "https://registry.npmjs.org/@alfresco/js-api/-/js-api-7.1.0-1372.tgz",
"integrity": "sha512-jaJaZr7unhdKvcG5wzr2ZNfUR0+/74BHDbpdzZJ8Edp77JnhQrQCtXcIzvw2qDzM84PT7PELUe6x4Ys0h6FzJA==",
"dev": true,
"dependencies": {
"event-emitter": "^0.3.5",
@ -234,14 +234,14 @@
}
},
"node_modules/@alfresco/eslint-plugin-eslint-angular": {
"version": "6.4.0-6377399867",
"resolved": "https://registry.npmjs.org/@alfresco/eslint-plugin-eslint-angular/-/eslint-plugin-eslint-angular-6.4.0-6377399867.tgz",
"integrity": "sha512-ZKiinjfISK1C4g3cBn+w0HH04DrAzEuSapT03VdHcNtHk4LLjhOeKPrnMoYr3ozWtUwJtXBVa+R31FxNfiP9oA=="
"version": "6.4.0-6497510485",
"resolved": "https://registry.npmjs.org/@alfresco/eslint-plugin-eslint-angular/-/eslint-plugin-eslint-angular-6.4.0-6497510485.tgz",
"integrity": "sha512-pfGSYNQSbosqGmWdWpHlQkKGuThizxaYCT2DPd17U6s74WYYIakj3F1dQ2PKiQl7tFvmhGeQ6vP08ru1KB/0kw=="
},
"node_modules/@alfresco/js-api": {
"version": "7.1.0-1371",
"resolved": "https://registry.npmjs.org/@alfresco/js-api/-/js-api-7.1.0-1371.tgz",
"integrity": "sha512-6BSKyg6xyXRcKr+6P6srbelaXQ23d5BVGgvTxtJnJitaQnJhU12u/lyZy7bGGJOW8cAksw63Tx4ty2rLfJAcZA==",
"version": "7.1.0-1384",
"resolved": "https://registry.npmjs.org/@alfresco/js-api/-/js-api-7.1.0-1384.tgz",
"integrity": "sha512-kcD5ZBAo6eRLeXYCjY3qRtEVnBV/9jE+ruMyNARy+dCBo+doiTYTx2yjc7yc7EX/yEDe07VU8bzPnEWXK/XkQA==",
"dependencies": {
"event-emitter": "^0.3.5",
"superagent": "^8.0.9",

14
package.json
View File

@ -33,11 +33,11 @@
},
"private": true,
"dependencies": {
"@alfresco/adf-content-services": "6.4.0-6377399867",
"@alfresco/adf-core": "6.4.0-6377399867",
"@alfresco/adf-extensions": "6.4.0-6377399867",
"@alfresco/eslint-plugin-eslint-angular": "6.4.0-6377399867",
"@alfresco/js-api": "7.1.0-1371",
"@alfresco/adf-content-services": "6.4.0-6497510485",
"@alfresco/adf-core": "6.4.0-6497510485",
"@alfresco/adf-extensions": "6.4.0-6497510485",
"@alfresco/eslint-plugin-eslint-angular": "6.4.0-6497510485",
"@alfresco/js-api": "7.1.0-1384",
"@angular/animations": "14.1.3",
"@angular/cdk": "14.1.3",
"@angular/common": "14.1.3",
@ -69,8 +69,8 @@
"zone.js": "0.11.8"
},
"devDependencies": {
"@alfresco/adf-cli": "6.4.0-6377399867",
"@alfresco/adf-testing": "6.4.0-6377399867",
"@alfresco/adf-cli": "6.4.0-6497510485",
"@alfresco/adf-testing": "6.4.0-6497510485",
"@angular-devkit/build-angular": "14.2.11",
"@angular-devkit/core": "14.1.2",
"@angular-devkit/schematics": "14.1.2",

8
projects/aca-content/package.json
View File

@ -5,10 +5,10 @@
"peerDependencies": {
"@angular/common": ">=14.1.0",
"@angular/core": ">=14.1.0",
"@alfresco/adf-core": ">=6.4.0-6341205853",
"@alfresco/adf-content-services": ">=6.4.0-6341205853",
"@alfresco/adf-extensions": ">=6.4.0-6341205853",
"@alfresco/js-api": ">=7.1.0-1349",
"@alfresco/adf-core": ">=6.4.0-6497510485",
"@alfresco/adf-content-services": ">=6.4.0-6497510485",
"@alfresco/adf-extensions": ">=6.4.0-6497510485",
"@alfresco/js-api": ">=7.1.0-1384",
"@angular/animations": ">=14.1.3",
"@angular/cdk": ">=14.1.3",
"@angular/forms": ">=14.1.3",

2
projects/aca-content/src/lib/components/dl-custom-components/name-column/name-column.component.html
View File

@ -1,5 +1,5 @@
<div class="aca-custom-name-column">
<div [ngClass]="{ 'aca-name-column-container': isFile && isFileWriteLocked }">
<div class="aca-name-column-container">
<span
role="link"
tabindex="0"

4
projects/aca-content/src/lib/components/dl-custom-components/name-column/name-column.component.scss
View File

@ -13,6 +13,10 @@
}
.aca-name-column-container {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
aca-locked-by {
display: flex;
align-items: center;

2
projects/aca-content/src/lib/components/dl-custom-components/name-column/name-column.component.ts
View File

@ -117,6 +117,8 @@ export class CustomNameColumnComponent extends NameColumnComponent implements On
}
onBadgeClick(badge: Badge) {
if (badge.actions?.click) {
this.appExtensionService.runActionById(badge.actions?.click, this.node);
}
}
}

25
projects/aca-content/src/lib/components/info-drawer/metadata-tab/metadata-tab.component.spec.ts
View File

@ -32,7 +32,8 @@ import { AppState, EditOfflineAction, SetInfoDrawerMetadataAspectAction } from '
import { By } from '@angular/platform-browser';
import { AppExtensionService, NodePermissionService } from '@alfresco/aca-shared';
import { Actions } from '@ngrx/effects';
import { Subject } from 'rxjs';
import { of, Subject } from 'rxjs';
import { ContentActionType } from '@alfresco/adf-extensions';
describe('MetadataTabComponent', () => {
let fixture: ComponentFixture<MetadataTabComponent>;
@ -42,6 +43,7 @@ describe('MetadataTabComponent', () => {
let extensions: AppExtensionService;
let nodePermissionService: NodePermissionService;
let actions$: Subject<EditOfflineAction>;
let appExtensionService: AppExtensionService;
const presets = {
default: {
@ -61,6 +63,7 @@ describe('MetadataTabComponent', () => {
]
});
nodePermissionService = TestBed.inject(NodePermissionService);
appExtensionService = TestBed.inject(AppExtensionService);
spyOn(nodePermissionService, 'check').and.callFake((source: Node, permissions: string[]) => {
return permissions.some((permission) => source.allowableOperations.includes(permission));
});
@ -270,4 +273,24 @@ describe('MetadataTabComponent', () => {
expect(initialState.componentInstance.displayAspect).toBe('EXIF');
});
});
describe('Custom metadata panels', () => {
beforeEach(() => {
fixture = TestBed.createComponent(MetadataTabComponent);
component = fixture.componentInstance;
});
it('should get custom metadata panels', (done) => {
spyOn(appExtensionService, 'getCustomMetadataPanels').and.returnValue(
of([{ id: 'test', type: ContentActionType.custom, title: 'testTitle', component: 'test-id' }])
);
component.ngOnInit();
component.customPanels.subscribe((panels) => {
expect(panels.length).toBe(1);
expect(panels[0].panelTitle).toEqual('testTitle');
expect(panels[0].component).toEqual('test-id');
done();
});
});
});
});

14
projects/aca-content/src/lib/components/info-drawer/metadata-tab/metadata-tab.component.ts
View File

@ -29,8 +29,8 @@ import { AppStore, EditOfflineAction, infoDrawerMetadataAspect, NodeActionTypes
import { AppConfigService, NotificationService } from '@alfresco/adf-core';
import { Observable, Subject } from 'rxjs';
import { Store } from '@ngrx/store';
import { ContentMetadataModule, ContentMetadataService } from '@alfresco/adf-content-services';
import { filter, takeUntil } from 'rxjs/operators';
import { ContentMetadataModule, ContentMetadataService, ContentMetadataCustomPanel } from '@alfresco/adf-content-services';
import { filter, map, takeUntil } from 'rxjs/operators';
import { CommonModule } from '@angular/common';
import { Actions, ofType } from '@ngrx/effects';
@ -44,6 +44,7 @@ import { Actions, ofType } from '@ngrx/effects';
[preset]="'custom'"
[node]="node"
[displayAspect]="displayAspect$ | async"
[customPanels]="customPanels | async"
[(editable)]="editable"
>
</adf-content-metadata-card>
@ -60,6 +61,7 @@ export class MetadataTabComponent implements OnInit, OnDestroy {
displayAspect$: Observable<string>;
canUpdateNode = false;
editable = false;
customPanels: Observable<ContentMetadataCustomPanel[]>;
constructor(
private permission: NodePermissionService,
@ -93,6 +95,14 @@ export class MetadataTabComponent implements OnInit, OnDestroy {
this.editable = false;
}
});
this.customPanels = this.extensions.getCustomMetadataPanels({ entry: this.node }).pipe(
map((panels) => {
return panels.map((panel) => {
return { panelTitle: panel.title, component: panel.component };
});
}),
takeUntil(this.onDestroy$)
);
}
ngOnDestroy() {

8
projects/aca-shared/package.json
View File

@ -5,10 +5,10 @@
"license": "LGPL-3.0",
"scripts": {},
"peerDependencies": {
"@alfresco/adf-content-services": ">=6.4.0-6341205853",
"@alfresco/adf-core": ">=6.4.0-6341205853",
"@alfresco/adf-extensions": ">=6.4.0-6341205853",
"@alfresco/js-api": ">=7.1.0-1349",
"@alfresco/adf-content-services": ">=6.4.0-6497510485",
"@alfresco/adf-core": ">=6.4.0-6497510485",
"@alfresco/adf-extensions": ">=6.4.0-6497510485",
"@alfresco/js-api": ">=7.1.0-1384",
"@angular/animations": ">=14.1.3",
"@angular/common": ">=14.1.3",
"@angular/compiler": ">=14.1.3",

56
projects/aca-shared/src/lib/services/app.extension.service.spec.ts
View File

@ -1736,4 +1736,60 @@ describe('AppExtensionService', () => {
done();
});
});
it('should get custom metadata panels from config', (done) => {
extensions.setEvaluators({
'action.enabled': () => true
});
applyConfig({
$id: 'test',
$name: 'test',
$version: '1.0.0',
$license: 'MIT',
$vendor: 'Good company',
$runtime: '1.5.0',
features: {
customMetadataPanels: [
{
id: 'panel1-id',
title: 'testTitle',
component: 'testComponent1',
rules: {
visible: 'action.enabled'
}
},
{
id: 'panel2-id',
title: 'testTitle2',
component: 'testComponent2',
rules: {
visible: 'action.enabled'
}
}
]
}
});
const node: NodeEntry = {
entry: {
id: 'testId',
name: 'testName',
nodeType: 'test',
isFile: true,
isFolder: false,
modifiedAt: undefined,
createdAt: undefined,
modifiedByUser: undefined,
createdByUser: undefined
}
};
service.getCustomMetadataPanels(node).subscribe((panels) => {
expect(panels.length).toBe(2);
expect(panels[0].id).toEqual('panel1-id');
expect(panels[1].id).toEqual('panel2-id');
done();
});
});
});

6
projects/aca-shared/src/lib/services/app.extension.service.ts
View File

@ -81,6 +81,7 @@ export class AppExtensionService implements RuleContext {
private _sidebarActions = new BehaviorSubject<Array<ContentActionRef>>([]);
private _badges = new BehaviorSubject<Array<Badge>>([]);
private _filesDocumentListPreset = new BehaviorSubject<Array<DocumentListPresetRef>>([]);
private _customMetadataPanels = new BehaviorSubject<Array<ContentActionRef>>([]);
documentListPresets: {
libraries: Array<DocumentListPresetRef>;
@ -160,6 +161,7 @@ export class AppExtensionService implements RuleContext {
this._mainActions.next(this.loader.getFeatures(config).mainAction);
this._badges.next(this.loader.getElements<Badge>(config, 'features.badges'));
this._filesDocumentListPreset.next(this.getDocumentListPreset(config, 'files'));
this._customMetadataPanels.next(this.loader.getElements<ContentActionRef>(config, 'features.customMetadataPanels'));
this.navbar = this.loadNavBar(config);
this.sidebarTabs = this.loader.getElements<SidebarTabRef>(config, 'features.sidebar.tabs');
@ -375,6 +377,10 @@ export class AppExtensionService implements RuleContext {
return this._badges.pipe(map((badges) => badges.filter((badge) => this.evaluateRule(badge.rules.visible, node))));
}
getCustomMetadataPanels(node: NodeEntry): Observable<Array<ContentActionRef>> {
return this._customMetadataPanels.pipe(map((panels) => panels.filter((panel) => this.evaluateRule(panel.rules.visible, node))));
}
private buildMenu(actionRef: ContentActionRef): ContentActionRef {
if (actionRef.type === ContentActionType.menu && actionRef.children && actionRef.children.length > 0) {
const children = actionRef.children.filter((action) => this.filterVisible(action)).map((action) => this.buildMenu(action));