(airflow) branch main updated: Highlight YAML Dag source in the Code tab (#74633)

[pierrejeambrun]

This is an automated email from the ASF dual-hosted git repository.

pierrejeambrun pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/airflow.git


The following commit(s) were added to refs/heads/main by this push:
     new f6f267d84ce Highlight YAML Dag source in the Code tab (#74633)
f6f267d84ce is described below

commit f6f267d84ce15d2058aff689abc501d74f0e23d3
Author: Pierre Jeambrun <pierrejb...@gmail.com>
AuthorDate: Tue Oct 13 14:44:18 2026 +0200

    Highlight YAML Dag source in the Code tab (#74633)
    
    The AIP-85 YAML importer (#74586) stores its Dag source with language
    "yaml", but the Code tab's Monaco setup only registers the Python,
    TypeScript, Java and Go grammars, so YAML Dags rendered as plain text.
    Register Monaco's YAML grammar the same way as the others.
---
 .../ui/src/components/MonacoEditor/configureMonaco.test.ts        | 1 +
 .../src/airflow/ui/src/components/MonacoEditor/configureMonaco.ts | 8 ++++++++
 airflow-core/src/airflow/ui/src/vite-env.d.ts                     | 7 +++++++
 3 files changed, 16 insertions(+)

diff --git 
a/airflow-core/src/airflow/ui/src/components/MonacoEditor/configureMonaco.test.ts
 
b/airflow-core/src/airflow/ui/src/components/MonacoEditor/configureMonaco.test.ts
index 4cadda79749..a9816858ae0 100644
--- 
a/airflow-core/src/airflow/ui/src/components/MonacoEditor/configureMonaco.test.ts
+++ 
b/airflow-core/src/airflow/ui/src/components/MonacoEditor/configureMonaco.test.ts
@@ -27,6 +27,7 @@ const grammars = [
   { id: "java", load: () => 
import("monaco-editor/languages/definitions/java/java") },
   { id: "python", load: () => 
import("monaco-editor/languages/definitions/python/python") },
   { id: "typescript", load: () => 
import("monaco-editor/languages/definitions/typescript/typescript") },
+  { id: "yaml", load: () => 
import("monaco-editor/languages/definitions/yaml/yaml") },
 ] as const;
 
 describe("Monaco Dag-code grammars", () => {
diff --git 
a/airflow-core/src/airflow/ui/src/components/MonacoEditor/configureMonaco.ts 
b/airflow-core/src/airflow/ui/src/components/MonacoEditor/configureMonaco.ts
index ee574c0ca0a..bfc28915c69 100644
--- a/airflow-core/src/airflow/ui/src/components/MonacoEditor/configureMonaco.ts
+++ b/airflow-core/src/airflow/ui/src/components/MonacoEditor/configureMonaco.ts
@@ -69,6 +69,7 @@ const loadMonacoModules = async () => {
   const typescriptGrammar = 
import("monaco-editor/languages/definitions/typescript/typescript");
   const javaGrammar = import("monaco-editor/languages/definitions/java/java");
   const goGrammar = import("monaco-editor/languages/definitions/go/go");
+  const yamlGrammar = import("monaco-editor/languages/definitions/yaml/yaml");
 
   const [
     monaco,
@@ -77,6 +78,7 @@ const loadMonacoModules = async () => {
     { conf: typescriptConf, language: typescriptLanguage },
     { conf: javaConf, language: javaLanguage },
     { conf: goConf, language: goLanguage },
+    { conf: yamlConf, language: yamlLanguage },
   ] = await Promise.all([
     monacoApi,
     workerUrls,
@@ -84,6 +86,7 @@ const loadMonacoModules = async () => {
     typescriptGrammar,
     javaGrammar,
     goGrammar,
+    yamlGrammar,
     jsonContribution,
   ]);
 
@@ -99,6 +102,8 @@ const loadMonacoModules = async () => {
     pythonLanguage,
     typescriptConf,
     typescriptLanguage,
+    yamlConf,
+    yamlLanguage,
   };
 };
 
@@ -129,6 +134,8 @@ export const configureMonaco = () => {
         pythonLanguage,
         typescriptConf,
         typescriptLanguage,
+        yamlConf,
+        yamlLanguage,
       }) => {
         Reflect.set(globalThis, "MonacoEnvironment", {
           getWorker: (_moduleId: string, label: string) =>
@@ -147,6 +154,7 @@ export const configureMonaco = () => {
           { conf: typescriptConf, id: "typescript", language: 
typescriptLanguage },
           { conf: javaConf, id: "java", language: javaLanguage },
           { conf: goConf, id: "go", language: goLanguage },
+          { conf: yamlConf, id: "yaml", language: yamlLanguage },
         ] as const;
 
         for (const grammar of grammars) {
diff --git a/airflow-core/src/airflow/ui/src/vite-env.d.ts 
b/airflow-core/src/airflow/ui/src/vite-env.d.ts
index cc1756f032a..5b70be41e1c 100644
--- a/airflow-core/src/airflow/ui/src/vite-env.d.ts
+++ b/airflow-core/src/airflow/ui/src/vite-env.d.ts
@@ -56,3 +56,10 @@ declare module "monaco-editor/languages/definitions/go/go" {
   export const language: import("monaco-editor").languages.IMonarchLanguage;
   /* eslint-enable @typescript-eslint/consistent-type-imports */
 }
+
+declare module "monaco-editor/languages/definitions/yaml/yaml" {
+  /* eslint-disable @typescript-eslint/consistent-type-imports */
+  export const conf: import("monaco-editor").languages.LanguageConfiguration;
+  export const language: import("monaco-editor").languages.IMonarchLanguage;
+  /* eslint-enable @typescript-eslint/consistent-type-imports */
+}