Show reactions buttons at all times

Don't send reactions via the channel if there's only one participant in the meeting

react/features/reactions/components/native/ReactionMenu.js

@@ -5,7 +5,6 @@ import { View } from 'react-native';
 import { useSelector } from 'react-redux';
 
 import { ColorSchemeRegistry } from '../../../base/color-scheme';
-import { getParticipantCount } from '../../../base/participants';
 import { REACTIONS } from '../../constants';
 
 import RaiseHandButton from './RaiseHandButton';
@@ -37,20 +36,17 @@ function ReactionMenu({
     overflowMenu
 }: Props) {
     const _styles = useSelector(state => ColorSchemeRegistry.get(state, 'Toolbox'));
-    const _participantCount = useSelector(state => getParticipantCount(state));
 
     return (
         <View style = { overflowMenu ? _styles.overflowReactionMenu : _styles.reactionMenu }>
-            {_participantCount > 1
-                && <View style = { _styles.reactionRow }>
-                    {Object.keys(REACTIONS).map(key => (
-                        <ReactionButton
-                            key = { key }
-                            reaction = { key }
-                            styles = { _styles.reactionButton } />
-                    ))}
-                </View>
-            }
+            <View style = { _styles.reactionRow }>
+                {Object.keys(REACTIONS).map(key => (
+                    <ReactionButton
+                        key = { key }
+                        reaction = { key }
+                        styles = { _styles.reactionButton } />
+                ))}
+            </View>
             <RaiseHandButton onCancel = { onCancel } />
         </View>
     );

react/features/reactions/components/web/ReactionsMenu.js

@@ -9,7 +9,7 @@ import {
     sendAnalytics
 } from '../../../analytics';
 import { translate } from '../../../base/i18n';
-import { getLocalParticipant, getParticipantCount, participantUpdated } from '../../../base/participants';
+import { getLocalParticipant, participantUpdated } from '../../../base/participants';
 import { connect } from '../../../base/redux';
 import { dockToolbox } from '../../../toolbox/actions.web';
 import { addReactionToBuffer } from '../../actions.any';
@@ -20,11 +20,6 @@ import ReactionButton from './ReactionButton';
 
 type Props = {
 
-    /**
-     * The number of conference participants.
-     */
-    _participantCount: number,
-
     /**
      * Used for translation.
      */
@@ -182,13 +177,13 @@ class ReactionsMenu extends Component<Props> {
      * @inheritdoc
      */
     render() {
-        const { _participantCount, _raisedHand, t, overflowMenu } = this.props;
+        const { _raisedHand, t, overflowMenu } = this.props;
 
         return (
             <div className = { `reactions-menu ${overflowMenu ? 'overflow' : ''}` }>
-                { _participantCount > 1 && <div className = 'reactions-row'>
+                <div className = 'reactions-row'>
                     { this._getReactionButtons() }
-                </div> }
+                </div>
                 <div className = 'raise-hand-row'>
                     <ReactionButton
                         accessibilityLabel = { t('toolbar.accessibilityLabel.raiseHand') }
@@ -217,8 +212,7 @@ function mapStateToProps(state) {
 
     return {
         _localParticipantID: localParticipant.id,
-        _raisedHand: localParticipant.raisedHand,
-        _participantCount: getParticipantCount(state)
+        _raisedHand: localParticipant.raisedHand
     };
 }
 

react/features/reactions/middleware.js

@@ -3,6 +3,7 @@
 import { batch } from 'react-redux';
 
 import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../base/app';
+import { getParticipantCount } from '../base/participants';
 import { MiddlewareRegistry } from '../base/redux';
 import { updateSettings } from '../base/settings';
 import { playSound, registerSound, unregisterSound } from '../base/sounds';
@@ -91,9 +92,12 @@ MiddlewareRegistry.register(store => next => action => {
     case FLUSH_REACTION_BUFFER: {
         const state = getState();
         const { buffer } = state['features/reactions'];
+        const participantCount = getParticipantCount(state);
 
         batch(() => {
-            dispatch(sendReactions());
+            if (participantCount > 1) {
+                dispatch(sendReactions());
+            }
             dispatch(addReactionsToChat(getReactionMessageFromBuffer(buffer)));
             dispatch(pushReactions(buffer));
         });