Make the encryption lock tooltip accessible via the keyboard

2023-11-20 18:59:56 -05:00
parent aa8ef57ee0
commit fcfb818a27
1 changed files with 6 additions and 0 deletions
--- a/src/room/EncryptionLock.tsx
+++ b/src/room/EncryptionLock.tsx
@@ -40,6 +40,12 @@ export const EncryptionLock: FC<Props> = ({ encrypted }) => {
        height={16}
        className={styles.lock}
        data-encrypted={encrypted}
+        // Make the icon focusable so that the tooltip can be opened
+        // with keyboard navigation
+        // TODO: Replace this with the solution from
+        // https://github.com/vector-im/compound-web/pull/130 once it
+        // lands
+        tabIndex={0}
      />
    </Tooltip>
  );