Filter empty states

This commit is contained in:
Adina Țeudan 2021-04-13 22:01:12 +03:00
parent ab8312c8db
commit fbb9af2921
10 changed files with 53 additions and 12 deletions

View File

@ -22,7 +22,7 @@
<div class="scrollbar-placeholder"></div>
</div>
<div *ngIf="noData" class="no-data heading-l" translate="downloads-list.no-data"></div>
<redaction-empty-state *ngIf="noData" icon="red:download" screen="downloads-list"></redaction-empty-state>
<cdk-virtual-scroll-viewport [itemSize]="80" redactionHasScrollbar>
<!-- Table lines -->

View File

@ -81,6 +81,12 @@
screen="dictionary-listing"
></redaction-empty-state>
<redaction-empty-state
*ngIf="dictionaries.length && !displayedDictionaries.length"
screen="dictionary-listing"
type="no-match"
></redaction-empty-state>
<cdk-virtual-scroll-viewport [itemSize]="80" redactionHasScrollbar>
<div
class="table-item pointer"

View File

@ -91,6 +91,12 @@
<redaction-empty-state *ngIf="!attributes.length" screen="file-attributes-listing" icon="red:attribute"></redaction-empty-state>
<redaction-empty-state
*ngIf="attributes.length && !displayedAttributes.length"
screen="file-attributes-listing"
type="no-match"
></redaction-empty-state>
<cdk-virtual-scroll-viewport [itemSize]="80" redactionHasScrollbar>
<!-- Table lines -->
<div class="table-item" *cdkVirtualFor="let attribute of displayedAttributes | sortBy: sortingOption.order:sortingOption.column">

View File

@ -78,6 +78,12 @@
<redaction-empty-state *ngIf="!ruleSets.length" icon="red:template" screen="project-templates-listing"></redaction-empty-state>
<redaction-empty-state
*ngIf="ruleSets.length && !displayedRuleSets.length"
screen="project-templates-listing"
type="no-match"
></redaction-empty-state>
<cdk-virtual-scroll-viewport [itemSize]="100" redactionHasScrollbar>
<div
class="table-item pointer"

View File

@ -73,7 +73,7 @@
<div class="scrollbar-placeholder"></div>
</div>
<!--No empty state necessary because there will always be at least the current user.-->
<redaction-empty-state *ngIf="!displayedUsers.length" screen="user-listing" type="no-match"></redaction-empty-state>
<cdk-virtual-scroll-viewport [itemSize]="80" redactionHasScrollbar>
<!-- Table lines -->

View File

@ -77,7 +77,11 @@
[showButton]="permissionsService.isManager()"
></redaction-empty-state>
<div *ngIf="appStateService.hasProjects && !displayedProjects.length" class="no-data heading-l" translate="project-listing.no-projects-match"></div>
<redaction-empty-state
*ngIf="appStateService.hasProjects && !displayedProjects.length"
screen="project-listing"
type="no-match"
></redaction-empty-state>
<cdk-virtual-scroll-viewport [itemSize]="85" redactionHasScrollbar>
<div

View File

@ -167,11 +167,11 @@
buttonIcon="red:upload"
></redaction-empty-state>
<div
<redaction-empty-state
*ngIf="appStateService.activeProject?.hasFiles && !displayedFiles.length"
class="no-data heading-l"
translate="project-overview.no-files-match"
></div>
screen="project-overview"
type="no-match"
></redaction-empty-state>
<cdk-virtual-scroll-viewport [itemSize]="80" redactionHasScrollbar>
<div

View File

@ -1,6 +1,6 @@
<div class="empty-state" [ngStyle]="{ 'padding-left': horizontalPadding + 'px', 'padding-right': horizontalPadding + 'px' }">
<mat-icon [svgIcon]="icon"></mat-icon>
<div class="heading-l" [translate]="text || screen + '.no-data.title'"></div>
<div class="heading-l" [translate]="text || screen + '.' + type + '.title'"></div>
<redaction-icon-button *ngIf="showButton" (action)="action.emit()" [icon]="buttonIcon" [text]="screen + '.no-data.action'" type="primary">
</redaction-icon-button>
</div>

View File

@ -12,6 +12,7 @@ export class EmptyStateComponent implements OnInit {
@Input() showButton = true;
@Input() buttonIcon = 'red:plus';
@Input() horizontalPadding = 100;
@Input() type: 'no-data' | 'no-match' = 'no-data';
@Output() action = new EventEmitter();
constructor() {}

View File

@ -169,7 +169,9 @@
"action": "Delete Project",
"delete-failed": "Failed to delete project: {{projectName}}"
},
"no-projects-match": "No Projects match your current filters"
"no-match": {
"title": "No projects match your current filters."
}
},
"project-details": {
"title": "Project Details",
@ -194,6 +196,9 @@
"title": "There are no documents yet.",
"action": "Upload Document"
},
"no-match": {
"title": "No documents match your current filters."
},
"search": "Document name...",
"header-actions": {
"edit": "Edit",
@ -209,7 +214,6 @@
"approve": "Approve",
"approve-disabled": "File can only be approved once it has been analysed with the latest dictionaries and all suggestions have been processed",
"under-review": "Under Review",
"no-files-match": "No File match your current filters",
"upload-files": "Drag & Drop files anywhere",
"upload-files-btn": "Upload Files",
"new-rule": {
@ -731,6 +735,9 @@
"no-data": {
"title": "There are no dictionaries yet.",
"action": "New Dictionary"
},
"no-match": {
"title": "No dictionaries match your current filters."
}
},
"digital-signature": "Digital Signature",
@ -755,6 +762,9 @@
},
"no-data": {
"title": "There are no project templates yet."
},
"no-match": {
"title": "No project templates match your current filters."
}
},
"file-attributes-listing": {
@ -775,6 +785,9 @@
"no-data": {
"title": "There are no file attributes yet."
},
"no-match": {
"title": "No file attributes match your current filters."
},
"read-only": "Read-only",
"action": {
"edit": "Edit Attribute",
@ -859,7 +872,10 @@
"delete-disabled": "You cannot delete your own account."
},
"search": "Search...",
"add-new": "New User"
"add-new": "New User",
"no-match": {
"title": "No users match your current filters."
}
},
"add-edit-user": {
"title": {
@ -1083,7 +1099,9 @@
"table-header": {
"title": "{{length}} downloads"
},
"no-data": "No active downloads.",
"no-data": {
"title": "No active downloads."
},
"table-col-names": {
"name": "Name",
"size": "Size",