diff --git a/docs/README.md b/docs/README.md index 5f73fd392f..392baec262 100644 --- a/docs/README.md +++ b/docs/README.md @@ -357,6 +357,7 @@ for more information about installing and using the source code. | [Base Card View Content Update interface](content-services/interfaces/base-card-view-content-update.interface.md) | Specifies required properties and methods for Card View Content Update service. | | | Extends from BaseCardViewUpdate. | [Source](../lib/content-services/src/lib/interfaces/base-card-view-content-update.interface.ts) | | | [Search widget interface](content-services/interfaces/search-widget.interface.md) | Specifies required properties for Search filter component widgets. | [Source](../lib/content-services/src/lib/search/models/search-widget.interface.ts) | +| [Content Metadata Custom Panel interface](content-services/interfaces/content-metadata-custom-panel.interface.md) | Specifies required properties for metadata custom panel. | [Source](../lib/content-services/src/lib/content-metadata/interfaces/content-metadata-custom-panel.interface.ts) | ### Models diff --git a/docs/content-services/components/content-metadata-card.component.md b/docs/content-services/components/content-metadata-card.component.md index a18f301343..e9257a9d1e 100644 --- a/docs/content-services/components/content-metadata-card.component.md +++ b/docs/content-services/components/content-metadata-card.component.md @@ -27,6 +27,7 @@ Displays and edits metadata related to a node. - [Use chips for multi value properties](#use-chips-for-multi-value-properties) - [Copy to Clipboard on click](#copy-to-clipboard-on-click) - [Search select options (ACS 7+)](#search-select-options-acs-7) +- [Custom metadata panels](#custom-metadata-panels) ## Basic Usage @@ -53,6 +54,7 @@ Displays and edits metadata related to a node. | readOnly | `boolean` | false | (optional) This flag sets the metadata in read only mode preventing changes. | | displayDefaultProperties | `boolean` | | (optional) This flag displays/hides the metadata properties. | | editable | `boolean` | | (optional) This flag toggles editable of content. | +| customPanels | [`ContentMetadataCustomPanel`](../interfaces/content-metadata-custom-panel.interface.md)`[]` | | (optional) List of custom metadata panels to be displayed as [`Dynamic components`](../../extensions/components/dynamic.component.md). | ### Events @@ -438,3 +440,7 @@ When the list of values is too long, the options selection panel will be enhance ``` ![Chips for multi value properties](../../docassets/images/adf-search-select.png) + +## Custom metadata panels + +If there is a need to display some custom node properties that require additional UI or data to be fetched you can define custom metadata panels for the metadata component. After creating custom component to be displayed it has to be registered in [Extension Service](../../extensions/services/extension.service.md). Both `panelTitle` and `component` properties have to be defined. diff --git a/docs/content-services/interfaces/content-metadata-custom-panel.interface.md b/docs/content-services/interfaces/content-metadata-custom-panel.interface.md new file mode 100644 index 0000000000..782b0cfdd2 --- /dev/null +++ b/docs/content-services/interfaces/content-metadata-custom-panel.interface.md @@ -0,0 +1,31 @@ +--- +Title: Content Metadata Custom Panel interface +Added: v6.4.0 +Status: Active +Last reviewed: 2023-10-06 +--- + +# [Content Metadata Custom Panel interface](../../../lib/content-services/src/lib/content-metadata/interfaces/content-metadata-custom-panel.interface.ts "Defined in content-metadata-custom-panel.interface.ts") + +Specifies required properties for custom metadata panel to be displayed in [ContentMetadataCardComponent](../components/content-metadata-card.component.md). + +## Basic usage + +```ts +export interface ContentMetadataCustomPanel { + panelTitle: string; + component: string; +} +``` + +### Properties + +| Name | Type | Default value | Description | +| ---- | ---- | ------------- | ----------- | +| panelTitle | `string` | | Title for the panel the will be displayed in expansion panel header. | +| component | `string` | | Id of the registered [Dynamic component](../../extensions/components/dynamic.component.md) to be displayed inside expansion panel. | + +## See also + +- [ContentMetadataCardComponent](../components/content-metadata-card.component.md) +- [Dynamic Component](../../extensions/components/dynamic.component.md) diff --git a/docs/versionIndex.md b/docs/versionIndex.md index bbc37f3bb0..17441938d3 100644 --- a/docs/versionIndex.md +++ b/docs/versionIndex.md @@ -12,6 +12,7 @@ backend services have been tested with each released version of ADF. ## Versions +- [v6.4.0](#v640) - [v6.2.0](#v620) - [v6.1.0](#v610) - [v6.0.0](#v600) @@ -43,6 +44,14 @@ backend services have been tested with each released version of ADF. - [v2.1.0](#v210) - [v2.0.0](#v200) +## v6.4.0 + + + +- [Content Metadata Custom Panel interface](content-services/interfaces/content-metadata-custom-panel.interface.md) + + + ## v6.2.0 diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata-card/content-metadata-card.component.html b/lib/content-services/src/lib/content-metadata/components/content-metadata-card/content-metadata-card.component.html index a72bc447df..3b9930e3b9 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata-card/content-metadata-card.component.html +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata-card/content-metadata-card.component.html @@ -10,7 +10,8 @@ [displayAspect]="displayAspect" [preset]="preset" [displayTags]="displayTags" - [displayCategories]="displayCategories"> + [displayCategories]="displayCategories" + [customPanels]="customPanels"> diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata-card/content-metadata-card.component.ts b/lib/content-services/src/lib/content-metadata/components/content-metadata-card/content-metadata-card.component.ts index 12b6f29fbd..4522d57b67 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata-card/content-metadata-card.component.ts +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata-card/content-metadata-card.component.ts @@ -18,7 +18,7 @@ import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges, ViewEncapsulation } from '@angular/core'; import { Node } from '@alfresco/js-api'; import { NodeAspectService } from '../../../aspect-list/services/node-aspect.service'; -import { PresetConfig } from '../../interfaces/content-metadata.interfaces'; +import { ContentMetadataCustomPanel, PresetConfig } from '../../interfaces/content-metadata.interfaces'; import { VersionCompatibilityService } from '../../../version-compatibility/version-compatibility.service'; import { ContentService } from '../../../common/services/content.service'; import { AllowableOperationsEnum } from '../../../common/models/allowable-operations.enum'; @@ -80,6 +80,10 @@ export class ContentMetadataCardComponent implements OnChanges { @Input() editable? = false; + /** List of custom metadata panels to be displayed with registered custom components */ + @Input() + customPanels: ContentMetadataCustomPanel[]; + /** Emitted when content's editable state is changed. */ @Output() editableChange = new EventEmitter(); diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html index 7def421223..783c3c6057 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html @@ -78,6 +78,12 @@ + + + {{ customPanel.panelTitle | translate }} + + +
{ }); }); }); + + describe('Custom metadata panels', () => { + it('should render correct custom panel with title and component', () => { + component.customPanels = [{ panelTitle: 'testTitle', component: 'testComponent' }]; + fixture.detectChanges(); + const panelTitle = fixture.debugElement.queryAll(By.css('mat-panel-title'))[1].nativeElement; + const customComponent = fixture.debugElement.query(By.css('adf-dynamic-component')).nativeElement; + expect(panelTitle.innerText).toEqual('testTitle'); + expect(customComponent).toBeDefined(); + }); + }); }); const queryDom = (fixture: ComponentFixture, properties: string = 'properties') => diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts index 56ee464bf9..60680dacd8 100644 --- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts +++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.ts @@ -36,7 +36,7 @@ import { UpdateNotification } from '@alfresco/adf-core'; import { ContentMetadataService } from '../../services/content-metadata.service'; -import { CardViewGroup, PresetConfig } from '../../interfaces/content-metadata.interfaces'; +import { CardViewGroup, PresetConfig, ContentMetadataCustomPanel } from '../../interfaces/content-metadata.interfaces'; import { catchError, debounceTime, map, takeUntil } from 'rxjs/operators'; import { CardViewContentUpdateService } from '../../../common/services/card-view-content-update.service'; import { NodesApiService } from '../../../common/services/nodes-api.service'; @@ -115,6 +115,10 @@ export class ContentMetadataComponent implements OnChanges, OnInit, OnDestroy { @Input() displayCategories = false; + /** List of custom metadata panels to be displayed with registered custom components */ + @Input() + customPanels: ContentMetadataCustomPanel[] = []; + private _assignedTags: string[] = []; private assignedTagsEntries: TagEntry[] = []; private _editable = false; diff --git a/lib/content-services/src/lib/content-metadata/content-metadata.module.ts b/lib/content-services/src/lib/content-metadata/content-metadata.module.ts index 534370f339..0ffad897fb 100644 --- a/lib/content-services/src/lib/content-metadata/content-metadata.module.ts +++ b/lib/content-services/src/lib/content-metadata/content-metadata.module.ts @@ -23,6 +23,7 @@ import { ContentMetadataComponent } from './components/content-metadata/content- import { ContentMetadataCardComponent } from './components/content-metadata-card/content-metadata-card.component'; import { TagModule } from '../tag/tag.module'; import { CategoriesModule } from '../category/category.module'; +import { ExtensionsModule } from '@alfresco/adf-extensions'; @NgModule({ imports: [ @@ -30,7 +31,8 @@ import { CategoriesModule } from '../category/category.module'; MaterialModule, CoreModule, TagModule, - CategoriesModule + CategoriesModule, + ExtensionsModule ], exports: [ ContentMetadataComponent, diff --git a/lib/content-services/src/lib/content-metadata/interfaces/content-metadata-custom-panel.interface.ts b/lib/content-services/src/lib/content-metadata/interfaces/content-metadata-custom-panel.interface.ts new file mode 100644 index 0000000000..68a22c8a01 --- /dev/null +++ b/lib/content-services/src/lib/content-metadata/interfaces/content-metadata-custom-panel.interface.ts @@ -0,0 +1,21 @@ +/*! + * @license + * Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +export interface ContentMetadataCustomPanel { + panelTitle: string; + component: string; +} diff --git a/lib/content-services/src/lib/content-metadata/interfaces/content-metadata.interfaces.ts b/lib/content-services/src/lib/content-metadata/interfaces/content-metadata.interfaces.ts index 76c2b81bc1..5003fd0e95 100644 --- a/lib/content-services/src/lib/content-metadata/interfaces/content-metadata.interfaces.ts +++ b/lib/content-services/src/lib/content-metadata/interfaces/content-metadata.interfaces.ts @@ -24,3 +24,4 @@ export * from './content-metadata-config.interface'; export * from './indifferent-config.interface'; export * from './layout-oriented-config.interface'; export * from './preset-config.interface'; +export * from './content-metadata-custom-panel.interface';