Focus the thread panel when clicking on an item in the TAC (#12410)

* Focus the thread panel when clicking on an item in the TAC

actually the 'close' button in the threads panel as it's the only
interactive element: we can improve this later when we use landmarks
& generally have better a11y.

* Undo minor refactoring

as none of it is test3ed, it's not worth it.

* add unit test

* Add matrixchat tests

* Needs awaits

* ts-ignore

* Fix test (I think...)

* Remove unnecessary value set

* Not how assignments work

src/components/views/right_panel/BaseCard.tsx

@@ -35,6 +35,8 @@ interface IProps {
     onKeyDown?(ev: KeyboardEvent): void;
     cardState?: any;
     ref?: Ref<HTMLDivElement>;
+    // Ref for the 'close' button the the card
+    closeButtonRef?: Ref<HTMLDivElement>;
     children: ReactNode;
 }
 
@@ -54,7 +56,21 @@ export const Group: React.FC<IGroupProps> = ({ className, title, children }) =>
 };
 
 const BaseCard: React.FC<IProps> = forwardRef<HTMLDivElement, IProps>(
-    ({ closeLabel, onClose, onBack, className, header, footer, withoutScrollContainer, children, onKeyDown }, ref) => {
+    (
+        {
+            closeLabel,
+            onClose,
+            onBack,
+            className,
+            header,
+            footer,
+            withoutScrollContainer,
+            children,
+            onKeyDown,
+            closeButtonRef,
+        },
+        ref,
+    ) => {
         let backButton;
         const cardHistory = RightPanelStore.instance.roomPhaseHistory;
         if (cardHistory.length > 1) {
@@ -75,6 +91,7 @@ const BaseCard: React.FC<IProps> = forwardRef<HTMLDivElement, IProps>(
                     className="mx_BaseCard_close"
                     onClick={onClose}
                     title={closeLabel || _t("action|close")}
+                    ref={closeButtonRef}
                 />
             );
         }

src/components/views/spaces/threads-activity-centre/ThreadsActivityCentre.tsx

@@ -159,6 +159,7 @@ function ThreadsActivityCentreRow({ room, onClick, notificationLevel }: ThreadsA
                     show_room_tile: true, // make sure the room is visible in the list
                     room_id: room.roomId,
                     metricsTrigger: "WebThreadsActivityCentre",
+                    focusNext: "threadsPanel",
                 });
             }}
             label={room.name}

src/components/views/spaces/threads-activity-centre/ThreadsActivityCentreButton.tsx

@@ -27,7 +27,7 @@ import { notificationLevelToIndicator } from "../../../../utils/notifications";
 
 interface ThreadsActivityCentreButtonProps extends ComponentProps<typeof IconButton> {
     /**
-     * Display the `Treads` label next to the icon.
+     * Display the `Threads` label next to the icon.
      */
     displayLabel?: boolean;
     /**