mirror of
https://github.com/Alfresco/alfresco-content-app.git
synced 2025-07-24 17:31:52 +00:00
[ACA-1432] unified selection and single info drawer (#385)
* track document list selection state * selection management enhancements * (fix) hide info drawer on selection reset * use store selection * remove event handler * upgrade info drawer for personal files * upgrade favorties * upgrade recent files * move info drawer to a separate component * test fixes * update tests * test fixes * remove obsolete directive * use last selection entry * switch back to first selected node * selection improvements, versioning uses same node * optimised toolbar visibility evaluation * upgrade libs * update js api * test fixes * test fixes * test updates * test fixes * fix e2e tests * show metadata for last clicked node
This commit is contained in:
@@ -3,28 +3,25 @@
|
||||
<adf-breadcrumb root="APP.BROWSE.SHARED.TITLE">
|
||||
</adf-breadcrumb>
|
||||
|
||||
<adf-toolbar class="inline">
|
||||
<adf-toolbar class="inline" *ngIf="hasSelection">
|
||||
<button
|
||||
color="primary"
|
||||
mat-icon-button
|
||||
*ngIf="isFileSelected(documentList.selection)"
|
||||
title="{{ 'APP.ACTIONS.VIEW' | translate }}"
|
||||
(click)="onNodeDoubleClick(documentList.selection[0]?.entry)">
|
||||
(click)="showPreview(selectedNodes[0])">
|
||||
<mat-icon>open_in_browser</mat-icon>
|
||||
</button>
|
||||
|
||||
<button
|
||||
color="primary"
|
||||
mat-icon-button
|
||||
*ngIf="hasSelection(documentList.selection)"
|
||||
title="{{ 'APP.ACTIONS.DOWNLOAD' | translate }}"
|
||||
[adfNodeDownload]="documentList.selection">
|
||||
[adfNodeDownload]="selectedNodes">
|
||||
<mat-icon>get_app</mat-icon>
|
||||
</button>
|
||||
|
||||
<button mat-icon-button
|
||||
[color]="infoDrawerOpened ? 'accent' : 'primary'"
|
||||
*ngIf="hasSelection(documentList.selection)"
|
||||
title="{{ 'APP.ACTIONS.DETAILS' | translate }}"
|
||||
(click)="toggleSidebar()">
|
||||
<mat-icon>info_outline</mat-icon>
|
||||
@@ -33,7 +30,6 @@
|
||||
<button
|
||||
color="primary"
|
||||
mat-icon-button
|
||||
*ngIf="hasSelection(documentList.selection)"
|
||||
title="{{ 'APP.ACTIONS.MORE' | translate }}"
|
||||
[matMenuTriggerFor]="actionsMenu">
|
||||
<mat-icon>more_vert</mat-icon>
|
||||
@@ -44,7 +40,7 @@
|
||||
<button
|
||||
mat-menu-item
|
||||
#selection="adfFavorite"
|
||||
[adf-node-favorite]="documentList.selection">
|
||||
[adf-node-favorite]="selectedNodes">
|
||||
<mat-icon color="primary" *ngIf="selection.hasFavorites()">star</mat-icon>
|
||||
<mat-icon *ngIf="!selection.hasFavorites()">star_border</mat-icon>
|
||||
<span>{{ 'APP.ACTIONS.FAVORITE' | translate }}</span>
|
||||
@@ -52,23 +48,23 @@
|
||||
|
||||
<button
|
||||
mat-menu-item
|
||||
[acaCopyNode]="documentList.selection">
|
||||
[acaCopyNode]="selectedNodes">
|
||||
<mat-icon>content_copy</mat-icon>
|
||||
<span>{{ 'APP.ACTIONS.COPY' | translate }}</span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
mat-menu-item
|
||||
*ngIf="permission.check(documentList.selection, ['delete'], { target: 'allowableOperationsOnTarget' })"
|
||||
[acaMoveNode]="documentList.selection">
|
||||
*ngIf="permission.check(selectedNodes, ['delete'], { target: 'allowableOperationsOnTarget' })"
|
||||
[acaMoveNode]="selectedNodes">
|
||||
<mat-icon>library_books</mat-icon>
|
||||
<span>{{ 'APP.ACTIONS.MOVE' | translate }}</span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
mat-menu-item
|
||||
*ngIf="permission.check(documentList.selection, ['delete'])"
|
||||
[acaUnshareNode]="documentList.selection"
|
||||
*ngIf="permission.check(selectedNodes, ['delete'])"
|
||||
[acaUnshareNode]="selectedNodes"
|
||||
(links-unshared)="reload()">
|
||||
<mat-icon>stop_screen_share</mat-icon>
|
||||
<span>{{ 'APP.ACTIONS.UNSHARE' | translate }}</span>
|
||||
@@ -76,16 +72,16 @@
|
||||
|
||||
<button
|
||||
mat-menu-item
|
||||
*ngIf="permission.check(documentList.selection, ['delete'], { target: 'allowableOperationsOnTarget' })"
|
||||
[acaDeleteNode]="documentList.selection">
|
||||
*ngIf="permission.check(selectedNodes, ['delete'], { target: 'allowableOperationsOnTarget' })"
|
||||
[acaDeleteNode]="selectedNodes">
|
||||
<mat-icon>delete</mat-icon>
|
||||
<span>{{ 'APP.ACTIONS.DELETE' | translate }}</span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
mat-menu-item
|
||||
*ngIf="permission.check(documentList.selection[0], ['update'], { target: 'allowableOperationsOnTarget' })"
|
||||
[acaNodeVersions]="documentList.selection">
|
||||
*ngIf="permission.check(selectedNodes, ['update'], { target: 'allowableOperationsOnTarget' })"
|
||||
[acaNodeVersions]="lastSelectedNode">
|
||||
<mat-icon>history</mat-icon>
|
||||
<span>{{ 'APP.ACTIONS.VERSIONS' | translate }}</span>
|
||||
</button>
|
||||
@@ -100,7 +96,10 @@
|
||||
selectionMode="multiple"
|
||||
[sorting]="[ 'modifiedAt', 'desc' ]"
|
||||
[acaSortingPreferenceKey]="sortingPreferenceKey"
|
||||
(node-dblclick)="onNodeDoubleClick($event.detail?.node?.entry)">
|
||||
(node-dblclick)="onNodeDoubleClick($event.detail?.node?.entry)"
|
||||
(ready)="onDocumentListReady($event, documentList)"
|
||||
(node-select)="onNodeSelect($event, documentList)"
|
||||
(node-unselect)="onNodeUnselect($event, documentList)">
|
||||
|
||||
<empty-folder-content>
|
||||
<ng-template>
|
||||
@@ -173,41 +172,8 @@
|
||||
</adf-pagination>
|
||||
</div>
|
||||
|
||||
<div class="inner-layout__side-panel"
|
||||
*ngIf="infoDrawerOpened"
|
||||
[acaNodeInfo]="documentList.selection"
|
||||
(changed)="toggleSidebar($event)"
|
||||
#infoInstance=nodeInfo>
|
||||
|
||||
<adf-info-drawer [title]="'APP.INFO_DRAWER.TITLE' | translate">
|
||||
<adf-info-drawer-tab [label]="'APP.INFO_DRAWER.TABS.PROPERTIES' | translate">
|
||||
<div *ngIf="infoInstance.loading">
|
||||
<mat-progress-bar mode="indeterminate"></mat-progress-bar>
|
||||
</div>
|
||||
|
||||
<adf-content-metadata-card
|
||||
[readOnly]="!permission.check(documentList.selection, ['update'], { target: 'allowableOperationsOnTarget' })"
|
||||
[displayEmpty]="permission.check(documentList.selection, ['update'], { target: 'allowableOperationsOnTarget' })"
|
||||
[preset]="'custom'"
|
||||
[node]="infoInstance.node">
|
||||
</adf-content-metadata-card>
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab [label]="'APP.INFO_DRAWER.TABS.VERSIONS' | translate">
|
||||
<ng-container *ngIf="isFileSelected(documentList.selection);else choose_document_template">
|
||||
<adf-version-manager
|
||||
*ngIf="infoInstance.node"
|
||||
[node]="infoInstance.node">
|
||||
</adf-version-manager>
|
||||
</ng-container>
|
||||
<ng-template #choose_document_template>
|
||||
<div class="adf-manage-versions-empty">
|
||||
<mat-icon class="adf-manage-versions-empty-icon">face</mat-icon>
|
||||
{{ 'VERSION.SELECTION.EMPTY' | translate }}
|
||||
</div>
|
||||
</ng-template>
|
||||
</adf-info-drawer-tab>
|
||||
</adf-info-drawer>
|
||||
<div class="inner-layout__side-panel" *ngIf="infoDrawerOpened">
|
||||
<aca-info-drawer [node]="lastSelectedNode"></aca-info-drawer>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
Reference in New Issue
Block a user