Apache
/
nifi
mirror of https://github.com/apache/nifi.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[NIFI-13221] - display supported shortcut/hotkey combos in context menu (#8821) 

This closes #8821
This commit is contained in:
Rob Fellows 2024-05-14 09:59:14 -04:00 committed by GitHub
parent 08cc23826b
commit 7aaa5b4224
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 53 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/service/canvas-context-menu.service.ts
View File

@ -560,13 +560,20 @@ export class CanvasContextMenu implements ContextMenuDefinitionProvider {
condition: this.canvasActionsService.getConditionFunction('refresh'),
clazz: 'fa fa-refresh',
text: 'Refresh',
action: this.canvasActionsService.getActionFunction('refresh')
action: this.canvasActionsService.getActionFunction('refresh'),
shortcut: {
control: true,
code: 'R'
}
},
{
condition: this.canvasActionsService.getConditionFunction('leaveGroup'),
clazz: 'fa fa-level-up',
text: 'Leave Group',
action: this.canvasActionsService.getActionFunction('leaveGroup')
action: this.canvasActionsService.getActionFunction('leaveGroup'),
shortcut: {
code: 'ESC'
}
},
{
isSeparator: true
@ -1230,7 +1237,11 @@ export class CanvasContextMenu implements ContextMenuDefinitionProvider {
condition: this.canvasActionsService.getConditionFunction('copy'),
clazz: 'fa fa-copy',
text: 'Copy',
action: this.canvasActionsService.getActionFunction('copy')
action: this.canvasActionsService.getActionFunction('copy'),
shortcut: {
control: true,
code: 'C'
}
},
{
condition: () => {
@ -1245,6 +1256,10 @@ export class CanvasContextMenu implements ContextMenuDefinitionProvider {
this.canvasActionsService.getActionFunction('paste')(selection, { pasteLocation });
}
}
},
shortcut: {
control: true,
code: 'V'
}
},
{
@ -1296,7 +1311,10 @@ export class CanvasContextMenu implements ContextMenuDefinitionProvider {
condition: this.canvasActionsService.getConditionFunction('delete'),
clazz: 'fa fa-trash',
text: 'Delete',
action: this.canvasActionsService.getActionFunction('delete')
action: this.canvasActionsService.getActionFunction('delete'),
shortcut: {
code: '⌫'
}
}
]
};

24
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/context-menu/context-menu.component.html
View File

@ -27,7 +27,7 @@
} @else {
@if (hasSubMenu(item)) {
@if (menuComponent.menu; as subMenu) {
<button class="context-menu-item pl-1 pt-2 pb-2" cdkMenuItem [cdkMenuTriggerFor]="subMenu">
<button class="context-menu-item pl-1 pr-1 pt-2 pb-2" cdkMenuItem [cdkMenuTriggerFor]="subMenu">
<div class="context-menu-item-img" [class]="item.clazz"></div>
<div class="context-menu-item-text surface-contrast">{{ item.text }}</div>
<div class="context-menu-group-item-img fa fa-caret-right"></div>
@ -39,11 +39,27 @@
[menuId]="item.subMenuId"></fd-context-menu>
} @else {
<button
class="context-menu-item pl-1 pt-2 pb-2"
class="context-menu-item pl-1 pr-1 pt-2 pb-2 flex justify-between"
(click)="menuItemClicked(item, $event)"
cdkMenuItem>
<div class="context-menu-item-img" [class]="item.clazz"></div>
<div class="context-menu-item-text surface-contrast">{{ item.text }}</div>
<div class="flex">
<div class="context-menu-item-img" [class]="item.clazz"></div>
<div class="context-menu-item-text surface-contrast">{{ item.text }}</div>
</div>
@if (item.shortcut) {
<div class="context-menu-item-shortcut surface-contrast justify-end opacity-40">
@if (item.shortcut.shift) {
⇧
}
@if (item.shortcut.control) {
{{ isMac ? '⌘' : '⌃' }}
}
@if (item.shortcut.alt) {
⌥
}
{{ item.shortcut.code }}
</div>
}
</button>
}
}

11
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/context-menu/context-menu.component.ts
View File

@ -22,10 +22,19 @@ import { CdkMenu, CdkMenuItem, CdkMenuTrigger } from '@angular/cdk/menu';
export interface ContextMenuDefinitionProvider {
getMenu(menuId: string): ContextMenuDefinition | undefined;
filterMenuItem(menuItem: ContextMenuItemDefinition): boolean;
menuItemClicked(menuItem: ContextMenuItemDefinition, event: MouseEvent): void;
}
export interface KeyboardShortcut {
code: string;
control?: boolean;
shift?: boolean;
alt?: boolean;
}
export interface ContextMenuItemDefinition {
isSeparator?: boolean;
condition?: (selection: any) => boolean;
@ -33,6 +42,7 @@ export interface ContextMenuItemDefinition {
text?: string;
subMenuId?: string;
action?: (selection: any, event?: MouseEvent) => void;
shortcut?: KeyboardShortcut;
}
export interface ContextMenuDefinition {
@ -54,6 +64,7 @@ export class ContextMenu implements OnInit {
private showFocused: Subject<boolean> = new Subject();
showFocused$: Observable<boolean> = this.showFocused.asObservable();
isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
getMenuItems(menuId: string | undefined): ContextMenuItemDefinition[] {
if (menuId) {