Migrate 6 files from JavaScript to TypeScript (#57885)

Author: heiskr

src/fixtures/tests/spotlight-processing.js renamed to src/fixtures/tests/spotlight-processing.ts

@@ -1,7 +1,26 @@
 import { describe, expect, test } from 'vitest'
 
+interface TocItem {
+  title: string
+  intro: string
+  fullPath?: string
+}
+
+interface SpotlightItem {
+  article: string
+  image: string
+}
+
+interface ProcessedSpotlightItem {
+  article: string
+  title: string
+  description: string
+  url: string
+  image: string
+}
+
 // Mock data to simulate tocItems and spotlight configurations
-const mockTocItems = [
+const mockTocItems: TocItem[] = [
   {
     title: 'Test Debug Article',
     intro: 'A test article for debugging functionality.',
@@ -20,19 +39,22 @@ const mockTocItems = [
 ]
 
 // Helper function to simulate the spotlight processing logic from CategoryLanding
-function processSpotlight(spotlight, tocItems) {
-  const findArticleData = (articlePath) => {
-    const cleanPath = articlePath.startsWith('/') ? articlePath.slice(1) : articlePath
+function processSpotlight(
+  spotlight: SpotlightItem[] | undefined,
+  tocItems: TocItem[],
+): ProcessedSpotlightItem[] {
+  const findArticleData = (articlePath: string): TocItem | undefined => {
+    const cleanPath: string = articlePath.startsWith('/') ? articlePath.slice(1) : articlePath
     return tocItems.find(
-      (item) =>
+      (item: TocItem) =>
         item.fullPath?.endsWith(cleanPath) ||
         item.fullPath?.includes(cleanPath.split('/').pop() || ''),
     )
   }
 
   return (
-    spotlight?.map((spotlightItem) => {
-      const articleData = findArticleData(spotlightItem.article)
+    spotlight?.map((spotlightItem: SpotlightItem): ProcessedSpotlightItem => {
+      const articleData: TocItem | undefined = findArticleData(spotlightItem.article)
       return {
         article: spotlightItem.article,
         title: articleData?.title || 'Unknown Article',
@@ -46,7 +68,7 @@ function processSpotlight(spotlight, tocItems) {
 
 describe('spotlight processing logic', () => {
   test('processes spotlight object items correctly', () => {
-    const spotlight = [
+    const spotlight: SpotlightItem[] = [
       {
         article: '/debugging-errors/test-debug-article',
         image: '/assets/images/test-debugging.png',
@@ -57,7 +79,7 @@ describe('spotlight processing logic', () => {
       },
     ]
 
-    const result = processSpotlight(spotlight, mockTocItems)
+    const result: ProcessedSpotlightItem[] = processSpotlight(spotlight, mockTocItems)
 
     expect(result).toHaveLength(2)
     expect(result[0]).toEqual({
@@ -77,7 +99,7 @@ describe('spotlight processing logic', () => {
   })
 
   test('processes multiple spotlight items with different images', () => {
-    const spotlight = [
+    const spotlight: SpotlightItem[] = [
       {
         article: '/debugging-errors/test-debug-article',
         image: '/assets/images/debugging.png',
@@ -92,7 +114,7 @@ describe('spotlight processing logic', () => {
       },
     ]
 
-    const result = processSpotlight(spotlight, mockTocItems)
+    const result: ProcessedSpotlightItem[] = processSpotlight(spotlight, mockTocItems)
 
     expect(result).toHaveLength(3)
     expect(result[0].image).toBe('/assets/images/debugging.png')
@@ -102,21 +124,21 @@ describe('spotlight processing logic', () => {
   })
 
   test('finds articles by filename when full path does not match', () => {
-    const spotlight = [
+    const spotlight: SpotlightItem[] = [
       {
         article: 'test-debug-article',
         image: '/assets/images/debug.png',
       },
     ]
-    const result = processSpotlight(spotlight, mockTocItems)
+    const result: ProcessedSpotlightItem[] = processSpotlight(spotlight, mockTocItems)
 
     expect(result[0].title).toBe('Test Debug Article')
     expect(result[0].url).toBe('/en/category/debugging-errors/test-debug-article')
     expect(result[0].image).toBe('/assets/images/debug.png')
   })
 
   test('handles articles not found in tocItems', () => {
-    const spotlight = [
+    const spotlight: SpotlightItem[] = [
       {
         article: '/completely/nonexistent/path',
         image: '/assets/images/missing1.png',
@@ -127,7 +149,7 @@ describe('spotlight processing logic', () => {
       },
     ]
 
-    const result = processSpotlight(spotlight, mockTocItems)
+    const result: ProcessedSpotlightItem[] = processSpotlight(spotlight, mockTocItems)
 
     expect(result).toHaveLength(2)
     expect(result[0]).toEqual({
@@ -147,13 +169,13 @@ describe('spotlight processing logic', () => {
   })
 
   test('handles empty spotlight array', () => {
-    const spotlight = []
-    const result = processSpotlight(spotlight, mockTocItems)
+    const spotlight: SpotlightItem[] = []
+    const result: ProcessedSpotlightItem[] = processSpotlight(spotlight, mockTocItems)
     expect(result).toEqual([])
   })
 
   test('handles undefined spotlight', () => {
-    const result = processSpotlight(undefined, mockTocItems)
+    const result: ProcessedSpotlightItem[] = processSpotlight(undefined, mockTocItems)
     expect(result).toEqual([])
   })
 })

src/frame/middleware/context/whats-new-changelog.ts

@@ -19,7 +19,7 @@ export default async function whatsNewChangelog(
     const changelogVersions = getApplicableVersions(req.context.page.changelog.versions)
 
     // If the current version is not included, do not display a changelog.
-    if (!changelogVersions.includes(req.context.currentVersion)) {
+    if (!req.context.currentVersion || !changelogVersions.includes(req.context.currentVersion)) {
       return next()
     }
   }

src/learning-track/lib/process-learning-tracks.ts

@@ -82,7 +82,7 @@ export default async function processLearningTracks(
       const trackVersions = getApplicableVersions(track.versions)
 
       // If the current version is not included, do not display the track.
-      if (!trackVersions.includes(context.currentVersion)) {
+      if (!context.currentVersion || !trackVersions.includes(context.currentVersion)) {
         continue
       }
     }

src/products/tests/get-product-groups.js renamed to src/products/tests/get-product-groups.ts

@@ -6,16 +6,33 @@ import {
   getLocalizedGroupNames,
 } from '@/products/lib/get-product-groups'
 
+// Mock data interface for tests - uses required name to match library expectations
+interface MockProductGroupData {
+  name: string
+  octicon?: string
+  children: string[]
+}
+
+// Mock data for testing edge cases with optional fields
+interface PartialProductGroupData {
+  name?: string
+  octicon?: string
+  children: string[]
+}
+
 describe('get-product-groups helper functions', () => {
   describe('createOcticonToNameMap', () => {
     test('creates correct mapping from childGroups', () => {
-      const mockChildGroups = [
+      const mockChildGroups: MockProductGroupData[] = [
         { name: 'Get started', octicon: 'RocketIcon', children: ['get-started'] },
         { name: 'GitHub Copilot', octicon: 'CopilotIcon', children: ['copilot'] },
         { name: 'Security', octicon: 'ShieldLockIcon', children: ['code-security'] },
       ]
 
-      const octiconToName = createOcticonToNameMap(mockChildGroups)
+      // Using any to cast mock data structure to match library's expected ProductGroupData type
+      const octiconToName: { [key: string]: string } = createOcticonToNameMap(
+        mockChildGroups as any,
+      )
 
       expect(octiconToName['RocketIcon']).toBe('Get started')
       expect(octiconToName['CopilotIcon']).toBe('GitHub Copilot')
@@ -24,14 +41,17 @@ describe('get-product-groups helper functions', () => {
     })
 
     test('handles missing octicon or name gracefully', () => {
-      const mockChildGroups = [
+      const mockChildGroups: PartialProductGroupData[] = [
         { name: 'Valid Group', octicon: 'RocketIcon', children: [] },
         { octicon: 'MissingNameIcon', children: [] }, // missing name
         { name: 'Missing Octicon', children: [] }, // missing octicon
         { name: '', octicon: 'EmptyNameIcon', children: [] }, // empty name
       ]
 
-      const octiconToName = createOcticonToNameMap(mockChildGroups)
+      // Using any to test edge cases with partial/missing fields that wouldn't normally pass strict typing
+      const octiconToName: { [key: string]: string } = createOcticonToNameMap(
+        mockChildGroups as any,
+      )
 
       expect(octiconToName['RocketIcon']).toBe('Valid Group')
       expect(octiconToName['MissingNameIcon']).toBeUndefined()
@@ -42,19 +62,23 @@ describe('get-product-groups helper functions', () => {
 
   describe('mapEnglishToLocalizedNames', () => {
     test('maps English names to localized names using octicon as key', () => {
-      const englishGroups = [
+      const englishGroups: MockProductGroupData[] = [
         { name: 'Get started', octicon: 'RocketIcon', children: [] },
         { name: 'Security', octicon: 'ShieldLockIcon', children: [] },
         { name: 'GitHub Copilot', octicon: 'CopilotIcon', children: [] },
       ]
 
-      const localizedByOcticon = {
+      const localizedByOcticon: { [key: string]: string } = {
         RocketIcon: 'Empezar',
         ShieldLockIcon: 'Seguridad',
         CopilotIcon: 'GitHub Copilot', // Some names stay the same
       }
 
-      const nameMap = mapEnglishToLocalizedNames(englishGroups, localizedByOcticon)
+      // Using any to cast mock data structure to match library's expected ProductGroupData type
+      const nameMap: { [key: string]: string } = mapEnglishToLocalizedNames(
+        englishGroups as any,
+        localizedByOcticon,
+      )
 
       expect(nameMap['Get started']).toBe('Empezar')
       expect(nameMap['Security']).toBe('Seguridad')
@@ -63,18 +87,22 @@ describe('get-product-groups helper functions', () => {
     })
 
     test('handles missing translations gracefully', () => {
-      const englishGroups = [
+      const englishGroups: MockProductGroupData[] = [
         { name: 'Get started', octicon: 'RocketIcon', children: [] },
         { name: 'Missing Translation', octicon: 'MissingIcon', children: [] },
         { name: 'No Octicon', children: [] },
       ]
 
-      const localizedByOcticon = {
+      const localizedByOcticon: { [key: string]: string } = {
         RocketIcon: 'Empezar',
         // MissingIcon is not in the localized map
       }
 
-      const nameMap = mapEnglishToLocalizedNames(englishGroups, localizedByOcticon)
+      // Using any to cast mock data structure to match library's expected ProductGroupData type
+      const nameMap: { [key: string]: string } = mapEnglishToLocalizedNames(
+        englishGroups as any,
+        localizedByOcticon,
+      )
 
       expect(nameMap['Get started']).toBe('Empezar')
       expect(nameMap['Missing Translation']).toBeUndefined()
@@ -84,18 +112,22 @@ describe('get-product-groups helper functions', () => {
 
     test('handles different ordering between English and localized groups', () => {
       // English groups in one order
-      const englishGroups = [
+      const englishGroups: MockProductGroupData[] = [
         { name: 'Get started', octicon: 'RocketIcon', children: [] },
         { name: 'Security', octicon: 'ShieldLockIcon', children: [] },
       ]
 
       // Localized groups in different order (but mapped by octicon)
-      const localizedByOcticon = {
+      const localizedByOcticon: { [key: string]: string } = {
         ShieldLockIcon: 'Seguridad', // Security comes first in localized
         RocketIcon: 'Empezar', // Get started comes second
       }
 
-      const nameMap = mapEnglishToLocalizedNames(englishGroups, localizedByOcticon)
+      // Using any to cast mock data structure to match library's expected ProductGroupData type
+      const nameMap: { [key: string]: string } = mapEnglishToLocalizedNames(
+        englishGroups as any,
+        localizedByOcticon,
+      )
 
       // Should correctly map regardless of order
       expect(nameMap['Get started']).toBe('Empezar')
@@ -105,17 +137,20 @@ describe('get-product-groups helper functions', () => {
 
   describe('getLocalizedGroupNames integration', () => {
     test('returns empty object for English language', async () => {
-      const result = await getLocalizedGroupNames('en')
+      const result: { [key: string]: string } = await getLocalizedGroupNames('en')
       expect(result).toEqual({})
     })
 
     test('returns empty object when no translation root available', () => {
       // Test the fallback when translation root is not found
       const lang = 'unknown-lang'
-      const languages = { en: { dir: '/en' }, es: { dir: '/es' } }
+      const languages: { [key: string]: { dir: string } } = {
+        en: { dir: '/en' },
+        es: { dir: '/es' },
+      }
 
-      const translationRoot = languages[lang]?.dir
-      const result = translationRoot
+      const translationRoot: string | undefined = languages[lang]?.dir
+      const result: { [key: string]: string } = translationRoot
         ? {
             /* would proceed */
           }
@@ -126,7 +161,7 @@ describe('get-product-groups helper functions', () => {
 
     test('handles file read errors gracefully', () => {
       // Test the try/catch behavior when file read fails
-      let result
+      let result: { [key: string]: string }
       try {
         // Simulate file read error
         throw new Error('File not found')
@@ -141,28 +176,35 @@ describe('get-product-groups helper functions', () => {
   describe('full translation pipeline', () => {
     test('complete flow from English groups to localized names', () => {
       // Simulate the complete flow
-      const englishChildGroups = [
+      const englishChildGroups: MockProductGroupData[] = [
         { name: 'Get started', octicon: 'RocketIcon', children: ['get-started'] },
         { name: 'Security', octicon: 'ShieldLockIcon', children: ['code-security'] },
         { name: 'GitHub Copilot', octicon: 'CopilotIcon', children: ['copilot'] },
       ]
 
       // Simulate what would come from a Spanish localized file
-      const mockLocalizedChildGroups = [
+      const mockLocalizedChildGroups: MockProductGroupData[] = [
         { name: 'Empezar', octicon: 'RocketIcon', children: ['get-started'] },
         { name: 'Seguridad', octicon: 'ShieldLockIcon', children: ['code-security'] },
         { name: 'GitHub Copilot', octicon: 'CopilotIcon', children: ['copilot'] },
       ]
 
       // Step 1: Create octicon -> localized name mapping
-      const localizedByOcticon = createOcticonToNameMap(mockLocalizedChildGroups)
+      // Using any to cast mock data structure to match library's expected ProductGroupData type
+      const localizedByOcticon: { [key: string]: string } = createOcticonToNameMap(
+        mockLocalizedChildGroups as any,
+      )
 
       // Step 2: Map English names to localized names
-      const localizedNames = mapEnglishToLocalizedNames(englishChildGroups, localizedByOcticon)
+      // Using any to cast mock data structure to match library's expected ProductGroupData type
+      const localizedNames: { [key: string]: string } = mapEnglishToLocalizedNames(
+        englishChildGroups as any,
+        localizedByOcticon,
+      )
 
       // Step 3: Use in final mapping
-      const finalResult = englishChildGroups.map((group) => {
-        const localizedName = localizedNames[group.name] || group.name
+      const finalResult = englishChildGroups.map((group: MockProductGroupData) => {
+        const localizedName: string = localizedNames[group.name] || group.name
         return {
           name: localizedName,
           octicon: group.octicon,

src/secret-scanning/middleware/secret-scanning.ts

@@ -31,7 +31,7 @@ export default async function secretScanning(
   const { currentVersion } = req.context
 
   req.context.secretScanningData = secretScanningData.filter((entry) =>
-    getApplicableVersions(entry.versions).includes(currentVersion),
+    currentVersion ? getApplicableVersions(entry.versions).includes(currentVersion) : false,
   )
 
   // Some entries might use Liquid syntax, so we need