Enable some oxlint a11y rules & improve keyboard accessibility (#34291)

* Conform to oxlint rule jsx-a11y/role-has-required-aria-props

* Conform to oxlint rule jsx-a11y/role-supports-aria-props

* Conform to oxlint rule jsx-a11y/interactive-supports-focus

* Conform to oxlint rule jsx-a11y/click-events-have-key-events

* Update snapshots

packages/shared-components/src/room-list/RoomListPrimaryFilters/RoomListPrimaryFilters.tsx

@@ -104,6 +104,8 @@ export const RoomListPrimaryFilters = memo(function RoomListPrimaryFilters({
                     <ChatFilter
                         key={`${filterId}-${index}`}
                         role="option"
+                        tabIndex={0}
+                        aria-selected={filterId === activeFilterId}
                         selected={filterId === activeFilterId}
                         onClick={() => onToggleFilter(filterId)}
                     >

packages/shared-components/src/room/timeline/event-tile/actions/ActionBarView/ActionBarView.tsx

@@ -376,6 +376,8 @@ export function ActionBarView({ vm, className }: Readonly<ActionBarViewProps>):
     return (
         <RovingTabIndexProvider key={rovingProviderKey} handleLeftRight handleHomeEnd handleLoop>
             {({ onKeyDownHandler }) => (
+                // This may be wrong but seems to work, this is a roving-toolbar, so the focus follows one of the children
+                // oxlint-disable-next-line jsx-a11y/interactive-supports-focus
                 <Flex
                     display="inline-flex"
                     direction="row"