Bring getRowAriaLabel back to life

Co-Authored-By: tidy-dev <75402236+tidy-dev@users.noreply.github.com>

app/src/ui/lib/list/list-row.tsx

@@ -82,6 +82,14 @@ interface IListRowProps {
 
   /** a custom css class to apply to the row */
   readonly className?: string
+
+  /**
+   * aria label value for screen readers
+   *
+   * Note: you may need to apply an aria-hidden attribute to any child text
+   * elements for this to take precedence.
+   */
+  readonly ariaLabel?: string
 }
 
 export class ListRow extends React.Component<IListRowProps, {}> {
@@ -170,6 +178,7 @@ export class ListRow extends React.Component<IListRowProps, {}> {
         aria-setsize={ariaSetSize}
         aria-posinset={ariaPosInSet}
         aria-selected={selectable ? selected : undefined}
+        aria-label={this.props.ariaLabel}
         className={rowClassName}
         tabIndex={tabIndex}
         ref={this.onRef}

app/src/ui/lib/list/list.tsx

@@ -256,6 +256,15 @@ interface IListProps {
 
   /** The aria-label attribute for the list component. */
   readonly ariaLabel?: string
+
+  /**
+   * Optional callback for providing an aria label for screen readers for each
+   * row.
+   *
+   * Note: you may need to apply an aria-hidden attribute to any child text
+   * elements for this to take precedence.
+   */
+  readonly getRowAriaLabel?: (row: number) => string | undefined
 }
 
 interface IListState {
@@ -947,6 +956,11 @@ export class List extends React.Component<IListProps, IListState> {
 
     const id = this.getRowId(rowIndex)
 
+    const ariaLabel =
+      this.props.getRowAriaLabel !== undefined
+        ? this.props.getRowAriaLabel(rowIndex)
+        : undefined
+
     return (
       <ListRow
         key={params.key}
@@ -956,6 +970,7 @@ export class List extends React.Component<IListProps, IListState> {
         rowIndex={{ section: 0, row: rowIndex }}
         sectionHasHeader={false}
         selected={selected}
+        ariaLabel={ariaLabel}
         onRowClick={this.onRowClick}
         onRowDoubleClick={this.onRowDoubleClick}
         onRowKeyDown={this.onRowKeyDown}