From 92fa6233d32381c22310bff1ab69e3fb6a86d251 Mon Sep 17 00:00:00 2001
From: Alex Grozav <alex@grozav.com>
Date: Wed, 6 Dec 2023 17:28:33 +0200
Subject: [PATCH] fix: Run dev command only for core packages (no-changelog)
 (#7928)

## Summary
Provide details about your pull request and what it adds, fixes, or
changes. Photos and videos are recommended.

- Filters out `@n8n/chat` and `n8n-design-system` from `pnpm run dev`
- Fixes dev/build error appearing due to code string `import ... from
'@n8n/chat'`

#### How to test the change:
1. `pnpm run dev` should work as expected
2. The command should not run for the two packages above
3. The error regarding `@n8n/chat` should no longer appear


## Issues fixed
Include links to Github issue or Community forum post or **Linear
ticket**:
> Important in order to close automatically and provide context to
reviewers


https://linear.app/n8n/issue/PAY-1089/run-dev-command-only-for-core-packages


## Review / Merge checklist
- [x] PR title and summary are descriptive. **Remember, the title
automatically goes into the changelog. Use `(no-changelog)` otherwise.**
([conventions](https://github.com/n8n-io/n8n/blob/master/.github/pull_request_title_conventions.md))
- [x] [Docs updated](https://github.com/n8n-io/n8n-docs) or follow-up
ticket created.
- [x] Tests included. N/A
> A bug is not considered fixed, unless a test is added to prevent it
from happening again. A feature is not complete without tests.
  >
> *(internal)* You can use Slack commands to trigger [e2e
tests](https://www.notion.so/n8n/How-to-use-Test-Instances-d65f49dfc51f441ea44367fb6f67eb0a?pvs=4#a39f9e5ba64a48b58a71d81c837e8227)
or [deploy test
instance](https://www.notion.so/n8n/How-to-use-Test-Instances-d65f49dfc51f441ea44367fb6f67eb0a?pvs=4#f6a177d32bde4b57ae2da0b8e454bfce)
or [deploy early access version on
Cloud](https://www.notion.so/n8n/Cloudbot-3dbe779836004972b7057bc989526998?pvs=4#fef2d36ab02247e1a0f65a74f6fb534e).
---
 package.json                                         |  2 +-
 packages/@n8n/chat/package.json                      |  2 +-
 packages/design-system/package.json                  |  1 +
 packages/editor-ui/src/components/ChatEmbedModal.vue | 11 ++++++-----
 turbo.json                                           |  8 ++++++--
 5 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/package.json b/package.json
index a9af524f36..be029c3585 100644
--- a/package.json
+++ b/package.json
@@ -14,7 +14,7 @@
     "build:backend": "pnpm --filter=!@n8n/chat --filter=!n8n-design-system --filter=!n8n-editor-ui build",
     "build:frontend": "pnpm --filter=@n8n/chat --filter=n8n-design-system --filter=n8n-editor-ui build",
     "typecheck": "turbo run typecheck",
-    "dev": "turbo run dev --parallel",
+    "dev": "turbo run dev --parallel --filter=!n8n-design-system --filter=!@n8n/chat",
     "dev:ai": "turbo run dev --parallel --filter=@n8n/nodes-langchain --filter=n8n --filter=n8n-core",
     "clean": "turbo run clean --parallel",
     "format": "turbo run format && node scripts/format.mjs",
diff --git a/packages/@n8n/chat/package.json b/packages/@n8n/chat/package.json
index 4dd311b927..d8493b1702 100644
--- a/packages/@n8n/chat/package.json
+++ b/packages/@n8n/chat/package.json
@@ -2,7 +2,7 @@
   "name": "@n8n/chat",
   "version": "0.2.0",
   "scripts": {
-    "dev": "npm run storybook",
+    "dev": "pnpm run storybook",
     "build": "run-p type-check build:vite && npm run build:prepare",
     "build:vite": "vite build && npm run build:vite:full",
     "build:vite:full": "INCLUDE_VUE=true vite build",
diff --git a/packages/design-system/package.json b/packages/design-system/package.json
index 77f4134ffb..16624391f1 100644
--- a/packages/design-system/package.json
+++ b/packages/design-system/package.json
@@ -14,6 +14,7 @@
     "url": "git+https://github.com/n8n-io/n8n.git"
   },
   "scripts": {
+    "dev": "pnpm run storybook",
     "clean": "rimraf dist .turbo",
     "build": "vite build",
     "typecheck": "vue-tsc --declaration --emitDeclarationOnly",
diff --git a/packages/editor-ui/src/components/ChatEmbedModal.vue b/packages/editor-ui/src/components/ChatEmbedModal.vue
index f4538f9cdd..0304acb11d 100644
--- a/packages/editor-ui/src/components/ChatEmbedModal.vue
+++ b/packages/editor-ui/src/components/ChatEmbedModal.vue
@@ -57,9 +57,10 @@ function indentLines(code: string, indent: string = '	') {
 		.join('\n');
 }
 
+const importCode = 'import';
 const commonCode = computed(() => ({
-	import: `import '@n8n/chat/style.css';
-import { createChat } from '@n8n/chat';`,
+	import: `${importCode} '@n8n/chat/style.css';
+${importCode} { createChat } from '@n8n/chat';`,
 	createChat: `createChat({
 	webhookUrl: '${webhookUrl.value}'
 });`,
@@ -69,7 +70,7 @@ import { createChat } from '@n8n/chat';`,
 const cdnCode = computed(
 	() => `<link href="https://cdn.jsdelivr.net/npm/@n8n/chat/style.css" rel="stylesheet" />
 <script type="module">
-import { createChat } from 'https://cdn.jsdelivr.net/npm/@n8n/chat/chat.bundle.es.js';
+${importCode} { createChat } from 'https://cdn.jsdelivr.net/npm/@n8n/chat/chat.bundle.es.js';
 
 ${commonCode.value.createChat}
 </${'script'}>`,
@@ -77,7 +78,7 @@ ${commonCode.value.createChat}
 
 const vueCode = computed(
 	() => `<script lang="ts" setup>
-import { onMounted } from 'vue';
+${importCode} { onMounted } from 'vue';
 ${commonCode.value.import}
 
 onMounted(() => {
@@ -87,7 +88,7 @@ ${indentLines(commonCode.value.createChat)}
 );
 
 const reactCode = computed(
-	() => `import { useEffect } from 'react';
+	() => `${importCode} { useEffect } from 'react';
 ${commonCode.value.import}
 
 export const App = () => {
diff --git a/turbo.json b/turbo.json
index 9155075d9a..f0b0521623 100644
--- a/turbo.json
+++ b/turbo.json
@@ -13,9 +13,13 @@
 		"lint": {},
 		"lintfix": {},
 		"test": {},
-		"watch": {},
+		"watch": {
+			"cache": false,
+			"persistent": true
+		},
 		"dev": {
-			"cache": false
+			"cache": false,
+			"persistent": true
 		}
 	}
 }