fix: connection status button subscribing to data of all users

bigbluebutton-html5/imports/ui/components/connection-status/button/component.jsx

@@ -1,7 +1,7 @@
 import React, { PureComponent } from 'react';
 import { defineMessages, injectIntl } from 'react-intl';
 import Button from '/imports/ui/components/common/button/component';
-import ConnectionStatusModalComponent from '/imports/ui/components/connection-status/modal/component';
+import ConnectionStatusModalComponent from '/imports/ui/components/connection-status/modal/container';
 import ConnectionStatusService from '/imports/ui/components/connection-status/service';
 import Icon from '/imports/ui/components/connection-status/icon/component';
 import Styled from './styles';
@@ -40,17 +40,12 @@ class ConnectionStatusButton extends PureComponent {
   setModalIsOpen = (isOpen) => this.setState({ isModalOpen: isOpen }); 
 
   renderModal(isModalOpen) {
-    const {
-      connectionData,
-    } = this.props;
-
     return (
       isModalOpen ?
       <ConnectionStatusModalComponent
         {...{
           isModalOpen,
           setModalIsOpen: this.setModalIsOpen,
-          connectionData,
         }}
       /> : null
     )
@@ -85,17 +80,11 @@ class ConnectionStatusButton extends PureComponent {
     }
 
     const {
-      connectionData,
+      myCurrentStatus,
     } = this.props;
 
-    const ownConnectionData = connectionData.filter((curr) => curr.user.userId === Auth.userID);
-
-    const currentStatus = ownConnectionData && ownConnectionData.length > 0
-      ? ownConnectionData[0].currentStatus
-      : 'normal';
-
     let color;
-    switch (currentStatus) {
+    switch (myCurrentStatus) {
       case 'warning':
         color = 'success';
         break;
@@ -114,7 +103,7 @@ class ConnectionStatusButton extends PureComponent {
     return (
       <Styled.ButtonWrapper>
         <Button
-          customIcon={this.renderIcon(currentStatus)}
+          customIcon={this.renderIcon(myCurrentStatus)}
           label={intl.formatMessage(intlMessages.label)}
           hideLabel
           aria-label={intl.formatMessage(intlMessages.description)}

bigbluebutton-html5/imports/ui/components/connection-status/button/container.jsx

@@ -3,15 +3,18 @@ import { Meteor } from 'meteor/meteor';
 import { withTracker } from 'meteor/react-meteor-data';
 import { useSubscription } from '@apollo/client';
 import ConnectionStatusButtonComponent from './component';
-import Service from '../service';
-import { CONNECTION_STATUS_REPORT_SUBSCRIPTION } from '../queries';
+import { USER_CURRENT_STATUS_SUBSCRIPTION } from '../queries';
+import Auth from '/imports/ui/services/auth';
 
 const connectionStatusButtonContainer = (props) => {
-  const { data } = useSubscription(CONNECTION_STATUS_REPORT_SUBSCRIPTION);
+  const { data } = useSubscription(USER_CURRENT_STATUS_SUBSCRIPTION, {
+    variables: { userId: Auth.userID },
+  });
+  const myCurrentStatus = data && data.length > 0
+    ? data[0].currentStatus
+    : 'normal';
 
-  const connectionData = data ? Service.sortConnectionData(data.user_connectionStatusReport) : [];
-
-  return <ConnectionStatusButtonComponent connectionData={connectionData} {...props} />;
+  return <ConnectionStatusButtonComponent myCurrentStatus={myCurrentStatus} {...props} />;
 };
 
 export default withTracker(() => {

bigbluebutton-html5/imports/ui/components/connection-status/modal/container.jsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import { useSubscription } from '@apollo/client';
+import { CONNECTION_STATUS_REPORT_SUBSCRIPTION } from '../queries';
+import Service from '../service';
+import Component from './component';
+
+const ConnectionStatusContainer = (props) => {
+  const { data } = useSubscription(CONNECTION_STATUS_REPORT_SUBSCRIPTION);
+  const connectionData = data ? Service.sortConnectionData(data.user_connectionStatusReport) : [];
+  return (
+    <Component
+      connectionData={connectionData}
+      {...props}
+    />
+  );
+};
+
+export default ConnectionStatusContainer;

bigbluebutton-html5/imports/ui/components/connection-status/queries.jsx

@@ -17,6 +17,20 @@ export const CONNECTION_STATUS_REPORT_SUBSCRIPTION = gql`subscription ConnStatus
   }
 }`;
 
+export const USER_CURRENT_STATUS_SUBSCRIPTION = gql`
+  subscription CurrentUserConnStatus($userId: String!) {
+    user_connectionStatusReport(
+      where: {
+        user: {
+          userId: { _eq: $userId }
+        }
+      }
+    ) {
+      currentStatus
+    }
+  }
+`;
+
 export const CONNECTION_STATUS_SUBSCRIPTION = gql`subscription ConnStatus {
   user_connectionStatus {
     connectionAliveAt