From d057e921fde8922476efbc3f20bbf4da81dd0db4 Mon Sep 17 00:00:00 2001 From: Calinteodor Date: Tue, 1 Feb 2022 16:52:42 +0200 Subject: [PATCH] Revert "feat(speaker-stats): make facial expressions expandable" This reverts commit 2b0f58c4eb3a7a92a3f5ec1218eb38299c2b2557. --- css/modals/speaker_stats/_speaker_stats.scss | 2 +- react/features/speaker-stats/actionTypes.js | 8 -- react/features/speaker-stats/actions.any.js | 14 +--- .../components/AbstractSpeakerStatsList.js | 10 +-- .../components/web/SpeakerStats.js | 30 +------- .../web/ToggleFacialExpressionsButton.js | 76 ------------------- react/features/speaker-stats/reducer.js | 12 +-- 7 files changed, 13 insertions(+), 139 deletions(-) delete mode 100644 react/features/speaker-stats/components/web/ToggleFacialExpressionsButton.js diff --git a/css/modals/speaker_stats/_speaker_stats.scss b/css/modals/speaker_stats/_speaker_stats.scss index 2b0ee22f7..b137c1b8f 100644 --- a/css/modals/speaker_stats/_speaker_stats.scss +++ b/css/modals/speaker_stats/_speaker_stats.scss @@ -48,7 +48,7 @@ width: 20%; } .speaker-stats-item__time_expressions_on { - width: 18%; + width: 25%; } .speaker-stats-item__expression { diff --git a/react/features/speaker-stats/actionTypes.js b/react/features/speaker-stats/actionTypes.js index 75aca2f7f..f61549bb1 100644 --- a/react/features/speaker-stats/actionTypes.js +++ b/react/features/speaker-stats/actionTypes.js @@ -47,11 +47,3 @@ export const INIT_REORDER_STATS = 'INIT_REORDER_STATS'; */ export const RESET_SEARCH_CRITERIA = 'RESET_SEARCH_CRITERIA' -/** - * Action type to toggle the facial expressions grid. - * { - * type: TOGGLE_FACIAL_EXPRESSIONS - * } - */ -export const TOGGLE_FACIAL_EXPRESSIONS = 'SHOW_FACIAL_EXPRESSIONS'; - diff --git a/react/features/speaker-stats/actions.any.js b/react/features/speaker-stats/actions.any.js index 205af9303..a0be70b15 100644 --- a/react/features/speaker-stats/actions.any.js +++ b/react/features/speaker-stats/actions.any.js @@ -5,8 +5,7 @@ import { INIT_UPDATE_STATS, UPDATE_STATS, INIT_REORDER_STATS, - RESET_SEARCH_CRITERIA, - TOGGLE_FACIAL_EXPRESSIONS + RESET_SEARCH_CRITERIA } from './actionTypes'; /** @@ -69,14 +68,3 @@ export function resetSearchCriteria() { type: RESET_SEARCH_CRITERIA }; } - -/** - * Toggles the facial expressions grid. - * - * @returns {Object} - */ -export function toggleFacialExpressions() { - return { - type: TOGGLE_FACIAL_EXPRESSIONS - }; -} diff --git a/react/features/speaker-stats/components/AbstractSpeakerStatsList.js b/react/features/speaker-stats/components/AbstractSpeakerStatsList.js index e58ffaeab..6a5b8006a 100644 --- a/react/features/speaker-stats/components/AbstractSpeakerStatsList.js +++ b/react/features/speaker-stats/components/AbstractSpeakerStatsList.js @@ -21,10 +21,10 @@ const abstractSpeakerStatsList = (speakerStatsItem: Function): Function[] => { const dispatch = useDispatch(); const { t } = useTranslation(); const conference = useSelector(state => state['features/base/conference'].conference); - const { stats: speakerStats, showFacialExpressions } = useSelector(state => state['features/speaker-stats']); + const speakerStats = useSelector(state => state['features/speaker-stats'].stats); const localParticipant = useSelector(getLocalParticipant); const { clientWidth } = useSelector(state => state['features/base/responsive-ui']); - const { defaultRemoteDisplayName } = useSelector( + const { defaultRemoteDisplayName, enableFacialRecognition } = useSelector( state => state['features/base/config']) || {}; const { facialExpressions: localFacialExpressions } = useSelector( state => state['features/facial-recognition']) || {}; @@ -48,7 +48,7 @@ const abstractSpeakerStatsList = (speakerStatsItem: Function): Function[] => { ? `${localParticipant.name} (${meString})` : meString ); - if (showFacialExpressions) { + if (enableFacialRecognition) { stats[userId].setFacialExpressions(localFacialExpressions); } } @@ -91,10 +91,10 @@ const abstractSpeakerStatsList = (speakerStatsItem: Function): Function[] => { props.dominantSpeakerTime = statsModel.getTotalDominantSpeakerTime(); props.participantId = userId; props.hasLeft = statsModel.hasLeft(); - if (showFacialExpressions) { + if (enableFacialRecognition) { props.facialExpressions = statsModel.getFacialExpressions(); } - props.showFacialExpressions = showFacialExpressions; + props.showFacialExpressions = enableFacialRecognition; props.reduceExpressions = clientWidth < REDUCE_EXPRESSIONS_THRESHOLD; props.displayName = statsModel.getDisplayName() || defaultRemoteDisplayName; props.t = t; diff --git a/react/features/speaker-stats/components/web/SpeakerStats.js b/react/features/speaker-stats/components/web/SpeakerStats.js index a52e40c05..c5d78d225 100644 --- a/react/features/speaker-stats/components/web/SpeakerStats.js +++ b/react/features/speaker-stats/components/web/SpeakerStats.js @@ -7,12 +7,11 @@ import { Dialog } from '../../../base/dialog'; import { translate } from '../../../base/i18n'; import { connect } from '../../../base/redux'; import { escapeRegexp } from '../../../base/util'; -import { initSearch, resetSearchCriteria, toggleFacialExpressions } from '../../actions'; +import { initSearch, resetSearchCriteria } from '../../actions'; import SpeakerStatsLabels from './SpeakerStatsLabels'; import SpeakerStatsList from './SpeakerStatsList'; import SpeakerStatsSearch from './SpeakerStatsSearch'; -import ToggleFacialExpressionsButton from './ToggleFacialExpressionsButton'; /** * The type of the React {@code Component} props of {@link SpeakerStats}. @@ -21,17 +20,12 @@ type Props = { /** * The flag which shows if the facial recognition is enabled, obtained from the redux store. - * If enabled facial expressions can be expanded. - */ - _enableFacialRecognition: boolean, - - /** - * The flag which shows if the facial expressions are displayed or not. + * If enabled facial expressions are shown. */ _showFacialExpressions: boolean, /** - * True if the client width is less than 750. + * True if the client width is les than 750. */ _reduceExpressions: boolean, @@ -69,7 +63,6 @@ class SpeakerStats extends Component { // Bind event handlers so they are only bound once per instance. this._onSearch = this._onSearch.bind(this); - this._onToggleFacialExpressions = this._onToggleFacialExpressions.bind(this); } /** @@ -97,11 +90,6 @@ class SpeakerStats extends Component { width = { this.props._showFacialExpressions ? 'large' : 'medium' }>
- { this.props._enableFacialRecognition - && - } @@ -123,14 +111,6 @@ class SpeakerStats extends Component { _onSearch(criteria = '') { this.props.dispatch(initSearch(escapeRegexp(criteria))); } - - _onToggleFacialExpressions: () => void; - - /** - */ - _onToggleFacialExpressions() { - this.props.dispatch(toggleFacialExpressions()); - } } /** @@ -145,7 +125,6 @@ class SpeakerStats extends Component { */ function _mapStateToProps(state) { const { enableFacialRecognition } = state['features/base/config']; - const { showFacialExpressions } = state['features/speaker-stats']; const { clientWidth } = state['features/base/responsive-ui']; return { @@ -155,8 +134,7 @@ function _mapStateToProps(state) { * @private * @type {string|undefined} */ - _enableFacialRecognition: enableFacialRecognition, - _showFacialExpressions: showFacialExpressions, + _showFacialExpressions: enableFacialRecognition, _reduceExpressions: clientWidth < 750 }; } diff --git a/react/features/speaker-stats/components/web/ToggleFacialExpressionsButton.js b/react/features/speaker-stats/components/web/ToggleFacialExpressionsButton.js deleted file mode 100644 index dd7287dbb..000000000 --- a/react/features/speaker-stats/components/web/ToggleFacialExpressionsButton.js +++ /dev/null @@ -1,76 +0,0 @@ -// @flow -import { makeStyles } from '@material-ui/core/styles'; -import React from 'react'; - -import { - Icon, - IconArrowDownSmall -} from '../../../base/icons'; -import { Tooltip } from '../../../base/tooltip'; - - -const useStyles = makeStyles(theme => { - return { - expandButton: { - position: 'absolute', - right: '24px', - top: '93px', - '&:hover': { - backgroundColor: theme.palette.ui03 - }, - padding: '12px', - borderRadius: '6px', - cursor: 'pointer' - }, - arrowRight: { - transform: 'rotate(-90deg)' - }, - arrowLeft: { - transform: 'rotate(90deg)' - } - }; -}); - -/** - * The type of the React {@code Component} props of {@link SpeakerStatsSearch}. - */ -type Props = { - - /** - * The function to initiate the change in the speaker stats table. - */ - onClick: Function, - - /** - * The state of the button. - */ - showFacialExpressions: boolean, - -}; - -/** - */ -export default function ToggleFacialExpressionsButton({ onClick, showFacialExpressions }: Props) { - const classes = useStyles(); - - const onClickCallback = React.useCallback(() => { - onClick(); - }, []); - - return ( - -
- -
- - ); -} diff --git a/react/features/speaker-stats/reducer.js b/react/features/speaker-stats/reducer.js index 3df0f6bd2..fb136ef78 100644 --- a/react/features/speaker-stats/reducer.js +++ b/react/features/speaker-stats/reducer.js @@ -8,8 +8,7 @@ import { INIT_SEARCH, UPDATE_STATS, INIT_REORDER_STATS, - RESET_SEARCH_CRITERIA, - TOGGLE_FACIAL_EXPRESSIONS + RESET_SEARCH_CRITERIA } from './actionTypes'; /** @@ -21,8 +20,7 @@ const INITIAL_STATE = { stats: {}, isOpen: false, pendingReorder: true, - criteria: null, - showFacialExpressions: false + criteria: null }; ReducerRegistry.register('features/speaker-stats', (state = _getInitialState(), action) => { @@ -35,12 +33,6 @@ ReducerRegistry.register('features/speaker-stats', (state = _getInitialState(), return _initReorderStats(state); case RESET_SEARCH_CRITERIA: return _updateCriteria(state, { criteria: null }); - case TOGGLE_FACIAL_EXPRESSIONS: { - return { - ...state, - showFacialExpressions: !state.showFacialExpressions - }; - } } return state;