mirror of https://github.com/apache/nifi.git
[NIFI-13246] move actions from details columns into menu (#8900)
* [NIFI-13246] move actions from details columns into menu * move View Documentation menu option lower This closes #8900
This commit is contained in:
Scott Aslan
GitHub
parent
732b587561
commit
e66c1643d1
|
|
@ -74,19 +74,6 @@
|
|||
(matSortChange)="updateSort($event)"
|
||||
[matSortActive]="sort.active"
|
||||
[matSortDirection]="sort.direction">
|
||||
<!-- More Details Column -->
|
||||
<ng-container matColumnDef="moreDetails">
|
||||
<th mat-header-cell *matHeaderCellDef></th>
|
||||
<td mat-cell *matCellDef="let item">
|
||||
<div class="flex items-center gap-x-2">
|
||||
<div
|
||||
class="pointer fa fa-info-circle primary-color"
|
||||
title="View Details"
|
||||
(click)="viewDetailsClicked(item)"></div>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Name Column -->
|
||||
<ng-container matColumnDef="eventTime">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>Event Time</th>
|
||||
|
|
@ -158,6 +145,10 @@
|
|||
<i class="fa fa-ellipsis-v"></i>
|
||||
</button>
|
||||
<mat-menu #actionMenu="matMenu" xPosition="before">
|
||||
<button mat-menu-item (click)="viewDetailsClicked(item)">
|
||||
<i class="fa fa-info-circle primary-color mr-2"></i>
|
||||
View Details
|
||||
</button>
|
||||
<button mat-menu-item (click)="showLineageGraph(item)">
|
||||
<i class="icon icon-lineage primary-color mr-2"></i>
|
||||
Show Lineage
|
||||
|
|
|
|||
|
|
@ -16,14 +16,6 @@
|
|||
*/
|
||||
|
||||
.provenance-event-table {
|
||||
.listing-table {
|
||||
table {
|
||||
.mat-column-moreDetails {
|
||||
width: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lineage {
|
||||
.lineage-controls {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -190,7 +190,6 @@ export class ProvenanceEventTable implements AfterViewInit {
|
|||
private destroyRef: DestroyRef = inject(DestroyRef);
|
||||
|
||||
displayedColumns: string[] = [
|
||||
'moreDetails',
|
||||
'eventTime',
|
||||
'eventType',
|
||||
'flowFileUuid',
|
||||
|
|
|
|||
|
|
@ -41,19 +41,6 @@
|
|||
<div class="flex-1 relative">
|
||||
<div class="listing-table absolute inset-0 overflow-y-auto">
|
||||
<table mat-table [dataSource]="dataSource">
|
||||
<!-- More Details Column -->
|
||||
<ng-container matColumnDef="moreDetails">
|
||||
<th mat-header-cell *matHeaderCellDef></th>
|
||||
<td mat-cell *matCellDef="let item">
|
||||
<div class="flex items-center gap-x-2">
|
||||
<div
|
||||
class="pointer fa fa-info-circle primary-color"
|
||||
title="View Details"
|
||||
(click)="viewFlowFileClicked(item)"></div>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Position Column -->
|
||||
<ng-container matColumnDef="position">
|
||||
<th mat-header-cell *matHeaderCellDef>Position</th>
|
||||
|
|
@ -139,6 +126,10 @@
|
|||
</button>
|
||||
}
|
||||
<mat-menu #actionMenu="matMenu" xPosition="before">
|
||||
<button mat-menu-item (click)="viewFlowFileClicked(item)">
|
||||
<i class="fa fa-info-circle primary-color mr-2"></i>
|
||||
View Details
|
||||
</button>
|
||||
@if (item.size > 0) {
|
||||
<button mat-menu-item (click)="downloadContentClicked(item)">
|
||||
<i class="fa fa-download primary-color mr-2"></i>
|
||||
|
|
|
|||
|
|
@ -18,10 +18,6 @@
|
|||
.flowfile-table {
|
||||
.listing-table {
|
||||
table {
|
||||
.mat-column-moreDetails {
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.mat-column-flowFileUuid {
|
||||
width: 25%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -79,7 +79,6 @@ export class FlowFileTable {
|
|||
protected readonly ValidationErrorsTip = ValidationErrorsTip;
|
||||
|
||||
displayedColumns: string[] = [
|
||||
'moreDetails',
|
||||
'position',
|
||||
'flowFileUuid',
|
||||
'fileName',
|
||||
|
|
|
|||
|
|
@ -31,10 +31,6 @@
|
|||
<td mat-cell *matCellDef="let item">
|
||||
@if (canRead(item)) {
|
||||
<div class="flex items-center gap-x-2">
|
||||
<div
|
||||
class="pointer fa fa-book primary-color"
|
||||
(click)="viewDocumentationClicked(item, $event)"
|
||||
title="View Documentation"></div>
|
||||
@if (hasComments(item)) {
|
||||
<div
|
||||
class="pointer fa fa-comment primary-color"
|
||||
|
|
@ -157,6 +153,12 @@
|
|||
View State
|
||||
</button>
|
||||
}
|
||||
@if (canRead(item)) {
|
||||
<button mat-menu-item (click)="viewDocumentationClicked(item)">
|
||||
<i class="fa fa-book primary-color mr-2"></i>
|
||||
View Documentation
|
||||
</button>
|
||||
}
|
||||
</mat-menu>
|
||||
</div>
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
.listing-table {
|
||||
table {
|
||||
.mat-column-moreDetails {
|
||||
width: 96px;
|
||||
width: 74px;
|
||||
}
|
||||
|
||||
.mat-column-name {
|
||||
|
|
|
|||
|
|
@ -132,8 +132,7 @@ export class FlowAnalysisRuleTable {
|
|||
return !!entity.operatePermissions?.canWrite;
|
||||
}
|
||||
|
||||
viewDocumentationClicked(entity: FlowAnalysisRuleEntity, event: MouseEvent): void {
|
||||
event.stopPropagation();
|
||||
viewDocumentationClicked(entity: FlowAnalysisRuleEntity): void {
|
||||
this.viewFlowAnalysisRuleDocumentation.next(entity);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -33,11 +33,6 @@
|
|||
<td mat-cell *matCellDef="let item">
|
||||
@if (canRead(item)) {
|
||||
<div class="flex items-center gap-x-2">
|
||||
<div
|
||||
class="pointer fa fa-book primary-color"
|
||||
(click)="viewDocumentationClicked(item, $event)"
|
||||
title="View Documentation"></div>
|
||||
|
||||
<!-- Validation Errors -->
|
||||
@if (hasErrors(item)) {
|
||||
<div
|
||||
|
|
@ -133,6 +128,12 @@
|
|||
Remove
|
||||
</button>
|
||||
}
|
||||
@if (canRead(item)) {
|
||||
<button mat-menu-item (click)="viewDocumentationClicked(item)">
|
||||
<i class="fa fa-book primary-color mr-2"></i>
|
||||
View Documentation
|
||||
</button>
|
||||
}
|
||||
@if (canManageAccessPolicies()) {
|
||||
<button mat-menu-item (click)="manageAccessPoliciesClicked(item)">
|
||||
<i class="fa fa-key primary-color mr-2"></i>
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@
|
|||
.listing-table {
|
||||
table {
|
||||
.mat-column-moreDetails {
|
||||
width: 52px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.mat-column-name {
|
||||
|
|
|
|||
|
|
@ -138,8 +138,7 @@ export class ParameterProvidersTable {
|
|||
return false;
|
||||
}
|
||||
|
||||
viewDocumentationClicked(entity: ParameterProviderEntity, event: MouseEvent): void {
|
||||
event.stopPropagation();
|
||||
viewDocumentationClicked(entity: ParameterProviderEntity): void {
|
||||
this.viewParameterProviderDocumentation.next(entity);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -31,10 +31,6 @@
|
|||
<td mat-cell *matCellDef="let item">
|
||||
@if (canRead(item)) {
|
||||
<div class="flex items-center gap-x-2">
|
||||
<div
|
||||
class="pointer fa fa-book primary-color"
|
||||
(click)="viewDocumentationClicked(item, $event)"
|
||||
title="View Documentation"></div>
|
||||
@if (hasComments(item)) {
|
||||
<div
|
||||
class="pointer fa fa-comment primary-color"
|
||||
|
|
@ -159,6 +155,12 @@
|
|||
View State
|
||||
</button>
|
||||
}
|
||||
@if (canRead(item)) {
|
||||
<button mat-menu-item (click)="viewDocumentationClicked(item)">
|
||||
<i class="fa fa-book primary-color mr-2"></i>
|
||||
View Documentation
|
||||
</button>
|
||||
}
|
||||
@if (canManageAccessPolicies()) {
|
||||
<button mat-menu-item (click)="managedAccessPoliciesClicked(item)">
|
||||
<i class="fa fa-key primary-color mr-2"></i>
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
.reporting-task-table.listing-table {
|
||||
table {
|
||||
.mat-column-moreDetails {
|
||||
width: 96px;
|
||||
width: 74px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -84,8 +84,7 @@ export class ReportingTaskTable {
|
|||
return !!entity.operatePermissions?.canWrite;
|
||||
}
|
||||
|
||||
viewDocumentationClicked(entity: ReportingTaskEntity, event: MouseEvent): void {
|
||||
event.stopPropagation();
|
||||
viewDocumentationClicked(entity: ReportingTaskEntity): void {
|
||||
this.viewReportingTaskDocumentation.next(entity);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -39,14 +39,6 @@
|
|||
(matSortChange)="sortData($event)"
|
||||
[matSortActive]="initialSortColumn"
|
||||
[matSortDirection]="initialSortDirection">
|
||||
<!-- More Details Column -->
|
||||
<ng-container matColumnDef="moreDetails">
|
||||
<th mat-header-cell *matHeaderCellDef></th>
|
||||
<td mat-cell *matCellDef="let item">
|
||||
<div class="flex items-center gap-x-2"></div>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Name Column -->
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>
|
||||
|
|
|
|||
|
|
@ -17,11 +17,6 @@
|
|||
|
||||
.port-status-table {
|
||||
.listing-table {
|
||||
.mat-column-moreDetails {
|
||||
width: 32px;
|
||||
min-width: 32px;
|
||||
}
|
||||
|
||||
.mat-column-runStatus {
|
||||
width: 20%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -63,9 +63,9 @@ export class PortStatusTable extends ComponentStatusTable<PortStatusSnapshotEnti
|
|||
|
||||
@Input() set portType(type: 'input' | 'output') {
|
||||
if (type === 'input') {
|
||||
this.displayedColumns = ['moreDetails', 'name', 'runStatus', 'out', 'actions'];
|
||||
this.displayedColumns = ['name', 'runStatus', 'out', 'actions'];
|
||||
} else {
|
||||
this.displayedColumns = ['moreDetails', 'name', 'runStatus', 'in', 'actions'];
|
||||
this.displayedColumns = ['name', 'runStatus', 'in', 'actions'];
|
||||
}
|
||||
this._portType = type;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,23 +40,6 @@
|
|||
(matSortChange)="sortData($event)"
|
||||
[matSortActive]="initialSortColumn"
|
||||
[matSortDirection]="initialSortDirection">
|
||||
<!-- More Details Column -->
|
||||
<ng-container matColumnDef="moreDetails">
|
||||
<th mat-header-cell *matHeaderCellDef></th>
|
||||
<td mat-cell *matCellDef="let item">
|
||||
@if (canRead(item)) {
|
||||
<div class="flex items-center gap-x-2">
|
||||
<!-- TODO - support showing connection details in EditConnectionDialog -->
|
||||
<!-- @if (canRead(item)) {-->
|
||||
<!-- <div-->
|
||||
<!-- class="pointer fa fa-info-circle primary-color"-->
|
||||
<!-- title="View Connection Details"></div>-->
|
||||
<!-- }-->
|
||||
</div>
|
||||
}
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Name Column -->
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>
|
||||
|
|
|
|||
|
|
@ -17,10 +17,6 @@
|
|||
|
||||
.connection-status-table {
|
||||
.listing-table {
|
||||
.mat-column-moreDetails {
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.mat-column-name {
|
||||
width: 25%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -58,7 +58,6 @@ export class ConnectionStatusTable extends ComponentStatusTable<ConnectionStatus
|
|||
];
|
||||
|
||||
displayedColumns: string[] = [
|
||||
'moreDetails',
|
||||
'name',
|
||||
'queue',
|
||||
'threshold',
|
||||
|
|
|
|||
|
|
@ -39,14 +39,6 @@
|
|||
(matSortChange)="sortData($event)"
|
||||
[matSortActive]="initialSortColumn"
|
||||
[matSortDirection]="initialSortDirection">
|
||||
<!-- More Details Column -->
|
||||
<ng-container matColumnDef="moreDetails">
|
||||
<th mat-header-cell *matHeaderCellDef></th>
|
||||
<td mat-cell *matCellDef="let item">
|
||||
<div class="flex items-center gap-x-2"></div>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Name Column -->
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>
|
||||
|
|
|
|||
|
|
@ -17,10 +17,6 @@
|
|||
|
||||
.process-group-status-table {
|
||||
.listing-table {
|
||||
.mat-column-moreDetails {
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.mat-column-name {
|
||||
width: 25%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -63,7 +63,6 @@ export class ProcessGroupStatusTable extends ComponentStatusTable<ProcessGroupSt
|
|||
filterableColumns: SummaryTableFilterColumn[] = [{ key: 'name', label: 'name' }];
|
||||
|
||||
displayedColumns: string[] = [
|
||||
'moreDetails',
|
||||
'name',
|
||||
'versionedFlowState',
|
||||
'transferred',
|
||||
|
|
|
|||
|
|
@ -39,23 +39,6 @@
|
|||
(matSortChange)="sortData($event)"
|
||||
[matSortActive]="initialSortColumn"
|
||||
[matSortDirection]="initialSortDirection">
|
||||
<!-- More Details Column -->
|
||||
<ng-container matColumnDef="moreDetails">
|
||||
<th mat-header-cell *matHeaderCellDef></th>
|
||||
<td mat-cell *matCellDef="let item">
|
||||
@if (canRead(item)) {
|
||||
<div class="flex items-center gap-x-2">
|
||||
<!-- TODO - support showing processor details in EditProcessorDialog -->
|
||||
<!-- @if (canRead(item)) {-->
|
||||
<!-- <div-->
|
||||
<!-- class="pointer fa fa-info-circle primary-color"-->
|
||||
<!-- title="View Processor Details"></div>-->
|
||||
<!-- }-->
|
||||
</div>
|
||||
}
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Name Column -->
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>
|
||||
|
|
|
|||
|
|
@ -17,10 +17,6 @@
|
|||
|
||||
.processor-status-table {
|
||||
.listing-table {
|
||||
.mat-column-moreDetails {
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.mat-column-name {
|
||||
width: 25%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -57,7 +57,6 @@ export class ProcessorStatusTable extends ComponentStatusTable<ProcessorStatusSn
|
|||
];
|
||||
|
||||
displayedColumns: string[] = [
|
||||
'moreDetails',
|
||||
'name',
|
||||
'type',
|
||||
'processGroup',
|
||||
|
|
|
|||
|
|
@ -40,14 +40,6 @@
|
|||
(matSortChange)="sortData($event)"
|
||||
[matSortActive]="initialSortColumn"
|
||||
[matSortDirection]="initialSortDirection">
|
||||
<!-- More Details Column -->
|
||||
<ng-container matColumnDef="moreDetails">
|
||||
<th mat-header-cell *matHeaderCellDef></th>
|
||||
<td mat-cell *matCellDef="let item">
|
||||
<div class="flex items-center gap-x-2"></div>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<!-- Name Column -->
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header>
|
||||
|
|
|
|||
|
|
@ -17,10 +17,6 @@
|
|||
|
||||
.remote-process-group-status-table {
|
||||
.listing-table {
|
||||
.mat-column-moreDetails {
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.mat-column-name {
|
||||
width: 25%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@ export class RemoteProcessGroupStatusTable extends ComponentStatusTable<RemotePr
|
|||
{ key: 'name', label: 'name' },
|
||||
{ key: 'targetUri', label: 'uri' }
|
||||
];
|
||||
displayedColumns: string[] = ['moreDetails', 'name', 'uri', 'transmitting', 'sent', 'received', 'actions'];
|
||||
displayedColumns: string[] = ['name', 'uri', 'transmitting', 'sent', 'received', 'actions'];
|
||||
|
||||
constructor(private nifiCommon: NiFiCommon) {
|
||||
super();
|
||||
|
|
|
|||
|
|
@ -31,11 +31,6 @@
|
|||
<td mat-cell *matCellDef="let item">
|
||||
@if (canRead(item)) {
|
||||
<div class="flex items-center gap-x-2">
|
||||
<div
|
||||
class="pointer fa fa-book primary-color"
|
||||
(click)="viewDocumentationClicked(item, $event)"
|
||||
title="View Documentation"></div>
|
||||
|
||||
@if (hasComments(item)) {
|
||||
<div
|
||||
class="pointer fa fa-comment primary-color"
|
||||
|
|
@ -166,6 +161,12 @@
|
|||
View State
|
||||
</button>
|
||||
}
|
||||
@if (canRead(item)) {
|
||||
<button mat-menu-item (click)="viewDocumentationClicked(item)">
|
||||
<i class="fa fa-book primary-color mr-2"></i>
|
||||
View Documentation
|
||||
</button>
|
||||
}
|
||||
@if (canManageAccessPolicies()) {
|
||||
<button mat-menu-item (click)="manageAccessPoliciesClicked(item)">
|
||||
<i class="fa fa-key primary-color mr-2"></i>
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
.listing-table {
|
||||
table {
|
||||
.mat-column-moreDetails {
|
||||
width: 96px;
|
||||
width: 74px;
|
||||
}
|
||||
|
||||
.mat-column-name {
|
||||
|
|
|
|||
|
|
@ -118,8 +118,7 @@ export class ControllerServiceTable {
|
|||
return !this.nifiCommon.isBlank(entity.component.comments);
|
||||
}
|
||||
|
||||
viewDocumentationClicked(entity: ControllerServiceEntity, event: MouseEvent): void {
|
||||
event.stopPropagation();
|
||||
viewDocumentationClicked(entity: ControllerServiceEntity): void {
|
||||
this.viewControllerServiceDocumentation.next(entity);
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue