fix(frontend,workflow): address Copilot review comments on PR #218

- Create-Release..yml: drop misleading ref override on push trigger
  (github.event.workflow_run.head_sha is empty on push events; let
  actions/checkout default to the pushed SHA)
- batchView.tsx: register SQL language for the Light SyntaxHighlighter
  so getFileLanguageAndType()='sql' renders correctly
- modernizationPage.tsx: register SQL language for the Light
  SyntaxHighlighter so translated SQL is highlighted instead of
  potentially erroring on the unregistered language
- processPage.tsx: fix comment typo (missing space before hyphen)
- package.json: declare highlight.js as a direct dependency since the
  Light highlighter imports highlight.js/lib/languages/* directly;
  pinned to ^10.7.3 to match the version already resolved transitively
  via react-syntax-highlighter

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Author: Shreyas-Microsoft

.github/workflows/Create-Release..yml

@@ -15,8 +15,6 @@ jobs:
      steps:
        - name: Checkout
          uses: actions/checkout@v6
-         with:
-           ref: ${{ github.event.workflow_run.head_sha }}
 
        - uses: codfish/semantic-release-action@v5
          id: semantic

src/frontend/package-lock.json

@@ -25,6 +25,7 @@
     "axios": "^1.15.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
+    "highlight.js": "^10.7.3",
     "js-yaml": "^4.1.1",
     "lottie-react": "^2.4.1",
     "lucide-react": "^1.7.0",

src/frontend/package.json

@@ -28,6 +28,7 @@ import { Light as SyntaxHighlighter } from "react-syntax-highlighter"
 import yamlLang from "highlight.js/lib/languages/yaml"
 import markdownLang from "highlight.js/lib/languages/markdown"
 import jsonLang from "highlight.js/lib/languages/json"
+import sqlLang from "highlight.js/lib/languages/sql"
 import { vs } from "react-syntax-highlighter/dist/esm/styles/hljs"
 import ReactMarkdown from "react-markdown"
 import remarkGfm from "remark-gfm"
@@ -45,6 +46,7 @@ const unwrap = (mod: any) => (typeof mod === "function" ? mod : mod.default);
 SyntaxHighlighter.registerLanguage("yaml", unwrap(yamlLang))
 SyntaxHighlighter.registerLanguage("markdown", unwrap(markdownLang))
 SyntaxHighlighter.registerLanguage("json", unwrap(jsonLang))
+SyntaxHighlighter.registerLanguage("sql", unwrap(sqlLang))
 
 
 

src/frontend/src/pages/batchView.tsx

@@ -26,7 +26,11 @@ import {
   ArrowDownload24Regular,
 } from "@fluentui/react-icons"
 import { Light as SyntaxHighlighter } from "react-syntax-highlighter"
+import sqlLang from "highlight.js/lib/languages/sql"
 import { vs } from "react-syntax-highlighter/dist/esm/styles/hljs"
+
+const unwrapHljs = (mod: any) => (typeof mod === "function" ? mod : mod.default);
+SyntaxHighlighter.registerLanguage("sql", unwrapHljs(sqlLang))
 import { useNavigate, useParams } from "react-router-dom"
 import { useState, useEffect, useCallback, useRef } from "react"
 import { getApiUrl, headerBuilder } from '../api/config';

src/frontend/src/pages/modernizationPage.tsx

@@ -132,7 +132,7 @@ const ProcessPage: React.FC = () => {
     details: '',
   });
 
-  // Helper function to clean phase name- removes "PHASE X - " prefix
+  // Helper function to clean phase name - removes "PHASE X - " prefix
   const cleanPhaseName = (phase: string): string => {
     if (!phase) return "";
     // Remove "PHASE X - " prefix (e.g., "PHASE 3 - SOURCE PLATFORM REVIEW" -> "SOURCE PLATFORM REVIEW")