improve screen reader panel check

bigbluebutton-html5/imports/ui/components/app/component.jsx

@@ -54,8 +54,6 @@ const propTypes = {
   media: PropTypes.element,
   actionsbar: PropTypes.element,
   closedCaption: PropTypes.element,
-  userListIsOpen: PropTypes.bool.isRequired,
-  chatIsOpen: PropTypes.bool.isRequired,
   locale: PropTypes.string,
   intl: intlShape.isRequired,
 };
@@ -81,6 +79,7 @@ class App extends Component {
     };
 
     this.handleWindowResize = throttle(this.handleWindowResize).bind(this);
+    this.enableSRTrap = this.enableSRTrap.bind(this);
   }
 
   componentDidMount() {
@@ -128,6 +127,11 @@ class App extends Component {
     this.setState({ enableResize: shouldEnableResize });
   }
 
+  enableSRTrap() {
+    const { openPanel, isPhone } = this.props;
+    return openPanel !== '' && (isPhone || isLayeredView.matches);
+  }
+
   renderPanel() {
     const { enableResize } = this.state;
     const { openPanel } = this.props;
@@ -182,30 +186,15 @@ class App extends Component {
     const {
       media,
       intl,
-      chatIsOpen,
-      userListIsOpen,
-      isPhone,
-      breakoutRoomIsOpen,
-      pollIsOpen,
-      waitingUsersIsOpen,
-      notesIsOpen,
     } = this.props;
 
-    const enableScreenReaderTrap = (isPhone || isLayeredView.matches)
-      && (userListIsOpen
-          || chatIsOpen
-          || breakoutRoomIsOpen
-          || pollIsOpen
-          || notesIsOpen
-          || waitingUsersIsOpen);
-
     if (!media) return null;
 
     return (
       <section
         className={styles.media}
         aria-label={intl.formatMessage(intlMessages.mediaLabel)}
-        aria-hidden={enableScreenReaderTrap}
+        aria-hidden={this.enableSRTrap()}
       >
         {media}
         {this.renderClosedCaption()}
@@ -217,30 +206,15 @@ class App extends Component {
     const {
       actionsbar,
       intl,
-      userListIsOpen,
-      chatIsOpen,
-      isPhone,
-      breakoutRoomIsOpen,
-      pollIsOpen,
-      notesIsOpen,
-      waitingUsersIsOpen,
     } = this.props;
 
-    const enableScreenReaderTrap = (isPhone || isLayeredView.matches)
-    && (userListIsOpen
-        || chatIsOpen
-        || breakoutRoomIsOpen
-        || pollIsOpen
-        || notesIsOpen
-        || waitingUsersIsOpen);
-
     if (!actionsbar) return null;
 
     return (
       <section
         className={styles.actionsbar}
         aria-label={intl.formatMessage(intlMessages.actionsBarLabel)}
-        aria-hidden={enableScreenReaderTrap}
+        aria-hidden={this.enableSRTrap()}
       >
         {actionsbar}
       </section>

bigbluebutton-html5/imports/ui/components/app/container.jsx

@@ -95,13 +95,7 @@ export default injectIntl(withModalMounter(withTracker(({ intl, baseControls })
     hasBreakoutRooms: getBreakoutRooms().length > 0,
     customStyle: getFromUserSettings('customStyle', false),
     customStyleUrl: getFromUserSettings('customStyleUrl', false),
-    breakoutRoomIsOpen: Session.equals('openPanel', 'breakoutroom'),
-    pollIsOpen: Session.equals('openPanel', 'poll'),
-    notesIsOpen: Session.equals('openPanel', 'note'),
-    waitingUsersIsOpen: Session.equals('openPanel', 'waitingUsersPanel'),
-    chatIsOpen: Session.equals('openPanel', 'chat'),
     openPanel: Session.get('openPanel'),
-    userListIsOpen: !Session.equals('openPanel', ''),
     UserInfo,
     notify,
     validIOSVersion,