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-5316] - Content Type (#6602)

Browse Source 
* [ADF-5316] - added content type editing for nodes

* [ADF-5316] - added content type editing for nodes

* [ADF-5316] - fix unit test #1

* [ADF-5316] - fix unit test #2

* [ADF-5316] - fix unit test - final

* Removed failing lint word

* [ADF-5316] - added alfresco api real calls

* Build fixed

* [ADF-5316] - fixed second loop trigger on model

* [ADF-5316] - fixed unit tests

* [ADF-5316] - removed unused stream

* [ADF-5316] - fixed package.json

* [ADF-5316] - added missing unit tests

* [ADF-5316] - fixed wrong import

Co-authored-by: Vito Albano <vitoalbano@vitoalbano-mbp-0120.local>
This commit is contained in:
Vito
2021-02-12 09:33:01 +00:00
committed by GitHub
parent 0b66ee8171
commit eb9e555ba9
31 changed files with 981 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
docs/content-services/components/content-type-dialog.component.md Normal file
View File

@@ -0,0 +1,86 @@
---
Title: Content Type Dialog component
Added: v2.0.0
Status: Active
Last reviewed: 2021-01-20
---
# [Content Type Dialog component](../../../lib/content-services/src/lib/content-type/content-type-dialog.component.ts "Defined in content-type-dialog.component.ts")
Confirm dialog when user changes content type of a node.
## Details
The [Content Type Dialog component](content-type-dialog.component.md) works as a dialog showing a confirm message when the user changes the conten type of a node. It is showing the properties of the new content type selected.
### Showing the dialog
Unlike most components, the [Content Type Dialog component](content-type-dialog.component.md) is typically shown in a dialog box
rather than the main page and you are responsible for opening the dialog yourself. You can use the
[Angular Material Dialog](https://material.angular.io/components/dialog/overview) for this,
as shown in the usage example. ADF provides the [`ContentTypeDialogComponentData`](../../../lib/content-services/src/lib/content-type/content-type-metadata.interface.ts) interface
to work with the Dialog's
[data option](https://material.angular.io/components/dialog/overview#sharing-data-with-the-dialog-component-):
```ts
export interface ContentTypeDialogComponentData {
title: string;
description: string;
confirmMessage: string;
select: Subject<boolean>;
nodeType?: string;
}
```
The properties are described in the table below:
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| title | `string` | "" | Dialog title |
| description | `string` | "" | Text to appear as description under the dialog title |
| confirmMessage | `string` | "" | Text that will be showed on the top of properties list accordion |
| select | [`Subject<Node>`](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/content-rest-api/docs/Node.md) | | Event emitted when apply button is clicked |
| nodeType | `string` | "" | current prefixed name of the content type selected |
If you don't want to manage the dialog yourself then it is easier to use the
methods of the Content Type Property Service, which create
the dialog for you.
### Usage example
```ts
import { MatDialog } from '@angular/material/dialog';
import { AspectListDialogComponentData, AspectListDialogComponent} from '@adf/content-services'
import { Subject } from 'rxjs/Subject';
...
constructor(dialog: MatDialog ... ) {}
openSelectorDialog() {
const data: ContentTypeDialogComponentData = {
title: 'CORE.METADATA.CONTENT_TYPE.DIALOG.TITLE',
description: 'CORE.METADATA.CONTENT_TYPE.DIALOG.DESCRIPTION',
confirmMessage: 'CORE.METADATA.CONTENT_TYPE.DIALOG.CONFIRM',
select: select,
nodeType
};
this.dialog.open(
ContentTypeDialogComponent,
{
data, panelClass: 'adf-content-type-dialog',
width: '630px'
}
);
data.select.subscribe((selections: Node[]) => {
// Use or store selection...
},
(error)=>{
//your error handling
},
()=>{
//action called when an action or cancel is clicked on the dialog
this.dialog.closeAll();
});
}
```
All the results will be streamed to the select [subject](http://reactivex.io/rxjs/manual/overview.html#subject) present in the [`ContentTypeDialogData`](../../../lib/content-services/src/lib/content-type/content-type-metadata.interface.ts) object passed to the dialog.
When the dialog action is selected by clicking, the `data.select` stream will be completed.