admin/n8n-enterprise-unlocked
1
0
Fork 0
mirror of https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git synced 2025-12-17 10:02:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(editor): Add support for changing sticky notes color in new canvas (no-changelog) (#10593)

Browse Source
This commit is contained in:
Alex Grozav
2024-08-29 13:07:39 +03:00
committed by GitHub
parent 821ca16a57
commit c988931898
11 changed files with 340 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
packages/editor-ui/src/components/canvas/Canvas.vue
View File

@@ -1,5 +1,11 @@
<script lang="ts" setup>
import type { CanvasConnection, CanvasNode, CanvasNodeMoveEvent, ConnectStartEvent } from '@/types';
import type {
CanvasConnection,
CanvasNode,
CanvasNodeMoveEvent,
CanvasEventBusEvents,
ConnectStartEvent,
} from '@/types';
import type {
EdgeMouseEvent,
Connection,
@@ -65,7 +71,7 @@ const props = withDefaults(
nodes: CanvasNode[];
connections: CanvasConnection[];
controlsPosition?: PanelPosition;
eventBus?: EventBus;
eventBus?: EventBus<CanvasEventBusEvents>;
readOnly?: boolean;
}>(),
{
@@ -102,8 +108,8 @@ useKeybindings({
ctrl_d: emitWithSelectedNodes((ids) => emit('duplicate:nodes', ids)),
d: emitWithSelectedNodes((ids) => emit('update:nodes:enabled', ids)),
p: emitWithSelectedNodes((ids) => emit('update:nodes:pin', ids, 'keyboard-shortcut')),
enter: () => emitWithLastSelectedNode((id) => emit('update:node:active', id)),
f2: () => emitWithLastSelectedNode((id) => emit('update:node:name', id)),
enter: emitWithLastSelectedNode((id) => onSetNodeActive(id)),
f2: emitWithLastSelectedNode((id) => emit('update:node:name', id)),
tab: () => emit('create:node', 'tab'),
shift_s: () => emit('create:sticky'),
ctrl_alt_n: () => emit('create:workflow'),
@@ -154,6 +160,7 @@ function onNodesChange(events: NodeChange[]) {
}
function onSetNodeActive(id: string) {
props.eventBus.emit('nodes:action', { ids: [id], action: 'update:node:active' });
emit('update:node:active', id);
}
@@ -166,7 +173,7 @@ function onSelectNode() {
emit('update:node:selected', lastSelectedNode.value.id);
}
function onSelectNodes(ids: string[]) {
function onSelectNodes({ ids }: CanvasEventBusEvents['nodes:select']) {
clearSelectedNodes();
addSelectedNodes(ids.map(findNode).filter(isPresent));
}
@@ -358,9 +365,11 @@ function onContextMenuAction(action: ContextMenuAction, nodeIds: string[]) {
case 'toggle_activation':
return emit('update:nodes:enabled', nodeIds);
case 'open':
return emit('update:node:active', nodeIds[0]);
return onSetNodeActive(nodeIds[0]);
case 'rename':
return emit('update:node:name', nodeIds[0]);
case 'change_color':
return props.eventBus.emit('nodes:action', { ids: nodeIds, action: 'update:sticky:color' });
}
}
@@ -378,12 +387,12 @@ function minimapNodeClassnameFn(node: CanvasNode) {
onMounted(() => {
props.eventBus.on('fitView', onFitView);
props.eventBus.on('selectNodes', onSelectNodes);
props.eventBus.on('nodes:select', onSelectNodes);
});
onUnmounted(() => {
props.eventBus.off('fitView', onFitView);
props.eventBus.off('selectNodes', onSelectNodes);
props.eventBus.off('nodes:select', onSelectNodes);
});
onPaneReady(async () => {
@@ -431,6 +440,7 @@ provide(CanvasKey, {
<Node
v-bind="canvasNodeProps"
:read-only="readOnly"
:event-bus="eventBus"
@delete="onDeleteNode"
@run="onRunNode"
@select="onSelectNode"