chore: 清理macOS同步产生的重复文件

详细说明:
- 删除了352个带数字后缀的重复文件
- 更新.gitignore防止未来产生此类文件
- 这些文件是由iCloud或其他同步服务冲突产生的
- 不影响项目功能,仅清理冗余文件
This commit is contained in:
Yep_Q
2025-09-08 12:06:01 +08:00
parent 1564396449
commit d6f48d6d14
365 changed files with 2039 additions and 68301 deletions

View File

@@ -1,31 +0,0 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
.DS_Store
dist
dist-ssr
coverage
*.local
/cypress/videos/
/cypress/screenshots/
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
# Auto-generated files
src/components.d.ts

View File

@@ -1,5 +0,0 @@
{
"yarn": false,
"tests": false,
"contents": "./dist"
}

View File

@@ -1,289 +0,0 @@
# n8n Chat
This is an embeddable Chat widget for n8n. It allows the execution of AI-Powered Workflows through a Chat window.
**Windowed Example**
![n8n Chat Windowed](https://raw.githubusercontent.com/n8n-io/n8n/master/packages/frontend/%40n8n/chat/resources/images/windowed.png)
**Fullscreen Example**
![n8n Chat Fullscreen](https://raw.githubusercontent.com/n8n-io/n8n/master/packages/frontend/%40n8n/chat/resources/images/fullscreen.png)
## Prerequisites
Create a n8n workflow which you want to execute via chat. The workflow has to be triggered using a **Chat Trigger** node.
Open the **Chat Trigger** node and add your domain to the **Allowed Origins (CORS)** field. This makes sure that only requests from your domain are accepted.
[See example workflow](https://github.com/n8n-io/n8n/blob/master/packages/%40n8n/chat/resources/workflow.json)
To use streaming responses, you need to enable the **Streaming response** response mode in the **Chat Trigger** node.
[See example workflow with streaming](https://github.com/n8n-io/n8n/blob/master/packages/%40n8n/chat/resources/workflow-streaming.json)
> Make sure the workflow is **Active.**
### How it works
Each Chat request is sent to the n8n Webhook endpoint, which then sends back a response.
Each request is accompanied by an `action` query parameter, where `action` can be one of:
- `loadPreviousSession` - When the user opens the Chatbot again and the previous chat session should be loaded
- `sendMessage` - When the user sends a message
## Installation
Open the **Webhook** node and replace `YOUR_PRODUCTION_WEBHOOK_URL` with your production URL. This is the URL that the Chat widget will use to send requests to.
### a. CDN Embed
Add the following code to your HTML page.
```html
<link href="https://cdn.jsdelivr.net/npm/@n8n/chat/dist/style.css" rel="stylesheet" />
<script type="module">
import { createChat } from 'https://cdn.jsdelivr.net/npm/@n8n/chat/dist/chat.bundle.es.js';
createChat({
webhookUrl: 'YOUR_PRODUCTION_WEBHOOK_URL'
});
</script>
```
### b. Import Embed
Install and save n8n Chat as a production dependency.
```sh
npm install @n8n/chat
```
Import the CSS and use the `createChat` function to initialize your Chat window.
```ts
import '@n8n/chat/style.css';
import { createChat } from '@n8n/chat';
createChat({
webhookUrl: 'YOUR_PRODUCTION_WEBHOOK_URL'
});
```
##### Vue.js
```html
<script lang="ts" setup>
// App.vue
import { onMounted } from 'vue';
import '@n8n/chat/style.css';
import { createChat } from '@n8n/chat';
onMounted(() => {
createChat({
webhookUrl: 'YOUR_PRODUCTION_WEBHOOK_URL'
});
});
</script>
<template>
<div></div>
</template>
```
##### React
```tsx
// App.tsx
import { useEffect } from 'react';
import '@n8n/chat/style.css';
import { createChat } from '@n8n/chat';
export const App = () => {
useEffect(() => {
createChat({
webhookUrl: 'YOUR_PRODUCTION_WEBHOOK_URL'
});
}, []);
return (<div></div>);
};
```
## Options
The default options are:
```ts
createChat({
webhookUrl: '',
webhookConfig: {
method: 'POST',
headers: {}
},
target: '#n8n-chat',
mode: 'window',
chatInputKey: 'chatInput',
chatSessionKey: 'sessionId',
loadPreviousSession: true,
metadata: {},
showWelcomeScreen: false,
defaultLanguage: 'en',
initialMessages: [
'Hi there! 👋',
'My name is Nathan. How can I assist you today?'
],
i18n: {
en: {
title: 'Hi there! 👋',
subtitle: "Start a chat. We're here to help you 24/7.",
footer: '',
getStarted: 'New Conversation',
inputPlaceholder: 'Type your question..',
},
},
enableStreaming: false,
});
```
### `webhookUrl`
- **Type**: `string`
- **Required**: `true`
- **Examples**:
- `https://yourname.app.n8n.cloud/webhook/513107b3-6f3a-4a1e-af21-659f0ed14183`
- `http://localhost:5678/webhook/513107b3-6f3a-4a1e-af21-659f0ed14183`
- **Description**: The URL of the n8n Webhook endpoint. Should be the production URL.
### `webhookConfig`
- **Type**: `{ method: string, headers: Record<string, string> }`
- **Default**: `{ method: 'POST', headers: {} }`
- **Description**: The configuration for the Webhook request.
### `target`
- **Type**: `string`
- **Default**: `'#n8n-chat'`
- **Description**: The CSS selector of the element where the Chat window should be embedded.
### `mode`
- **Type**: `'window' | 'fullscreen'`
- **Default**: `'window'`
- **Description**: The render mode of the Chat window.
- In `window` mode, the Chat window will be embedded in the target element as a chat toggle button and a fixed size chat window.
- In `fullscreen` mode, the Chat will take up the entire width and height of its target container.
### `showWelcomeScreen`
- **Type**: `boolean`
- **Default**: `false`
- **Description**: Whether to show the welcome screen when the Chat window is opened.
### `chatInputKey`
- **Type**: `string`
- **Default**: `'chatInput'`
- **Description**: The key to use for sending the chat input for the AI Agent node.
### `chatSessionKey`
- **Type**: `string`
- **Default**: `'sessionId'`
- **Description**: The key to use for sending the chat history session ID for the AI Memory node.
### `loadPreviousSession`
- **Type**: `boolean`
- **Default**: `true`
- **Description**: Whether to load previous messages (chat context).
### `defaultLanguage`
- **Type**: `string`
- **Default**: `'en'`
- **Description**: The default language of the Chat window. Currently only `en` is supported.
### `i18n`
- **Type**: `{ [key: string]: Record<string, string> }`
- **Description**: The i18n configuration for the Chat window. Currently only `en` is supported.
### `initialMessages`
- **Type**: `string[]`
- **Description**: The initial messages to be displayed in the Chat window.
### `allowFileUploads`
- **Type**: `Ref<boolean> | boolean`
- **Default**: `false`
- **Description**: Whether to allow file uploads in the chat. If set to `true`, users will be able to upload files through the chat interface.
### `allowedFilesMimeTypes`
- **Type**: `Ref<string> | string`
- **Default**: `''`
- **Description**: A comma-separated list of allowed MIME types for file uploads. Only applicable if `allowFileUploads` is set to `true`. If left empty, all file types are allowed. For example: `'image/*,application/pdf'`.
### enableStreaming
- Type: boolean
- Default: false
- Description: Whether to enable streaming responses from the n8n workflow. If set to `true`, the chat will display responses as they are being generated, providing a more interactive experience. For this to work the workflow must be configured as well to return streaming responses.
## Customization
The Chat window is entirely customizable using CSS variables.
```css
:root {
--chat--color-primary: #e74266;
--chat--color-primary-shade-50: #db4061;
--chat--color-primary-shade-100: #cf3c5c;
--chat--color-secondary: #20b69e;
--chat--color-secondary-shade-50: #1ca08a;
--chat--color-white: #ffffff;
--chat--color-light: #f2f4f8;
--chat--color-light-shade-50: #e6e9f1;
--chat--color-light-shade-100: #c2c5cc;
--chat--color-medium: #d2d4d9;
--chat--color-dark: #101330;
--chat--color-disabled: #777980;
--chat--color-typing: #404040;
--chat--spacing: 1rem;
--chat--border-radius: 0.25rem;
--chat--transition-duration: 0.15s;
--chat--window--width: 400px;
--chat--window--height: 600px;
--chat--header-height: auto;
--chat--header--padding: var(--chat--spacing);
--chat--header--background: var(--chat--color-dark);
--chat--header--color: var(--chat--color-light);
--chat--header--border-top: none;
--chat--header--border-bottom: none;
--chat--header--border-bottom: none;
--chat--header--border-bottom: none;
--chat--heading--font-size: 2em;
--chat--header--color: var(--chat--color-light);
--chat--subtitle--font-size: inherit;
--chat--subtitle--line-height: 1.8;
--chat--textarea--height: 50px;
--chat--message--font-size: 1rem;
--chat--message--padding: var(--chat--spacing);
--chat--message--border-radius: var(--chat--border-radius);
--chat--message-line-height: 1.8;
--chat--message--bot--background: var(--chat--color-white);
--chat--message--bot--color: var(--chat--color-dark);
--chat--message--bot--border: none;
--chat--message--user--background: var(--chat--color-secondary);
--chat--message--user--color: var(--chat--color-white);
--chat--message--user--border: none;
--chat--message--pre--background: rgba(0, 0, 0, 0.05);
--chat--toggle--background: var(--chat--color-primary);
--chat--toggle--hover--background: var(--chat--color-primary-shade-50);
--chat--toggle--active--background: var(--chat--color-primary-shade-100);
--chat--toggle--color: var(--chat--color-white);
--chat--toggle--size: 64px;
}
```
## Caveats
### Fullscreen mode
In fullscreen mode, the Chat window will take up the entire width and height of its target container. Make sure that the container has a set width and height.
```css
html,
body,
#n8n-chat {
width: 100%;
height: 100%;
}
```
## License
You can find the license information [here](https://github.com/n8n-io/n8n/blob/master/README.md#license)

View File

@@ -1,17 +0,0 @@
import { frontendConfig } from '@n8n/eslint-config/frontend';
import { defineConfig } from 'eslint/config';
export default defineConfig(frontendConfig, {
rules: {
// TODO: Remove these
'no-empty': 'warn',
'@typescript-eslint/require-await': 'warn',
'@typescript-eslint/no-empty-object-type': 'warn',
'@typescript-eslint/naming-convention': 'warn',
'@typescript-eslint/no-unsafe-function-type': 'warn',
'@typescript-eslint/no-unsafe-call': 'warn',
'@typescript-eslint/no-unsafe-member-access': 'warn',
'@typescript-eslint/no-unsafe-return': 'warn',
'@typescript-eslint/no-unsafe-assignment': 'warn',
},
});

View File

@@ -1,13 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vite App</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>

View File

@@ -1,68 +0,0 @@
{
"name": "@n8n/chat",
"version": "0.54.0",
"scripts": {
"dev": "pnpm run storybook",
"build": "pnpm build:vite && pnpm build:bundle",
"build:vite": "cross-env vite build",
"build:bundle": "cross-env INCLUDE_VUE=true vite build",
"preview": "vite preview",
"test:dev": "vitest",
"test": "vitest run",
"typecheck": "vue-tsc --noEmit",
"lint": "eslint src --quiet",
"lint:fix": "eslint src --fix",
"lint:styles": "stylelint \"src/**/*.{scss,sass,vue}\" --cache",
"lint:styles:fix": "stylelint \"src/**/*.{scss,sass,vue}\" --fix --cache",
"format": "biome format --write src .storybook && prettier --write src/ --ignore-path ../../../../.prettierignore",
"format:check": "biome ci src .storybook && prettier --check src/ --ignore-path ../../../../.prettierignore",
"storybook": "storybook dev -p 6006 --no-open",
"build:storybook": "storybook build"
},
"types": "./dist/index.d.ts",
"main": "./dist/chat.umd.js",
"module": "./dist/chat.es.js",
"exports": {
".": {
"types": "./dist/index.d.ts",
"import": "./dist/chat.es.js",
"require": "./dist/chat.umd.js"
},
"./style.css": {
"import": "./dist/style.css",
"require": "./dist/style.css"
},
"./*": {
"import": "./*",
"require": "./*"
}
},
"dependencies": {
"@n8n/design-system": "workspace:*",
"@vueuse/core": "catalog:frontend",
"highlight.js": "catalog:frontend",
"markdown-it-link-attributes": "^4.0.1",
"uuid": "catalog:",
"vue": "catalog:frontend",
"vue-markdown-render": "catalog:frontend"
},
"devDependencies": {
"@iconify-json/mdi": "^1.1.54",
"@n8n/storybook": "workspace:*",
"@n8n/eslint-config": "workspace:*",
"@n8n/stylelint-config": "workspace:*",
"@n8n/typescript-config": "workspace:*",
"@n8n/vitest-config": "workspace:*",
"@vitejs/plugin-vue": "catalog:frontend",
"@vitest/coverage-v8": "catalog:",
"unplugin-icons": "^0.19.0",
"vite": "catalog:",
"vitest": "catalog:",
"vite-plugin-dts": "^4.5.3",
"vue-tsc": "catalog:frontend"
},
"files": [
"README.md",
"dist"
]
}

View File

@@ -1,3 +0,0 @@
import { baseConfig } from '@n8n/stylelint-config/base';
export default baseConfig;

View File

@@ -1,25 +0,0 @@
{
"extends": "@n8n/typescript-config/tsconfig.common.json",
"compilerOptions": {
"rootDir": "src",
"outDir": "dist",
"baseUrl": "src",
"target": "esnext",
"module": "esnext",
"moduleResolution": "bundler",
"allowJs": true,
"importHelpers": true,
"incremental": false,
"allowSyntheticDefaultImports": true,
"resolveJsonModule": true,
"types": ["vitest/globals"],
"paths": {
"@n8n/chat/*": ["./*"],
"@n8n/design-system*": ["../../design-system/src*"]
},
"lib": ["esnext", "dom", "dom.iterable", "scripthost"],
// TODO: remove all options below this line
"useUnknownInCatchVariables": false
},
"include": ["**/*.ts", "**/*.vue"]
}

View File

@@ -1,119 +0,0 @@
import { defineConfig, mergeConfig, PluginOption } from 'vite';
import { resolve } from 'path';
import { renameSync, writeFileSync, readFileSync } from 'fs';
import vue from '@vitejs/plugin-vue';
import icons from 'unplugin-icons/vite';
import dts from 'vite-plugin-dts';
import { vitestConfig } from '@n8n/vitest-config/frontend';
import pkg from './package.json';
import iconsResolver from 'unplugin-icons/resolver';
import components from 'unplugin-vue-components/vite';
const includeVue = process.env.INCLUDE_VUE === 'true';
const srcPath = resolve(__dirname, 'src');
const packagesDir = resolve(__dirname, '..', '..', '..');
const banner = `/*! Package version @n8n/chat@${pkg.version} */`;
// https://vitejs.dev/config/
export default mergeConfig(
defineConfig({
plugins: [
vue(),
icons({
compiler: 'vue3',
autoInstall: true,
}),
dts(),
components({
dts: './src/components.d.ts',
resolvers: [
(componentName) => {
if (componentName.startsWith('N8n'))
return { name: componentName, from: '@n8n/design-system' };
},
iconsResolver({
prefix: 'icon',
}),
],
}),
{
name: 'rename-css-file',
closeBundle() {
// The chat.css is automatically named based on vite.config.ts library name.
// ChatTrigger Node requires https://cdn.jsdelivr.net/npm/@n8n/chat/dist/style.css
// As such for backwards compatibility, we need to maintain the same name file
const cssPath = resolve(__dirname, 'dist', 'chat.css');
const newCssPath = resolve(__dirname, 'dist', 'style.css');
try {
renameSync(cssPath, newCssPath);
} catch (error) {
console.error('Failed to rename chat.css file:', error);
}
},
},
{
name: 'inject-build-version',
closeBundle() {
const cssPath = resolve(__dirname, 'dist', 'style.css');
try {
const cssContent = readFileSync(cssPath, 'utf-8');
const updatedCssContent = banner + '\n' + cssContent;
writeFileSync(cssPath, updatedCssContent, 'utf-8');
} catch (error) {
console.error('Failed to inject build version into CSS file:', error);
}
},
},
],
resolve: {
alias: [
{
find: '@',
replacement: srcPath,
},
{
find: '@n8n/chat',
replacement: srcPath,
},
{
find: /^@n8n\/chat(.+)$/,
replacement: srcPath + '$1',
},
{
find: /^@n8n\/design-system(.+)$/,
replacement: resolve(packagesDir, 'frontend', '@n8n', 'design-system', 'src$1'),
},
],
},
define: {
'process.env.NODE_ENV': process.env.NODE_ENV ? `"${process.env.NODE_ENV}"` : '"development"',
},
build: {
emptyOutDir: !includeVue,
lib: {
entry: resolve(__dirname, 'src', 'index.ts'),
name: 'N8nChat',
fileName: (format) => (includeVue ? `chat.bundle.${format}.js` : `chat.${format}.js`),
},
rollupOptions: {
// make sure to externalize deps that shouldn't be bundled
// into your library
external: includeVue ? [] : ['vue'],
output: {
exports: 'named',
// inject banner on top of all JS files
banner,
// Provide global variables to use in the UMD build
// for externalized deps
globals: includeVue
? {}
: {
vue: 'Vue',
},
},
},
},
}),
vitestConfig,
);

View File

@@ -1,24 +0,0 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

View File

@@ -1,24 +0,0 @@
# @n8n/composables
A collection of Vue composables that provide common functionality across n8n's Front-End packages.
## Table of Contents
- [Features](#features)
- [Contributing](#contributing)
- [License](#license)
## Features
- **Reusable Logic**: Encapsulate complex stateful logic into composable functions.
- **Consistency**: Ensure consistent patterns and practices across our Vue components.
- **Extensible**: Easily add new composables as our project grows.
- **Optimized**: Fully compatible with the Composition API.
## Contributing
For more details, please read our [CONTRIBUTING.md](CONTRIBUTING.md).
## License
For more details, please read our [LICENSE.md](LICENSE.md).

View File

@@ -1,4 +0,0 @@
{
"$schema": "../../../../node_modules/@biomejs/biome/configuration_schema.json",
"extends": ["../../../../biome.jsonc"]
}

View File

@@ -1,7 +0,0 @@
import { defineConfig } from 'eslint/config';
import { frontendConfig } from '@n8n/eslint-config/frontend';
export default defineConfig(frontendConfig, {
files: ['**/*.test.ts'],
rules: { '@typescript-eslint/no-unsafe-assignment': 'warn' },
});

View File

@@ -1,49 +0,0 @@
{
"name": "@n8n/composables",
"type": "module",
"version": "1.9.0",
"files": [
"dist"
],
"exports": {
"./*": {
"types": "./dist/*.d.ts",
"import": "./dist/*.js",
"require": "./dist/*.cjs"
}
},
"scripts": {
"dev": "vite",
"build": "tsup",
"preview": "vite preview",
"typecheck": "vue-tsc --noEmit",
"test": "vitest run",
"test:dev": "vitest --silent=false",
"lint": "eslint src --quiet",
"lint:fix": "eslint src --fix",
"format": "biome format --write . && prettier --write . --ignore-path ../../../../.prettierignore",
"format:check": "biome ci . && prettier --check . --ignore-path ../../../../.prettierignore"
},
"devDependencies": {
"@n8n/eslint-config": "workspace:*",
"@n8n/typescript-config": "workspace:*",
"@n8n/vitest-config": "workspace:*",
"@testing-library/jest-dom": "catalog:frontend",
"@testing-library/user-event": "catalog:frontend",
"@testing-library/vue": "catalog:frontend",
"@vitejs/plugin-vue": "catalog:frontend",
"@vue/tsconfig": "catalog:frontend",
"@vueuse/core": "catalog:frontend",
"vue": "catalog:frontend",
"tsup": "catalog:",
"typescript": "catalog:",
"vite": "catalog:",
"vitest": "catalog:",
"vue-tsc": "catalog:frontend"
},
"peerDependencies": {
"@vueuse/core": "catalog:frontend",
"vue": "catalog:frontend"
},
"license": "See LICENSE.md file in the root of the repository"
}

View File

@@ -1,11 +0,0 @@
{
"extends": "@n8n/typescript-config/tsconfig.frontend.json",
"compilerOptions": {
"baseUrl": ".",
"rootDir": ".",
"outDir": "dist",
"types": ["vite/client", "vitest/globals"],
"isolatedModules": true
},
"include": ["src/**/*.ts", "src/**/*.vue", "vite.config.ts", "tsup.config.ts"]
}

View File

@@ -1,11 +0,0 @@
import { defineConfig } from 'tsup';
export default defineConfig({
entry: ['src/**/*.ts', '!src/**/*.test.ts', '!src/**/*.d.ts', '!src/__tests__/**/*'],
format: ['cjs', 'esm'],
clean: true,
dts: true,
cjsInterop: true,
splitting: true,
sourcemap: true,
});

View File

@@ -1,4 +0,0 @@
import { defineConfig, mergeConfig } from 'vite';
import { vitestConfig } from '@n8n/vitest-config/frontend';
export default mergeConfig(defineConfig({}), vitestConfig);

View File

@@ -1,3 +0,0 @@
> 1%
last 2 versions
not ie <= 8

View File

@@ -1,5 +0,0 @@
storybook-static
**/*.stories.js
# Auto-generated
src/components.d.ts

View File

@@ -1,13 +0,0 @@
/src/**/*.{ts,vue,scss,snap}
/theme/src
!dist
storybook-static
.storybook
.browserslistrc
jest.config.js
vite.config.ts
*.md
*.stories.js

View File

@@ -1,51 +0,0 @@
![n8n.io - Workflow Automation](https://user-images.githubusercontent.com/65276001/173571060-9f2f6d7b-bac0-43b6-bdb2-001da9694058.png)
# @n8n/design-system
A component system for [n8n](https://n8n.io) using Storybook to preview.
## Project setup
```
pnpm install
```
### Compiles and hot-reloads for development
```
pnpm storybook
```
### Build static pages
```
pnpm build:storybook
```
### Run your unit tests
```
pnpm test:unit
```
### Lints and fixes files
```
pnpm lint
```
### Build css files
```
pnpm build:theme
```
### Monitor theme files and build any changes
```
pnpm watch:theme
```
## License
You can find the license information [here](https://github.com/n8n-io/n8n/blob/master/README.md#license)

View File

@@ -1,7 +0,0 @@
{
"$schema": "../../../../node_modules/@biomejs/biome/configuration_schema.json",
"extends": ["../../../../biome.jsonc"],
"formatter": {
"ignore": ["theme/**"]
}
}

View File

@@ -1,4 +0,0 @@
{
"projectId": "Project:65f085d72c13e4e1154414db",
"buildScriptName": "build:storybook"
}

View File

@@ -1,52 +0,0 @@
import { defineConfig } from 'eslint/config';
import { frontendConfig } from '@n8n/eslint-config/frontend';
export default defineConfig(
frontendConfig,
{
rules: {
'vue/no-undef-components': 'error',
// TODO: Remove these
'import-x/no-default-export': 'warn',
'no-empty': 'warn',
'no-prototype-builtins': 'warn',
'@typescript-eslint/no-unsafe-argument': 'warn',
'@typescript-eslint/no-unsafe-return': 'warn',
'@typescript-eslint/no-unsafe-member-access': 'warn',
'@typescript-eslint/prefer-optional-chain': 'warn',
'@typescript-eslint/prefer-nullish-coalescing': 'warn',
'@typescript-eslint/require-await': 'warn',
'@typescript-eslint/naming-convention': 'warn',
'@typescript-eslint/no-empty-object-type': 'warn',
'@typescript-eslint/no-unsafe-assignment': 'warn',
'@typescript-eslint/unbound-method': 'warn',
'@typescript-eslint/restrict-template-expressions': 'warn',
'@typescript-eslint/no-unsafe-call': 'warn',
},
},
{
files: ['src/**/*.stories.ts', 'src/**/*.vue', 'src/**/*.spec.ts'],
rules: {
'@typescript-eslint/naming-convention': [
'warn',
{
selector: ['variable', 'property'],
format: ['PascalCase', 'camelCase', 'UPPER_CASE'],
},
],
},
},
{
files: ['src/components/N8nFormInput/validators.ts'],
rules: {
'@typescript-eslint/naming-convention': [
'error',
{
selector: ['property'],
format: ['camelCase', 'UPPER_CASE'],
},
],
},
},
);

View File

@@ -1,77 +0,0 @@
{
"type": "module",
"name": "@n8n/design-system",
"version": "1.96.0",
"main": "src/index.ts",
"import": "src/index.ts",
"scripts": {
"dev": "pnpm run storybook",
"clean": "rimraf dist .turbo",
"build": "vite build",
"typecheck": "vue-tsc --noEmit",
"typecheck:watch": "vue-tsc --watch --noEmit",
"test": "vitest run",
"test:dev": "vitest",
"build:storybook": "storybook build",
"storybook": "storybook dev -p 6006 --no-open",
"chromatic": "chromatic",
"format": "biome format --write . && prettier --write . --ignore-path ../../../../.prettierignore",
"format:check": "biome ci . && prettier --check . --ignore-path ../../../../.prettierignore",
"lint": "eslint src --quiet",
"lint:fix": "eslint src --fix",
"lint:styles": "stylelint \"src/**/*.{scss,sass,vue}\" --cache",
"lint:styles:fix": "stylelint \"src/**/*.{scss,sass,vue}\" --fix --cache"
},
"devDependencies": {
"@n8n/eslint-config": "workspace:*",
"@n8n/storybook": "workspace:*",
"@n8n/stylelint-config": "workspace:*",
"@n8n/typescript-config": "workspace:*",
"@n8n/vitest-config": "workspace:*",
"@testing-library/jest-dom": "catalog:frontend",
"@testing-library/user-event": "catalog:frontend",
"@testing-library/vue": "catalog:frontend",
"@types/lodash": "catalog:",
"@types/markdown-it": "^13.0.9",
"@types/markdown-it-emoji": "^2.0.2",
"@types/markdown-it-link-attributes": "^3.0.5",
"@types/sanitize-html": "^2.11.0",
"@vitejs/plugin-vue": "catalog:frontend",
"@vitest/coverage-v8": "catalog:",
"autoprefixer": "^10.4.19",
"postcss": "^8.4.38",
"sass": "^1.71.1",
"tailwindcss": "^3.4.3",
"unplugin-icons": "catalog:frontend",
"unplugin-vue-components": "catalog:frontend",
"vite": "catalog:",
"vitest": "catalog:",
"vitest-mock-extended": "catalog:",
"vue-tsc": "catalog:frontend"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "^1.2.36",
"@fortawesome/free-solid-svg-icons": "^5.15.4",
"@fortawesome/vue-fontawesome": "^3.0.3",
"@n8n/composables": "workspace:*",
"@n8n/utils": "workspace:*",
"@tanstack/vue-table": "^8.21.2",
"element-plus": "catalog:frontend",
"is-emoji-supported": "^0.0.5",
"lodash": "catalog:",
"markdown-it": "^13.0.2",
"markdown-it-emoji": "^2.0.2",
"markdown-it-link-attributes": "^4.0.1",
"markdown-it-task-lists": "^2.1.1",
"parse-diff": "^0.11.1",
"reka-ui": "^2.2.1",
"sanitize-html": "2.12.1",
"vue": "catalog:frontend",
"vue-boring-avatars": "^1.3.0",
"vue-router": "catalog:frontend",
"xss": "catalog:"
},
"peerDependencies": {
"@vueuse/core": "*"
}
}

View File

@@ -1,6 +0,0 @@
module.exports = {
plugins: {
// tailwindcss: {},
autoprefixer: {},
},
};

View File

@@ -1,3 +0,0 @@
import { baseConfig } from '@n8n/stylelint-config/base';
export default baseConfig;

View File

@@ -1,8 +0,0 @@
module.exports = {
content: ['./src/**/*.{vue,js,ts}'],
darkMode: ['selector', '[data-theme="dark"]'],
theme: {
extend: {},
},
plugins: [],
};

View File

@@ -1,21 +0,0 @@
{
"extends": "@n8n/typescript-config/tsconfig.frontend.json",
"compilerOptions": {
"baseUrl": ".",
"rootDirs": [".", "../composables/src"],
"outDir": "dist",
"types": ["vite/client", "unplugin-icons/types/vue", "vitest/globals"],
"typeRoots": [
"./node_modules/@testing-library",
"./node_modules/@types",
"../../../../node_modules",
"../../../../node_modules/@types"
],
"paths": {
"@n8n/design-system*": ["./src*"],
"@n8n/composables*": ["../composables/src*"],
"@n8n/utils*": ["../../../@n8n/utils/src*"]
}
},
"include": ["src/**/*.ts", "src/**/*.vue"]
}

View File

@@ -1,77 +0,0 @@
import vue from '@vitejs/plugin-vue';
import { resolve } from 'path';
import { defineConfig, mergeConfig } from 'vite';
import components from 'unplugin-vue-components/vite';
import icons from 'unplugin-icons/vite';
import iconsResolver from 'unplugin-icons/resolver';
import { vitestConfig } from '@n8n/vitest-config/frontend';
import svgLoader from 'vite-svg-loader';
const packagesDir = resolve(__dirname, '..', '..', '..');
export default mergeConfig(
defineConfig({
plugins: [
vue(),
svgLoader({
svgoConfig: {
plugins: [
{
name: 'preset-default',
params: {
overrides: {
// disable a default plugin
cleanupIds: false,
// preserve viewBox for scalability
removeViewBox: false,
},
},
},
],
},
}),
icons({
compiler: 'vue3',
autoInstall: true,
}),
components({
dirs: [],
dts: false,
resolvers: [
iconsResolver({
prefix: 'Icon',
}),
],
}),
],
resolve: {
alias: {
'@': resolve(__dirname, 'src'),
'@n8n/design-system': resolve(__dirname, 'src'),
'@n8n/composables(.*)': resolve(packagesDir, 'frontend', '@n8n', 'composables', 'src$1'),
'@n8n/utils(.*)': resolve(packagesDir, '@n8n', 'utils', 'src$1'),
},
},
build: {
lib: {
entry: resolve(__dirname, 'src', 'index.ts'),
name: 'N8nDesignSystem',
fileName: (format) => `n8n-design-system.${format}.js`,
},
rollupOptions: {
// make sure to externalize deps that shouldn't be bundled
// into your library
external: ['vue'],
output: {
exports: 'named',
// Provide global variables to use in the UMD build
// for externalized deps
globals: {
vue: 'Vue',
},
},
},
},
}),
vitestConfig,
);

View File

@@ -1,24 +0,0 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

View File

@@ -1,27 +0,0 @@
# @n8n/i18n
A package for managing internationalization (i18n) in n8n's Frontend codebase. It provides a structured way to handle translations and localization, ensuring that the application can be easily adapted to different languages and regions.
## Table of Contents
- [Features](#features)
- [Contributing](#contributing)
- [License](#license)
## Features
- **Translation Management**: Simplifies the process of managing translations for different languages.
- **Localization Support**: Provides tools to adapt the application for different regions and cultures.
- **Easy Integration**: Seamlessly integrates with n8n's Frontend codebase, making it easy to implement and use.
- **Reusable Base Text**: Allows for the definition of reusable base text strings, reducing redundancy in translations.
- **Pluralization and Interpolation**: Supports pluralization and interpolation in base text strings, making it flexible for various use cases.
- **Versioned Nodes Support**: Facilitates the management of translations for nodes in versioned directories, ensuring consistency across different versions.
- **Documentation**: Comprehensive documentation to help developers understand and utilize the package effectively.
## Contributing
For more details, please read our [CONTRIBUTING.md](CONTRIBUTING.md).
## License
For more details, please read our [LICENSE.md](LICENSE.md).

View File

@@ -1,4 +0,0 @@
{
"$schema": "../../../../node_modules/@biomejs/biome/configuration_schema.json",
"extends": ["../../../../biome.jsonc"]
}

View File

@@ -1,13 +0,0 @@
import { defineConfig } from 'eslint/config';
import { frontendConfig } from '@n8n/eslint-config/frontend';
export default defineConfig(frontendConfig, {
rules: {
// TODO: Remove this
'@typescript-eslint/require-await': 'warn',
'@typescript-eslint/no-unnecessary-type-assertion': 'warn',
'@typescript-eslint/naming-convention': 'warn',
'@typescript-eslint/no-unsafe-member-access': 'warn',
'@typescript-eslint/no-unsafe-assignment': 'warn',
},
});

View File

@@ -1,60 +0,0 @@
{
"name": "@n8n/i18n",
"type": "module",
"version": "1.13.1",
"files": [
"dist"
],
"main": "dist/index.cjs",
"module": "dist/index.js",
"types": "dist/index.d.ts",
"exports": {
".": {
"types": "./dist/index.d.ts",
"import": "./dist/index.js",
"require": "./dist/index.cjs"
},
"./*": {
"types": "./dist/*.d.ts",
"import": "./dist/*.js",
"require": "./dist/*.cjs"
}
},
"scripts": {
"dev": "vite",
"build": "tsup",
"preview": "vite preview",
"typecheck": "vue-tsc --noEmit",
"test": "vitest run",
"test:dev": "vitest --silent=false",
"lint": "eslint src --quiet",
"lint:fix": "eslint src --fix",
"format": "biome format --write . && prettier --write . --ignore-path ../../../../.prettierignore",
"format:check": "biome ci . && prettier --check . --ignore-path ../../../../.prettierignore"
},
"dependencies": {
"n8n-workflow": "workspace:*",
"vue-i18n": "catalog:frontend"
},
"devDependencies": {
"@n8n/eslint-config": "workspace:*",
"@n8n/typescript-config": "workspace:*",
"@n8n/vitest-config": "workspace:*",
"@testing-library/jest-dom": "catalog:frontend",
"@testing-library/user-event": "catalog:frontend",
"@testing-library/vue": "catalog:frontend",
"@vitejs/plugin-vue": "catalog:frontend",
"@vue/tsconfig": "catalog:frontend",
"@vueuse/core": "catalog:frontend",
"vue": "catalog:frontend",
"tsup": "catalog:",
"typescript": "catalog:",
"vite": "catalog:",
"vitest": "catalog:",
"vue-tsc": "catalog:frontend"
},
"peerDependencies": {
"vue": "catalog:frontend"
},
"license": "See LICENSE.md file in the root of the repository"
}

View File

@@ -1,12 +0,0 @@
{
"extends": "@n8n/typescript-config/tsconfig.frontend.json",
"compilerOptions": {
"baseUrl": ".",
"rootDir": ".",
"outDir": "dist",
"types": ["vite/client", "vitest/globals"],
"isolatedModules": true,
"resolveJsonModule": true
},
"include": ["src/**/*.ts", "src/**/*.vue", "vite.config.ts", "tsup.config.ts"]
}

View File

@@ -1,11 +0,0 @@
import { defineConfig } from 'tsup';
export default defineConfig({
entry: ['src/**/*.ts', '!src/**/*.test.ts', '!src/**/*.d.ts', '!src/__tests__/**/*'],
format: ['cjs', 'esm'],
clean: true,
dts: true,
cjsInterop: true,
splitting: true,
sourcemap: true,
});

View File

@@ -1,4 +0,0 @@
import { defineConfig, mergeConfig } from 'vite';
import { vitestConfig } from '@n8n/vitest-config/frontend';
export default mergeConfig(defineConfig({}), vitestConfig);

View File

@@ -1,24 +0,0 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

View File

@@ -1,22 +0,0 @@
# @n8n/rest-api-client
This package contains the REST API calls for n8n.
## Table of Contents
- [Features](#features)
- [Contributing](#contributing)
- [License](#license)
## Features
- Provides a REST API for n8n
- Supports authentication and authorization
## Contributing
For more details, please read our [CONTRIBUTING.md](CONTRIBUTING.md).
## License
For more details, please read our [LICENSE.md](LICENSE.md).

View File

@@ -1,4 +0,0 @@
{
"$schema": "../../../../node_modules/@biomejs/biome/configuration_schema.json",
"extends": ["../../../../biome.jsonc"]
}

View File

@@ -1,15 +0,0 @@
import { defineConfig } from 'eslint/config';
import { frontendConfig } from '@n8n/eslint-config/frontend';
export default defineConfig(frontendConfig, {
rules: {
// TODO: Remove these
'@typescript-eslint/naming-convention': 'warn',
'@typescript-eslint/no-empty-object-type': 'warn',
'@typescript-eslint/prefer-nullish-coalescing': 'warn',
'@typescript-eslint/no-unsafe-member-access': 'warn',
'@typescript-eslint/no-unsafe-return': 'warn',
'@typescript-eslint/no-unsafe-assignment': 'warn',
'@typescript-eslint/no-unsafe-argument': 'warn',
},
});

View File

@@ -1,58 +0,0 @@
{
"name": "@n8n/rest-api-client",
"type": "module",
"version": "1.12.0",
"files": [
"dist"
],
"main": "./dist/index.cjs",
"module": "./dist/index.js",
"types": "./dist/index.d.ts",
"exports": {
".": {
"types": "./dist/index.d.ts",
"import": "./dist/index.js",
"require": "./dist/index.cjs"
},
"./*": {
"types": "./dist/*.d.ts",
"import": "./dist/*.js",
"require": "./dist/*.cjs"
}
},
"scripts": {
"dev": "vite",
"build": "tsup",
"preview": "vite preview",
"typecheck": "vue-tsc --noEmit",
"test": "vitest run",
"test:dev": "vitest --silent=false",
"lint": "eslint src --quiet",
"lint:fix": "eslint src --fix",
"format": "biome format --write . && prettier --write . --ignore-path ../../../../.prettierignore",
"format:check": "biome ci . && prettier --check . --ignore-path ../../../../.prettierignore"
},
"dependencies": {
"@n8n/api-types": "workspace:*",
"@n8n/constants": "workspace:*",
"@n8n/permissions": "workspace:*",
"@n8n/utils": "workspace:*",
"js-base64": "catalog:",
"n8n-workflow": "workspace:*",
"axios": "catalog:",
"flatted": "catalog:"
},
"devDependencies": {
"@n8n/eslint-config": "workspace:*",
"@n8n/i18n": "workspace:*",
"@n8n/typescript-config": "workspace:*",
"@n8n/vitest-config": "workspace:*",
"@testing-library/jest-dom": "catalog:frontend",
"@testing-library/user-event": "catalog:frontend",
"tsup": "catalog:",
"typescript": "catalog:",
"vite": "catalog:",
"vitest": "catalog:"
},
"license": "See LICENSE.md file in the root of the repository"
}

View File

@@ -1,14 +0,0 @@
{
"extends": "@n8n/typescript-config/tsconfig.frontend.json",
"compilerOptions": {
"baseUrl": ".",
"outDir": "dist",
"useUnknownInCatchVariables": false,
"types": ["vite/client", "vitest/globals"],
"isolatedModules": true,
"paths": {
"@n8n/utils/*": ["../../../@n8n/utils/src/*"]
}
},
"include": ["src/**/*.ts", "vite.config.ts", "tsup.config.ts"]
}

View File

@@ -1,11 +0,0 @@
import { defineConfig } from 'tsup';
export default defineConfig({
entry: ['src/**/*.ts', '!src/**/*.test.ts', '!src/**/*.d.ts', '!src/__tests__/**/*'],
format: ['cjs', 'esm'],
clean: true,
dts: true,
cjsInterop: true,
splitting: true,
sourcemap: true,
});

View File

@@ -1,4 +0,0 @@
import { defineConfig, mergeConfig } from 'vite';
import { createVitestConfig } from '@n8n/vitest-config/frontend';
export default mergeConfig(defineConfig({}), createVitestConfig({ setupFiles: [] }));

View File

@@ -1,24 +0,0 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

View File

@@ -1,24 +0,0 @@
# @n8n/stores
A collection of Pinia stores that provide common data-related functionality across n8n's Front-End packages.
## Table of Contents
- [Features](#features)
- [Contributing](#contributing)
- [License](#license)
## Features
- **Composable State Management**: Share and reuse stateful logic across multiple Vue components using Pinia stores.
- **Consistent Patterns**: Promote uniform state handling and best practices throughout the front-end codebase.
- **Easy Extensibility**: Add or modify stores as project requirements evolve, supporting scalable development.
- **Composition API Support**: Designed to work seamlessly with Vue's Composition API for modern, maintainable code.
## Contributing
For more details, please read our [CONTRIBUTING.md](CONTRIBUTING.md).
## License
For more details, please read our [LICENSE.md](LICENSE.md).

View File

@@ -1,4 +0,0 @@
{
"$schema": "../../../../node_modules/@biomejs/biome/configuration_schema.json",
"extends": ["../../../../biome.jsonc"]
}

View File

@@ -1,11 +0,0 @@
import { defineConfig } from 'eslint/config';
import { frontendConfig } from '@n8n/eslint-config/frontend';
export default defineConfig(frontendConfig, {
rules: {
//TODO: Remove these
'@typescript-eslint/naming-convention': 'warn',
'@typescript-eslint/no-unnecessary-type-assertion': 'warn',
'@typescript-eslint/no-unsafe-assignment': 'warn',
},
});

View File

@@ -1,62 +0,0 @@
{
"name": "@n8n/stores",
"type": "module",
"version": "1.16.0",
"files": [
"dist"
],
"main": "dist/index.cjs",
"module": "dist/index.js",
"types": "dist/index.d.ts",
"exports": {
".": {
"types": "./dist/index.d.ts",
"import": "./dist/index.js",
"require": "./dist/index.cjs"
},
"./*": {
"types": "./dist/*.d.ts",
"import": "./dist/*.js",
"require": "./dist/*.cjs"
}
},
"scripts": {
"dev": "vite",
"build": "tsup",
"preview": "vite preview",
"typecheck": "vue-tsc --noEmit",
"test": "vitest run",
"test:dev": "vitest --silent=false",
"lint": "eslint src --quiet",
"lint:fix": "eslint src --fix",
"format": "biome format --write . && prettier --write . --ignore-path ../../../../.prettierignore",
"format:check": "biome ci . && prettier --check . --ignore-path ../../../../.prettierignore"
},
"dependencies": {
"n8n-workflow": "workspace:*"
},
"devDependencies": {
"@n8n/eslint-config": "workspace:*",
"@n8n/typescript-config": "workspace:*",
"@n8n/vitest-config": "workspace:*",
"@testing-library/jest-dom": "catalog:frontend",
"@testing-library/user-event": "catalog:frontend",
"@testing-library/vue": "catalog:frontend",
"@vitejs/plugin-vue": "catalog:frontend",
"@vue/tsconfig": "catalog:frontend",
"@vueuse/core": "catalog:frontend",
"pinia": "catalog:frontend",
"vue": "catalog:frontend",
"tsup": "catalog:",
"typescript": "catalog:",
"vite": "catalog:",
"vitest": "catalog:",
"vue-tsc": "catalog:frontend"
},
"peerDependencies": {
"@vueuse/core": "catalog:frontend",
"pinia": "catalog:frontend",
"vue": "catalog:frontend"
},
"license": "See LICENSE.md file in the root of the repository"
}

View File

@@ -1,11 +0,0 @@
{
"extends": "@n8n/typescript-config/tsconfig.frontend.json",
"compilerOptions": {
"baseUrl": ".",
"rootDir": ".",
"outDir": "dist",
"types": ["vite/client", "vitest/globals"],
"isolatedModules": true
},
"include": ["src/**/*.ts", "src/**/*.vue", "vite.config.ts", "tsup.config.ts"]
}

View File

@@ -1,11 +0,0 @@
import { defineConfig } from 'tsup';
export default defineConfig({
entry: ['src/**/*.ts', '!src/**/*.test.ts', '!src/**/*.d.ts', '!src/__tests__/**/*'],
format: ['cjs', 'esm'],
clean: true,
dts: true,
cjsInterop: true,
splitting: true,
sourcemap: true,
});

View File

@@ -1,4 +0,0 @@
import { defineConfig, mergeConfig } from 'vite';
import { vitestConfig } from '@n8n/vitest-config/frontend';
export default mergeConfig(defineConfig({}), vitestConfig);

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

View File

@@ -1,227 +0,0 @@
<script setup lang="ts">
import '@/polyfills';
import { ref, computed, watch, onMounted, onBeforeUnmount, nextTick } from 'vue';
import { useRoute } from 'vue-router';
import LoadingView from '@/views/LoadingView.vue';
import BannerStack from '@/components/banners/BannerStack.vue';
import Modals from '@/components/Modals.vue';
import Telemetry from '@/components/Telemetry.vue';
import AskAssistantFloatingButton from '@/components/AskAssistant/Chat/AskAssistantFloatingButton.vue';
import AssistantsHub from '@/components/AskAssistant/AssistantsHub.vue';
import { loadLanguage } from '@n8n/i18n';
import {
APP_MODALS_ELEMENT_ID,
CODEMIRROR_TOOLTIP_CONTAINER_ELEMENT_ID,
HIRING_BANNER,
VIEWS,
} from '@/constants';
import { useRootStore } from '@n8n/stores/useRootStore';
import { useAssistantStore } from '@/stores/assistant.store';
import { useBuilderStore } from '@/stores/builder.store';
import { useUIStore } from '@/stores/ui.store';
import { useUsersStore } from '@/stores/users.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useHistoryHelper } from '@/composables/useHistoryHelper';
import { useWorkflowDiffRouting } from '@/composables/useWorkflowDiffRouting';
import { useStyles } from './composables/useStyles';
import { locale } from '@n8n/design-system';
import axios from 'axios';
const route = useRoute();
const rootStore = useRootStore();
const assistantStore = useAssistantStore();
const builderStore = useBuilderStore();
const uiStore = useUIStore();
const usersStore = useUsersStore();
const settingsStore = useSettingsStore();
const { setAppZIndexes } = useStyles();
// Initialize undo/redo
useHistoryHelper(route);
// Initialize workflow diff routing management
useWorkflowDiffRouting();
const loading = ref(true);
const defaultLocale = computed(() => rootStore.defaultLocale);
const isDemoMode = computed(() => route.name === VIEWS.DEMO);
const showAssistantFloatingButton = computed(
() =>
assistantStore.canShowAssistantButtonsOnCanvas && !assistantStore.hideAssistantFloatingButton,
);
const hasContentFooter = ref(false);
const appGrid = ref<Element | null>(null);
const assistantSidebarWidth = computed(() => assistantStore.chatWidth);
const builderSidebarWidth = computed(() => builderStore.chatWidth);
onMounted(async () => {
setAppZIndexes();
logHiringBanner();
loading.value = false;
window.addEventListener('resize', updateGridWidth);
await updateGridWidth();
});
onBeforeUnmount(() => {
window.removeEventListener('resize', updateGridWidth);
});
const logHiringBanner = () => {
if (settingsStore.isHiringBannerEnabled && !isDemoMode.value) {
console.log(HIRING_BANNER);
}
};
const updateGridWidth = async () => {
await nextTick();
if (appGrid.value) {
const { width, height } = appGrid.value.getBoundingClientRect();
uiStore.appGridDimensions = { width, height };
}
};
// As assistant sidebar width changes, recalculate the total width regularly
watch([assistantSidebarWidth, builderSidebarWidth], async () => {
await updateGridWidth();
});
watch(route, (r) => {
hasContentFooter.value = r.matched.some(
(matchedRoute) => matchedRoute.components?.footer !== undefined,
);
});
watch(
defaultLocale,
(newLocale) => {
void loadLanguage(newLocale);
void locale.use(newLocale);
axios.defaults.headers.common['Accept-Language'] = newLocale;
},
{ immediate: true },
);
</script>
<template>
<LoadingView v-if="loading" />
<div
v-else
id="n8n-app"
:class="{
[$style.container]: true,
[$style.sidebarCollapsed]: uiStore.sidebarMenuCollapsed,
}"
>
<div id="app-grid" ref="appGrid" :class="$style['app-grid']">
<div id="banners" :class="$style.banners">
<BannerStack v-if="!isDemoMode" />
</div>
<div id="header" :class="$style.header">
<RouterView name="header" />
</div>
<div v-if="usersStore.currentUser" id="sidebar" :class="$style.sidebar">
<RouterView name="sidebar" />
</div>
<div id="content" :class="$style.content">
<div :class="$style.contentWrapper">
<RouterView v-slot="{ Component }">
<KeepAlive v-if="$route.meta.keepWorkflowAlive" include="NodeView" :max="1">
<component :is="Component" />
</KeepAlive>
<component :is="Component" v-else />
</RouterView>
</div>
<div v-if="hasContentFooter" :class="$style.contentFooter">
<RouterView name="footer" />
</div>
</div>
<div :id="APP_MODALS_ELEMENT_ID" :class="$style.modals">
<Modals />
</div>
<Telemetry />
<AskAssistantFloatingButton v-if="showAssistantFloatingButton" />
</div>
<AssistantsHub />
<div :id="CODEMIRROR_TOOLTIP_CONTAINER_ELEMENT_ID" />
</div>
</template>
<style lang="scss" module>
// On the root level, whole app is a flex container
// with app grid and assistant sidebar as children
.container {
height: 100vh;
overflow: hidden;
display: grid;
grid-template-columns: 1fr auto;
}
// App grid is the main app layout including modals and other absolute positioned elements
.app-grid {
position: relative;
display: grid;
height: 100vh;
grid-template-areas:
'banners banners'
'sidebar header'
'sidebar content';
grid-template-columns: auto 1fr;
grid-template-rows: auto auto 1fr;
}
.banners {
grid-area: banners;
z-index: var(--z-index-top-banners);
}
.content {
display: flex;
flex-direction: column;
align-items: center;
overflow: auto;
grid-area: content;
}
.contentFooter {
height: auto;
z-index: 10;
width: 100%;
display: none;
// Only show footer if there's content
&:has(*) {
display: block;
}
}
.contentWrapper {
display: flex;
grid-area: content;
position: relative;
overflow: auto;
height: 100%;
width: 100%;
justify-content: center;
main {
width: 100%;
height: 100%;
}
}
.header {
grid-area: header;
z-index: var(--z-index-app-header);
min-width: 0;
min-height: 0;
}
.sidebar {
grid-area: sidebar;
z-index: var(--z-index-app-sidebar);
}
.modals {
width: 100%;
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -1,987 +0,0 @@
import type {
EnterpriseEditionFeatureKey,
EnterpriseEditionFeatureValue,
NodeCreatorOpenSource,
} from './Interface';
import type { NodeConnectionType } from 'n8n-workflow';
import { NodeConnectionTypes } from 'n8n-workflow';
import type {
CanvasInjectionData,
CanvasNodeHandleInjectionData,
CanvasNodeInjectionData,
} from '@/types';
import type { ComputedRef, InjectionKey, Ref } from 'vue';
import type { ExpressionLocalResolveContext } from './types/expressions';
import { DATA_STORE_MODULE_NAME } from './features/dataStore/constants';
export const MAX_WORKFLOW_SIZE = 1024 * 1024 * 16; // Workflow size limit in bytes
export const MAX_EXPECTED_REQUEST_SIZE = 2048; // Expected maximum workflow request metadata (i.e. headers) size in bytes
export const MAX_PINNED_DATA_SIZE = 1024 * 1024 * 12; // 12 MB; Workflow pinned data size limit in bytes
export const MAX_DISPLAY_DATA_SIZE = 1024 * 1024; // 1 MB
export const MAX_DISPLAY_DATA_SIZE_SCHEMA_VIEW = 1024 * 1024 * 4; // 4 MB
export const MAX_DISPLAY_ITEMS_AUTO_ALL = 250;
export const PLACEHOLDER_FILLED_AT_EXECUTION_TIME = '[filled at execution time]';
export const IN_PROGRESS_EXECUTION_ID = '__IN_PROGRESS__';
// parameter input
export const CUSTOM_API_CALL_KEY = '__CUSTOM_API_CALL__';
export const CUSTOM_API_CALL_NAME = 'Custom API Call';
// workflows
export const PLACEHOLDER_EMPTY_WORKFLOW_ID = '__EMPTY__';
export const NEW_WORKFLOW_ID = 'new';
export const DEFAULT_NODETYPE_VERSION = 1;
export const DEFAULT_NEW_WORKFLOW_NAME = 'My workflow';
export const MIN_WORKFLOW_NAME_LENGTH = 1;
export const MAX_WORKFLOW_NAME_LENGTH = 128;
export const DUPLICATE_POSTFFIX = ' copy';
export const NODE_OUTPUT_DEFAULT_KEY = '_NODE_OUTPUT_DEFAULT_KEY_';
export const DEFAULT_WORKFLOW_PAGE_SIZE = 50;
// tags
export const MAX_TAG_NAME_LENGTH = 24;
// modals
export const ABOUT_MODAL_KEY = 'about';
export const CHAT_EMBED_MODAL_KEY = 'chatEmbed';
export const CHANGE_PASSWORD_MODAL_KEY = 'changePassword';
export const CREDENTIAL_EDIT_MODAL_KEY = 'editCredential';
export const API_KEY_CREATE_OR_EDIT_MODAL_KEY = 'createOrEditApiKey';
export const CREDENTIAL_SELECT_MODAL_KEY = 'selectCredential';
export const DELETE_USER_MODAL_KEY = 'deleteUser';
export const INVITE_USER_MODAL_KEY = 'inviteUser';
export const DUPLICATE_MODAL_KEY = 'duplicate';
export const IMPORT_WORKFLOW_URL_MODAL_KEY = 'importWorkflowUrl';
export const TAGS_MANAGER_MODAL_KEY = 'tagsManager';
export const ANNOTATION_TAGS_MANAGER_MODAL_KEY = 'annotationTagsManager';
export const VERSIONS_MODAL_KEY = 'versions';
export const WORKFLOW_SETTINGS_MODAL_KEY = 'settings';
export const WORKFLOW_SHARE_MODAL_KEY = 'workflowShare';
export const PERSONALIZATION_MODAL_KEY = 'personalization';
export const CONTACT_PROMPT_MODAL_KEY = 'contactPrompt';
export const NODE_PINNING_MODAL_KEY = 'nodePinning';
export const NPS_SURVEY_MODAL_KEY = 'npsSurvey';
export const WORKFLOW_ACTIVE_MODAL_KEY = 'activation';
export const COMMUNITY_PACKAGE_INSTALL_MODAL_KEY = 'communityPackageInstall';
export const COMMUNITY_PACKAGE_CONFIRM_MODAL_KEY = 'communityPackageManageConfirm';
export const IMPORT_CURL_MODAL_KEY = 'importCurl';
export const LOG_STREAM_MODAL_KEY = 'settingsLogStream';
export const SOURCE_CONTROL_PUSH_MODAL_KEY = 'sourceControlPush';
export const SOURCE_CONTROL_PULL_MODAL_KEY = 'sourceControlPull';
export const DEBUG_PAYWALL_MODAL_KEY = 'debugPaywall';
export const MFA_SETUP_MODAL_KEY = 'mfaSetup';
export const PROMPT_MFA_CODE_MODAL_KEY = 'promptMfaCode';
export const WORKFLOW_HISTORY_VERSION_RESTORE = 'workflowHistoryVersionRestore';
export const SETUP_CREDENTIALS_MODAL_KEY = 'setupCredentials';
export const PROJECT_MOVE_RESOURCE_MODAL = 'projectMoveResourceModal';
export const NEW_ASSISTANT_SESSION_MODAL = 'newAssistantSession';
export const EXTERNAL_SECRETS_PROVIDER_MODAL_KEY = 'externalSecretsProvider';
export const COMMUNITY_PLUS_ENROLLMENT_MODAL = 'communityPlusEnrollment';
export const DELETE_FOLDER_MODAL_KEY = 'deleteFolder';
export const MOVE_FOLDER_MODAL_KEY = 'moveFolder';
export const WORKFLOW_ACTIVATION_CONFLICTING_WEBHOOK_MODAL_KEY =
'workflowActivationConflictingWebhook';
export const FROM_AI_PARAMETERS_MODAL_KEY = 'fromAiParameters';
export const WORKFLOW_EXTRACTION_NAME_MODAL_KEY = 'workflowExtractionName';
export const WHATS_NEW_MODAL_KEY = 'whatsNew';
export const WORKFLOW_DIFF_MODAL_KEY = 'workflowDiff';
export const EXPERIMENT_TEMPLATE_RECO_V2_KEY = 'templateRecoV2';
export const COMMUNITY_PACKAGE_MANAGE_ACTIONS = {
UNINSTALL: 'uninstall',
UPDATE: 'update',
VIEW_DOCS: 'view-documentation',
};
// breakpoints
export const BREAKPOINT_SM = 768;
export const BREAKPOINT_MD = 992;
export const BREAKPOINT_LG = 1200;
export const BREAKPOINT_XL = 1920;
export const DOCS_DOMAIN = 'docs.n8n.io';
export const BUILTIN_NODES_DOCS_URL = `https://${DOCS_DOMAIN}/integrations/builtin/`;
export const BUILTIN_CREDENTIALS_DOCS_URL = `https://${DOCS_DOMAIN}/integrations/builtin/credentials/`;
export const DATA_PINNING_DOCS_URL = `https://${DOCS_DOMAIN}/data/data-pinning/`;
export const DATA_EDITING_DOCS_URL = `https://${DOCS_DOMAIN}/data/data-editing/`;
export const SCHEMA_PREVIEW_DOCS_URL = `https://${DOCS_DOMAIN}/data/schema-preview/`;
export const MFA_DOCS_URL = `https://${DOCS_DOMAIN}/user-management/two-factor-auth/`;
export const NPM_PACKAGE_DOCS_BASE_URL = 'https://www.npmjs.com/package/';
export const NPM_KEYWORD_SEARCH_URL =
'https://www.npmjs.com/search?q=keywords%3An8n-community-node-package';
export const N8N_QUEUE_MODE_DOCS_URL = `https://${DOCS_DOMAIN}/hosting/scaling/queue-mode/`;
export const COMMUNITY_NODES_INSTALLATION_DOCS_URL = `https://${DOCS_DOMAIN}/integrations/community-nodes/installation/gui-install/`;
export const COMMUNITY_NODES_RISKS_DOCS_URL = `https://${DOCS_DOMAIN}/integrations/community-nodes/risks/`;
export const COMMUNITY_NODES_BLOCKLIST_DOCS_URL = `https://${DOCS_DOMAIN}/integrations/community-nodes/blocklist/`;
export const CUSTOM_NODES_DOCS_URL = `https://${DOCS_DOMAIN}/integrations/creating-nodes/code/create-n8n-nodes-module/`;
export const EXPRESSIONS_DOCS_URL = `https://${DOCS_DOMAIN}/code-examples/expressions/`;
export const EVALUATIONS_DOCS_URL = `https://${DOCS_DOMAIN}/advanced-ai/evaluations/overview/`;
export const ERROR_WORKFLOW_DOCS_URL = `https://${DOCS_DOMAIN}/flow-logic/error-handling/#create-and-set-an-error-workflow`;
export const TIME_SAVED_DOCS_URL = `https://${DOCS_DOMAIN}/insights/#setting-the-time-saved-by-a-workflow`;
export const N8N_PRICING_PAGE_URL = 'https://n8n.io/pricing';
export const N8N_MAIN_GITHUB_REPO_URL = 'https://github.com/n8n-io/n8n';
export const NODE_MIN_INPUT_ITEMS_COUNT = 4;
// node types
export const BAMBOO_HR_NODE_TYPE = 'n8n-nodes-base.bambooHr';
export const CALENDLY_TRIGGER_NODE_TYPE = 'n8n-nodes-base.calendlyTrigger';
export const CODE_NODE_TYPE = 'n8n-nodes-base.code';
export const AI_CODE_NODE_TYPE = '@n8n/n8n-nodes-langchain.code';
export const AI_MCP_TOOL_NODE_TYPE = '@n8n/n8n-nodes-langchain.mcpClientTool';
export const WIKIPEDIA_TOOL_NODE_TYPE = '@n8n/n8n-nodes-langchain.toolWikipedia';
export const CRON_NODE_TYPE = 'n8n-nodes-base.cron';
export const CLEARBIT_NODE_TYPE = 'n8n-nodes-base.clearbit';
export const FILTER_NODE_TYPE = 'n8n-nodes-base.filter';
export const FUNCTION_NODE_TYPE = 'n8n-nodes-base.function';
export const GITHUB_TRIGGER_NODE_TYPE = 'n8n-nodes-base.githubTrigger';
export const GIT_NODE_TYPE = 'n8n-nodes-base.git';
export const GOOGLE_GMAIL_NODE_TYPE = 'n8n-nodes-base.gmail';
export const GOOGLE_SHEETS_NODE_TYPE = 'n8n-nodes-base.googleSheets';
export const ERROR_TRIGGER_NODE_TYPE = 'n8n-nodes-base.errorTrigger';
export const ELASTIC_SECURITY_NODE_TYPE = 'n8n-nodes-base.elasticSecurity';
export const EMAIL_SEND_NODE_TYPE = 'n8n-nodes-base.emailSend';
export const EMAIL_IMAP_NODE_TYPE = 'n8n-nodes-base.emailReadImap';
export const EXECUTE_COMMAND_NODE_TYPE = 'n8n-nodes-base.executeCommand';
export const FORM_TRIGGER_NODE_TYPE = 'n8n-nodes-base.formTrigger';
export const HTML_NODE_TYPE = 'n8n-nodes-base.html';
export const HTTP_REQUEST_NODE_TYPE = 'n8n-nodes-base.httpRequest';
export const HTTP_REQUEST_TOOL_NODE_TYPE = 'n8n-nodes-base.httpRequestTool';
export const HUBSPOT_TRIGGER_NODE_TYPE = 'n8n-nodes-base.hubspotTrigger';
export const IF_NODE_TYPE = 'n8n-nodes-base.if';
export const INTERVAL_NODE_TYPE = 'n8n-nodes-base.interval';
export const ITEM_LISTS_NODE_TYPE = 'n8n-nodes-base.itemLists';
export const JIRA_NODE_TYPE = 'n8n-nodes-base.jira';
export const JIRA_TRIGGER_NODE_TYPE = 'n8n-nodes-base.jiraTrigger';
export const MICROSOFT_EXCEL_NODE_TYPE = 'n8n-nodes-base.microsoftExcel';
export const MANUAL_TRIGGER_NODE_TYPE = 'n8n-nodes-base.manualTrigger';
export const MANUAL_CHAT_TRIGGER_NODE_TYPE = '@n8n/n8n-nodes-langchain.manualChatTrigger';
export const MCP_TRIGGER_NODE_TYPE = '@n8n/n8n-nodes-langchain.mcpTrigger';
export const CHAT_TRIGGER_NODE_TYPE = '@n8n/n8n-nodes-langchain.chatTrigger';
export const CHAT_NODE_TYPE = '@n8n/n8n-nodes-langchain.chat';
export const AGENT_NODE_TYPE = '@n8n/n8n-nodes-langchain.agent';
export const OPEN_AI_NODE_TYPE = '@n8n/n8n-nodes-langchain.openAi';
export const OPEN_AI_NODE_MESSAGE_ASSISTANT_TYPE =
'@n8n/n8n-nodes-langchain.openAi.assistant.message';
export const OPEN_AI_ASSISTANT_NODE_TYPE = '@n8n/n8n-nodes-langchain.openAiAssistant';
export const BASIC_CHAIN_NODE_TYPE = '@n8n/n8n-nodes-langchain.chainLlm';
export const QA_CHAIN_NODE_TYPE = '@n8n/n8n-nodes-langchain.chainRetrievalQa';
export const MICROSOFT_TEAMS_NODE_TYPE = 'n8n-nodes-base.microsoftTeams';
export const N8N_NODE_TYPE = 'n8n-nodes-base.n8n';
export const NO_OP_NODE_TYPE = 'n8n-nodes-base.noOp';
export const STICKY_NODE_TYPE = 'n8n-nodes-base.stickyNote';
export const NOTION_TRIGGER_NODE_TYPE = 'n8n-nodes-base.notionTrigger';
export const PAGERDUTY_NODE_TYPE = 'n8n-nodes-base.pagerDuty';
export const SALESFORCE_NODE_TYPE = 'n8n-nodes-base.salesforce';
export const SEGMENT_NODE_TYPE = 'n8n-nodes-base.segment';
export const SET_NODE_TYPE = 'n8n-nodes-base.set';
export const SCHEDULE_TRIGGER_NODE_TYPE = 'n8n-nodes-base.scheduleTrigger';
export const SERVICENOW_NODE_TYPE = 'n8n-nodes-base.serviceNow';
export const SLACK_NODE_TYPE = 'n8n-nodes-base.slack';
export const SPREADSHEET_FILE_NODE_TYPE = 'n8n-nodes-base.spreadsheetFile';
export const SPLIT_IN_BATCHES_NODE_TYPE = 'n8n-nodes-base.splitInBatches';
export const START_NODE_TYPE = 'n8n-nodes-base.start';
export const SWITCH_NODE_TYPE = 'n8n-nodes-base.switch';
export const TELEGRAM_NODE_TYPE = 'n8n-nodes-base.telegram';
export const THE_HIVE_TRIGGER_NODE_TYPE = 'n8n-nodes-base.theHiveTrigger';
export const QUICKBOOKS_NODE_TYPE = 'n8n-nodes-base.quickbooks';
export const WAIT_NODE_TYPE = 'n8n-nodes-base.wait';
export const WEBHOOK_NODE_TYPE = 'n8n-nodes-base.webhook';
export const WORKABLE_TRIGGER_NODE_TYPE = 'n8n-nodes-base.workableTrigger';
export const WORKFLOW_TRIGGER_NODE_TYPE = 'n8n-nodes-base.workflowTrigger';
export const EXECUTE_WORKFLOW_NODE_TYPE = 'n8n-nodes-base.executeWorkflow';
export const EXECUTE_WORKFLOW_TRIGGER_NODE_TYPE = 'n8n-nodes-base.executeWorkflowTrigger';
export const WOOCOMMERCE_TRIGGER_NODE_TYPE = 'n8n-nodes-base.wooCommerceTrigger';
export const XERO_NODE_TYPE = 'n8n-nodes-base.xero';
export const ZENDESK_NODE_TYPE = 'n8n-nodes-base.zendesk';
export const ZENDESK_TRIGGER_NODE_TYPE = 'n8n-nodes-base.zendeskTrigger';
export const DISCORD_NODE_TYPE = 'n8n-nodes-base.discord';
export const EXTRACT_FROM_FILE_NODE_TYPE = 'n8n-nodes-base.extractFromFile';
export const CONVERT_TO_FILE_NODE_TYPE = 'n8n-nodes-base.convertToFile';
export const DATETIME_NODE_TYPE = 'n8n-nodes-base.dateTime';
export const REMOVE_DUPLICATES_NODE_TYPE = 'n8n-nodes-base.removeDuplicates';
export const SPLIT_OUT_NODE_TYPE = 'n8n-nodes-base.splitOut';
export const LIMIT_NODE_TYPE = 'n8n-nodes-base.limit';
export const SUMMARIZE_NODE_TYPE = 'n8n-nodes-base.summarize';
export const AGGREGATE_NODE_TYPE = 'n8n-nodes-base.aggregate';
export const MERGE_NODE_TYPE = 'n8n-nodes-base.merge';
export const MARKDOWN_NODE_TYPE = 'n8n-nodes-base.markdown';
export const XML_NODE_TYPE = 'n8n-nodes-base.xml';
export const CRYPTO_NODE_TYPE = 'n8n-nodes-base.crypto';
export const RSS_READ_NODE_TYPE = 'n8n-nodes-base.rssFeedRead';
export const COMPRESSION_NODE_TYPE = 'n8n-nodes-base.compression';
export const EDIT_IMAGE_NODE_TYPE = 'n8n-nodes-base.editImage';
export const CHAIN_SUMMARIZATION_LANGCHAIN_NODE_TYPE =
'@n8n/n8n-nodes-langchain.chainSummarization';
export const SIMULATE_NODE_TYPE = 'n8n-nodes-base.simulate';
export const SIMULATE_TRIGGER_NODE_TYPE = 'n8n-nodes-base.simulateTrigger';
export const AI_TRANSFORM_NODE_TYPE = 'n8n-nodes-base.aiTransform';
export const FORM_NODE_TYPE = 'n8n-nodes-base.form';
export const GITHUB_NODE_TYPE = 'n8n-nodes-base.github';
export const SLACK_TRIGGER_NODE_TYPE = 'n8n-nodes-base.slackTrigger';
export const TELEGRAM_TRIGGER_NODE_TYPE = 'n8n-nodes-base.telegramTrigger';
export const FACEBOOK_LEAD_ADS_TRIGGER_NODE_TYPE = 'n8n-nodes-base.facebookLeadAdsTrigger';
export const RESPOND_TO_WEBHOOK_NODE_TYPE = 'n8n-nodes-base.respondToWebhook';
export const DATA_STORE_NODE_TYPE = 'n8n-nodes-base.dataStore';
export const CREDENTIAL_ONLY_NODE_PREFIX = 'n8n-creds-base';
export const CREDENTIAL_ONLY_HTTP_NODE_VERSION = 4.1;
// template categories
export const TEMPLATE_CATEGORY_AI = 'categories/ai';
export const EXECUTABLE_TRIGGER_NODE_TYPES = [
START_NODE_TYPE,
MANUAL_TRIGGER_NODE_TYPE,
SCHEDULE_TRIGGER_NODE_TYPE,
CRON_NODE_TYPE,
INTERVAL_NODE_TYPE,
];
export const NON_ACTIVATABLE_TRIGGER_NODE_TYPES = [
ERROR_TRIGGER_NODE_TYPE,
MANUAL_TRIGGER_NODE_TYPE,
EXECUTE_WORKFLOW_TRIGGER_NODE_TYPE,
MANUAL_CHAT_TRIGGER_NODE_TYPE,
];
export const NODES_USING_CODE_NODE_EDITOR = [
CODE_NODE_TYPE,
AI_CODE_NODE_TYPE,
AI_TRANSFORM_NODE_TYPE,
];
export const MODULE_ENABLED_NODES = [
{ nodeType: DATA_STORE_NODE_TYPE, module: DATA_STORE_MODULE_NAME },
];
export const NODE_POSITION_CONFLICT_ALLOWLIST = [STICKY_NODE_TYPE];
export const PIN_DATA_NODE_TYPES_DENYLIST = [SPLIT_IN_BATCHES_NODE_TYPE, STICKY_NODE_TYPE];
export const OPEN_URL_PANEL_TRIGGER_NODE_TYPES = [
WEBHOOK_NODE_TYPE,
FORM_TRIGGER_NODE_TYPE,
CHAT_TRIGGER_NODE_TYPE,
MCP_TRIGGER_NODE_TYPE,
];
export const SINGLE_WEBHOOK_TRIGGERS = [
TELEGRAM_TRIGGER_NODE_TYPE,
SLACK_TRIGGER_NODE_TYPE,
FACEBOOK_LEAD_ADS_TRIGGER_NODE_TYPE,
];
export const LIST_LIKE_NODE_OPERATIONS = ['getAll', 'getMany', 'read', 'search'];
export const PRODUCTION_ONLY_TRIGGER_NODE_TYPES = [CHAT_TRIGGER_NODE_TYPE];
// Node creator
export const NODE_CREATOR_OPEN_SOURCES: Record<
Uppercase<NodeCreatorOpenSource>,
NodeCreatorOpenSource
> = {
NO_TRIGGER_EXECUTION_TOOLTIP: 'no_trigger_execution_tooltip',
PLUS_ENDPOINT: 'plus_endpoint',
ADD_INPUT_ENDPOINT: 'add_input_endpoint',
TRIGGER_PLACEHOLDER_BUTTON: 'trigger_placeholder_button',
ADD_NODE_BUTTON: 'add_node_button',
TAB: 'tab',
NODE_CONNECTION_ACTION: 'node_connection_action',
NODE_CONNECTION_DROP: 'node_connection_drop',
NOTICE_ERROR_MESSAGE: 'notice_error_message',
CONTEXT_MENU: 'context_menu',
ADD_EVALUATION_NODE_BUTTON: 'add_evaluation_node_button',
ADD_EVALUATION_TRIGGER_BUTTON: 'add_evaluation_trigger_button',
TEMPLATES_CALLOUT: 'templates_callout',
'': '',
};
export const CORE_NODES_CATEGORY = 'Core Nodes';
export const HUMAN_IN_THE_LOOP_CATEGORY = 'HITL';
export const CUSTOM_NODES_CATEGORY = 'Custom Nodes';
export const DEFAULT_SUBCATEGORY = '*';
export const AI_OTHERS_NODE_CREATOR_VIEW = 'AI Other';
export const AI_NODE_CREATOR_VIEW = 'AI';
export const REGULAR_NODE_CREATOR_VIEW = 'Regular';
export const TRIGGER_NODE_CREATOR_VIEW = 'Trigger';
export const OTHER_TRIGGER_NODES_SUBCATEGORY = 'Other Trigger Nodes';
export const TRANSFORM_DATA_SUBCATEGORY = 'Data Transformation';
export const FILES_SUBCATEGORY = 'Files';
export const FLOWS_CONTROL_SUBCATEGORY = 'Flow';
export const AI_SUBCATEGORY = 'AI';
export const HELPERS_SUBCATEGORY = 'Helpers';
export const HITL_SUBCATEGORY = 'Human in the Loop';
export const AI_CATEGORY_AGENTS = 'Agents';
export const AI_CATEGORY_CHAINS = 'Chains';
export const AI_CATEGORY_LANGUAGE_MODELS = 'Language Models';
export const AI_CATEGORY_MEMORY = 'Memory';
export const AI_CATEGORY_OUTPUTPARSER = 'Output Parsers';
export const AI_CATEGORY_TOOLS = 'Tools';
export const AI_CATEGORY_VECTOR_STORES = 'Vector Stores';
export const AI_CATEGORY_RETRIEVERS = 'Retrievers';
export const AI_CATEGORY_EMBEDDING = 'Embeddings';
export const AI_CATEGORY_DOCUMENT_LOADERS = 'Document Loaders';
export const AI_CATEGORY_TEXT_SPLITTERS = 'Text Splitters';
export const AI_CATEGORY_OTHER_TOOLS = 'Other Tools';
export const AI_CATEGORY_ROOT_NODES = 'Root Nodes';
export const AI_CATEGORY_MCP_NODES = 'Model Context Protocol';
export const AI_EVALUATION = 'Evaluation';
export const AI_UNCATEGORIZED_CATEGORY = 'Miscellaneous';
export const AI_CODE_TOOL_LANGCHAIN_NODE_TYPE = '@n8n/n8n-nodes-langchain.toolCode';
export const AI_WORKFLOW_TOOL_LANGCHAIN_NODE_TYPE = '@n8n/n8n-nodes-langchain.toolWorkflow';
export const REQUEST_NODE_FORM_URL = 'https://n8n-community.typeform.com/to/K1fBVTZ3';
export const PRE_BUILT_AGENTS_COLLECTION = 'pre-built-agents-collection';
// Node Connection Types
export const NODE_CONNECTION_TYPE_ALLOW_MULTIPLE: NodeConnectionType[] = [
NodeConnectionTypes.AiTool,
NodeConnectionTypes.Main,
];
/** PERSONALIZATION SURVEY */
export const EMAIL_KEY = 'email';
export const WORK_AREA_KEY = 'workArea';
export const FINANCE_WORK_AREA = 'finance';
export const IT_ENGINEERING_WORK_AREA = 'IT-Engineering';
export const PRODUCT_WORK_AREA = 'product';
export const SALES_BUSINESSDEV_WORK_AREA = 'sales-businessDevelopment';
export const SECURITY_WORK_AREA = 'security';
export const COMPANY_TYPE_KEY = 'companyType';
export const SAAS_COMPANY_TYPE = 'saas';
export const ECOMMERCE_COMPANY_TYPE = 'ecommerce';
export const EDUCATION_TYPE = 'education';
export const MSP_COMPANY_TYPE = 'msp';
export const DIGITAL_AGENCY_COMPANY_TYPE = 'digital-agency';
export const SYSTEMS_INTEGRATOR_COMPANY_TYPE = 'systems-integrator';
export const OTHER_COMPANY_TYPE = 'other';
export const PERSONAL_COMPANY_TYPE = 'personal';
export const COMPANY_INDUSTRY_EXTENDED_KEY = 'companyIndustryExtended';
export const OTHER_COMPANY_INDUSTRY_EXTENDED_KEY = 'otherCompanyIndustryExtended';
export const PHYSICAL_RETAIL_OR_SERVICES = 'physical-retail-or-services';
export const REAL_ESTATE_OR_CONSTRUCTION = 'real-estate-or-construction';
export const GOVERNMENT_INDUSTRY = 'government';
export const LEGAL_INDUSTRY = 'legal-industry';
export const MARKETING_INDUSTRY = 'marketing-industry';
export const MEDIA_INDUSTRY = 'media-industry';
export const MANUFACTURING_INDUSTRY = 'manufacturing-industry';
export const MSP_INDUSTRY = 'msp';
export const HEALTHCARE_INDUSTRY = 'healthcare';
export const FINANCE_INSURANCE_INDUSTRY = 'finance-insurance-industry';
export const IT_INDUSTRY = 'it-industry';
export const SECURITY_INDUSTRY = 'security-industry';
export const TELECOMS_INDUSTRY = 'telecoms';
export const OTHER_INDUSTRY_OPTION = 'other';
export const COMPANY_SIZE_KEY = 'companySize';
export const COMPANY_SIZE_20_OR_LESS = '<20';
export const COMPANY_SIZE_20_99 = '20-99';
export const COMPANY_SIZE_100_499 = '100-499';
export const COMPANY_SIZE_500_999 = '500-999';
export const COMPANY_SIZE_1000_OR_MORE = '1000+';
export const COMPANY_SIZE_PERSONAL_USE = 'personalUser';
export const MARKETING_AUTOMATION_GOAL_KEY = 'automationGoalSm';
export const MARKETING_AUTOMATION_LEAD_GENERATION_GOAL = 'lead-generation';
export const MARKETING_AUTOMATION_CUSTOMER_COMMUNICATION = 'customer-communication';
export const MARKETING_AUTOMATION_ACTIONS = 'actions';
export const MARKETING_AUTOMATION_AD_CAMPAIGN = 'ad-campaign';
export const MARKETING_AUTOMATION_REPORTING = 'reporting';
export const MARKETING_AUTOMATION_DATA_SYNCHING = 'data-syncing';
export const MARKETING_AUTOMATION_OTHER = 'other';
export const OTHER_MARKETING_AUTOMATION_GOAL_KEY = 'automationGoalSmOther';
export const CODING_SKILL_KEY = 'codingSkill';
export const AUTOMATION_BENEFICIARY_KEY = 'automationBeneficiary';
export const AUTOMATION_BENEFICIARY_SELF = 'myself';
export const AUTOMATION_BENEFICIARY_MY_TEAM = 'my-team';
export const AUTOMATION_BENEFICIARY_OTHER_TEAMS = 'other-teams';
export const USAGE_MODE_KEY = 'usageModes';
export const USAGE_MODE_CONNECT_TO_DB = 'connect-internal-db';
export const USAGE_MODE_BUILD_BE_SERVICES = 'build-be-services';
export const USAGE_MODE_MANIPULATE_FILES = 'manipulate-files';
export const REPORTED_SOURCE_KEY = 'reportedSource';
export const REPORTED_SOURCE_OTHER_KEY = 'reportedSourceOther';
export const REPORTED_SOURCE_GOOGLE = 'google';
export const REPORTED_SOURCE_TWITTER = 'twitter';
export const REPORTED_SOURCE_LINKEDIN = 'linkedin';
export const REPORTED_SOURCE_YOUTUBE = 'youtube';
export const REPORTED_SOURCE_FRIEND = 'friend';
export const REPORTED_SOURCE_PODCAST = 'podcast';
export const REPORTED_SOURCE_EVENT = 'event';
export const REPORTED_SOURCE_OTHER = 'other';
export const AUTOMATION_GOAL_KEY = 'automationGoal';
export const DEVOPS_AUTOMATION_GOAL_KEY = 'automationGoalDevops';
export const DEVOPS_AUTOMATION_GOAL_OTHER_KEY = 'automationGoalDevopsOther';
export const DEVOPS_AUTOMATION_OTHER = 'other';
export const DEVOPS_AUTOMATION_CI_CD_GOAL = 'ci-cd';
export const DEVOPS_AUTOMATION_CLOUD_INFRASTRUCTURE_ORCHESTRATION_GOAL =
'cloud-infrastructure-orchestration';
export const DEVOPS_AUTOMATION_DATA_SYNCING_GOAL = 'data-syncing';
export const DEVOPS_INCIDENT_RESPONSE_GOAL = 'incident-response';
export const DEVOPS_MONITORING_AND_ALERTING_GOAL = 'monitoring-alerting';
export const DEVOPS_REPORTING_GOAL = 'reporting';
export const DEVOPS_TICKETING_SYSTEMS_INTEGRATIONS_GOAL = 'ticketing-systems-integrations';
export const CUSTOMER_INTEGRATIONS_GOAL = 'customer-integrations';
export const CUSTOMER_SUPPORT_GOAL = 'customer-support';
export const ENGINEERING_GOAL = 'engineering';
export const FINANCE_ACCOUNTING_GOAL = 'finance-accounting';
export const HR_GOAL = 'hr';
export const OPERATIONS_GOAL = 'operations';
export const PRODUCT_GOAL = 'product';
export const SALES_MARKETING_GOAL = 'sales-marketing';
export const SECURITY_GOAL = 'security';
export const OTHER_AUTOMATION_GOAL = 'other';
export const NOT_SURE_YET_GOAL = 'not-sure-yet';
export const ROLE_KEY = 'role';
export const ROLE_OTHER_KEY = 'roleOther';
export const ROLE_BUSINESS_OWNER = 'business-owner';
export const ROLE_CUSTOMER_SUPPORT = 'customer-support';
export const ROLE_DATA_SCIENCE = 'data-science';
export const ROLE_DEVOPS = 'devops';
export const ROLE_IT = 'it';
export const ROLE_ENGINEERING = 'engineering';
export const ROLE_SALES_AND_MARKETING = 'sales-and-marketing';
export const ROLE_SECURITY = 'security';
export const ROLE_OTHER = 'other';
/** END OF PERSONALIZATION SURVEY */
export const MODAL_CANCEL = 'cancel';
export const MODAL_CONFIRM = 'confirm';
export const MODAL_CLOSE = 'close';
export const ILLEGAL_FOLDER_CHARACTERS = [
'[',
']',
'^',
'\\',
'/',
':',
'*',
'?',
'"',
'<',
'>',
'|',
];
export const FOLDER_NAME_ILLEGAL_CHARACTERS_REGEX = new RegExp(
`[${ILLEGAL_FOLDER_CHARACTERS.map((char) => {
return char.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
}).join('')}]`,
);
export const FOLDER_NAME_ONLY_DOTS_REGEX = /^\.+$/;
export const FOLDER_NAME_MAX_LENGTH = 100;
export const VALID_EMAIL_REGEX =
/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
export const VALID_WORKFLOW_IMPORT_URL_REGEX = /^http[s]?:\/\/.*\.json$/i;
export const LOCAL_STORAGE_ACTIVATION_FLAG = 'N8N_HIDE_ACTIVATION_ALERT';
export const LOCAL_STORAGE_PIN_DATA_DISCOVERY_NDV_FLAG = 'N8N_PIN_DATA_DISCOVERY_NDV';
export const LOCAL_STORAGE_PIN_DATA_DISCOVERY_CANVAS_FLAG = 'N8N_PIN_DATA_DISCOVERY_CANVAS';
export const LOCAL_STORAGE_MAPPING_IS_ONBOARDED = 'N8N_MAPPING_ONBOARDED';
export const LOCAL_STORAGE_AUTOCOMPLETE_IS_ONBOARDED = 'N8N_AUTOCOMPLETE_ONBOARDED';
export const LOCAL_STORAGE_TABLE_HOVER_IS_ONBOARDED = 'N8N_TABLE_HOVER_ONBOARDED';
export const LOCAL_STORAGE_MAIN_PANEL_RELATIVE_WIDTH = 'N8N_MAIN_PANEL_RELATIVE_WIDTH';
export const LOCAL_STORAGE_NDV_DIMENSIONS = 'N8N_NDV_DIMENSIONS';
export const LOCAL_STORAGE_ACTIVE_MODAL = 'N8N_ACTIVE_MODAL';
export const LOCAL_STORAGE_THEME = 'N8N_THEME';
export const LOCAL_STORAGE_EXPERIMENT_OVERRIDES = 'N8N_EXPERIMENT_OVERRIDES';
export const LOCAL_STORAGE_HIDE_GITHUB_STAR_BUTTON = 'N8N_HIDE_HIDE_GITHUB_STAR_BUTTON';
export const LOCAL_STORAGE_NDV_INPUT_PANEL_DISPLAY_MODE = 'N8N_NDV_INPUT_PANEL_DISPLAY_MODE';
export const LOCAL_STORAGE_NDV_OUTPUT_PANEL_DISPLAY_MODE = 'N8N_NDV_OUTPUT_PANEL_DISPLAY_MODE';
export const LOCAL_STORAGE_LOGS_PANEL_OPEN = 'N8N_LOGS_PANEL_OPEN';
export const LOCAL_STORAGE_TURN_OFF_WORKFLOW_SUGGESTIONS = 'N8N_TURN_OFF_WORKFLOW_SUGGESTIONS';
export const LOCAL_STORAGE_LOGS_SYNC_SELECTION = 'N8N_LOGS_SYNC_SELECTION_ENABLED';
export const LOCAL_STORAGE_LOGS_PANEL_DETAILS_PANEL = 'N8N_LOGS_DETAILS_PANEL';
export const LOCAL_STORAGE_LOGS_PANEL_DETAILS_PANEL_SUB_NODE = 'N8N_LOGS_DETAILS_PANEL_SUB_NODE';
export const LOCAL_STORAGE_WORKFLOW_LIST_PREFERENCES_KEY = 'N8N_WORKFLOWS_LIST_PREFERENCES';
export const LOCAL_STORAGE_EXPERIMENTAL_DOCKED_NODE_SETTINGS =
'N8N_EXPERIMENTAL_DOCKED_NODE_SETTINGS';
export const LOCAL_STORAGE_READ_WHATS_NEW_ARTICLES = 'N8N_READ_WHATS_NEW_ARTICLES';
export const LOCAL_STORAGE_DISMISSED_WHATS_NEW_CALLOUT = 'N8N_DISMISSED_WHATS_NEW_CALLOUT';
export const LOCAL_STORAGE_NDV_PANEL_WIDTH = 'N8N_NDV_PANEL_WIDTH';
export const LOCAL_STORAGE_FOCUS_PANEL = 'N8N_FOCUS_PANEL';
export const LOCAL_STORAGE_EXPERIMENTAL_DISMISSED_SUGGESTED_WORKFLOWS =
'N8N_EXPERIMENTAL_DISMISSED_SUGGESTED_WORKFLOWS';
export const BASE_NODE_SURVEY_URL = 'https://n8n-community.typeform.com/to/BvmzxqYv#nodename=';
export const COMMUNITY_PLUS_DOCS_URL =
'https://docs.n8n.io/hosting/community-edition-features/#registered-community-edition';
export const RELEASE_NOTES_URL = 'https://docs.n8n.io/release-notes/';
export const HIRING_BANNER = `
//////
///////////
///// ////
/////////////////// ////
////////////////////// ////
/////// /////// //// /////////////
//////////// //////////// //// ///////
//// //// //// //// ////
///// ///////////// //////////
///// //// //// //// ////
//////////// //////////// //// ////////
/////// ////// //// /////////////
///////////// ////
////////// ////
//// ////
///////////
//////
Love n8n? Help us build the future of automation! https://n8n.io/careers?utm_source=n8n_user&utm_medium=console_output
`;
export const TEMPLATES_NODES_FILTER = ['n8n-nodes-base.start', 'n8n-nodes-base.respondToWebhook'];
export const enum VIEWS {
HOMEPAGE = 'Homepage',
COLLECTION = 'TemplatesCollectionView',
EXECUTIONS = 'Executions',
EXECUTION_PREVIEW = 'ExecutionPreview',
EXECUTION_DEBUG = 'ExecutionDebug',
EXECUTION_HOME = 'ExecutionsLandingPage',
TEMPLATE = 'TemplatesWorkflowView',
TEMPLATE_SETUP = 'TemplatesWorkflowSetupView',
TEMPLATES = 'TemplatesSearchView',
CREDENTIALS = 'CredentialsView',
VARIABLES = 'VariablesView',
NEW_WORKFLOW = 'NodeViewNew',
WORKFLOW = 'NodeViewExisting',
DEMO = 'WorkflowDemo',
TEMPLATE_IMPORT = 'WorkflowTemplate',
WORKFLOW_ONBOARDING = 'WorkflowOnboarding',
SIGNIN = 'SigninView',
SIGNUP = 'SignupView',
SIGNOUT = 'SignoutView',
SETUP = 'SetupView',
FORGOT_PASSWORD = 'ForgotMyPasswordView',
CHANGE_PASSWORD = 'ChangePasswordView',
SETTINGS = 'Settings',
USERS_SETTINGS = 'UsersSettings',
LDAP_SETTINGS = 'LdapSettings',
PERSONAL_SETTINGS = 'PersonalSettings',
API_SETTINGS = 'APISettings',
NOT_FOUND = 'NotFoundView',
COMMUNITY_NODES = 'CommunityNodes',
WORKFLOWS = 'WorkflowsView',
WORKFLOW_EXECUTIONS = 'WorkflowExecutions',
EVALUATION = 'Evaluation',
EVALUATION_EDIT = 'EvaluationEdit',
EVALUATION_RUNS_DETAIL = 'EvaluationRunsDetail',
USAGE = 'Usage',
LOG_STREAMING_SETTINGS = 'LogStreamingSettingsView',
SSO_SETTINGS = 'SSoSettings',
EXTERNAL_SECRETS_SETTINGS = 'ExternalSecretsSettings',
SAML_ONBOARDING = 'SamlOnboarding',
SOURCE_CONTROL = 'SourceControl',
MFA_VIEW = 'MfaView',
WORKFLOW_HISTORY = 'WorkflowHistory',
WORKER_VIEW = 'WorkerView',
PROJECTS = 'Projects',
PROJECT_DETAILS = 'ProjectDetails',
PROJECTS_WORKFLOWS = 'ProjectsWorkflows',
PROJECTS_CREDENTIALS = 'ProjectsCredentials',
PROJECT_SETTINGS = 'ProjectSettings',
PROJECTS_EXECUTIONS = 'ProjectsExecutions',
FOLDERS = 'Folders',
PROJECTS_FOLDERS = 'ProjectsFolders',
INSIGHTS = 'Insights',
SHARED_WITH_ME = 'SharedWithMe',
SHARED_WORKFLOWS = 'SharedWorkflows',
SHARED_CREDENTIALS = 'SharedCredentials',
ENTITY_NOT_FOUND = 'EntityNotFound',
ENTITY_UNAUTHORIZED = 'EntityUnAuthorized',
}
export const EDITABLE_CANVAS_VIEWS = [VIEWS.WORKFLOW, VIEWS.NEW_WORKFLOW, VIEWS.EXECUTION_DEBUG];
export const VISIBLE_LOGS_VIEWS = [...EDITABLE_CANVAS_VIEWS, VIEWS.EXECUTION_PREVIEW];
export const TEST_PIN_DATA = [
{
name: 'First item',
code: 1,
},
{
name: 'Second item',
code: 2,
},
];
export const MAPPING_PARAMS = [
'$binary',
'$data',
'$env',
'$evaluateExpression',
'$execution',
'$ifEmpty',
'$input',
'$item',
'$jmespath',
'$fromAI',
'$json',
'$node',
'$now',
'$parameter',
'$parameters',
'$position',
'$prevNode',
'$resumeWebhookUrl',
'$runIndex',
'$today',
'$vars',
'$workflow',
'$nodeVersion',
];
export const DEFAULT_STICKY_HEIGHT = 160;
export const DEFAULT_STICKY_WIDTH = 240;
export const enum WORKFLOW_MENU_ACTIONS {
DUPLICATE = 'duplicate',
DOWNLOAD = 'download',
IMPORT_FROM_URL = 'import-from-url',
IMPORT_FROM_FILE = 'import-from-file',
PUSH = 'push',
SETTINGS = 'settings',
DELETE = 'delete',
ARCHIVE = 'archive',
UNARCHIVE = 'unarchive',
RENAME = 'rename',
CHANGE_OWNER = 'change-owner',
}
/**
* Enterprise edition
*/
export const EnterpriseEditionFeature: Record<
EnterpriseEditionFeatureKey,
EnterpriseEditionFeatureValue
> = {
AdvancedExecutionFilters: 'advancedExecutionFilters',
Sharing: 'sharing',
Ldap: 'ldap',
LogStreaming: 'logStreaming',
Variables: 'variables',
Saml: 'saml',
Oidc: 'oidc',
EnforceMFA: 'mfaEnforcement',
SourceControl: 'sourceControl',
ExternalSecrets: 'externalSecrets',
AuditLogs: 'auditLogs',
DebugInEditor: 'debugInEditor',
WorkflowHistory: 'workflowHistory',
WorkerView: 'workerView',
AdvancedPermissions: 'advancedPermissions',
ApiKeyScopes: 'apiKeyScopes',
};
export const MAIN_NODE_PANEL_WIDTH = 390;
export const enum MAIN_HEADER_TABS {
WORKFLOW = 'workflow',
EXECUTIONS = 'executions',
SETTINGS = 'settings',
EVALUATION = 'evaluation',
}
export const CURL_IMPORT_NOT_SUPPORTED_PROTOCOLS = [
'ftp',
'ftps',
'dict',
'imap',
'imaps',
'ldap',
'ldaps',
'mqtt',
'pop',
'pop3s',
'rtmp',
'rtsp',
'scp',
'sftp',
'smb',
'smbs',
'smtp',
'smtps',
'telnet',
'tftp',
];
export const CURL_IMPORT_NODES_PROTOCOLS: { [key: string]: string } = {
ftp: 'FTP',
ftps: 'FTP',
ldap: 'LDAP',
ldaps: 'LDAP',
mqtt: 'MQTT',
imap: 'IMAP',
imaps: 'IMAP',
};
export const enum SignInType {
LDAP = 'ldap',
EMAIL = 'email',
OIDC = 'oidc',
}
export const N8N_SALES_EMAIL = 'sales@n8n.io';
export const N8N_CONTACT_EMAIL = 'contact@n8n.io';
export const EXPRESSION_EDITOR_PARSER_TIMEOUT = 15_000; // ms
export const KEEP_AUTH_IN_NDV_FOR_NODES = [
HTTP_REQUEST_NODE_TYPE,
HTTP_REQUEST_TOOL_NODE_TYPE,
WEBHOOK_NODE_TYPE,
WAIT_NODE_TYPE,
DISCORD_NODE_TYPE,
CHAT_TRIGGER_NODE_TYPE,
FORM_TRIGGER_NODE_TYPE,
];
export const MAIN_AUTH_FIELD_NAME = 'authentication';
export const NODE_RESOURCE_FIELD_NAME = 'resource';
export const CANVAS_ZOOMED_VIEW_EXPERIMENT = {
name: 'canvas_zoomed_view',
control: 'control',
variant: 'variant',
};
export const NDV_UI_OVERHAUL_EXPERIMENT = {
name: '029_ndv_ui_overhaul',
control: 'control',
variant: 'variant',
};
export const WORKFLOW_BUILDER_EXPERIMENT = {
name: '036_workflow_builder_agent',
control: 'control',
variant: 'variant',
};
export const EXTRA_TEMPLATE_LINKS_EXPERIMENT = {
name: '034_extra_template_links',
control: 'control',
variant: 'variant',
};
export const TEMPLATE_ONBOARDING_EXPERIMENT = {
name: '035_template_onboarding',
control: 'control',
variantStarterPack: 'variant-starter-pack',
variantSuggestedTemplates: 'variant-suggested-templates',
};
export const BATCH_11AUG_EXPERIMENT = {
name: '37_onboarding_experiments_batch_aug11',
control: 'control',
variantReadyToRun: 'variant-ready-to-run-workflows',
variantReadyToRun2: 'variant-ready-to-run-workflows_v2',
variantReadyToRun3: 'variant-ready-to-run-workflows_v3',
};
export const PRE_BUILT_AGENTS_EXPERIMENT = {
name: '038_pre_built_agents',
control: 'control',
variant: 'variant',
};
export const TEMPLATE_RECO_V2 = {
name: '039_template_onboarding_v2',
control: 'control',
variant: 'variant',
};
export const EXPERIMENTS_TO_TRACK = [
WORKFLOW_BUILDER_EXPERIMENT.name,
EXTRA_TEMPLATE_LINKS_EXPERIMENT.name,
TEMPLATE_ONBOARDING_EXPERIMENT.name,
NDV_UI_OVERHAUL_EXPERIMENT.name,
BATCH_11AUG_EXPERIMENT.name,
PRE_BUILT_AGENTS_EXPERIMENT.name,
TEMPLATE_RECO_V2.name,
];
export const MFA_FORM = {
MFA_TOKEN: 'MFA_TOKEN',
MFA_RECOVERY_CODE: 'MFA_RECOVERY_CODE',
} as const;
export const MFA_AUTHENTICATION_REQUIRED_ERROR_CODE = 998;
export const MFA_AUTHENTICATION_CODE_WINDOW_EXPIRED = 997;
export const MFA_AUTHENTICATION_CODE_INPUT_MAX_LENGTH = 6;
export const MFA_AUTHENTICATION_RECOVERY_CODE_INPUT_MAX_LENGTH = 36;
export const NODE_TYPES_EXCLUDED_FROM_OUTPUT_NAME_APPEND = [
FILTER_NODE_TYPE,
SWITCH_NODE_TYPE,
REMOVE_DUPLICATES_NODE_TYPE,
RESPOND_TO_WEBHOOK_NODE_TYPE,
];
type ClearOutgoingConnectonsEvents = {
[nodeName: string]: {
parameterPaths: string[];
eventTypes: string[];
};
};
export const SHOULD_CLEAR_NODE_OUTPUTS: ClearOutgoingConnectonsEvents = {
[SWITCH_NODE_TYPE]: {
parameterPaths: ['parameters.rules.values'],
eventTypes: ['optionsOrderChanged'],
},
};
export const ALLOWED_HTML_ATTRIBUTES = ['href', 'name', 'target', 'title', 'class', 'id', 'style'];
export const ALLOWED_HTML_TAGS = [
'p',
'strong',
'b',
'code',
'a',
'br',
'i',
'ul',
'li',
'em',
'small',
'details',
'summary',
'mark',
];
export const CLOUD_CHANGE_PLAN_PAGE = window.location.host.includes('stage-app.n8n.cloud')
? 'https://stage-app.n8n.cloud/account/change-plan'
: 'https://app.n8n.cloud/account/change-plan';
export const CLOUD_TRIAL_CHECK_INTERVAL = 5000;
// A path that does not exist so that nothing is selected by default
export const nonExistingJsonPath = '_!^&*';
// Ask AI
export const ASK_AI_MAX_PROMPT_LENGTH = 600;
export const ASK_AI_MIN_PROMPT_LENGTH = 15;
export const ASK_AI_LOADING_DURATION_MS = 12000;
export const ASK_AI_SLIDE_OUT_DURATION_MS = 200;
export const APPEND_ATTRIBUTION_DEFAULT_PATH = 'parameters.options.appendAttribution';
export const DRAG_EVENT_DATA_KEY = 'nodesAndConnections';
export const NOT_DUPLICATABLE_NODE_TYPES = [FORM_TRIGGER_NODE_TYPE];
export const UPDATE_WEBHOOK_ID_NODE_TYPES = [FORM_TRIGGER_NODE_TYPE];
export const CREATOR_HUB_URL = 'https://creators.n8n.io/hub';
/**
* Units of time in milliseconds
*/
export const TIME = {
SECOND: 1000,
MINUTE: 60 * 1000,
HOUR: 60 * 60 * 1000,
DAY: 24 * 60 * 60 * 1000,
};
export const THREE_DAYS_IN_MILLIS = 3 * TIME.DAY;
export const SEVEN_DAYS_IN_MILLIS = 7 * TIME.DAY;
export const SIX_MONTHS_IN_MILLIS = 6 * 30 * TIME.DAY;
/**
* Mouse button codes
*/
/**
* Mapping for the MouseEvent.button property that indicates which button was pressed
* on the mouse to trigger the event.
*
* @docs https://www.w3.org/TR/uievents/#dom-mouseevent-button
*/
export const MOUSE_EVENT_BUTTON = {
PRIMARY: 0,
MIDDLE: 1,
SECONDARY: 2,
BROWSER_BACK: 3,
BROWSER_FORWARD: 4,
} as const;
/**
* Mapping for the MouseEvent.buttons property that indicates which buttons are pressed
* on the mouse when a mouse event is triggered. If multiple buttons are pressed,
* the values are added together to produce a new number.
*
* @docs https://www.w3.org/TR/uievents/#dom-mouseevent-buttons
*/
export const MOUSE_EVENT_BUTTONS = {
NONE: 0,
PRIMARY: 1,
SECONDARY: 2,
MIDDLE: 4,
BROWSER_BACK: 8,
BROWSER_FORWARD: 16,
} as const;
/**
* Urls used to route users to the right template repository
*/
export const TEMPLATES_URLS = {
DEFAULT_API_HOST: 'https://api.n8n.io/api/',
BASE_WEBSITE_URL: 'https://n8n.io/workflows/',
UTM_QUERY: {
utm_source: 'n8n_app',
utm_medium: 'template_library',
},
};
export const INSECURE_CONNECTION_WARNING = `
<body style="margin-top: 20px; font-family: 'Open Sans', sans-serif; text-align: center;">
<h1 style="font-size: 40px">&#x1F6AB;</h1>
<h2>Your n8n server is configured to use a secure cookie, <br/>however you are either visiting this via an insecure URL, or using Safari.
</h2>
<br/>
<div style="font-size: 18px; max-width: 640px; text-align: left; margin: 10px auto">
To fix this, please consider the following options:
<ul>
<li>Setup TLS/HTTPS (<strong>recommended</strong>), or</li>
<li>If you are running this locally, and not using Safari, try using <a href="http://localhost:5678">localhost</a> instead</li>
<li>If you prefer to disable this security feature (<strong>not recommended</strong>), set the environment variable <code>N8N_SECURE_COOKIE</code> to <code>false</code></li>
</ul>
</div>
</body>`;
/**
* Injection Keys
*/
export const CanvasKey = 'canvas' as unknown as InjectionKey<CanvasInjectionData>;
export const CanvasNodeKey = 'canvasNode' as unknown as InjectionKey<CanvasNodeInjectionData>;
export const CanvasNodeHandleKey =
'canvasNodeHandle' as unknown as InjectionKey<CanvasNodeHandleInjectionData>;
export const PopOutWindowKey: InjectionKey<Ref<Window | undefined>> = Symbol('PopOutWindow');
export const ExpressionLocalResolveContextSymbol: InjectionKey<
ComputedRef<ExpressionLocalResolveContext | undefined>
> = Symbol('ExpressionLocalResolveContext');
export const APP_MODALS_ELEMENT_ID = 'app-modals';
export const CODEMIRROR_TOOLTIP_CONTAINER_ELEMENT_ID = 'cm-tooltip-container';
export const AI_NODES_PACKAGE_NAME = '@n8n/n8n-nodes-langchain';
export const AI_ASSISTANT_MAX_CONTENT_LENGTH = 100; // in kilobytes
export const RUN_DATA_DEFAULT_PAGE_SIZE = 25;

View File

@@ -1,178 +0,0 @@
import { NodeConnectionTypes } from 'n8n-workflow';
import type { INodeUi } from './Interface';
import type { WorkflowDataCreate } from '@n8n/rest-api-client/api/workflows';
export const SAMPLE_SUBWORKFLOW_TRIGGER_ID = 'c055762a-8fe7-4141-a639-df2372f30060';
export const SAMPLE_SUBWORKFLOW_WORKFLOW: WorkflowDataCreate = {
name: 'My Sub-Workflow',
nodes: [
{
id: SAMPLE_SUBWORKFLOW_TRIGGER_ID,
typeVersion: 1.1,
name: 'When Executed by Another Workflow',
type: 'n8n-nodes-base.executeWorkflowTrigger',
position: [260, 340],
parameters: {},
},
{
id: 'b5942df6-0160-4ef7-965d-57583acdc8aa',
name: 'Replace me with your logic',
type: 'n8n-nodes-base.noOp',
position: [520, 340],
parameters: {},
},
] as INodeUi[],
connections: {
'When Executed by Another Workflow': {
main: [
[
{
node: 'Replace me with your logic',
type: NodeConnectionTypes.Main,
index: 0,
},
],
],
},
},
settings: {
executionOrder: 'v1',
},
pinData: {},
};
export const SAMPLE_EVALUATION_WORKFLOW: WorkflowDataCreate = {
name: 'My Evaluation Sub-Workflow',
nodes: [
{
parameters: {
inputSource: 'passthrough',
},
id: 'c20c82d6-5f71-4fb6-a398-a10a6e6944c5',
name: 'When called by a test run',
type: 'n8n-nodes-base.executeWorkflowTrigger',
typeVersion: 1.1,
position: [80, 440],
},
{
parameters: {},
id: '4e14d09a-2699-4659-9a20-e4f4965f473e',
name: 'Replace me',
type: 'n8n-nodes-base.noOp',
typeVersion: 1,
position: [340, 440],
},
{
parameters: {
metrics: {
assignments: [
{
name: 'latency',
value:
'={{(() => {\n const newExecutionRuns = Object.values($json.newExecution)\n .reduce((acc, node) => {\n acc.push(node.runs.filter(run => run.output.main !== undefined))\n return acc\n }, []).flat()\n\n const latency = newExecutionRuns.reduce((acc, run) => acc + run.executionTime, 0)\n\n return latency\n})()}}',
type: 'number',
id: '1ebc15e9-f079-4d1f-a08d-d4880ea0ddb5',
},
],
},
},
type: 'n8n-nodes-base.evaluationMetrics',
id: '33e2e94a-ec48-4e7b-b750-f56718d5105c',
name: 'Return metric(s)',
typeVersion: 1,
position: [600, 440],
},
{
parameters: {
content:
"### 1. Receive execution data\n\nThis workflow will be passed:\n- The benchmark execution (`$json.originalExecution`)\n- The evaluation execution (`$json.newExecution`) produced by re-running the workflow using trigger data from benchmark execution\n\n\nWe've pinned some example data to get you started",
height: 458,
width: 257,
color: 7,
},
id: '55e5e311-e285-4000-bd1e-900bc3a07da3',
name: 'Sticky Note',
type: 'n8n-nodes-base.stickyNote',
typeVersion: 1,
position: [0, 140],
},
{
parameters: {
content:
'### 2. Evaluation logic\n\nReplace with logic to perform the tests you want to perform.\n\nE.g. compare against benchmark data, use LLMs to evaluate sentiment, compare token usage, and more.',
height: 459,
width: 237,
color: 7,
},
id: 'ea74e341-ff9c-456a-83f0-c10758f0844a',
name: 'Sticky Note1',
type: 'n8n-nodes-base.stickyNote',
typeVersion: 1,
position: [280, 140],
},
{
parameters: {
content:
'### 3. Return metrics\n\nDefine evaluation metrics you want to show on your report.\n\n__Note:__ Metrics need to be numeric',
height: 459,
width: 217,
color: 7,
},
id: '9b3c3408-19e1-43d5-b2bb-29d61bd129b8',
name: 'Sticky Note2',
type: 'n8n-nodes-base.stickyNote',
typeVersion: 1,
position: [540, 140],
},
{
parameters: {
content:
'## Evaluation workflow\nThis workflow is used to define evaluation logic and calculate metrics. You can compare against benchmark executions, use LLMs to evaluate, or write any other logic you choose.',
height: 105,
width: 754,
},
id: '0fc1356e-6238-4557-a920-e50806c1ec13',
name: 'Sticky Note3',
type: 'n8n-nodes-base.stickyNote',
typeVersion: 1,
position: [0, 0],
},
],
connections: {
'When called by a test run': {
main: [
[
{
node: 'Replace me',
type: NodeConnectionTypes.Main,
index: 0,
},
],
],
},
'Replace me': {
main: [
[
{
node: 'Return metric(s)',
type: NodeConnectionTypes.Main,
index: 0,
},
],
],
},
},
pinData: {
'When called by a test run': [
{
json: {
newExecution: {},
originalExecution: {},
},
},
],
},
settings: {
executionOrder: 'v1',
},
};

View File

@@ -1,224 +0,0 @@
import { h } from 'vue';
import { useCloudPlanStore } from '@/stores/cloudPlan.store';
import { useNodeTypesStore } from '@/stores/nodeTypes.store';
import { useRootStore } from '@n8n/stores/useRootStore';
import { useSettingsStore } from '@/stores/settings.store';
import { useSourceControlStore } from '@/stores/sourceControl.store';
import { useUsersStore } from '@/stores/users.store';
import { useExternalHooks } from '@/composables/useExternalHooks';
import { useVersionsStore } from '@/stores/versions.store';
import { useProjectsStore } from '@/stores/projects.store';
import { useRolesStore } from './stores/roles.store';
import { useInsightsStore } from '@/features/insights/insights.store';
import { useToast } from '@/composables/useToast';
import { useI18n } from '@n8n/i18n';
import SourceControlInitializationErrorMessage from '@/components/SourceControlInitializationErrorMessage.vue';
import { useSSOStore } from '@/stores/sso.store';
import { EnterpriseEditionFeature, VIEWS } from '@/constants';
import type { UserManagementAuthenticationMethod } from '@/Interface';
import { useUIStore } from '@/stores/ui.store';
import type { BannerName } from '@n8n/api-types';
import { useNpsSurveyStore } from '@/stores/npsSurvey.store';
import { usePostHog } from '@/stores/posthog.store';
import { useTelemetry } from '@/composables/useTelemetry';
import { useRBACStore } from '@/stores/rbac.store';
import {
registerModuleProjectTabs,
registerModuleResources,
registerModuleModals,
} from '@/moduleInitializer/moduleInitializer';
export const state = {
initialized: false,
};
let authenticatedFeaturesInitialized = false;
/**
* Initializes the core application stores and hooks
* This is called once, when the first route is loaded.
*/
export async function initializeCore() {
if (state.initialized) {
return;
}
const settingsStore = useSettingsStore();
const usersStore = useUsersStore();
const versionsStore = useVersionsStore();
const ssoStore = useSSOStore();
const uiStore = useUIStore();
const toast = useToast();
const i18n = useI18n();
registerAuthenticationHooks();
/**
* Initialize stores
*/
try {
await settingsStore.initialize();
} catch (error) {
toast.showToast({
title: i18n.baseText('startupError'),
message: i18n.baseText('startupError.message'),
type: 'error',
duration: 0,
});
}
ssoStore.initialize({
authenticationMethod: settingsStore.userManagement
.authenticationMethod as UserManagementAuthenticationMethod,
config: settingsStore.settings.sso,
features: {
saml: settingsStore.isEnterpriseFeatureEnabled[EnterpriseEditionFeature.Saml],
ldap: settingsStore.isEnterpriseFeatureEnabled[EnterpriseEditionFeature.Ldap],
oidc: settingsStore.isEnterpriseFeatureEnabled[EnterpriseEditionFeature.Oidc],
},
});
const banners: BannerName[] = [];
if (settingsStore.isEnterpriseFeatureEnabled.showNonProdBanner) {
banners.push('NON_PRODUCTION_LICENSE');
}
if (
!(settingsStore.settings.banners?.dismissed || []).includes('V1') &&
settingsStore.settings.versionCli.startsWith('1.')
) {
banners.push('V1');
}
uiStore.initialize({
banners,
});
versionsStore.initialize(settingsStore.settings.versionNotifications);
void useExternalHooks().run('app.mount');
if (!settingsStore.isPreviewMode) {
await usersStore.initialize({
quota: settingsStore.userManagement.quota,
});
}
state.initialized = true;
}
/**
* Initializes the features of the application that require an authenticated user
*/
export async function initializeAuthenticatedFeatures(
initialized: boolean = authenticatedFeaturesInitialized,
routeName?: string,
) {
if (initialized) {
return;
}
const usersStore = useUsersStore();
if (!usersStore.currentUser) {
return;
}
const i18n = useI18n();
const toast = useToast();
const sourceControlStore = useSourceControlStore();
const settingsStore = useSettingsStore();
const rootStore = useRootStore();
const nodeTypesStore = useNodeTypesStore();
const cloudPlanStore = useCloudPlanStore();
const projectsStore = useProjectsStore();
const rolesStore = useRolesStore();
const insightsStore = useInsightsStore();
const uiStore = useUIStore();
const versionsStore = useVersionsStore();
if (sourceControlStore.isEnterpriseSourceControlEnabled) {
try {
await sourceControlStore.getPreferences();
} catch (e) {
toast.showMessage({
title: i18n.baseText('settings.sourceControl.connection.error'),
message: h(SourceControlInitializationErrorMessage),
type: 'error',
duration: 0,
});
console.error('Failed to initialize source control store', e);
}
}
if (rootStore.defaultLocale !== 'en') {
await nodeTypesStore.getNodeTranslationHeaders();
}
if (settingsStore.isCloudDeployment) {
void cloudPlanStore
.initialize()
.then(() => {
if (cloudPlanStore.userIsTrialing) {
if (cloudPlanStore.trialExpired) {
uiStore.pushBannerToStack('TRIAL_OVER');
} else {
uiStore.pushBannerToStack('TRIAL');
}
} else if (cloudPlanStore.currentUserCloudInfo?.confirmed === false) {
uiStore.pushBannerToStack('EMAIL_CONFIRMATION');
}
})
.catch((error) => {
console.error('Failed to initialize cloud plan store:', error);
});
}
if (insightsStore.isSummaryEnabled) {
void insightsStore.weeklySummary.execute();
}
// Don't check for new versions in preview mode or demo view (ex: executions iframe)
if (!settingsStore.isPreviewMode && routeName !== VIEWS.DEMO) {
void versionsStore.checkForNewVersions();
}
await Promise.all([
projectsStore.getMyProjects(),
projectsStore.getPersonalProject(),
projectsStore.getProjectsCount(),
rolesStore.fetchRoles(),
]);
// Initialize modules
registerModuleResources();
registerModuleProjectTabs();
registerModuleModals();
authenticatedFeaturesInitialized = true;
}
function registerAuthenticationHooks() {
const rootStore = useRootStore();
const usersStore = useUsersStore();
const cloudPlanStore = useCloudPlanStore();
const postHogStore = usePostHog();
const uiStore = useUIStore();
const npsSurveyStore = useNpsSurveyStore();
const telemetry = useTelemetry();
const RBACStore = useRBACStore();
usersStore.registerLoginHook((user) => {
RBACStore.setGlobalScopes(user.globalScopes ?? []);
telemetry.identify(rootStore.instanceId, user.id);
postHogStore.init(user.featureFlags);
npsSurveyStore.setupNpsSurveyOnLogin(user.id, user.settings);
});
usersStore.registerLogoutHook(() => {
uiStore.clearBannerStack();
npsSurveyStore.resetNpsSurveyOnLogOut();
postHogStore.reset();
cloudPlanStore.reset();
telemetry.reset();
RBACStore.setGlobalScopes([]);
});
}

View File

@@ -1,340 +0,0 @@
import { useUsersStore } from '@/stores/users.store';
import { useCloudPlanStore } from '@/stores/cloudPlan.store';
import { useSourceControlStore } from '@/stores/sourceControl.store';
import { useNodeTypesStore } from '@/stores/nodeTypes.store';
import { useRootStore } from '@n8n/stores/useRootStore';
import { state, initializeAuthenticatedFeatures, initializeCore } from '@/init';
import { createTestingPinia } from '@pinia/testing';
import { setActivePinia } from 'pinia';
import { useSettingsStore } from '@/stores/settings.store';
import { useVersionsStore } from '@/stores/versions.store';
import { AxiosError } from 'axios';
import merge from 'lodash/merge';
import { mockedStore, SETTINGS_STORE_DEFAULT_STATE } from '@/__tests__/utils';
import { STORES } from '@n8n/stores';
import { useSSOStore } from '@/stores/sso.store';
import { UserManagementAuthenticationMethod } from '@/Interface';
import type { IUser } from '@n8n/rest-api-client/api/users';
import { EnterpriseEditionFeature } from '@/constants';
import { useUIStore } from '@/stores/ui.store';
import type { Cloud } from '@n8n/rest-api-client';
const showMessage = vi.fn();
const showToast = vi.fn();
vi.mock('@/composables/useToast', () => ({
useToast: () => ({ showMessage, showToast }),
}));
vi.mock('@/stores/users.store', () => ({
useUsersStore: vi.fn().mockReturnValue({
initialize: vi.fn(),
registerLoginHook: vi.fn(),
registerLogoutHook: vi.fn(),
}),
}));
vi.mock('@n8n/stores/useRootStore', () => ({
useRootStore: vi.fn(),
}));
describe('Init', () => {
let settingsStore: ReturnType<typeof useSettingsStore>;
let cloudPlanStore: ReturnType<typeof mockedStore<typeof useCloudPlanStore>>;
let sourceControlStore: ReturnType<typeof useSourceControlStore>;
let usersStore: ReturnType<typeof useUsersStore>;
let nodeTypesStore: ReturnType<typeof useNodeTypesStore>;
let versionsStore: ReturnType<typeof useVersionsStore>;
let ssoStore: ReturnType<typeof useSSOStore>;
let uiStore: ReturnType<typeof useUIStore>;
beforeEach(() => {
setActivePinia(
createTestingPinia({
initialState: {
[STORES.SETTINGS]: merge({}, SETTINGS_STORE_DEFAULT_STATE),
},
}),
);
settingsStore = useSettingsStore();
cloudPlanStore = mockedStore(useCloudPlanStore);
sourceControlStore = useSourceControlStore();
nodeTypesStore = useNodeTypesStore();
usersStore = useUsersStore();
versionsStore = useVersionsStore();
versionsStore = useVersionsStore();
ssoStore = useSSOStore();
uiStore = useUIStore();
});
describe('initializeCore()', () => {
beforeEach(() => {
state.initialized = false;
});
afterEach(() => {
vi.clearAllMocks();
});
it('should initialize core features only once', async () => {
const usersStoreSpy = vi.spyOn(usersStore, 'initialize');
const settingsStoreSpy = vi.spyOn(settingsStore, 'initialize');
await initializeCore();
expect(settingsStoreSpy).toHaveBeenCalled();
expect(usersStoreSpy).toHaveBeenCalled();
await initializeCore();
expect(settingsStoreSpy).toHaveBeenCalledTimes(1);
});
it('should throw an error if settings initialization fails', async () => {
const error = new Error('Settings initialization failed');
vi.spyOn(settingsStore, 'initialize').mockImplementation(() => {
throw error;
});
await initializeCore();
expect(showToast).toHaveBeenCalledWith(
expect.objectContaining({
title: 'Error connecting to n8n',
type: 'error',
}),
);
});
it('should initialize authentication hooks', async () => {
const registerLoginHookSpy = vi.spyOn(usersStore, 'registerLoginHook');
const registerLogoutHookSpy = vi.spyOn(usersStore, 'registerLogoutHook');
await initializeCore();
expect(registerLoginHookSpy).toHaveBeenCalled();
expect(registerLogoutHookSpy).toHaveBeenCalled();
});
it('should initialize ssoStore with settings SSO configuration', async () => {
const saml = { loginEnabled: true, loginLabel: '' };
const ldap = { loginEnabled: false, loginLabel: '' };
const oidc = { loginEnabled: false, loginUrl: '', callbackUrl: '' };
settingsStore.userManagement.authenticationMethod = UserManagementAuthenticationMethod.Saml;
settingsStore.settings.sso = { saml, ldap, oidc };
settingsStore.isEnterpriseFeatureEnabled[EnterpriseEditionFeature.Saml] = true;
await initializeCore();
expect(ssoStore.initialize).toHaveBeenCalledWith({
authenticationMethod: UserManagementAuthenticationMethod.Saml,
config: { saml, ldap, oidc },
features: {
saml: true,
ldap: false,
oidc: false,
},
});
});
it('should initialize uiStore with banners based on settings', async () => {
settingsStore.isEnterpriseFeatureEnabled.showNonProdBanner = true;
settingsStore.settings.banners = { dismissed: [] };
settingsStore.settings.versionCli = '1.2.3';
await initializeCore();
expect(uiStore.initialize).toHaveBeenCalledWith({
banners: ['NON_PRODUCTION_LICENSE', 'V1'],
});
});
});
describe('initializeAuthenticatedFeatures()', () => {
beforeEach(() => {
vi.spyOn(settingsStore, 'isCloudDeployment', 'get').mockReturnValue(true);
vi.spyOn(settingsStore, 'isTemplatesEnabled', 'get').mockReturnValue(true);
vi.spyOn(sourceControlStore, 'isEnterpriseSourceControlEnabled', 'get').mockReturnValue(true);
vi.mocked(useRootStore).mockReturnValue({ defaultLocale: 'es' } as ReturnType<
typeof useRootStore
>);
});
afterEach(() => {
vi.clearAllMocks();
});
it('should not init authenticated features if user is not logged in', async () => {
const cloudStoreSpy = vi.spyOn(cloudPlanStore, 'initialize');
const sourceControlSpy = vi.spyOn(sourceControlStore, 'getPreferences');
const nodeTranslationSpy = vi.spyOn(nodeTypesStore, 'getNodeTranslationHeaders');
const versionsSpy = vi.spyOn(versionsStore, 'checkForNewVersions');
vi.mocked(useUsersStore).mockReturnValue({ currentUser: null } as ReturnType<
typeof useUsersStore
>);
await initializeAuthenticatedFeatures(false);
expect(cloudStoreSpy).not.toHaveBeenCalled();
expect(sourceControlSpy).not.toHaveBeenCalled();
expect(nodeTranslationSpy).not.toHaveBeenCalled();
expect(versionsSpy).not.toHaveBeenCalled();
});
it('should init authenticated features only once if user is logged in', async () => {
const cloudStoreSpy = vi.spyOn(cloudPlanStore, 'initialize').mockResolvedValue();
const sourceControlSpy = vi.spyOn(sourceControlStore, 'getPreferences');
const nodeTranslationSpy = vi.spyOn(nodeTypesStore, 'getNodeTranslationHeaders');
const versionsSpy = vi.spyOn(versionsStore, 'checkForNewVersions');
vi.mocked(useUsersStore).mockReturnValue({ currentUser: { id: '123' } } as ReturnType<
typeof useUsersStore
>);
await initializeAuthenticatedFeatures(false);
expect(cloudStoreSpy).toHaveBeenCalled();
expect(sourceControlSpy).toHaveBeenCalled();
expect(nodeTranslationSpy).toHaveBeenCalled();
expect(versionsSpy).toHaveBeenCalled();
await initializeAuthenticatedFeatures();
expect(cloudStoreSpy).toHaveBeenCalledTimes(1);
});
it('should handle cloud plan initialization error', async () => {
const cloudStoreSpy = vi
.spyOn(cloudPlanStore, 'initialize')
.mockRejectedValue(new AxiosError('Something went wrong', '404'));
const sourceControlSpy = vi.spyOn(sourceControlStore, 'getPreferences');
const nodeTranslationSpy = vi.spyOn(nodeTypesStore, 'getNodeTranslationHeaders');
const versionsSpy = vi.spyOn(versionsStore, 'checkForNewVersions');
vi.mocked(useUsersStore).mockReturnValue({ currentUser: { id: '123' } } as ReturnType<
typeof useUsersStore
>);
await initializeAuthenticatedFeatures(false);
expect(cloudStoreSpy).toHaveBeenCalled();
expect(sourceControlSpy).toHaveBeenCalled();
expect(nodeTranslationSpy).toHaveBeenCalled();
expect(versionsSpy).toHaveBeenCalled();
});
it('should initialize even if cloud requests get stuck', async () => {
const cloudStoreSpy = vi.spyOn(cloudPlanStore, 'initialize').mockImplementation(async () => {
await new Promise((resolve) => setTimeout(resolve, 10000));
});
const sourceControlSpy = vi.spyOn(sourceControlStore, 'getPreferences');
const nodeTranslationSpy = vi.spyOn(nodeTypesStore, 'getNodeTranslationHeaders');
const versionsSpy = vi.spyOn(versionsStore, 'checkForNewVersions');
vi.mocked(useUsersStore).mockReturnValue({ currentUser: { id: '123' } } as ReturnType<
typeof useUsersStore
>);
await initializeAuthenticatedFeatures(false);
expect(cloudStoreSpy).toHaveBeenCalled();
expect(sourceControlSpy).toHaveBeenCalled();
expect(nodeTranslationSpy).toHaveBeenCalled();
expect(versionsSpy).toHaveBeenCalled();
}, 5000);
it('should handle source control initialization error', async () => {
vi.spyOn(cloudPlanStore, 'initialize').mockResolvedValue();
vi.mocked(useUsersStore).mockReturnValue({ currentUser: { id: '123' } } as ReturnType<
typeof useUsersStore
>);
vi.spyOn(sourceControlStore, 'getPreferences').mockRejectedValueOnce(
new AxiosError('Something went wrong', '404'),
);
const consoleSpy = vi.spyOn(window.console, 'error');
await initializeAuthenticatedFeatures(false);
expect(showMessage).toHaveBeenCalled();
expect(consoleSpy).toHaveBeenCalledWith(
'Failed to initialize source control store',
expect.anything(),
);
});
describe('cloudPlanStore', () => {
it('should initialize cloudPlanStore correctly', async () => {
settingsStore.settings.deployment.type = 'cloud';
usersStore.usersById = { '123': { id: '123', email: '' } as IUser };
usersStore.currentUserId = '123';
const cloudStoreSpy = vi.spyOn(cloudPlanStore, 'initialize').mockResolvedValueOnce();
await initializeAuthenticatedFeatures(false);
expect(cloudStoreSpy).toHaveBeenCalled();
});
it('should push TRIAL_OVER banner if trial is expired', async () => {
settingsStore.settings.deployment.type = 'cloud';
usersStore.usersById = { '123': { id: '123', email: '' } as IUser };
usersStore.currentUserId = '123';
cloudPlanStore.userIsTrialing = true;
cloudPlanStore.trialExpired = true;
const cloudStoreSpy = vi.spyOn(cloudPlanStore, 'initialize').mockResolvedValueOnce();
await initializeAuthenticatedFeatures(false);
expect(cloudStoreSpy).toHaveBeenCalled();
expect(uiStore.pushBannerToStack).toHaveBeenCalledWith('TRIAL_OVER');
});
it('should push TRIAL banner if trial is active', async () => {
settingsStore.settings.deployment.type = 'cloud';
usersStore.usersById = { '123': { id: '123', email: '' } as IUser };
usersStore.currentUserId = '123';
cloudPlanStore.userIsTrialing = true;
cloudPlanStore.trialExpired = false;
const cloudStoreSpy = vi.spyOn(cloudPlanStore, 'initialize').mockResolvedValueOnce();
await initializeAuthenticatedFeatures(false);
expect(cloudStoreSpy).toHaveBeenCalled();
expect(uiStore.pushBannerToStack).toHaveBeenCalledWith('TRIAL');
});
it('should push EMAIL_CONFIRMATION banner if user cloud info is not confirmed', async () => {
settingsStore.settings.deployment.type = 'cloud';
usersStore.usersById = { '123': { id: '123', email: '' } as IUser };
usersStore.currentUserId = '123';
cloudPlanStore.userIsTrialing = false;
cloudPlanStore.currentUserCloudInfo = { confirmed: false } as Cloud.UserAccount;
const cloudStoreSpy = vi.spyOn(cloudPlanStore, 'initialize').mockResolvedValueOnce();
await initializeAuthenticatedFeatures(false);
expect(cloudStoreSpy).toHaveBeenCalled();
expect(uiStore.pushBannerToStack).toHaveBeenCalledWith('EMAIL_CONFIRMATION');
});
it('should not push EMAIL_CONFIRMATION banner if user cloud account does not exist', async () => {
settingsStore.settings.deployment.type = 'cloud';
usersStore.usersById = { '123': { id: '123', email: '' } as IUser };
usersStore.currentUserId = '123';
cloudPlanStore.userIsTrialing = false;
cloudPlanStore.currentUserCloudInfo = null;
const cloudStoreSpy = vi.spyOn(cloudPlanStore, 'initialize').mockResolvedValueOnce();
await initializeAuthenticatedFeatures(false);
expect(cloudStoreSpy).toHaveBeenCalled();
expect(uiStore.pushBannerToStack).not.toHaveBeenCalledWith('EMAIL_CONFIRMATION');
});
});
});
});

View File

@@ -1,74 +0,0 @@
import { createApp } from 'vue';
import '@vue-flow/core/dist/style.css';
import '@vue-flow/core/dist/theme-default.css';
import '@vue-flow/controls/dist/style.css';
import '@vue-flow/minimap/dist/style.css';
import '@vue-flow/node-resizer/dist/style.css';
import 'vue-json-pretty/lib/styles.css';
import '@n8n/design-system/css/index.scss';
// import '@n8n/design-system/css/tailwind/index.css';
import './n8n-theme.scss';
import App from '@/App.vue';
import router from './router';
import { i18nInstance } from '@n8n/i18n';
import { TelemetryPlugin } from './plugins/telemetry';
import { GlobalComponentsPlugin } from './plugins/components';
import { GlobalDirectivesPlugin } from './plugins/directives';
import { FontAwesomePlugin } from './plugins/icons';
import { createPinia, PiniaVuePlugin } from 'pinia';
import { ChartJSPlugin } from '@/plugins/chartjs';
import { SentryPlugin } from '@/plugins/sentry';
import { registerModuleRoutes } from '@/moduleInitializer/moduleInitializer';
import type { VueScanOptions } from 'z-vue-scan';
const pinia = createPinia();
const app = createApp(App);
app.use(SentryPlugin);
// Register module routes
// We do this here so landing straight on a module page works
registerModuleRoutes(router);
app.use(TelemetryPlugin);
app.use(PiniaVuePlugin);
app.use(FontAwesomePlugin);
app.use(GlobalComponentsPlugin);
app.use(GlobalDirectivesPlugin);
app.use(pinia);
app.use(router);
app.use(i18nInstance);
app.use(ChartJSPlugin);
if (import.meta.env.VUE_SCAN) {
const { default: VueScan } = await import('z-vue-scan');
app.use<VueScanOptions>(VueScan, {
enable: true,
});
}
app.mount('#app');
if (!import.meta.env.PROD) {
// Make sure that we get all error messages properly displayed
// as long as we are not in production mode
window.onerror = (message, _source, _lineno, _colno, error) => {
// eslint-disable-next-line @typescript-eslint/no-base-to-string
if (message.toString().includes('ResizeObserver')) {
// That error can apparently be ignored and can probably
// not do anything about it anyway
return;
}
console.error('error caught in main.ts');
console.error(message);
console.error(error);
};
}

View File

@@ -1,288 +0,0 @@
@use '@n8n/design-system/css/mixins' as ds-mixins;
@use '@n8n/chat/css';
@use 'styles';
:root {
// Using native css variable enables us to use this value in JS
--header-height: 65;
--content-container-width: 1280px;
}
.clickable {
cursor: pointer !important;
}
.primary-color {
color: var(--color-primary);
}
.text-light {
color: var(--color-text-lighter);
font-weight: var(--font-weight-regular);
}
// Dialog
.el-overlay {
background-color: var(--color-dialog-overlay-background-dark);
}
#app-modals .el-overlay {
position: absolute;
}
.el-dialog {
border: var(--border-base);
box-shadow: 0 6px 16px rgb(68 28 23 / 6%);
border-radius: 8px;
&.classic {
.el-dialog__header {
padding: 15px 20px;
}
.el-dialog__headerbtn {
position: absolute;
top: 0;
right: -50px;
color: var(--color-foreground-xlight);
background-color: var(--color-background-dark);
border-radius: 0 18px 18px 0;
z-index: 110;
font-size: 1.7em;
text-align: center;
line-height: 30px;
height: 50px;
width: 50px;
.el-dialog__close {
color: var(--color-foreground-xlight);
font-weight: var(--font-weight-regular);
}
.el-dialog__close:hover {
transform: scale(1.2);
}
}
.el-dialog__body {
color: var(--color-text-dark);
padding: 0 20px 20px;
}
.el-dialog__title {
color: var(--color-text-dark);
}
}
}
.el-message-box {
background-color: var(--color-background-base);
border: none;
.el-message-box__headerbtn {
.el-message-box__close {
color: var(--color-text-dark);
}
}
.el-message-box__content,
.el-message-box__title {
color: var(--color-text-dark);
}
.el-message-box-icon {
width: var(--spacing-l);
height: var(--spacing-l);
&--warning {
color: var(--color-warning);
}
}
}
// Notification Message
.el-message p {
line-height: 1.5em;
}
// Table
.el-table {
thead th {
color: var(--color-text-base);
background-color: var(--color-background-base);
}
tr {
color: var(--color-text-dark);
td {
border: none;
}
}
.tr {
color: var(--color-text-dark);
}
}
// Tabs
.type-selector:focus,
.el-tabs__header:focus,
.el-tabs__nav-wrap:focus,
.el-tabs__nav-scroll:focus,
.el-tabs__nav:focus {
outline: none;
}
.el-tabs__item.is-active {
font-weight: var(--font-weight-bold);
}
.el-tabs__content {
border: 1px solid var(--color-foreground-base);
border-radius: 0 var(--border-radius-base) var(--border-radius-base);
}
.el-tabs__header {
border-bottom: 0 !important;
}
.el-tabs__nav {
padding: 0;
overflow: hidden;
}
.el-tabs__item {
padding: var(--spacing-5xs) var(--spacing-2xs) !important;
height: auto;
line-height: var(--font-line-height-xloose);
font-weight: var(--font-weight-regular);
font-size: var(--font-size-2xs);
&:not([aria-selected='true']) {
background-color: var(--color-background-base);
border-bottom: 1px solid var(--color-foreground-base) !important;
}
}
// Loading Indicator
.el-loading-mask {
background-color: var(--color-foreground-xlight);
opacity: 0.8;
}
// Pagination
.el-pager li,
.el-pagination .btn-prev,
.el-pagination .btn-next {
background: none;
color: var(--color-text-dark);
}
.el-pagination button:disabled {
background: none;
color: var(--color-text-lighter);
}
.el-pager li.btn-quicknext,
.el-pager li.btn-quickprev {
color: var(--color-text-dark);
}
// Notification
.el-notification {
border-radius: 4px;
border: none;
&.whats-new-notification {
bottom: var(--spacing-xs) !important;
left: var(--spacing-s) !important;
width: 300px;
padding: var(--spacing-xs);
border: var(--border-base);
.el-notification__group {
margin-left: 0;
margin-right: var(--spacing-l);
}
.el-notification__title {
color: var(--color-callout-info-font);
font-family: var(--font-family);
font-size: var(--font-size-s);
font-style: normal;
font-weight: var(--font-weight-bold);
line-height: 1.4;
}
.el-notification__content {
color: var(--color-callout-info-font);
font-family: var(--font-family);
font-size: var(--font-size-s);
font-style: normal;
font-weight: var(--font-weight-regular);
line-height: 1.4;
margin-top: 0;
}
.el-notification__closeBtn {
height: 100%;
top: 0;
right: var(--spacing-xs);
}
}
}
.el-notification__content {
text-align: left;
word-break: break-word;
max-height: 30vh;
overflow-y: auto;
}
.tags-container {
.el-select-tags-wrapper .el-tag {
font-size: 12px;
font-weight: var(--font-weight-regular);
display: flex;
align-items: center;
&.is-closable {
overflow-y: hidden;
}
.el-tag__close {
max-height: 15px;
max-width: 15px;
margin-left: var(--spacing-4xs);
&:hover {
background-color: var(--color-background-light) !important;
}
}
}
}
.add-option {
> * {
border: none;
}
.el-select .el-input.is-disabled {
.el-input__icon {
opacity: 1 !important;
cursor: not-allowed;
color: var(--color-foreground-dark);
}
.el-input__inner,
.el-input__inner::placeholder {
opacity: 1;
color: var(--color-foreground-dark);
}
}
.el-select .el-input:not(.is-disabled) .el-input__icon {
color: var(--color-text-dark);
}
.el-input .el-input__inner {
text-align: center;
}
.el-input:not(.is-disabled) .el-input__inner {
&,
&:hover,
&:focus {
padding-left: 35px;
border-radius: var(--border-radius-base);
color: var(--color-text-dark);
background-color: var(--color-background-base);
border-color: var(--color-foreground-base);
text-align: center;
}
&::placeholder {
color: var(--color-text-dark);
opacity: 1; /** Firefox */
}
}
}

View File

@@ -1,111 +0,0 @@
// Primary Theme Color
$color-primary: var(--color-primary);
// Dialog
$custom-dialog-text-color: var(--color-text-dark);
$custom-dialog-background: var(--color-background-xlight);
$custom-font-black: var(--color-text-dark);
$custom-font-dark: var(--color-text-dark);
$custom-font-light: var(--color-text-light);
$custom-font-very-light: var(--color-text-light);
$custom-expression-text: var(--color-secondary);
$custom-expression-background: var(--color-background-light);
// Badge
$badge-danger-color: var(--color-danger);
$badge-danger-background-color: var(--color-primary-tint-3);
$badge-danger-border-color: var(--color-primary-tint-2);
$badge-warning-background-color: hsla(
var(--color-warning-h),
var(--color-warning-s),
var(--color-warning-l),
0.3
);
$badge-warning-color: hsla(
var(--color-warning-h),
var(--color-warning-s),
var(--color-warning-l),
0.3
);
$badge-warning-color: var(--color-text-dark);
// Warning tooltip
$warning-tooltip-color: var(--color-danger);
// sass variable is used for scss files
$header-height: calc(var(--header-height) * 1px);
// sidebar
$sidebar-width: 65px;
$sidebar-expanded-width: 200px;
$sidebar-inactive-color: var(--color-foreground-xdark);
$sidebar-active-color: var(--color-primary);
// gifts notification
$gift-notification-active-color: var(--color-primary);
$gift-notification-inner-color: var(--color-primary);
$gift-notification-outer-color: var(--color-text-xlight);
// based on element.io breakpoints
$breakpoint-2xs: 600px;
$breakpoint-xs: 768px;
$breakpoint-sm: 992px;
$breakpoint-md: 1200px;
$breakpoint-lg: 1920px;
// tags
$tag-background-color: var(--color-foreground-base);
$tag-text-color: var(--color-text-dark);
$tag-close-background-color: var(--color-text-light);
$tag-close-background-hover-color: var(--color-text-dark);
// Node creator
$node-creator-width: 385px;
$node-creator-text-color: var(--color-text-dark);
$node-creator-select-background-color: var(--color-background-base);
$node-creator-background-color: var(--color-background-xlight);
$node-creator-search-background-color: var(--color-background-xlight);
$node-creator-border-color: var(--color-foreground-base);
$node-creator-item-hover-border-color: var(--color-text-light);
$node-creator-arrow-color: var(--color-text-light);
$node-creator-no-results-background-color: var(--color-background-xlight);
$node-creator-close-button-color: var(--color-text-xlight);
$node-creator-search-clear-color: var(--color-text-xlight);
$node-creator-search-clear-background-color: var(--color-text-light);
$node-creator-search-clear-background-color-hover: var(--color-text-base);
$node-creator-search-placeholder-color: var(--color-text-light);
$node-creator-subcategory-panel-header-bacground-color: var(--color-background-base);
$node-creator-description-color: var(--color-text-base);
// trigger icon
$trigger-icon-border-color: var(--color-text-lighter);
$trigger-icon-background-color: var(--color-background-xlight);
// drawer
$drawer-background-color: var(--color-background-xlight);
// updates-panel
$updates-panel-info-url-color: var(--color-primary);
$updates-panel-border: var(--border-base);
$updates-panel-dark-background-color: var(--color-background-light);
$updates-panel-description-text-color: var(--color-text-base);
$updates-panel-text-color: var(--color-text-dark);
// versions card
$version-card-name-text-color: var(--color-text-base);
$version-card-background-color: var(--color-background-xlight);
$version-card-border: var(--border-base);
$version-card-description-text-color: var(--color-text-base);
$version-card-release-date-text-color: var(--color-foreground-xdark);
$version-card-box-shadow-color: hsla(
var(--color-background-dark-h),
var(--color-background-dark-s),
var(--color-background-dark-l),
0.07
);
// supplemental node types
$supplemental-node-types: ai_chain ai_document ai_embedding ai_languageModel ai_memory
ai_outputParser ai_tool ai_retriever ai_textSplitter ai_vectorRetriever ai_vectorStore;

View File

@@ -1,7 +0,0 @@
import 'array.prototype.tosorted';
import { v4 as uuid } from 'uuid';
// Polyfill crypto.randomUUID
if (!('randomUUID' in crypto)) {
Object.defineProperty(crypto, 'randomUUID', { value: uuid });
}

View File

@@ -1,879 +0,0 @@
import type {
NavigationGuardNext,
RouteLocation,
RouteRecordRaw,
RouteLocationRaw,
RouteLocationNormalized,
} from 'vue-router';
import { createRouter, createWebHistory, isNavigationFailure } from 'vue-router';
import { useExternalHooks } from '@/composables/useExternalHooks';
import { useSettingsStore } from '@/stores/settings.store';
import { useTemplatesStore } from '@/stores/templates.store';
import { useUIStore } from '@/stores/ui.store';
import { useSSOStore } from '@/stores/sso.store';
import { EnterpriseEditionFeature, VIEWS, EDITABLE_CANVAS_VIEWS } from '@/constants';
import { useTelemetry } from '@/composables/useTelemetry';
import { middleware } from '@/utils/rbac/middleware';
import type { RouterMiddleware } from '@/types/router';
import { initializeAuthenticatedFeatures, initializeCore } from '@/init';
import { tryToParseNumber } from '@/utils/typesUtils';
import { projectsRoutes } from '@/routes/projects.routes';
import TestRunDetailView from '@/views/Evaluations.ee/TestRunDetailView.vue';
import { MfaRequiredError } from '@n8n/rest-api-client';
const ChangePasswordView = async () => await import('./views/ChangePasswordView.vue');
const ErrorView = async () => await import('./views/ErrorView.vue');
const EntityNotFound = async () => await import('./views/EntityNotFound.vue');
const EntityUnAuthorised = async () => await import('./views/EntityUnAuthorised.vue');
const ForgotMyPasswordView = async () => await import('./views/ForgotMyPasswordView.vue');
const MainHeader = async () => await import('@/components/MainHeader/MainHeader.vue');
const MainSidebar = async () => await import('@/components/MainSidebar.vue');
const LogsPanel = async () => await import('@/features/logs/components/LogsPanel.vue');
const DemoFooter = async () => await import('@/features/logs/components/DemoFooter.vue');
const NodeView = async () => await import('@/views/NodeView.vue');
const WorkflowExecutionsView = async () => await import('@/views/WorkflowExecutionsView.vue');
const WorkflowExecutionsLandingPage = async () =>
await import('@/components/executions/workflow/WorkflowExecutionsLandingPage.vue');
const WorkflowExecutionsPreview = async () =>
await import('@/components/executions/workflow/WorkflowExecutionsPreview.vue');
const SettingsView = async () => await import('./views/SettingsView.vue');
const SettingsLdapView = async () => await import('./views/SettingsLdapView.vue');
const SettingsPersonalView = async () => await import('./views/SettingsPersonalView.vue');
const SettingsUsersView = async () => await import('./views/SettingsUsersView.vue');
const SettingsCommunityNodesView = async () =>
await import('./views/SettingsCommunityNodesView.vue');
const SettingsApiView = async () => await import('./views/SettingsApiView.vue');
const SettingsLogStreamingView = async () => await import('./views/SettingsLogStreamingView.vue');
const SetupView = async () => await import('./views/SetupView.vue');
const SigninView = async () => await import('./views/SigninView.vue');
const SignupView = async () => await import('./views/SignupView.vue');
const TemplatesCollectionView = async () => await import('@/views/TemplatesCollectionView.vue');
const TemplatesWorkflowView = async () => await import('@/views/TemplatesWorkflowView.vue');
const SetupWorkflowFromTemplateView = async () =>
await import('@/views/SetupWorkflowFromTemplateView/SetupWorkflowFromTemplateView.vue');
const TemplatesSearchView = async () => await import('@/views/TemplatesSearchView.vue');
const VariablesView = async () => await import('@/views/VariablesView.vue');
const SettingsUsageAndPlan = async () => await import('./views/SettingsUsageAndPlan.vue');
const SettingsSso = async () => await import('./views/SettingsSso.vue');
const SignoutView = async () => await import('@/views/SignoutView.vue');
const SamlOnboarding = async () => await import('@/views/SamlOnboarding.vue');
const SettingsSourceControl = async () => await import('./views/SettingsSourceControl.vue');
const SettingsExternalSecrets = async () => await import('./views/SettingsExternalSecrets.vue');
const WorkerView = async () => await import('./views/WorkerView.vue');
const WorkflowHistory = async () => await import('@/views/WorkflowHistory.vue');
const WorkflowOnboardingView = async () => await import('@/views/WorkflowOnboardingView.vue');
const EvaluationsView = async () => await import('@/views/Evaluations.ee/EvaluationsView.vue');
const EvaluationRootView = async () =>
await import('@/views/Evaluations.ee/EvaluationsRootView.vue');
function getTemplatesRedirect(defaultRedirect: VIEWS[keyof VIEWS]): { name: string } | false {
const settingsStore = useSettingsStore();
const isTemplatesEnabled: boolean = settingsStore.isTemplatesEnabled;
if (!isTemplatesEnabled) {
return { name: `${defaultRedirect}` || VIEWS.NOT_FOUND };
}
return false;
}
export const routes: RouteRecordRaw[] = [
{
path: '/',
redirect: '/home/workflows',
meta: {
middleware: ['authenticated'],
},
},
{
path: '/collections/:id',
name: VIEWS.COLLECTION,
components: {
default: TemplatesCollectionView,
sidebar: MainSidebar,
},
meta: {
templatesEnabled: true,
telemetry: {
getProperties(route: RouteLocation) {
const templatesStore = useTemplatesStore();
return {
collection_id: route.params.id,
wf_template_repo_session_id: templatesStore.currentSessionId,
};
},
},
getRedirect: getTemplatesRedirect,
middleware: ['authenticated'],
},
},
// Following two routes are kept in-app:
// Single workflow view, used when a custom template host is set
// Also, reachable directly from this URL
{
path: '/templates/:id',
name: VIEWS.TEMPLATE,
components: {
default: TemplatesWorkflowView,
sidebar: MainSidebar,
},
meta: {
templatesEnabled: true,
getRedirect: getTemplatesRedirect,
telemetry: {
getProperties(route: RouteLocation) {
const templatesStore = useTemplatesStore();
return {
template_id: tryToParseNumber(
Array.isArray(route.params.id) ? route.params.id[0] : route.params.id,
),
wf_template_repo_session_id: templatesStore.currentSessionId,
};
},
},
middleware: ['authenticated'],
},
},
// Template setup view, this is the landing view for website users
{
path: '/templates/:id/setup',
name: VIEWS.TEMPLATE_SETUP,
components: {
default: SetupWorkflowFromTemplateView,
sidebar: MainSidebar,
},
meta: {
templatesEnabled: true,
getRedirect: getTemplatesRedirect,
telemetry: {
getProperties(route: RouteLocation) {
const templatesStore = useTemplatesStore();
return {
template_id: tryToParseNumber(
Array.isArray(route.params.id) ? route.params.id[0] : route.params.id,
),
wf_template_repo_session_id: templatesStore.currentSessionId,
};
},
},
middleware: ['authenticated'],
},
},
{
path: '/templates/',
name: VIEWS.TEMPLATES,
components: {
default: TemplatesSearchView,
sidebar: MainSidebar,
},
meta: {
templatesEnabled: true,
getRedirect: getTemplatesRedirect,
// Templates view remembers it's scroll position on back
scrollOffset: 0,
telemetry: {
getProperties() {
const templatesStore = useTemplatesStore();
return {
wf_template_repo_session_id: templatesStore.currentSessionId,
};
},
},
setScrollPosition(pos: number) {
this.scrollOffset = pos;
},
middleware: ['authenticated'],
},
beforeEnter: (_to, _from, next) => {
const templatesStore = useTemplatesStore();
if (!templatesStore.hasCustomTemplatesHost) {
window.location.href = templatesStore.websiteTemplateRepositoryURL;
} else {
next();
}
},
},
{
path: '/variables',
name: VIEWS.VARIABLES,
components: {
default: VariablesView,
sidebar: MainSidebar,
},
meta: { middleware: ['authenticated'] },
},
{
path: '/workflow/:name/debug/:executionId',
name: VIEWS.EXECUTION_DEBUG,
components: {
default: NodeView,
header: MainHeader,
sidebar: MainSidebar,
footer: LogsPanel,
},
meta: {
nodeView: true,
keepWorkflowAlive: true,
middleware: ['authenticated', 'enterprise'],
middlewareOptions: {
enterprise: {
feature: [EnterpriseEditionFeature.DebugInEditor],
},
},
},
},
{
path: '/workflow/:name/executions',
name: VIEWS.WORKFLOW_EXECUTIONS,
components: {
default: WorkflowExecutionsView,
header: MainHeader,
sidebar: MainSidebar,
},
meta: {
keepWorkflowAlive: true,
middleware: ['authenticated'],
},
children: [
{
path: '',
name: VIEWS.EXECUTION_HOME,
components: {
executionPreview: WorkflowExecutionsLandingPage,
},
meta: {
keepWorkflowAlive: true,
middleware: ['authenticated'],
},
},
{
path: ':executionId/:nodeId?',
name: VIEWS.EXECUTION_PREVIEW,
components: {
executionPreview: WorkflowExecutionsPreview,
},
meta: {
keepWorkflowAlive: true,
middleware: ['authenticated'],
},
},
],
},
{
path: '/workflow/:name/evaluation',
name: VIEWS.EVALUATION,
components: {
default: EvaluationRootView,
header: MainHeader,
sidebar: MainSidebar,
},
props: {
default: true,
},
meta: {
keepWorkflowAlive: true,
middleware: ['authenticated'],
},
children: [
{
path: '',
name: VIEWS.EVALUATION_EDIT,
component: EvaluationsView,
props: true,
},
{
path: 'test-runs/:runId',
name: VIEWS.EVALUATION_RUNS_DETAIL,
component: TestRunDetailView,
props: true,
},
],
},
{
path: '/workflow/:workflowId/history/:versionId?',
name: VIEWS.WORKFLOW_HISTORY,
components: {
default: WorkflowHistory,
sidebar: MainSidebar,
},
meta: {
middleware: ['authenticated', 'enterprise'],
middlewareOptions: {
enterprise: {
feature: [EnterpriseEditionFeature.WorkflowHistory],
},
},
},
},
{
path: '/workflows/templates/:id',
name: VIEWS.TEMPLATE_IMPORT,
components: {
default: NodeView,
header: MainHeader,
sidebar: MainSidebar,
},
meta: {
templatesEnabled: true,
keepWorkflowAlive: true,
getRedirect: getTemplatesRedirect,
middleware: ['authenticated'],
},
},
{
path: '/workflows/onboarding/:id',
name: VIEWS.WORKFLOW_ONBOARDING,
components: {
default: WorkflowOnboardingView,
header: MainHeader,
sidebar: MainSidebar,
},
meta: {
templatesEnabled: true,
keepWorkflowAlive: true,
getRedirect: () => getTemplatesRedirect(VIEWS.NEW_WORKFLOW),
middleware: ['authenticated'],
},
},
{
path: '/workflow/new',
name: VIEWS.NEW_WORKFLOW,
components: {
default: NodeView,
header: MainHeader,
sidebar: MainSidebar,
footer: LogsPanel,
},
meta: {
nodeView: true,
keepWorkflowAlive: true,
middleware: ['authenticated'],
},
},
{
path: '/workflows/demo',
name: VIEWS.DEMO,
components: {
default: NodeView,
footer: DemoFooter,
},
meta: {
middleware: ['authenticated'],
middlewareOptions: {
authenticated: {
bypass: () => {
const settingsStore = useSettingsStore();
return settingsStore.isPreviewMode;
},
},
},
},
},
{
path: '/workflow/:name/:nodeId?',
name: VIEWS.WORKFLOW,
components: {
default: NodeView,
header: MainHeader,
sidebar: MainSidebar,
footer: LogsPanel,
},
meta: {
nodeView: true,
keepWorkflowAlive: true,
middleware: ['authenticated'],
},
},
{
path: '/workflow',
redirect: '/workflow/new',
},
{
path: '/signin',
name: VIEWS.SIGNIN,
components: {
default: SigninView,
},
meta: {
telemetry: {
pageCategory: 'auth',
},
middleware: ['guest'],
},
},
{
path: '/signup',
name: VIEWS.SIGNUP,
components: {
default: SignupView,
},
meta: {
telemetry: {
pageCategory: 'auth',
},
middleware: ['guest'],
},
},
{
path: '/signout',
name: VIEWS.SIGNOUT,
components: {
default: SignoutView,
},
meta: {
telemetry: {
pageCategory: 'auth',
},
middleware: ['authenticated'],
},
},
{
path: '/setup',
name: VIEWS.SETUP,
components: {
default: SetupView,
},
meta: {
middleware: ['defaultUser'],
telemetry: {
pageCategory: 'auth',
},
},
},
{
path: '/forgot-password',
name: VIEWS.FORGOT_PASSWORD,
components: {
default: ForgotMyPasswordView,
},
meta: {
middleware: ['guest'],
telemetry: {
pageCategory: 'auth',
},
},
},
{
path: '/change-password',
name: VIEWS.CHANGE_PASSWORD,
components: {
default: ChangePasswordView,
},
meta: {
middleware: ['guest'],
telemetry: {
pageCategory: 'auth',
},
},
},
{
path: '/settings',
name: VIEWS.SETTINGS,
component: SettingsView,
props: true,
redirect: () => {
const settingsStore = useSettingsStore();
if (settingsStore.settings.hideUsagePage) {
return { name: VIEWS.PERSONAL_SETTINGS };
}
return { name: VIEWS.USAGE };
},
children: [
{
path: 'usage',
name: VIEWS.USAGE,
components: {
settingsView: SettingsUsageAndPlan,
},
meta: {
middleware: ['authenticated', 'custom'],
middlewareOptions: {
custom: () => {
const settingsStore = useSettingsStore();
return !settingsStore.settings.hideUsagePage;
},
},
telemetry: {
pageCategory: 'settings',
getProperties() {
return {
feature: 'usage',
};
},
},
},
},
{
path: 'personal',
name: VIEWS.PERSONAL_SETTINGS,
components: {
settingsView: SettingsPersonalView,
},
meta: {
middleware: ['authenticated'],
telemetry: {
pageCategory: 'settings',
getProperties() {
return {
feature: 'personal',
};
},
},
},
},
{
path: 'users',
name: VIEWS.USERS_SETTINGS,
components: {
settingsView: SettingsUsersView,
},
meta: {
middleware: ['authenticated', 'rbac'],
middlewareOptions: {
rbac: {
scope: ['user:create', 'user:update'],
},
},
telemetry: {
pageCategory: 'settings',
getProperties() {
return {
feature: 'users',
};
},
},
},
},
{
path: 'api',
name: VIEWS.API_SETTINGS,
components: {
settingsView: SettingsApiView,
},
meta: {
middleware: ['authenticated'],
telemetry: {
pageCategory: 'settings',
getProperties() {
return {
feature: 'api',
};
},
},
},
},
{
path: 'environments',
name: VIEWS.SOURCE_CONTROL,
components: {
settingsView: SettingsSourceControl,
},
meta: {
middleware: ['authenticated', 'rbac'],
middlewareOptions: {
rbac: {
scope: 'sourceControl:manage',
},
},
telemetry: {
pageCategory: 'settings',
getProperties() {
return {
feature: 'environments',
};
},
},
},
},
{
path: 'external-secrets',
name: VIEWS.EXTERNAL_SECRETS_SETTINGS,
components: {
settingsView: SettingsExternalSecrets,
},
meta: {
middleware: ['authenticated', 'rbac'],
middlewareOptions: {
rbac: {
scope: ['externalSecretsProvider:list', 'externalSecretsProvider:update'],
},
},
telemetry: {
pageCategory: 'settings',
getProperties() {
return {
feature: 'external-secrets',
};
},
},
},
},
{
path: 'sso',
name: VIEWS.SSO_SETTINGS,
components: {
settingsView: SettingsSso,
},
meta: {
middleware: ['authenticated', 'rbac'],
middlewareOptions: {
rbac: {
scope: 'saml:manage',
},
},
telemetry: {
pageCategory: 'settings',
getProperties() {
return {
feature: 'sso',
};
},
},
},
},
{
path: 'log-streaming',
name: VIEWS.LOG_STREAMING_SETTINGS,
components: {
settingsView: SettingsLogStreamingView,
},
meta: {
middleware: ['authenticated', 'rbac'],
middlewareOptions: {
rbac: {
scope: 'logStreaming:manage',
},
},
telemetry: {
pageCategory: 'settings',
},
},
},
{
path: 'workers',
name: VIEWS.WORKER_VIEW,
components: {
settingsView: WorkerView,
},
meta: {
middleware: ['authenticated'],
},
},
{
path: 'community-nodes',
name: VIEWS.COMMUNITY_NODES,
components: {
settingsView: SettingsCommunityNodesView,
},
meta: {
middleware: ['authenticated', 'rbac', 'custom'],
middlewareOptions: {
rbac: {
scope: ['communityPackage:list', 'communityPackage:update'],
},
custom: () => {
const settingsStore = useSettingsStore();
return settingsStore.isCommunityNodesFeatureEnabled;
},
},
telemetry: {
pageCategory: 'settings',
},
},
},
{
path: 'ldap',
name: VIEWS.LDAP_SETTINGS,
components: {
settingsView: SettingsLdapView,
},
meta: {
middleware: ['authenticated', 'rbac'],
middlewareOptions: {
rbac: {
scope: 'ldap:manage',
},
},
},
},
],
},
{
path: '/saml/onboarding',
name: VIEWS.SAML_ONBOARDING,
components: {
default: SamlOnboarding,
},
meta: {
middleware: ['authenticated', 'custom'],
middlewareOptions: {
custom: () => {
const settingsStore = useSettingsStore();
const ssoStore = useSSOStore();
return ssoStore.isEnterpriseSamlEnabled && !settingsStore.isCloudDeployment;
},
},
telemetry: {
pageCategory: 'auth',
},
},
},
...projectsRoutes,
{
path: '/entity-not-found/:entityType(credential|workflow)',
props: true,
name: VIEWS.ENTITY_NOT_FOUND,
components: {
default: EntityNotFound,
sidebar: MainSidebar,
},
},
{
path: '/entity-not-authorized/:entityType(credential|workflow)',
props: true,
name: VIEWS.ENTITY_UNAUTHORIZED,
components: {
default: EntityUnAuthorised,
sidebar: MainSidebar,
},
},
{
path: '/:pathMatch(.*)*',
name: VIEWS.NOT_FOUND,
component: ErrorView,
props: {
messageKey: 'error.pageNotFound',
errorCode: 404,
redirectTextKey: 'error.goBack',
redirectPage: VIEWS.HOMEPAGE,
},
meta: {
nodeView: true,
telemetry: {
disabled: true,
},
},
},
];
function withCanvasReadOnlyMeta(route: RouteRecordRaw) {
if (!route.meta) {
route.meta = {};
}
route.meta.readOnlyCanvas = !EDITABLE_CANVAS_VIEWS.includes((route?.name ?? '') as VIEWS);
if (route.children) {
route.children = route.children.map(withCanvasReadOnlyMeta);
}
return route;
}
const router = createRouter({
history: createWebHistory(import.meta.env.DEV ? '/' : (window.BASE_PATH ?? '/')),
scrollBehavior(to: RouteLocationNormalized, _, savedPosition) {
// saved position == null means the page is NOT visited from history (back button)
if (savedPosition === null && to.name === VIEWS.TEMPLATES && to.meta?.setScrollPosition) {
// for templates view, reset scroll position in this case
to.meta.setScrollPosition(0);
}
},
routes: routes.map(withCanvasReadOnlyMeta),
});
router.beforeEach(async (to: RouteLocationNormalized, from, next) => {
try {
/**
* Initialize application core
* This step executes before first route is loaded and is required for permission checks
*/
await initializeCore();
// Pass undefined for first param to use default
await initializeAuthenticatedFeatures(undefined, to.name as string);
/**
* Redirect to setup page. User should be redirected to this only once
*/
const settingsStore = useSettingsStore();
if (settingsStore.showSetupPage) {
if (to.name === VIEWS.SETUP) {
return next();
}
return next({ name: VIEWS.SETUP });
}
/**
* Verify user permissions for current route
*/
const routeMiddleware = to.meta?.middleware ?? [];
const routeMiddlewareOptions = to.meta?.middlewareOptions ?? {};
for (const middlewareName of routeMiddleware) {
let nextCalled = false;
const middlewareNext = ((location: RouteLocationRaw): void => {
next(location);
nextCalled = true;
}) as NavigationGuardNext;
const middlewareOptions = routeMiddlewareOptions[middlewareName];
const middlewareFn = middleware[middlewareName] as RouterMiddleware<unknown>;
await middlewareFn(to, from, middlewareNext, middlewareOptions);
if (nextCalled) {
return;
}
}
return next();
} catch (failure) {
const settingsStore = useSettingsStore();
if (failure instanceof MfaRequiredError && settingsStore.isMFAEnforced) {
if (to.name !== VIEWS.PERSONAL_SETTINGS) {
return next({ name: VIEWS.PERSONAL_SETTINGS });
} else {
return next();
}
}
if (isNavigationFailure(failure)) {
console.log(failure);
} else {
console.error(failure);
}
}
});
router.afterEach((to, from) => {
try {
const telemetry = useTelemetry();
const uiStore = useUIStore();
const templatesStore = useTemplatesStore();
/**
* Run external hooks
*/
void useExternalHooks().run('main.routeChange', { from, to });
/**
* Track current view for telemetry
*/
uiStore.currentView = (to.name as string) ?? '';
if (to.meta?.templatesEnabled) {
templatesStore.setSessionId();
} else {
templatesStore.resetSessionId(); // reset telemetry session id when user leaves template pages
}
telemetry.page(to);
} catch (failure) {
if (isNavigationFailure(failure)) {
console.log(failure);
} else {
console.error(failure);
}
}
});
export default router;

View File

@@ -1,142 +0,0 @@
import { createPinia, setActivePinia } from 'pinia';
import { createComponentRenderer } from '@/__tests__/render';
import router from '@/router';
import { VIEWS } from '@/constants';
import { setupServer } from '@/__tests__/server';
import { useSettingsStore } from '@/stores/settings.store';
import { useRBACStore } from '@/stores/rbac.store';
import type { Scope } from '@n8n/permissions';
import type { RouteRecordName } from 'vue-router';
import * as init from '@/init';
const App = {
template: '<div />',
};
const renderComponent = createComponentRenderer(App);
let settingsStore: ReturnType<typeof useSettingsStore>;
describe('router', () => {
let server: ReturnType<typeof setupServer>;
const initializeAuthenticatedFeaturesSpy = vi.spyOn(init, 'initializeAuthenticatedFeatures');
beforeAll(async () => {
server = setupServer();
const pinia = createPinia();
setActivePinia(pinia);
renderComponent({ pinia });
});
beforeEach(() => {
settingsStore = useSettingsStore();
initializeAuthenticatedFeaturesSpy.mockImplementation(async () => await Promise.resolve());
});
afterAll(() => {
server.shutdown();
vi.restoreAllMocks();
});
test.each([
['/', VIEWS.WORKFLOWS],
['/workflows', VIEWS.WORKFLOWS],
['/workflow', VIEWS.NEW_WORKFLOW],
['/workflow/new', VIEWS.NEW_WORKFLOW],
['/workflow/R9JFXwkUCL1jZBuw', VIEWS.WORKFLOW],
['/workflow/R9JFXwkUCL1jZBuw/myNodeId', VIEWS.WORKFLOW],
['/workflow/R9JFXwkUCL1jZBuw/398-1ewq213', VIEWS.WORKFLOW],
['/workflow/R9JFXwkUCL1jZBuw/executions/29021', VIEWS.EXECUTION_PREVIEW],
['/workflows/templates/R9JFXwkUCL1jZBuw', VIEWS.TEMPLATE_IMPORT],
['/workflows/demo', VIEWS.DEMO],
])(
'should resolve %s to %s',
async (path, name) => {
await router.push(path);
expect(initializeAuthenticatedFeaturesSpy).toHaveBeenCalled();
expect(router.currentRoute.value.name).toBe(name);
},
10000,
);
test.each([
['/workflow/R9JFXwkUCL1jZBuw/debug/29021', VIEWS.WORKFLOWS],
['/workflow/8IFYawZ9dKqJu8sT/history', VIEWS.WORKFLOWS],
['/workflow/8IFYawZ9dKqJu8sT/history/6513ed960252b846f3792f0c', VIEWS.WORKFLOWS],
])(
'should redirect %s to %s if user does not have permissions',
async (path, name) => {
await router.push(path);
expect(initializeAuthenticatedFeaturesSpy).toHaveBeenCalled();
expect(router.currentRoute.value.name).toBe(name);
},
10000,
);
test.each([
['/workflow/R9JFXwkUCL1jZBuw/debug/29021', VIEWS.EXECUTION_DEBUG],
['/workflow/8IFYawZ9dKqJu8sT/history', VIEWS.WORKFLOW_HISTORY],
['/workflow/8IFYawZ9dKqJu8sT/history/6513ed960252b846f3792f0c', VIEWS.WORKFLOW_HISTORY],
])(
'should resolve %s to %s if user has permissions',
async (path, name) => {
const settingsStore = useSettingsStore();
settingsStore.settings.enterprise.debugInEditor = true;
settingsStore.settings.enterprise.workflowHistory = true;
await router.push(path);
expect(initializeAuthenticatedFeaturesSpy).toHaveBeenCalled();
expect(router.currentRoute.value.name).toBe(name);
},
10000,
);
test.each<[string, RouteRecordName, Scope[]]>([
['/settings/users', VIEWS.WORKFLOWS, []],
['/settings/users', VIEWS.USERS_SETTINGS, ['user:create', 'user:update']],
['/settings/environments', VIEWS.WORKFLOWS, []],
['/settings/environments', VIEWS.SOURCE_CONTROL, ['sourceControl:manage']],
['/settings/external-secrets', VIEWS.WORKFLOWS, []],
[
'/settings/external-secrets',
VIEWS.EXTERNAL_SECRETS_SETTINGS,
['externalSecretsProvider:list', 'externalSecretsProvider:update'],
],
['/settings/sso', VIEWS.WORKFLOWS, []],
['/settings/sso', VIEWS.SSO_SETTINGS, ['saml:manage']],
['/settings/log-streaming', VIEWS.WORKFLOWS, []],
['/settings/log-streaming', VIEWS.LOG_STREAMING_SETTINGS, ['logStreaming:manage']],
['/settings/community-nodes', VIEWS.WORKFLOWS, []],
[
'/settings/community-nodes',
VIEWS.COMMUNITY_NODES,
['communityPackage:list', 'communityPackage:update'],
],
['/settings/ldap', VIEWS.WORKFLOWS, []],
['/settings/ldap', VIEWS.LDAP_SETTINGS, ['ldap:manage']],
])(
'should resolve %s to %s with %s user permissions',
async (path, name, scopes) => {
const rbacStore = useRBACStore();
settingsStore.settings.communityNodesEnabled = true;
rbacStore.setGlobalScopes(scopes);
await router.push(path);
expect(initializeAuthenticatedFeaturesSpy).toHaveBeenCalled();
expect(router.currentRoute.value.name).toBe(name);
},
10000,
);
test.each([
[VIEWS.PERSONAL_SETTINGS, true],
[VIEWS.USAGE, false],
])('should redirect Settings to %s', async (name, hideUsagePage) => {
settingsStore.settings.hideUsagePage = hideUsagePage;
await router.push('/settings');
expect(router.currentRoute.value.name).toBe(name);
});
});

View File

@@ -1,39 +0,0 @@
/**
* Modules
*/
declare module 'vue-agile';
/**
* File types
*/
declare module '*.json';
declare module '*.svg';
declare module '*.png';
declare module '*.jpg';
declare module '*.jpeg';
declare module '*.gif';
declare module '*.webp';
declare module '*?raw' {
const content: string;
export default content;
}
declare module 'v3-infinite-loading' {
import { Plugin, DefineComponent } from 'vue';
interface InfiniteLoadingProps {
target: string;
}
export interface Events {
infinite: (state: { loaded: () => void; complete: () => void }) => void;
}
const InfiniteLoading: DefineComponent<InfiniteLoadingProps, {}, {}, {}, {}, {}, {}, Events> &
Plugin;
export default InfiniteLoading;
}

View File

@@ -1,53 +0,0 @@
import 'vue-router';
import type { I18nClass } from '@n8n/i18n';
import type { Route, Router, RouteLocation } from 'vue-router';
import type { Telemetry } from '@/plugins/telemetry';
import type { VIEWS } from '@/constants';
import type { IPermissions } from '@/Interface';
import type { MiddlewareOptions, RouterMiddlewareType } from '@/types/router';
export {};
/**
* @docs https://vuejs.org/guide/typescript/options-api.html#augmenting-global-properties
*/
declare module '@vue/runtime-core' {
interface ComponentCustomOptions {
beforeRouteEnter?(to: Route, from: Route, next: () => void): void;
beforeRouteLeave?(to: Route, from: Route, next: () => void): void;
beforeRouteUpdate?(to: Route, from: Route, next: () => void): void;
}
interface ComponentCustomProperties {
$style: Record<string, string>;
$telemetry: Telemetry;
$route: RouteLocation;
$router: Router;
}
}
/**
* @docs https://router.vuejs.org/guide/advanced/meta
*/
declare module 'vue-router' {
interface RouteMeta {
nodeView?: boolean;
templatesEnabled?: boolean;
getRedirect?:
| (() => { name: string } | false)
| ((defaultRedirect: VIEWS[keyof VIEWS]) => { name: string } | false);
permissions?: IPermissions;
middleware?: RouterMiddlewareType[];
middlewareOptions?: Partial<MiddlewareOptions>;
telemetry?: {
disabled?: true;
pageCategory?: string;
getProperties?: (route: RouteLocation) => Record<string, unknown>;
};
scrollOffset?: number;
setScrollPosition?: (position: number) => void;
readOnlyCanvas?: boolean;
}
}

View File

@@ -1,41 +0,0 @@
/// <reference types="vite-plugin-comlink/client" />
import type { VNode, ComponentPublicInstance } from 'vue';
import type { PartialDeep } from 'type-fest';
import type { ExternalHooks } from '@/types/externalHooks';
import type { FrontendSettings } from '@n8n/api-types';
export {};
declare global {
interface ImportMeta {
env: {
DEV: boolean;
PROD: boolean;
NODE_ENV: 'development' | 'production';
VUE_APP_URL_BASE_API: string;
VUE_SCAN: boolean;
};
}
interface Window {
BASE_PATH: string;
REST_ENDPOINT: string;
sentry?: { dsn?: string; environment: string; release: string; serverName?: string };
n8nExternalHooks?: PartialDeep<ExternalHooks>;
preventNodeViewBeforeUnload?: boolean;
maxPinnedDataSize?: number;
}
namespace JSX {
interface Element extends VNode {}
interface ElementClass extends ComponentPublicInstance {}
interface IntrinsicElements {
[elem: string]: any;
}
}
interface Array<T> {
findLast(predicate: (value: T, index: number, obj: T[]) => unknown, thisArg?: any): T;
}
}

View File

@@ -1 +0,0 @@
export default {};

View File

@@ -1,7 +0,0 @@
export type RecursivePartial<T> = {
[P in keyof T]?: T[P] extends Array<infer U>
? Array<RecursivePartial<U>>
: T[P] extends object | undefined
? RecursivePartial<T[P]>
: T[P];
};

View File

@@ -1,112 +0,0 @@
declare module 'vue-virtual-scroller' {
import {
type ObjectEmitsOptions,
type PublicProps,
type SetupContext,
type SlotsType,
type VNode,
} from 'vue';
interface RecycleScrollerProps<T> {
items: readonly T[];
direction?: 'vertical' | 'horizontal';
itemSize?: number | null;
gridItems?: number;
itemSecondarySize?: number;
minItemSize?: number;
sizeField?: string;
typeField?: string;
keyField?: keyof T;
pageMode?: boolean;
prerender?: number;
buffer?: number;
emitUpdate?: boolean;
updateInterval?: number;
listClass?: string;
itemClass?: string;
listTag?: string;
itemTag?: string;
}
interface DynamicScrollerProps<T> extends RecycleScrollerProps<T> {
minItemSize: number;
}
interface RecycleScrollerEmitOptions extends ObjectEmitsOptions {
resize: () => void;
visible: () => void;
hidden: () => void;
update: (
startIndex: number,
endIndex: number,
visibleStartIndex: number,
visibleEndIndex: number,
) => void;
'scroll-start': () => void;
'scroll-end': () => void;
}
interface RecycleScrollerSlotProps<T> {
item: T;
index: number;
active: boolean;
}
interface RecycleScrollerSlots<T> {
default(slotProps: RecycleScrollerSlotProps<T>): unknown;
before(): unknown;
empty(): unknown;
after(): unknown;
}
export interface RecycleScrollerInstance {
getScroll(): { start: number; end: number };
scrollToItem(index: number): void;
scrollToPosition(position: number): void;
}
export const RecycleScroller: <T>(
props: RecycleScrollerProps<T> & PublicProps,
ctx?: SetupContext<RecycleScrollerEmitOptions, SlotsType<RecycleScrollerSlots<T>>>,
expose?: (exposed: RecycleScrollerInstance) => void,
) => VNode & {
__ctx?: {
props: RecycleScrollerProps<T> & PublicProps;
expose(exposed: RecycleScrollerInstance): void;
slots: RecycleScrollerSlots<T>;
};
};
export const DynamicScroller: <T>(
props: DynamicScrollerProps<T> & PublicProps,
ctx?: SetupContext<RecycleScrollerEmitOptions, SlotsType<RecycleScrollerSlots<T>>>,
expose?: (exposed: RecycleScrollerInstance) => void,
) => VNode & {
__ctx?: {
props: DynamicScrollerProps<T> & PublicProps;
expose(exposed: RecycleScrollerInstance): void;
slots: RecycleScrollerSlots<T>;
};
};
interface DynamicScrollerItemProps<T> {
item: T;
active: boolean;
sizeDependencies?: unknown[];
watchData?: boolean;
tag?: string;
emitResize?: boolean;
onResize?: () => void;
}
interface DynamicScrollerItemEmitOptions extends ObjectEmitsOptions {
resize: () => void;
}
export const DynamicScrollerItem: <T>(
props: DynamicScrollerItemProps<T> & PublicProps,
ctx?: SetupContext<DynamicScrollerItemEmitOptions>,
) => VNode;
export function IdState(options?: { idProp?: (value: any) => unknown }): unknown;
}

View File

@@ -1,3 +0,0 @@
import { baseConfig } from '@n8n/stylelint-config/base';
export default baseConfig;

View File

@@ -1,8 +0,0 @@
module.exports = {
content: ['./index.html', './src/**/*.{vue,js,ts}'],
darkMode: ['selector', '[data-theme="dark"]'],
theme: {
extend: {},
},
plugins: [],
};

View File

@@ -1,36 +0,0 @@
{
"extends": "@n8n/typescript-config/tsconfig.frontend.json",
"compilerOptions": {
"baseUrl": ".",
"moduleResolution": "bundler",
"rootDirs": [
".",
"../@n8n/rest-api-client/src",
"../@n8n/composables/src",
"../@n8n/chat/src",
"../@n8n/design-system/src"
],
"outDir": "dist",
"types": [
"vitest/globals",
"unplugin-icons/types/vue",
"../@n8n/design-system/src/shims-modules.d.ts"
],
"paths": {
"@/*": ["./src/*"],
"@n8n/rest-api-client*": ["../@n8n/rest-api-client/src*"],
"@n8n/composables*": ["../@n8n/composables/src*"],
"@n8n/constants*": ["../../@n8n/constants/src*"],
"@n8n/chat*": ["../@n8n/chat/src*"],
"@n8n/design-system*": ["../@n8n/design-system/src*"],
"@n8n/i18n*": ["../@n8n/i18n/src*"],
"@n8n/stores*": ["../@n8n/stores/src*"],
"@n8n/api-types*": ["../../@n8n/api-types/src*"],
"@n8n/utils*": ["../../@n8n/utils/src*"]
},
// TODO: remove all options below this line
"useUnknownInCatchVariables": false
},
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.vue"],
"exclude": ["src/plugins/codemirror/typescript/worker/**/*.d.ts"]
}

View File

@@ -1,183 +0,0 @@
import vue from '@vitejs/plugin-vue';
import { posix as pathPosix, resolve } from 'path';
import { defineConfig, mergeConfig, type UserConfig } from 'vite';
import { viteStaticCopy } from 'vite-plugin-static-copy';
import { nodePolyfills } from 'vite-plugin-node-polyfills';
import svgLoader from 'vite-svg-loader';
import { vitestConfig } from '@n8n/vitest-config/frontend';
import icons from 'unplugin-icons/vite';
import iconsResolver from 'unplugin-icons/resolver';
import components from 'unplugin-vue-components/vite';
import browserslistToEsbuild from 'browserslist-to-esbuild';
import legacy from '@vitejs/plugin-legacy';
import browserslist from 'browserslist';
const publicPath = process.env.VUE_APP_PUBLIC_PATH || '/';
const { NODE_ENV } = process.env;
const browsers = browserslist.loadConfig({ path: process.cwd() });
const packagesDir = resolve(__dirname, '..', '..');
const alias = [
{ find: '@', replacement: resolve(__dirname, 'src') },
{ find: 'stream', replacement: 'stream-browserify' },
{
find: /^@n8n\/chat(.+)$/,
replacement: resolve(packagesDir, 'frontend', '@n8n', 'chat', 'src$1'),
},
{
find: /^@n8n\/api-requests(.+)$/,
replacement: resolve(packagesDir, 'frontend', '@n8n', 'api-requests', 'src$1'),
},
{
find: /^@n8n\/composables(.+)$/,
replacement: resolve(packagesDir, 'frontend', '@n8n', 'composables', 'src$1'),
},
{
find: /^@n8n\/constants(.+)$/,
replacement: resolve(packagesDir, '@n8n', 'constants', 'src$1'),
},
{
find: /^@n8n\/design-system(.+)$/,
replacement: resolve(packagesDir, 'frontend', '@n8n', 'design-system', 'src$1'),
},
{
find: /^@n8n\/i18n(.+)$/,
replacement: resolve(packagesDir, 'frontend', '@n8n', 'i18n', 'src$1'),
},
{
find: /^@n8n\/stores(.+)$/,
replacement: resolve(packagesDir, 'frontend', '@n8n', 'stores', 'src$1'),
},
{
find: /^@n8n\/utils(.+)$/,
replacement: resolve(packagesDir, '@n8n', 'utils', 'src$1'),
},
...['orderBy', 'camelCase', 'cloneDeep', 'startCase'].map((name) => ({
find: new RegExp(`^lodash.${name}$`, 'i'),
replacement: `lodash/${name}`,
})),
{
find: /^lodash\.(.+)$/,
replacement: 'lodash/$1',
},
{
// For sanitize-html
find: 'source-map-js',
replacement: resolve(__dirname, 'src/source-map-js-shim'),
},
];
const plugins: UserConfig['plugins'] = [
icons({
compiler: 'vue3',
autoInstall: true,
}),
components({
dts: './src/components.d.ts',
resolvers: [
(componentName) => {
if (componentName.startsWith('N8n'))
return { name: componentName, from: '@n8n/design-system' };
},
iconsResolver({
prefix: 'Icon',
}),
],
}),
viteStaticCopy({
targets: [
{
src: pathPosix.resolve('node_modules/web-tree-sitter/tree-sitter.wasm'),
dest: resolve(__dirname, 'dist'),
},
{
src: pathPosix.resolve('node_modules/curlconverter/dist/tree-sitter-bash.wasm'),
dest: resolve(__dirname, 'dist'),
},
],
}),
vue(),
svgLoader({
svgoConfig: {
plugins: [
{
name: 'preset-default',
params: {
overrides: {
// disable a default plugin
cleanupIds: false,
// preserve viewBox for scalability
removeViewBox: false,
},
},
},
],
},
}),
legacy({
modernTargets: browsers,
modernPolyfills: true,
renderLegacyChunks: false,
}),
{
name: 'Insert config script',
transformIndexHtml: (html, ctx) => {
const replacement = ctx.server
? '' // Skip when using Vite dev server
: '<script src="/{{BASE_PATH}}/{{REST_ENDPOINT}}/config.js"></script>';
return html.replace('%CONFIG_SCRIPT%', replacement);
},
},
// For sanitize-html
nodePolyfills({
include: ['fs', 'path', 'url', 'util', 'timers'],
}),
];
const { RELEASE: release } = process.env;
const target = browserslistToEsbuild(browsers);
export default mergeConfig(
defineConfig({
define: {
// This causes test to fail but is required for actually running it
// ...(NODE_ENV !== 'test' ? { 'global': 'globalThis' } : {}),
...(NODE_ENV === 'development' ? { 'process.env': {} } : {}),
BASE_PATH: `'${publicPath}'`,
},
plugins,
resolve: { alias },
base: publicPath,
envPrefix: ['VUE', 'N8N_ENV_FEAT'],
css: {
preprocessorOptions: {
scss: {
additionalData: [
'',
'@use "@/n8n-theme-variables.scss" as *;',
'@use "@n8n/design-system/css/mixins" as mixins;',
].join('\n'),
},
},
},
build: {
minify: !!release,
sourcemap: !!release,
target,
},
optimizeDeps: {
esbuildOptions: {
target,
},
},
worker: {
format: 'es',
},
}),
vitestConfig,
);