From 5b149db9761cad58a7bd262951f6f705a9013e3b Mon Sep 17 00:00:00 2001 From: DominikIwanek Date: Thu, 5 Oct 2023 13:37:20 +0200 Subject: [PATCH 1/8] [ACS-5566] - add configurable columns to document list --- .../components/document-list.component.html | 12 ++++ .../components/document-list.component.ts | 59 +++---------------- .../columns-selector.component.ts | 5 +- 3 files changed, 24 insertions(+), 52 deletions(-) diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.html b/lib/content-services/src/lib/document-list/components/document-list.component.html index d5ba61e536b..0b303f1efaa 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.html +++ b/lib/content-services/src/lib/document-list/components/document-list.component.html @@ -8,6 +8,7 @@ [contextMenu]="contextMenuActions" [rowStyle]="rowStyle" [rowStyleClass]="rowStyleClass" + [showMainDatatableActions]="true" [loading]="loading" [display]="display" [noPermission]="noPermission" @@ -72,4 +73,15 @@ + + + + + + + diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.ts b/lib/content-services/src/lib/document-list/components/document-list.component.ts index df702a5040a..367dd9bc00b 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.ts +++ b/lib/content-services/src/lib/document-list/components/document-list.component.ts @@ -38,13 +38,11 @@ import { ContentService } from '../../common/services/content.service'; import { DataCellEvent, - DataColumn, DataRowActionEvent, DataSorting, DataTableComponent, DisplayMode, ShowHeaderMode, - ObjectDataColumn, PaginatedComponent, AppConfigService, DataColumnListComponent, @@ -58,7 +56,7 @@ import { AlfrescoApiService, UserPreferenceValues, DataRow, - DataTableService + DataTableService, DataTableSchema, DataColumn } from '@alfresco/adf-core'; import { NodesApiService } from '../../common/services/nodes-api.service'; @@ -97,7 +95,7 @@ const BYTES_TO_MB_CONVERSION_VALUE = 1048576; encapsulation: ViewEncapsulation.None, host: { class: 'adf-document-list' } }) -export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, AfterContentInit, PaginatedComponent, NavigableComponentInterface { +export class DocumentListComponent extends DataTableSchema implements OnInit, OnChanges, OnDestroy, AfterContentInit, PaginatedComponent, NavigableComponentInterface { static SINGLE_CLICK_NAVIGATION: string = 'click'; static DOUBLE_CLICK_NAVIGATION: string = 'dblclick'; @@ -371,7 +369,6 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte pagination: BehaviorSubject = new BehaviorSubject(this.DEFAULT_PAGINATION); sortingSubject: BehaviorSubject = new BehaviorSubject(this.DEFAULT_SORTING); - private layoutPresets = {}; private rowMenuCache: { [key: string]: ContentActionModel[] } = {}; private loadingTimeout: any; private onDestroy$ = new Subject(); @@ -395,6 +392,7 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte private lockService: LockService, private dialog: MatDialog ) { + super(appConfig, 'default', presetsDefaultModel); this.nodeService.nodeUpdated.pipe(takeUntil(this.onDestroy$)).subscribe((node) => { this.dataTableService.rowUpdate.next({ id: node.id, obj: { entry: node } }); }); @@ -421,10 +419,6 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte return null; } - private get hasCustomLayout(): boolean { - return this.columnList?.columns?.length > 0; - } - private getDefaultSorting(): DataSorting { let defaultSorting: DataSorting; if (Array.isArray(this.sorting)) { @@ -437,9 +431,6 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte return defaultSorting; } - private getLayoutPreset(name: string = 'default'): DataColumn[] { - return (this.layoutPresets[name] || this.layoutPresets['default']).map((col) => new ObjectDataColumn(col)); - } isMobile(): boolean { return !!/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); @@ -480,29 +471,12 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte } ngAfterContentInit() { - if (this.columnList) { - this.columnList.columns.changes.pipe(takeUntil(this.onDestroy$)).subscribe(() => this.setTableSchema()); - } this.setTableSchema(); } private setTableSchema() { - let schema: DataColumn[] = []; - - if (this.hasCustomLayout) { - schema = this.columnList.columns.map((c) => c as DataColumn); - } - - if (!this.data) { - this.data = new ShareDataTableAdapter(this.thumbnailService, this.contentService, schema, this.getDefaultSorting(), this.sortingMode); - } else if (schema && schema.length > 0) { - this.data.setColumns(schema); - } - - const columns = this.data.getColumns(); - if (!columns || columns.length === 0) { - this.setupDefaultColumns(this.currentFolderId); - } + this.createDatatableSchema(); + this.data.setColumns(this.columns); } ngOnChanges(changes: SimpleChanges) { @@ -718,10 +692,6 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte this.setLoadingState(true); } - if (!this.hasCustomLayout) { - this.setupDefaultColumns(this.currentFolderId); - } - if (this.documentListService.isCustomSourceService(this.currentFolderId)) { this.updateCustomSourceData(this.currentFolderId); } @@ -772,17 +742,6 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte return [`${this.additionalSorting.key} ${this.additionalSorting.direction}`, `${currentKey} ${currentDirection}`]; } - /** - * Creates a set of predefined columns. - * @param preset preset to use - */ - private setupDefaultColumns(preset: string = 'default'): void { - if (this.data) { - const columns = this.getLayoutPreset(preset); - this.data.setColumns(columns); - } - } - onPreviewFile(node: NodeEntry) { if (node) { const sizeInMB = node.entry?.content?.sizeInBytes / BYTES_TO_MB_CONVERSION_VALUE; @@ -797,7 +756,9 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte } } } - + onColumnsVisibilityChange(e: Array): void { + this.data.setColumns(e); + } onNodeClick(nodeEntry: NodeEntry) { const domEvent = new CustomEvent('node-click', { detail: { @@ -932,10 +893,6 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte return canNavigateFolder; } - private loadLayoutPresets(): void { - const externalSettings = this.appConfig.get('document-list.presets', null); - this.layoutPresets = externalSettings ? Object.assign({}, presetsDefaultModel, externalSettings) : presetsDefaultModel; - } private onDataReady(nodePaging: NodePaging) { this.ready.emit(nodePaging); diff --git a/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts b/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts index 99e370d96cd..7414c2640ce 100644 --- a/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts +++ b/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts @@ -34,6 +34,9 @@ export class ColumnsSelectorComponent implements OnInit, OnDestroy { @Input() mainMenuTrigger: MatMenuTrigger; + @Input() + columnsSorting = true; + @Output() submitColumnsVisibility = new EventEmitter(); @@ -47,7 +50,7 @@ export class ColumnsSelectorComponent implements OnInit, OnDestroy { takeUntil(this.onDestroy$) ).subscribe(() => { const columns = this.columns.map(column => ({...column})); - this.columnItems = this.sortColumns(columns); + this.columnItems = this.columnsSorting ? this.sortColumns(columns) : columns; }); this.mainMenuTrigger.menuClosed.pipe( From 2bf2a766012eb4b67fc9e46a23c049dbed7193f4 Mon Sep 17 00:00:00 2001 From: DominikIwanek Date: Thu, 5 Oct 2023 17:00:02 +0200 Subject: [PATCH 2/8] [ACS-5566] - add max visible columns --- .../components/document-list.component.html | 1 + .../components/document-list.component.ts | 11 +++++++++++ .../columns-selector/columns-selector.component.html | 1 + .../columns-selector/columns-selector.component.ts | 7 +++++++ 4 files changed, 20 insertions(+) diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.html b/lib/content-services/src/lib/document-list/components/document-list.component.html index 0b303f1efaa..5eeb6a5c33e 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.html +++ b/lib/content-services/src/lib/document-list/components/document-list.component.html @@ -79,6 +79,7 @@ [columns]="data.getColumns()" [mainMenuTrigger]="mainMenuTrigger" [columnsSorting]="false" + [maxColumnsVisible]="maxColumnsVisible" (submitColumnsVisibility)="onColumnsVisibilityChange($event)"> diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.ts b/lib/content-services/src/lib/document-list/components/document-list.component.ts index 367dd9bc00b..3fd737376f0 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.ts +++ b/lib/content-services/src/lib/document-list/components/document-list.component.ts @@ -313,6 +313,14 @@ export class DocumentListComponent extends DataTableSchema implements OnInit, On @Input() maxItems: number = this.DEFAULT_PAGINATION.maxItems; + /** Key of columns preset if columns are not specified */ + @Input() + columnsPresetKey?: string; + + /** Limit of possible visible columns, including "$thumbnail" column if provided */ + @Input() + maxColumnsVisible?: number; + /** Emitted when the user clicks a list node */ @Output() nodeClick = new EventEmitter(); @@ -468,6 +476,9 @@ export class DocumentListComponent extends DataTableSchema implements OnInit, On if (this.filterValue && Object.keys(this.filterValue).length > 0) { this.showHeader = ShowHeaderMode.Always; } + if (this.columnsPresetKey) { + this.setPresetKey(this.columnsPresetKey); + } } ngAfterContentInit() { diff --git a/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.html b/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.html index 0c05eaa43de..2e71b7a9780 100644 --- a/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.html +++ b/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.html @@ -43,6 +43,7 @@ class="adf-columns-selector-column-checkbox" [attr.data-automation-id]="'adf-columns-selector-column-checkbox-' + column.title" [checked]="!column.isHidden" + [disabled]="isCheckboxDisabled(column)" (change)="changeColumnVisibility(column)">
{{translatedTitle}}
diff --git a/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts b/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts index 7414c2640ce..680f8b3f02f 100644 --- a/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts +++ b/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts @@ -37,6 +37,9 @@ export class ColumnsSelectorComponent implements OnInit, OnDestroy { @Input() columnsSorting = true; + @Input() + maxColumnsVisible?: number; + @Output() submitColumnsVisibility = new EventEmitter(); @@ -85,6 +88,10 @@ export class ColumnsSelectorComponent implements OnInit, OnDestroy { this.closeMenu(); } + isCheckboxDisabled(column: DataColumn): boolean { + return this.maxColumnsVisible && column.isHidden && this.maxColumnsVisible === this.columnItems.filter(column => !column.isHidden).length; + } + private sortColumns(columns: DataColumn[]): DataColumn[] { const shownColumns = columns.filter(column => !column.isHidden); const hiddenColumns = columns.filter(column => column.isHidden); From 6e79e646f593b01e9293ca86fdcbdb9cda88bd37 Mon Sep 17 00:00:00 2001 From: DominikIwanek Date: Tue, 10 Oct 2023 17:53:23 +0200 Subject: [PATCH 3/8] [ACS-5566] - add unit tests --- .../document-list.component.spec.ts | 51 +++++----------- .../lib/document-list/models/preset.model.ts | 26 -------- .../columns-selector.component.spec.ts | 59 ++++++++++++++----- .../lib/datatable/data/data-table.schema.ts | 4 +- .../lib/config/document-list.extensions.ts | 1 + 5 files changed, 62 insertions(+), 79 deletions(-) diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.spec.ts b/lib/content-services/src/lib/document-list/components/document-list.component.spec.ts index 6afad064061..8ef5841fc37 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.spec.ts +++ b/lib/content-services/src/lib/document-list/components/document-list.component.spec.ts @@ -132,57 +132,39 @@ describe('DocumentList', () => { }); }; - it('should load -trashcan- preset', async () => { - documentList.currentFolderId = '-trashcan-'; - - fixture.detectChanges(); - await fixture.whenStable(); - + it('should load -trashcan- preset', () => { + documentList.presetColumn = '-trashcan-'; + documentList.ngAfterContentInit(); validatePreset(['$thumbnail', 'name', 'path', 'content.sizeInBytes', 'archivedAt', 'archivedByUser.displayName']); }); it('should load -sites- preset', async () => { - documentList.currentFolderId = '-sites-'; - - fixture.detectChanges(); - await fixture.whenStable(); - + documentList.presetColumn = '-sites-'; + documentList.ngAfterContentInit(); validatePreset(['$thumbnail', 'title', 'visibility']); }); it('shuld load -mysites- preset', async () => { - documentList.currentFolderId = '-mysites-'; - - fixture.detectChanges(); - await fixture.whenStable(); - + documentList.presetColumn = '-mysites-'; + documentList.ngAfterContentInit(); validatePreset(['$thumbnail', 'title', 'visibility']); }); it('should load -favorites- preset', async () => { - documentList.currentFolderId = '-favorites-'; - - fixture.detectChanges(); - await fixture.whenStable(); - + documentList.presetColumn = '-favorites-'; + documentList.ngAfterContentInit(); validatePreset(['$thumbnail', 'name', 'path', 'content.sizeInBytes', 'modifiedAt', 'modifiedByUser.displayName']); }); it('should load -recent- preset', async () => { - documentList.currentFolderId = '-recent-'; - - fixture.detectChanges(); - await fixture.whenStable(); - + documentList.presetColumn = '-recent-'; + documentList.ngAfterContentInit(); validatePreset(['$thumbnail', 'name', 'path', 'content.sizeInBytes', 'modifiedAt']); }); it('should load -sharedlinks- preset', async () => { - documentList.currentFolderId = '-sharedlinks-'; - - fixture.detectChanges(); - await fixture.whenStable(); - + documentList.presetColumn = '-sharedlinks-'; + documentList.ngAfterContentInit(); validatePreset([ '$thumbnail', 'name', @@ -195,11 +177,8 @@ describe('DocumentList', () => { }); it('should load default preset', async () => { - documentList.currentFolderId = 'f5dacdb9-6d07-4fe9-9f2a-dedc21bae603'; - - fixture.detectChanges(); - await fixture.whenStable(); - + documentList.presetColumn = 'f5dacdb9-6d07-4fe9-9f2a-dedc21bae603'; + documentList.ngAfterContentInit(); validatePreset(['$thumbnail', 'name', 'content.sizeInBytes', 'modifiedAt', 'modifiedByUser.displayName']); }); }); diff --git a/lib/content-services/src/lib/document-list/models/preset.model.ts b/lib/content-services/src/lib/document-list/models/preset.model.ts index 16d05d9da99..712640f68a4 100644 --- a/lib/content-services/src/lib/document-list/models/preset.model.ts +++ b/lib/content-services/src/lib/document-list/models/preset.model.ts @@ -23,32 +23,6 @@ export const presetsDefaultModel = { srTitle: 'ADF-DOCUMENT-LIST.LAYOUT.THUMBNAIL', sortable: false }, - { - key: 'name', - type: 'text', - title: 'ADF-DOCUMENT-LIST.LAYOUT.NAME', - cssClass: 'full-width ellipsis-cell', - sortable: true - }, - { - key: 'path', - type: 'location', - title: 'ADF-DOCUMENT-LIST.LAYOUT.LOCATION', - sortable: true - }, - { - key: 'content.sizeInBytes', - type: 'fileSize', - title: 'ADF-DOCUMENT-LIST.LAYOUT.SIZE', - sortable: true - }, - { - key: 'archivedAt', - type: 'date', - title: 'ADF-DOCUMENT-LIST.LAYOUT.DELETED_ON', - format: 'timeAgo', - sortable: true - }, { key: 'archivedByUser.displayName', type: 'text', diff --git a/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.spec.ts b/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.spec.ts index b15f72930e4..790fbf17666 100644 --- a/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.spec.ts +++ b/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.spec.ts @@ -156,19 +156,35 @@ describe('ColumnsSelectorComponent', () => { expect(toggledColumnItem.isHidden).toBe(true); }); - it('should set proper default state for checkboxes', async () => { - menuOpenedTrigger.next(); - fixture.detectChanges(); - const checkboxes = await loader.getAllHarnesses(MatCheckboxHarness); + describe('checkboxes', () => { + it('should have set proper default state', async () => { + menuOpenedTrigger.next(); + fixture.detectChanges(); + + const checkboxes = await loader.getAllHarnesses(MatCheckboxHarness); + + expect(await checkboxes[0].isChecked()).toBe(true); + expect(await checkboxes[1].isChecked()).toBe(true); + expect(await checkboxes[2].isChecked()).toBe(true); + expect(await checkboxes[3].isChecked()).toBe(false); + }); + + it('should be disabled when visible columns limit is reached', async () => { + component.maxColumnsVisible = 4; + menuOpenedTrigger.next(); + fixture.detectChanges(); - expect(await checkboxes[0].isChecked()).toBe(true); - expect(await checkboxes[1].isChecked()).toBe(true); - expect(await checkboxes[2].isChecked()).toBe(true); - expect(await checkboxes[3].isChecked()).toBe(false); + const checkboxes = await loader.getAllHarnesses(MatCheckboxHarness); + + expect(await checkboxes[0].isDisabled()).toBe(false); + expect(await checkboxes[1].isDisabled()).toBe(false); + expect(await checkboxes[2].isDisabled()).toBe(false); + expect(await checkboxes[3].isDisabled()).toBe(true); + }); }); - it('should show hidden columns at the end of the list', async () => { + describe('sorting', () => { const hiddenDataColumn: DataColumn = { id: 'hiddenDataColumn', title: 'hiddenDataColumn', @@ -183,14 +199,27 @@ describe('ColumnsSelectorComponent', () => { key: 'shownDataColumn', type: 'text' }; + it('should show hidden columns at the end of the list by default', async () => { + component.columns = [hiddenDataColumn, shownDataColumn]; + menuOpenedTrigger.next(); + fixture.detectChanges(); - component.columns = [hiddenDataColumn, shownDataColumn]; - menuOpenedTrigger.next(); - fixture.detectChanges(); + const checkboxes = await loader.getAllHarnesses(MatCheckboxHarness); - const checkboxes = await loader.getAllHarnesses(MatCheckboxHarness); + expect(await checkboxes[0].getLabelText()).toBe(shownDataColumn.title); + expect(await checkboxes[1].getLabelText()).toBe(hiddenDataColumn.title); + }); + + it('should NOT show hidden columns at the end of the list if sorting is disabled', async () => { + component.columns = [hiddenDataColumn, shownDataColumn]; + component.columnsSorting = false; + menuOpenedTrigger.next(); + fixture.detectChanges(); + + const checkboxes = await loader.getAllHarnesses(MatCheckboxHarness); - expect(await checkboxes[0].getLabelText()).toBe(shownDataColumn.title); - expect(await checkboxes[1].getLabelText()).toBe(hiddenDataColumn.title); + expect(await checkboxes[0].getLabelText()).toBe(hiddenDataColumn.title); + expect(await checkboxes[1].getLabelText()).toBe(shownDataColumn.title); + }); }); }); diff --git a/lib/core/src/lib/datatable/data/data-table.schema.ts b/lib/core/src/lib/datatable/data/data-table.schema.ts index 1615b5c2d63..69a79be84fe 100644 --- a/lib/core/src/lib/datatable/data/data-table.schema.ts +++ b/lib/core/src/lib/datatable/data/data-table.schema.ts @@ -49,7 +49,6 @@ export abstract class DataTableSchema { public createDatatableSchema(): void { this.loadLayoutPresets(); - if (!this.columns || this.columns.length === 0) { this.createColumns(); this.columnsSchemaSubject$.next(true); @@ -94,11 +93,12 @@ export abstract class DataTableSchema { if (columnList?.columns?.length > 0) { schema = columnList.columns.map((c) => c as DataColumn); } + console.log(schema); return schema; } public getSchemaFromConfig(presetColumn: string): DataColumn[] { - return presetColumn ? this.layoutPresets[presetColumn].map((col) => new ObjectDataColumn(col)) : []; + return presetColumn && this.layoutPresets[presetColumn] ? this.layoutPresets[presetColumn].map((col) => new ObjectDataColumn(col)) : []; } private getDefaultLayoutPreset(): DataColumn[] { diff --git a/lib/extensions/src/lib/config/document-list.extensions.ts b/lib/extensions/src/lib/config/document-list.extensions.ts index 863caa06b4d..1bce638bd0f 100644 --- a/lib/extensions/src/lib/config/document-list.extensions.ts +++ b/lib/extensions/src/lib/config/document-list.extensions.ts @@ -27,6 +27,7 @@ export interface DocumentListPresetRef extends ExtensionElement { template: string; desktopOnly: boolean; sortingKey: string; + isHidden?: boolean; rules?: { [key: string]: string; visible?: string; From 692dc8c0064a6e22f9fdd416fd5d90c146489be2 Mon Sep 17 00:00:00 2001 From: DominikIwanek Date: Tue, 10 Oct 2023 21:20:52 +0200 Subject: [PATCH 4/8] [ACS-5566] - add docs --- docs/content-services/components/document-list.component.md | 2 ++ .../src/lib/document-list/components/document-list.component.ts | 2 +- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/docs/content-services/components/document-list.component.md b/docs/content-services/components/document-list.component.md index 1b52e1ee028..71c36ab0a42 100644 --- a/docs/content-services/components/document-list.component.md +++ b/docs/content-services/components/document-list.component.md @@ -60,6 +60,7 @@ Displays the documents from a repository. | ---- | ---- | ------------- | ----------- | | additionalSorting | [`DataSorting`](../../../lib/core/src/lib/datatable/data/data-sorting.model.ts) | | Defines default sorting. The format is an array of strings `[key direction, otherKey otherDirection]` i.e. `['name desc', 'nodeType asc']` or `['name asc']`. Set this value if you want a base rule to be added to the sorting apart from the one driven by the header. | | allowDropFiles | `boolean` | false | When true, this enables you to drop files directly into subfolders shown as items in the list or into another file to trigger updating it's version. When false, the dropped file will be added to the current folder (ie, the one containing all the items shown in the list). See the [Upload directive](../../core/directives/upload.directive.md) for further details about how the file drop is handled. | +| columnsPresetKey | `string` | | Key of columns preset set in extension.json| | contentActions | `boolean` | false | Toggles content actions for each row | | contentActionsPosition | `string` | "right" | Position of the content actions dropdown menu. Can be set to "left" or "right". | | contextMenuActions | `boolean` | false | Toggles context menus for each row | @@ -72,6 +73,7 @@ Displays the documents from a repository. | includeFields | `string[]` | | Include additional information about the node in the server request. For example: association, isLink, isLocked and others. | | loading | `boolean` | false | Toggles the loading state and animated spinners for the component. Used in combination with `navigate=false` to perform custom navigation and loading state indication. | | locationFormat | `string` | "/" | The default route for all the location-based columns (if declared). | +| maxColumnsVisible | `number` | | Limit of possible visible columns, including "$thumbnail" column if provided | | maxItems | `number` | | Default value is stored in the user preference settings. Use this only if you are not using pagination. | | multiselect | `boolean` | false | Toggles multiselect mode | | navigate | `boolean` | true | Toggles navigation to folder content or file preview | diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.ts b/lib/content-services/src/lib/document-list/components/document-list.component.ts index 3fd737376f0..67c814ecae1 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.ts +++ b/lib/content-services/src/lib/document-list/components/document-list.component.ts @@ -313,7 +313,7 @@ export class DocumentListComponent extends DataTableSchema implements OnInit, On @Input() maxItems: number = this.DEFAULT_PAGINATION.maxItems; - /** Key of columns preset if columns are not specified */ + /** Key of columns preset set in extension.json */ @Input() columnsPresetKey?: string; From 9f70d92933edd576d5575a5f895150ec203d89bc Mon Sep 17 00:00:00 2001 From: DominikIwanek Date: Wed, 11 Oct 2023 09:04:13 +0200 Subject: [PATCH 5/8] [ACS-5566] - style changes after CR --- .../lib/document-list/components/document-list.component.ts | 4 ++-- lib/core/src/lib/datatable/data/data-table.schema.ts | 1 - 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.ts b/lib/content-services/src/lib/document-list/components/document-list.component.ts index 67c814ecae1..132a970291b 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.ts +++ b/lib/content-services/src/lib/document-list/components/document-list.component.ts @@ -767,8 +767,8 @@ export class DocumentListComponent extends DataTableSchema implements OnInit, On } } } - onColumnsVisibilityChange(e: Array): void { - this.data.setColumns(e); + onColumnsVisibilityChange(updatedColumns: Array): void { + this.data.setColumns(updatedColumns); } onNodeClick(nodeEntry: NodeEntry) { const domEvent = new CustomEvent('node-click', { diff --git a/lib/core/src/lib/datatable/data/data-table.schema.ts b/lib/core/src/lib/datatable/data/data-table.schema.ts index 69a79be84fe..693d753441f 100644 --- a/lib/core/src/lib/datatable/data/data-table.schema.ts +++ b/lib/core/src/lib/datatable/data/data-table.schema.ts @@ -93,7 +93,6 @@ export abstract class DataTableSchema { if (columnList?.columns?.length > 0) { schema = columnList.columns.map((c) => c as DataColumn); } - console.log(schema); return schema; } From d167ebe28c4a4661bba8d55679a3c56e099748d4 Mon Sep 17 00:00:00 2001 From: DominikIwanek Date: Wed, 11 Oct 2023 11:27:40 +0200 Subject: [PATCH 6/8] [ACS-5566] - changes for pipeline --- .../lib/document-list/models/preset.model.ts | 26 +++++++++++++++++++ .../columns-selector.component.ts | 2 +- 2 files changed, 27 insertions(+), 1 deletion(-) diff --git a/lib/content-services/src/lib/document-list/models/preset.model.ts b/lib/content-services/src/lib/document-list/models/preset.model.ts index 712640f68a4..16d05d9da99 100644 --- a/lib/content-services/src/lib/document-list/models/preset.model.ts +++ b/lib/content-services/src/lib/document-list/models/preset.model.ts @@ -23,6 +23,32 @@ export const presetsDefaultModel = { srTitle: 'ADF-DOCUMENT-LIST.LAYOUT.THUMBNAIL', sortable: false }, + { + key: 'name', + type: 'text', + title: 'ADF-DOCUMENT-LIST.LAYOUT.NAME', + cssClass: 'full-width ellipsis-cell', + sortable: true + }, + { + key: 'path', + type: 'location', + title: 'ADF-DOCUMENT-LIST.LAYOUT.LOCATION', + sortable: true + }, + { + key: 'content.sizeInBytes', + type: 'fileSize', + title: 'ADF-DOCUMENT-LIST.LAYOUT.SIZE', + sortable: true + }, + { + key: 'archivedAt', + type: 'date', + title: 'ADF-DOCUMENT-LIST.LAYOUT.DELETED_ON', + format: 'timeAgo', + sortable: true + }, { key: 'archivedByUser.displayName', type: 'text', diff --git a/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts b/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts index 680f8b3f02f..4761768fb38 100644 --- a/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts +++ b/lib/core/src/lib/datatable/components/columns-selector/columns-selector.component.ts @@ -89,7 +89,7 @@ export class ColumnsSelectorComponent implements OnInit, OnDestroy { } isCheckboxDisabled(column: DataColumn): boolean { - return this.maxColumnsVisible && column.isHidden && this.maxColumnsVisible === this.columnItems.filter(column => !column.isHidden).length; + return this.maxColumnsVisible && column.isHidden && this.maxColumnsVisible === this.columnItems.filter(dataColumn => !dataColumn.isHidden).length; } private sortColumns(columns: DataColumn[]): DataColumn[] { From aeea577f35fc24c4bbc549a63d232d0122db3477 Mon Sep 17 00:00:00 2001 From: DominikIwanek Date: Thu, 12 Oct 2023 14:01:12 +0200 Subject: [PATCH 7/8] [ACS-5566] - changes for pipeline --- .../components/document-list.component.ts | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.ts b/lib/content-services/src/lib/document-list/components/document-list.component.ts index 132a970291b..e6a353ea0a0 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.ts +++ b/lib/content-services/src/lib/document-list/components/document-list.component.ts @@ -482,14 +482,15 @@ export class DocumentListComponent extends DataTableSchema implements OnInit, On } ngAfterContentInit() { - this.setTableSchema(); - } - - private setTableSchema() { + if (this.columnList) { + this.columnList.columns.changes.pipe(takeUntil(this.onDestroy$)).subscribe(() => { + this.createColumns(); + this.data.setColumns(this.columns); + }); + } this.createDatatableSchema(); this.data.setColumns(this.columns); } - ngOnChanges(changes: SimpleChanges) { if (!changes['preselectNodes']) { this.resetSelection(); From 530f66aaed2afb89e34c75a51592ddd32193886c Mon Sep 17 00:00:00 2001 From: DominikIwanek Date: Thu, 12 Oct 2023 14:37:38 +0200 Subject: [PATCH 8/8] [ACS-5566] - changes for pipeline --- .../lib/document-list/components/document-list.component.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/lib/content-services/src/lib/document-list/components/document-list.component.ts b/lib/content-services/src/lib/document-list/components/document-list.component.ts index e6a353ea0a0..2417894819c 100644 --- a/lib/content-services/src/lib/document-list/components/document-list.component.ts +++ b/lib/content-services/src/lib/document-list/components/document-list.component.ts @@ -56,7 +56,9 @@ import { AlfrescoApiService, UserPreferenceValues, DataRow, - DataTableService, DataTableSchema, DataColumn + DataTableService, + DataTableSchema, + DataColumn } from '@alfresco/adf-core'; import { NodesApiService } from '../../common/services/nodes-api.service';