fix(monaco): Do not use CDN version of monaco-editor (fixes #1186)

Author: grgrzybek

app/package.json

@@ -20,6 +20,7 @@
     "css-loader": "^7.1.2",
     "html-webpack-plugin": "^5.6.2",
     "jest": "^29.7.0",
+    "monaco-editor": "^0.52.0",
     "monaco-editor-webpack-plugin": "^7.1.0",
     "style-loader": "^4.0.0",
     "swc-loader": "^0.2.6",

package.json

@@ -47,6 +47,7 @@
     "eslint-plugin-react-hooks": "^5.0.0",
     "eslint-plugin-testing-library": "^6.4.0",
     "prettier": "3.3.3",
+    "typescript": "^5.4.5",
     "typescript-eslint": "^8.11.0"
   },
   "config": {

packages/hawtio/package.json

@@ -37,6 +37,7 @@
     "@hawtio/camel-model-v4_8": "npm:@hawtio/camel-model@~4.8.0",
     "@jolokia.js/simple": "^2.1.7",
     "@module-federation/utilities": "^3.1.16",
+    "@monaco-editor/react": "^4.6.0",
     "@patternfly/react-charts": "~7.3.0",
     "@patternfly/react-code-editor": "~5.3.3",
     "@patternfly/react-core": "~5.3.3",

packages/hawtio/src/plugins/camel/endpoints/SendMessage.tsx

@@ -30,6 +30,10 @@ import { doSendMessage } from './endpoints-service'
 // TODO: Parameterise the version of Camel mode for the exchange headers
 import { headers as exchangeHeaders } from './exchange-headers-camel-model.json'
 
+import { loader } from '@monaco-editor/react'
+
+loader.config({ monaco: monacoEditor })
+
 export const SendMessage: React.FunctionComponent = () => {
   const { selectedNode } = useContext(CamelContext)
   const messageHeaders = useRef<{ name: string; value: string }[]>([])

packages/hawtio/src/plugins/camel/routes/Source.tsx

@@ -8,6 +8,11 @@ import { routesService } from './routes-service'
 import { eventService } from '@hawtiosrc/core'
 import { Alert, AlertActionCloseButton, AlertVariant } from '@patternfly/react-core'
 
+import * as monaco from 'monaco-editor'
+import { loader } from '@monaco-editor/react'
+
+loader.config({ monaco })
+
 export const Source: React.FunctionComponent = () => {
   const { selectedNode } = useContext(CamelContext)
   const [xmlSource, setXmlSource] = useState('')

yarn.lock

@@ -2016,6 +2016,7 @@ __metadata:
     eslint-plugin-react-hooks: "npm:^5.0.0"
     eslint-plugin-testing-library: "npm:^6.4.0"
     prettier: "npm:3.3.3"
+    typescript: "npm:^5.4.5"
     typescript-eslint: "npm:^8.11.0"
   languageName: unknown
   linkType: soft
@@ -2028,6 +2029,7 @@ __metadata:
     "@hawtio/camel-model-v4_8": "npm:@hawtio/camel-model@~4.8.0"
     "@jolokia.js/simple": "npm:^2.1.7"
     "@module-federation/utilities": "npm:^3.1.16"
+    "@monaco-editor/react": "npm:^4.6.0"
     "@patternfly/react-charts": "npm:~7.3.0"
     "@patternfly/react-code-editor": "npm:~5.3.3"
     "@patternfly/react-core": "npm:~5.3.3"
@@ -4742,6 +4744,7 @@ __metadata:
     css-loader: "npm:^7.1.2"
     html-webpack-plugin: "npm:^5.6.2"
     jest: "npm:^29.7.0"
+    monaco-editor: "npm:^0.52.0"
     monaco-editor-webpack-plugin: "npm:^7.1.0"
     react: "npm:^18.3.1"
     react-dom: "npm:^18.3.1"