ref(TS) Convert some features to TS (#12454)

react/features/speaker-stats/actions.native.js

@@ -1,3 +0,0 @@
-// @flow
-
-export * from './actions.any';

react/features/speaker-stats/actions.ts

@@ -1,5 +1,3 @@
-// @flow
-
 import {
     INIT_REORDER_STATS,
     INIT_SEARCH,
@@ -55,7 +53,7 @@ export function updateStats(stats: Object) {
  * @param {Object} participantIds - Participant ids.
  * @returns {Object}
  */
-export function updateSortedSpeakerStatsIds(participantIds: Array<string>) {
+export function updateSortedSpeakerStatsIds(participantIds?: Array<string>) {
     return {
         type: UPDATE_SORTED_SPEAKER_STATS_IDS,
         participantIds

react/features/speaker-stats/actions.web.js

@@ -1,3 +0,0 @@
-// @flow
-
-export * from './actions.any';

react/features/speaker-stats/components/AbstractSpeakerStatsList.js

@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
 
 import { getLocalParticipant } from '../../base/participants';
-import { initUpdateStats } from '../actions.any';
+import { initUpdateStats } from '../actions';
 import {
     SPEAKER_STATS_RELOAD_INTERVAL
 } from '../constants';

react/features/speaker-stats/components/web/SpeakerStats.tsx

@@ -6,8 +6,6 @@ import { makeStyles } from 'tss-react/mui';
 import { IReduxState } from '../../../app/types';
 import Dialog from '../../../base/ui/components/web/Dialog';
 import { escapeRegexp } from '../../../base/util/helpers';
-// eslint-disable-next-line lines-around-comment
-// @ts-ignore
 import { initSearch, resetSearchCriteria, toggleFaceExpressions } from '../../actions';
 import {
     DISPLAY_SWITCH_BREAKPOINT,
@@ -107,7 +105,9 @@ const SpeakerStats = () => {
     useEffect(() => {
         showFaceExpressions && !displaySwitch && dispatch(toggleFaceExpressions());
     }, [ clientWidth ]);
-    useEffect(() => () => dispatch(resetSearchCriteria()), []);
+    useEffect(() => () => {
+        dispatch(resetSearchCriteria());
+    }, []);
 
     return (
         <Dialog

react/features/speaker-stats/components/web/SpeakerStatsSearch.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable lines-around-comment */
 import { Theme } from '@mui/material';
 import React, { useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -10,7 +9,6 @@ import { IconSearch } from '../../../base/icons/svg';
 import { getFieldValue } from '../../../base/react/functions';
 import { withPixelLineHeight } from '../../../base/styles/functions.web';
 import { MOBILE_BREAKPOINT } from '../../constants';
-// @ts-ignore
 import { isSpeakerStatsSearchDisabled } from '../../functions';
 
 const useStyles = makeStyles()((theme: Theme) => {

react/features/speaker-stats/functions.ts

@@ -1,40 +1,37 @@
-// @flow
-
 import _ from 'lodash';
 
-import {
-    PARTICIPANT_ROLE,
-    getParticipantById
-} from '../base/participants';
+import { IReduxState } from '../app/types';
+import { PARTICIPANT_ROLE } from '../base/participants/constants';
+import { getParticipantById } from '../base/participants/functions';
 
 /**
  * Checks if the speaker stats search is disabled.
  *
- * @param {*} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {boolean} - True if the speaker stats search is disabled and false otherwise.
  */
-export function isSpeakerStatsSearchDisabled(state: Object) {
-    return state['features/base/config']?.speakerStats.disableSearch;
+export function isSpeakerStatsSearchDisabled(state: IReduxState) {
+    return state['features/base/config']?.speakerStats?.disableSearch;
 }
 
 /**
  * Checks if the speaker stats is disabled.
  *
- * @param {*} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {boolean} - True if the speaker stats search is disabled and false otherwise.
  */
-export function isSpeakerStatsDisabled(state: Object) {
+export function isSpeakerStatsDisabled(state: IReduxState) {
     return state['features/base/config']?.speakerStats?.disabled;
 }
 
 /**
  * Gets whether participants in speaker stats should be ordered or not, and with what priority.
  *
- * @param {*} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {Array<string>} - The speaker stats order array or an empty array.
  */
-export function getSpeakerStatsOrder(state: Object) {
-    return state['features/base/config']?.speakerStats.order ?? [
+export function getSpeakerStatsOrder(state: IReduxState) {
+    return state['features/base/config']?.speakerStats?.order ?? [
         'role',
         'name',
         'hasLeft'
@@ -44,42 +41,42 @@ export function getSpeakerStatsOrder(state: Object) {
 /**
  * Gets speaker stats.
  *
- * @param {*} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {Object} - The speaker stats.
  */
-export function getSpeakerStats(state: Object) {
+export function getSpeakerStats(state: IReduxState) {
     return state['features/speaker-stats']?.stats ?? {};
 }
 
 /**
  * Gets speaker stats search criteria.
  *
- * @param {*} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {string | null} - The search criteria.
  */
-export function getSearchCriteria(state: Object) {
+export function getSearchCriteria(state: IReduxState) {
     return state['features/speaker-stats']?.criteria;
 }
 
 /**
  * Gets if speaker stats reorder is pending.
  *
- * @param {*} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {boolean} - The pending reorder flag.
  */
-export function getPendingReorder(state: Object) {
+export function getPendingReorder(state: IReduxState) {
     return state['features/speaker-stats']?.pendingReorder ?? false;
 }
 
 /**
  * Get sorted speaker stats ids based on a configuration setting.
  *
- * @param {Object} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @param {Object} stats - The current speaker stats.
  * @returns {Object} - Ordered speaker stats ids.
  * @public
  */
-export function getSortedSpeakerStatsIds(state: Object, stats: Object) {
+export function getSortedSpeakerStatsIds(state: IReduxState, stats: Object) {
     const orderConfig = getSpeakerStatsOrder(state);
 
     if (orderConfig) {
@@ -98,7 +95,7 @@ export function getSortedSpeakerStatsIds(state: Object, stats: Object) {
      * @param {Object} nextParticipant - The second participant for comparison.
      * @returns {number} - The sort order of the two participants.
      */
-    function compareFn(currentParticipant, nextParticipant) {
+    function compareFn(currentParticipant: any, nextParticipant: any) {
         if (orderConfig.includes('hasLeft')) {
             if (nextParticipant.hasLeft() && !currentParticipant.hasLeft()) {
                 return -1;
@@ -139,13 +136,13 @@ export function getSortedSpeakerStatsIds(state: Object, stats: Object) {
 /**
  * Enhance speaker stats to include data needed for ordering.
  *
- * @param {Object} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @param {Object} stats - Speaker stats.
  * @param {Array<string>} orderConfig - Ordering configuration.
  * @returns {Object} - Enhanced speaker stats.
  * @public
  */
-function getEnhancedStatsForOrdering(state, stats, orderConfig) {
+function getEnhancedStatsForOrdering(state: IReduxState, stats: any, orderConfig?: string[]) {
     if (!orderConfig) {
         return stats;
     }
@@ -166,14 +163,14 @@ function getEnhancedStatsForOrdering(state, stats, orderConfig) {
 /**
  * Filter stats by search criteria.
  *
- * @param {Object} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @param {Object | undefined} stats - The unfiltered stats.
  *
  * @returns {Object} - Filtered speaker stats.
  * @public
  */
-export function filterBySearchCriteria(state: Object, stats: ?Object) {
-    const filteredStats = _.cloneDeep(stats ?? getSpeakerStats(state));
+export function filterBySearchCriteria(state: IReduxState, stats?: Object) {
+    const filteredStats: any = _.cloneDeep(stats ?? getSpeakerStats(state));
     const criteria = getSearchCriteria(state);
 
     if (criteria !== null) {
@@ -194,14 +191,14 @@ export function filterBySearchCriteria(state: Object, stats: ?Object) {
 /**
  * Reset the hidden speaker stats.
  *
- * @param {Object} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @param {Object | undefined} stats - The unfiltered stats.
  *
  * @returns {Object} - Speaker stats.
  * @public
  */
-export function resetHiddenStats(state: Object, stats: ?Object) {
-    const resetStats = _.cloneDeep(stats ?? getSpeakerStats(state));
+export function resetHiddenStats(state: IReduxState, stats?: Object) {
+    const resetStats: any = _.cloneDeep(stats ?? getSpeakerStats(state));
 
     for (const id in resetStats) {
         if (resetStats[id].hidden) {

react/features/speaker-stats/middleware.ts

@@ -1,12 +1,10 @@
-// @flow
-
 import {
     PARTICIPANT_JOINED,
     PARTICIPANT_KICKED,
     PARTICIPANT_LEFT,
     PARTICIPANT_UPDATED
 } from '../base/participants/actionTypes';
-import { MiddlewareRegistry } from '../base/redux';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
 
 import {
     INIT_SEARCH,