Avoid TypeError in useAnnouncements (#5551)

* Avoid accessing properties of undefined in useAnnouncements * Add changeset
primer · Jan 16, 2025 · c0360db · c0360db
1 parent b8284ce
commit c0360db
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/.changeset/giant-bees-impress.md b/.changeset/giant-bees-impress.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Fix an issue in useAnnouncements.tsx causing a TypeError in production. The activeItem variable may be null.
diff --git a/packages/react/src/FilteredActionList/useAnnouncements.tsx b/packages/react/src/FilteredActionList/useAnnouncements.tsx
@@ -4,6 +4,7 @@
 import {announce} from '@primer/live-region-element'
 import {useEffect, useRef} from 'react'
 import type {FilteredActionListProps} from './FilteredActionListEntry'
+import type {ItemInput} from '../deprecated/ActionList/List'
 
 // we add a delay so that it does not interrupt default screen reader announcement and queues after it
 const delayMs = 500
@@ -28,10 +29,10 @@ const getItemWithActiveDescendant = (
   const optionElements = listElement.querySelectorAll('[role="option"]')
 
   const index = Array.from(optionElements).indexOf(activeItemElement)
-  const activeItem = items[index]
+  const activeItem = items[index] as ItemInput | undefined
 
-  const text = activeItem.text
-  const selected = activeItem.selected
+  const text = activeItem?.text
+  const selected = activeItem?.selected
 
   return {index, text, selected}
 }