This is an automated email from the ASF dual-hosted git repository. scottyaslan pushed a commit to branch main in repository https://gitbox.apache.org/repos/asf/nifi.git
The following commit(s) were added to refs/heads/main by this push: new 7aaa5b4224 [NIFI-13221] - display supported shortcut/hotkey combos in context menu (#8821) 7aaa5b4224 is described below commit 7aaa5b42247e9ded4fa8d43186713b5f15717867 Author: Rob Fellows <rob.fell...@gmail.com> AuthorDate: Tue May 14 09:59:14 2024 -0400 [NIFI-13221] - display supported shortcut/hotkey combos in context menu (#8821) This closes #8821 --- .../service/canvas-context-menu.service.ts | 26 ++++++++++++++++++---- .../context-menu/context-menu.component.html | 24 ++++++++++++++++---- .../common/context-menu/context-menu.component.ts | 11 +++++++++ 3 files changed, 53 insertions(+), 8 deletions(-) diff --git a/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/service/canvas-context-menu.service.ts b/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/service/canvas-context-menu.service.ts index f5e155ef91..3f69dbcbed 100644 --- a/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/service/canvas-context-menu.service.ts +++ b/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/service/canvas-context-menu.service.ts @@ -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: '⌫' + } } ] }; diff --git a/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/context-menu/context-menu.component.html b/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/context-menu/context-menu.component.html index ee4d862b77..d7226b23ec 100644 --- a/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/context-menu/context-menu.component.html +++ b/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/context-menu/context-menu.component.html @@ -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> } } diff --git a/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/context-menu/context-menu.component.ts b/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/context-menu/context-menu.component.ts index c0d80c47a4..708bb38a26 100644 --- a/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/context-menu/context-menu.component.ts +++ b/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/context-menu/context-menu.component.ts @@ -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) {