feat(editor): Add option to disable NDV in workflow previews (#7990)

## Summary
This PR adds a new property to the `WorkflowPreview` component that
controls if the Node Details View can be opened in each workflow preview
or not.
This property is passed on to underlying `iframe` via the `postMessage`
and is used to disable pointer events for nodes and stickies in that
preview.

#### How to test the change:
Until the component that uses this flag is implemented this can be
tested manually. In this example, we'll use `WorkflowPreview` as part of
the `TemplatesWorkflowView` component
1. Pass `:canOpenNDV="false"` to this component
2. Run n8n
3. Open any template preview and check if nodes and stickies are
interactive
4. Open any workflow execution preview -> Nodes and Stickies should be
interactive

## Issues fixed
Fixes ADO-1548

## Review / Merge checklist
- [ ] PR title and summary are descriptive. **Remember, the title
automatically goes into the changelog. Use `(no-changelog)` otherwise.**
([conventions](https://github.com/n8n-io/n8n/blob/master/.github/pull_request_title_conventions.md))
- [ ] [Docs updated](https://github.com/n8n-io/n8n-docs) or follow-up
ticket created.
- [ ] Tests included.
> A bug is not considered fixed, unless a test is added to prevent it
from happening again. A feature is not complete without tests.
  >
> *(internal)* You can use Slack commands to trigger [e2e
tests](https://www.notion.so/n8n/How-to-use-Test-Instances-d65f49dfc51f441ea44367fb6f67eb0a?pvs=4#a39f9e5ba64a48b58a71d81c837e8227)
or [deploy test
instance](https://www.notion.so/n8n/How-to-use-Test-Instances-d65f49dfc51f441ea44367fb6f67eb0a?pvs=4#f6a177d32bde4b57ae2da0b8e454bfce)
or [deploy early access version on
Cloud](https://www.notion.so/n8n/Cloudbot-3dbe779836004972b7057bc989526998?pvs=4#fef2d36ab02247e1a0f65a74f6fb534e).
This commit is contained in:
Milorad FIlipović
2023-12-11 15:30:01 +01:00
committed by GitHub
parent bbeeab5d27
commit 393afef174
5 changed files with 48 additions and 0 deletions

View File

@@ -37,11 +37,13 @@ const props = withDefaults(
executionId?: string;
executionMode?: string;
loaderType?: 'image' | 'spinner';
canOpenNDV?: boolean;
}>(),
{
loading: false,
mode: 'workflow',
loaderType: 'image',
canOpenNDV: true,
},
);
@@ -82,6 +84,7 @@ const loadWorkflow = () => {
JSON.stringify({
command: 'openWorkflow',
workflow: props.workflow,
canOpenNDV: props.canOpenNDV,
}),
'*',
);
@@ -104,6 +107,7 @@ const loadExecution = () => {
command: 'openExecution',
executionId: props.executionId,
executionMode: props.executionMode || '',
canOpenNDV: props.canOpenNDV,
}),
'*',
);