(airflow) branch v3-4-test updated: [v3-4-test] Highlight YAML Dag source in the Code tab (#74633) (#74972)

[rahulvats]

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

vatsrahul1001 pushed a commit to branch v3-4-test
in repository https://gitbox.apache.org/repos/asf/airflow.git


The following commit(s) were added to refs/heads/v3-4-test by this push:
     new 64602ce2af2 [v3-4-test] Highlight YAML Dag source in the Code tab 
(#74633) (#74972)
64602ce2af2 is described below

commit 64602ce2af2b6fcfdc196dcd29d76d635a02f1fc
Author: github-actions[bot] 
<41898282+github-actions[bot]@users.noreply.github.com>
AuthorDate: Sun Oct 18 15:45:21 2026 +0530

    [v3-4-test] Highlight YAML Dag source in the Code tab (#74633) (#74972)
    
    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.
    (cherry picked from commit f6f267d84ce15d2058aff689abc501d74f0e23d3)
    
    Co-authored-by: Pierre Jeambrun <pierrejb...@gmail.com>
---
 .../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 */
+}