diff --git a/react/.eslintrc.js b/react/.eslintrc.js
index f4779d949..052ee2524 100644
--- a/react/.eslintrc.js
+++ b/react/.eslintrc.js
@@ -13,6 +13,19 @@ module.exports = {
             parserOptions: {
                 sourceType: 'module',
                 project: [ './tsconfig.web.json', './tsconfig.native.json' ]
+            },
+            rules: {
+                '@typescript-eslint/naming-convention': [
+                    'error',
+                    {
+                        'selector': 'interface',
+                        'format': [ 'PascalCase' ],
+                        'custom': {
+                            'regex': '^I[A-Z]',
+                            'match': true
+                        }
+                    }
+                ]
             }
         }
     ],
diff --git a/react/features/analytics/handlers/AbstractHandler.ts b/react/features/analytics/handlers/AbstractHandler.ts
index fea82b382..b478b179e 100644
--- a/react/features/analytics/handlers/AbstractHandler.ts
+++ b/react/features/analytics/handlers/AbstractHandler.ts
@@ -9,7 +9,7 @@ export interface IEvent {
     type?: string;
 }
 
-interface Options {
+interface IOptions {
     amplitudeAPPKey?: string;
     blackListedEvents?: string[];
     envType?: string;
@@ -38,7 +38,7 @@ export default class AbstractHandler {
      *
      * @param {Object} options - Optional parameters.
      */
-    constructor(options: Options = {}) {
+    constructor(options: IOptions = {}) {
         this._enabled = false;
         this._whiteListedEvents = options.whiteListedEvents;
 
diff --git a/react/features/analytics/middleware.ts b/react/features/analytics/middleware.ts
index 76c16dc8a..ed0336a31 100644
--- a/react/features/analytics/middleware.ts
+++ b/react/features/analytics/middleware.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import {
     CONFERENCE_JOINED,
     CONFERENCE_WILL_LEAVE,
@@ -27,7 +27,7 @@ import { createHandlers, initAnalytics, resetAnalytics, sendAnalytics } from './
  * @param {Object} state - The redux state.
  * @returns {Object} - The local tracks duration.
  */
-function calculateLocalTrackDuration(state: IState) {
+function calculateLocalTrackDuration(state: IReduxState) {
     const now = Date.now();
     const { localTracksDuration } = state['features/analytics'];
     const { conference } = state['features/base/conference'];
diff --git a/react/features/analytics/reducer.ts b/react/features/analytics/reducer.ts
index 36949f579..342dce872 100644
--- a/react/features/analytics/reducer.ts
+++ b/react/features/analytics/reducer.ts
@@ -28,18 +28,18 @@ const DEFAULT_STATE = {
     }
 };
 
-interface Value {
+interface IValue {
     startedTime: number;
     value: number;
 }
 
 export interface IAnalyticsState {
     localTracksDuration: {
-        audio: Value;
-        conference: Value;
+        audio: IValue;
+        conference: IValue;
         video: {
-            camera: Value;
-            desktop: Value;
+            camera: IValue;
+            desktop: IValue;
         };
     };
 }
diff --git a/react/features/app/types.ts b/react/features/app/types.ts
index fe1cb9e2d..925c84bd7 100644
--- a/react/features/app/types.ts
+++ b/react/features/app/types.ts
@@ -78,11 +78,11 @@ import { IVirtualBackground } from '../virtual-background/reducer';
 import { IWhiteboardState } from '../whiteboard/reducer';
 
 export interface IStore {
-    dispatch: ThunkDispatch<IState, void, AnyAction>;
-    getState: () => IState;
+    dispatch: ThunkDispatch<IReduxState, void, AnyAction>;
+    getState: () => IReduxState;
 }
 
-export interface IState {
+export interface IReduxState {
     'features/analytics': IAnalyticsState;
     'features/authentication': IAuthenticationState;
     'features/av-moderation': IAVModerationState;
diff --git a/react/features/authentication/components/web/LoginDialog.tsx b/react/features/authentication/components/web/LoginDialog.tsx
index d847078f7..f16ef83f7 100644
--- a/react/features/authentication/components/web/LoginDialog.tsx
+++ b/react/features/authentication/components/web/LoginDialog.tsx
@@ -3,7 +3,7 @@ import { WithTranslation } from 'react-i18next';
 
 // @ts-expect-error
 import { connect } from '../../../../../connection';
-import { IState, IStore } from '../../../app/types';
+import { IReduxState, IStore } from '../../../app/types';
 import { IJitsiConference } from '../../../base/conference/reducer';
 import { IConfig } from '../../../base/config/configType';
 import { toJid } from '../../../base/connection/functions';
@@ -20,7 +20,7 @@ import {
 /**
  * The type of the React {@code Component} props of {@link LoginDialog}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * {@link JitsiConference} That needs authentication - will hold a valid
@@ -91,13 +91,13 @@ type State = {
  *
  *  @returns {React$Element<any>}
  */
-class LoginDialog extends Component<Props, State> {
+class LoginDialog extends Component<IProps, State> {
     /**
      * Initializes a new {@code LoginDialog} instance.
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this.state = {
@@ -294,9 +294,9 @@ class LoginDialog extends Component<Props, State> {
  *
  * @param {Object} state - The Redux state.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function mapStateToProps(state: IState) {
+function mapStateToProps(state: IReduxState) {
     const {
         error: authenticateAndUpgradeRoleError,
         progress,
diff --git a/react/features/authentication/components/web/WaitForOwnerDialog.tsx b/react/features/authentication/components/web/WaitForOwnerDialog.tsx
index 41ea34ab3..efbb59d96 100644
--- a/react/features/authentication/components/web/WaitForOwnerDialog.tsx
+++ b/react/features/authentication/components/web/WaitForOwnerDialog.tsx
@@ -10,7 +10,7 @@ import { cancelWaitForOwner } from '../../actions.web';
 /**
  * The type of the React {@code Component} props of {@link WaitForOwnerDialog}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Redux store dispatch method.
@@ -28,14 +28,14 @@ interface Props extends WithTranslation {
  *
  * @returns {React$Element<any>}
  */
-class WaitForOwnerDialog extends PureComponent<Props> {
+class WaitForOwnerDialog extends PureComponent<IProps> {
     /**
      * Instantiates a new component.
      *
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onCancelWaitForOwner = this._onCancelWaitForOwner.bind(this);
diff --git a/react/features/av-moderation/actions.ts b/react/features/av-moderation/actions.ts
index ee7f9af61..4f07cbc40 100644
--- a/react/features/av-moderation/actions.ts
+++ b/react/features/av-moderation/actions.ts
@@ -2,7 +2,7 @@ import { IStore } from '../app/types';
 import { getConferenceState } from '../base/conference/functions';
 import { MEDIA_TYPE, type MediaType } from '../base/media/constants';
 import { getParticipantById, isParticipantModerator } from '../base/participants/functions';
-import { Participant } from '../base/participants/types';
+import { IParticipant } from '../base/participants/types';
 import { isForceMuted } from '../participants-pane/functions';
 
 import {
@@ -133,10 +133,10 @@ export const disableModeration = (mediaType: MediaType, actor: Object) => {
 /**
  * Hides the notification with the participant that asked to unmute audio.
  *
- * @param {Participant} participant - The participant for which the notification to be hidden.
+ * @param {IParticipant} participant - The participant for which the notification to be hidden.
  * @returns {Object}
  */
-export function dismissPendingAudioParticipant(participant: Participant) {
+export function dismissPendingAudioParticipant(participant: IParticipant) {
     return dismissPendingParticipant(participant.id, MEDIA_TYPE.AUDIO);
 }
 
@@ -270,10 +270,10 @@ export function showModeratedNotification(mediaType: MediaType) {
 /**
  * Shows a notification with the participant that asked to audio unmute.
  *
- * @param {Participant} participant - The participant for which is the notification.
+ * @param {IParticipant} participant - The participant for which is the notification.
  * @returns {Object}
  */
-export function participantPendingAudio(participant: Participant) {
+export function participantPendingAudio(participant: IParticipant) {
     return {
         type: PARTICIPANT_PENDING_AUDIO,
         participant
diff --git a/react/features/av-moderation/functions.ts b/react/features/av-moderation/functions.ts
index 867a8df75..9f6c79dc0 100644
--- a/react/features/av-moderation/functions.ts
+++ b/react/features/av-moderation/functions.ts
@@ -1,7 +1,7 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { MEDIA_TYPE, type MediaType } from '../base/media/constants';
 import { isLocalParticipantModerator } from '../base/participants/functions';
-import { Participant } from '../base/participants/types';
+import { IParticipant } from '../base/participants/types';
 import { isInBreakoutRoom } from '../breakout-rooms/functions';
 
 import { MEDIA_TYPE_TO_PENDING_STORE_KEY, MEDIA_TYPE_TO_WHITELIST_STORE_KEY } from './constants';
@@ -9,10 +9,10 @@ import { MEDIA_TYPE_TO_PENDING_STORE_KEY, MEDIA_TYPE_TO_WHITELIST_STORE_KEY } fr
 /**
  * Returns this feature's root state.
  *
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {Object} Feature state.
  */
-const getState = (state: IState) => state['features/av-moderation'];
+const getState = (state: IReduxState) => state['features/av-moderation'];
 
 /**
  * We use to construct once the empty array so we can keep the same instance between calls
@@ -26,10 +26,10 @@ const EMPTY_ARRAY: any[] = [];
  * Returns whether moderation is enabled per media type.
  *
  * @param {MEDIA_TYPE} mediaType - The media type to check.
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {boolean}
  */
-export const isEnabledFromState = (mediaType: MediaType, state: IState) =>
+export const isEnabledFromState = (mediaType: MediaType, state: IReduxState) =>
     (mediaType === MEDIA_TYPE.AUDIO
         ? getState(state)?.audioModerationEnabled
         : getState(state)?.videoModerationEnabled) === true;
@@ -40,14 +40,14 @@ export const isEnabledFromState = (mediaType: MediaType, state: IState) =>
  * @param {MEDIA_TYPE} mediaType - The media type to check.
  * @returns {boolean}
  */
-export const isEnabled = (mediaType: MediaType) => (state: IState) => isEnabledFromState(mediaType, state);
+export const isEnabled = (mediaType: MediaType) => (state: IReduxState) => isEnabledFromState(mediaType, state);
 
 /**
  * Returns whether moderation is supported by the backend.
  *
  * @returns {boolean}
  */
-export const isSupported = () => (state: IState) => {
+export const isSupported = () => (state: IReduxState) => {
     const { conference } = state['features/base/conference'];
 
     return Boolean(!isInBreakoutRoom(state) && conference?.isAVModerationSupported());
@@ -57,10 +57,10 @@ export const isSupported = () => (state: IState) => {
  * Returns whether local participant is approved to unmute a media type.
  *
  * @param {MEDIA_TYPE} mediaType - The media type to check.
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {boolean}
  */
-export const isLocalParticipantApprovedFromState = (mediaType: MediaType, state: IState) => {
+export const isLocalParticipantApprovedFromState = (mediaType: MediaType, state: IReduxState) => {
     const approved = (mediaType === MEDIA_TYPE.AUDIO
         ? getState(state).audioUnmuteApproved
         : getState(state).videoUnmuteApproved) === true;
@@ -75,7 +75,7 @@ export const isLocalParticipantApprovedFromState = (mediaType: MediaType, state:
  * @returns {boolean}
  */
 export const isLocalParticipantApproved = (mediaType: MediaType) =>
-    (state: IState) =>
+    (state: IReduxState) =>
         isLocalParticipantApprovedFromState(mediaType, state);
 
 /**
@@ -85,7 +85,7 @@ export const isLocalParticipantApproved = (mediaType: MediaType) =>
  * @param {MEDIA_TYPE} mediaType - The media type to check.
  * @returns {boolean}
  */
-export const isParticipantApproved = (id: string, mediaType: MediaType) => (state: IState) => {
+export const isParticipantApproved = (id: string, mediaType: MediaType) => (state: IReduxState) => {
     const storeKey = MEDIA_TYPE_TO_WHITELIST_STORE_KEY[mediaType];
 
     const avModerationState = getState(state);
@@ -97,11 +97,11 @@ export const isParticipantApproved = (id: string, mediaType: MediaType) => (stat
 /**
  * Returns a selector creator which determines if the participant is pending or not for a media type.
  *
- * @param {Participant} participant - The participant.
+ * @param {IParticipant} participant - The participant.
  * @param {MEDIA_TYPE} mediaType - The media type to check.
  * @returns {boolean}
  */
-export const isParticipantPending = (participant: Participant, mediaType: MediaType) => (state: IState) => {
+export const isParticipantPending = (participant: IParticipant, mediaType: MediaType) => (state: IReduxState) => {
     const storeKey = MEDIA_TYPE_TO_PENDING_STORE_KEY[mediaType];
     const arr = getState(state)[storeKey];
 
@@ -115,7 +115,7 @@ export const isParticipantPending = (participant: Participant, mediaType: MediaT
  * @param {Object} state - The global state.
  * @returns {Array<Object>}
  */
-export const getParticipantsAskingToAudioUnmute = (state: IState) => {
+export const getParticipantsAskingToAudioUnmute = (state: IReduxState) => {
     if (isLocalParticipantModerator(state)) {
         return getState(state).pendingAudio;
     }
@@ -131,6 +131,6 @@ export const getParticipantsAskingToAudioUnmute = (state: IState) => {
  * @param {Object} state - The global state.
  * @returns {boolean}
  */
-export const shouldShowModeratedNotification = (mediaType: MediaType, state: IState) =>
+export const shouldShowModeratedNotification = (mediaType: MediaType, state: IReduxState) =>
     isEnabledFromState(mediaType, state)
     && !isLocalParticipantApprovedFromState(mediaType, state);
diff --git a/react/features/av-moderation/reducer.ts b/react/features/av-moderation/reducer.ts
index 6ef9544bd..c06e2b444 100644
--- a/react/features/av-moderation/reducer.ts
+++ b/react/features/av-moderation/reducer.ts
@@ -4,7 +4,7 @@ import {
     PARTICIPANT_LEFT,
     PARTICIPANT_UPDATED
 } from '../base/participants/actionTypes';
-import { Participant } from '../base/participants/types';
+import { IParticipant } from '../base/participants/types';
 import ReducerRegistry from '../base/redux/ReducerRegistry';
 
 import {
@@ -48,7 +48,7 @@ export interface IAVModerationState {
  * @private
  * @returns {boolean} - Whether state instance was modified.
  */
-function _updatePendingParticipant(mediaType: MediaType, participant: Participant, state: IAVModerationState) {
+function _updatePendingParticipant(mediaType: MediaType, participant: IParticipant, state: IAVModerationState) {
     let arrayItemChanged = false;
     const storeKey = MEDIA_TYPE_TO_PENDING_STORE_KEY[mediaType];
     const arr = state[storeKey];
diff --git a/react/features/base/app/types.ts b/react/features/base/app/types.ts
index 7ddeb98c6..b50573327 100644
--- a/react/features/base/app/types.ts
+++ b/react/features/base/app/types.ts
@@ -1,3 +1,3 @@
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 
-export type IStateful = Function | IStore | IState;
+export type IStateful = Function | IStore | IReduxState;
diff --git a/react/features/base/conference/actions.ts b/react/features/base/conference/actions.ts
index 3db1d093e..e71acecb1 100644
--- a/react/features/base/conference/actions.ts
+++ b/react/features/base/conference/actions.ts
@@ -2,7 +2,7 @@
 import { createStartMutedConfigurationEvent } from '../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../analytics/functions';
 import { appNavigate } from '../../app/actions';
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import { endpointMessageReceived } from '../../subtitles/actions.any';
 import { getReplaceParticipant } from '../config/functions';
 import { disconnect } from '../connection/actions';
@@ -84,7 +84,7 @@ import { IJitsiConference } from './reducer';
  * @private
  * @returns {void}
  */
-function _addConferenceListeners(conference: IJitsiConference, dispatch: IStore['dispatch'], state: IState) {
+function _addConferenceListeners(conference: IJitsiConference, dispatch: IStore['dispatch'], state: IReduxState) {
     // A simple logger for conference errors received through
     // the listener. These errors are not handled now, but logged.
     conference.on(JitsiConferenceEvents.CONFERENCE_ERROR,
diff --git a/react/features/base/conference/functions.ts b/react/features/base/conference/functions.ts
index ee67ce36c..6e5e35547 100644
--- a/react/features/base/conference/functions.ts
+++ b/react/features/base/conference/functions.ts
@@ -2,7 +2,7 @@ import { sha512_256 as sha512 } from 'js-sha512';
 import _ from 'lodash';
 
 import { getName } from '../../app/functions';
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import { determineTranscriptionLanguage } from '../../transcribing/functions';
 import { IStateful } from '../app/types';
 import { JitsiTrackErrors } from '../lib-jitsi-meet';
@@ -29,18 +29,18 @@ import { IJitsiConference } from './reducer';
 /**
  * Returns root conference state.
  *
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {Object} Conference state.
  */
-export const getConferenceState = (state: IState) => state['features/base/conference'];
+export const getConferenceState = (state: IReduxState) => state['features/base/conference'];
 
 /**
  * Is the conference joined or not.
  *
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {boolean}
  */
-export const getIsConferenceJoined = (state: IState) => Boolean(getConferenceState(state).conference);
+export const getIsConferenceJoined = (state: IReduxState) => Boolean(getConferenceState(state).conference);
 
 /**
  * Attach a set of local tracks to a conference.
@@ -292,21 +292,21 @@ export function getCurrentConference(stateful: IStateful): any {
 /**
  * Returns the stored room name.
  *
- * @param {IState} state - The current state of the app.
+ * @param {IReduxState} state - The current state of the app.
  * @returns {string}
  */
-export function getRoomName(state: IState) {
+export function getRoomName(state: IReduxState) {
     return getConferenceState(state).room;
 }
 
 /**
  * Get an obfuscated room name or create and persist it if it doesn't exists.
  *
- * @param {IState} state - The current state of the app.
+ * @param {IReduxState} state - The current state of the app.
  * @param {Function} dispatch - The Redux dispatch function.
  * @returns {string} - Obfuscated room name.
  */
-export function getOrCreateObfuscatedRoomName(state: IState, dispatch: IStore['dispatch']) {
+export function getOrCreateObfuscatedRoomName(state: IReduxState, dispatch: IStore['dispatch']) {
     let { obfuscatedRoom } = getConferenceState(state);
     const { obfuscatedRoomSource } = getConferenceState(state);
     const room = getRoomName(state);
@@ -330,11 +330,11 @@ export function getOrCreateObfuscatedRoomName(state: IState, dispatch: IStore['d
  * Analytics may require an obfuscated room name, this functions decides based on a config if the normal or
  * obfuscated room name should be returned.
  *
- * @param {IState} state - The current state of the app.
+ * @param {IReduxState} state - The current state of the app.
  * @param {Function} dispatch - The Redux dispatch function.
  * @returns {string} - Analytics room name.
  */
-export function getAnalyticsRoomName(state: IState, dispatch: IStore['dispatch']) {
+export function getAnalyticsRoomName(state: IReduxState, dispatch: IStore['dispatch']) {
     const { analysis: { obfuscateRoomName = false } = {} } = state['features/base/config'];
 
     if (obfuscateRoomName) {
diff --git a/react/features/base/config/functions.any.ts b/react/features/base/config/functions.any.ts
index f412dda8f..3425c3c3d 100644
--- a/react/features/base/config/functions.any.ts
+++ b/react/features/base/config/functions.any.ts
@@ -5,7 +5,7 @@ import Bourne from '@hapi/bourne';
 import { jitsiLocalStorage } from '@jitsi/js-utils';
 import _ from 'lodash';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { browser } from '../lib-jitsi-meet';
 import { parseURLParams } from '../util/parseURLParams';
 
@@ -49,7 +49,7 @@ export function createFakeConfig(baseURL: string) {
  * @param {Object} state - The global state.
  * @returns {string}
  */
-export function getMeetingRegion(state: IState) {
+export function getMeetingRegion(state: IReduxState) {
     return state['features/base/config']?.deploymentInfo?.region || '';
 }
 
@@ -59,7 +59,7 @@ export function getMeetingRegion(state: IState) {
  * @param {Object} state - The global state.
  * @returns {boolean}
  */
-export function getMultipleVideoSupportFeatureFlag(state: IState) {
+export function getMultipleVideoSupportFeatureFlag(state: IReduxState) {
     return (getFeatureFlag(state, FEATURE_FLAGS.MULTIPLE_VIDEO_STREAMS_SUPPORT)
         && getSourceNameSignalingFeatureFlag(state)) ?? true;
 }
@@ -70,7 +70,7 @@ export function getMultipleVideoSupportFeatureFlag(state: IState) {
  * @param {Object} state - The global state.
  * @returns {boolean}
  */
-export function getMultipleVideoSendingSupportFeatureFlag(state: IState) {
+export function getMultipleVideoSendingSupportFeatureFlag(state: IReduxState) {
     return navigator.product !== 'ReactNative'
         && ((getMultipleVideoSupportFeatureFlag(state) ?? true) && isUnifiedPlanEnabled(state));
 }
@@ -81,7 +81,7 @@ export function getMultipleVideoSendingSupportFeatureFlag(state: IState) {
  * @param {Object} state - The global state.
  * @returns {boolean}
  */
-export function getSourceNameSignalingFeatureFlag(state: IState) {
+export function getSourceNameSignalingFeatureFlag(state: IReduxState) {
     return getFeatureFlag(state, FEATURE_FLAGS.SOURCE_NAME_SIGNALING) ?? true;
 }
 
@@ -92,7 +92,7 @@ export function getSourceNameSignalingFeatureFlag(state: IState) {
  * @param {string} featureFlag - The name of the feature flag.
  * @returns {boolean}
  */
-export function getFeatureFlag(state: IState, featureFlag: string) {
+export function getFeatureFlag(state: IReduxState, featureFlag: string) {
     const featureFlags = state['features/base/config']?.flags || {};
 
     return featureFlags[featureFlag as keyof typeof featureFlags];
@@ -104,7 +104,7 @@ export function getFeatureFlag(state: IState, featureFlag: string) {
  * @param {Object} state - The global state.
  * @returns {boolean}
  */
-export function getDisableRemoveRaisedHandOnFocus(state: IState) {
+export function getDisableRemoveRaisedHandOnFocus(state: IReduxState) {
     return state['features/base/config']?.disableRemoveRaisedHandOnFocus || false;
 }
 
@@ -114,7 +114,7 @@ export function getDisableRemoveRaisedHandOnFocus(state: IState) {
  * @param {Object} state - The global state.
  * @returns {string}
  */
-export function getRecordingSharingUrl(state: IState) {
+export function getRecordingSharingUrl(state: IReduxState) {
     return state['features/base/config'].recordingSharingUrl;
 }
 
@@ -196,7 +196,7 @@ export function getWhitelistedJSON(configName: 'interfaceConfig' | 'config', con
  * @param {Object} state - The state of the app.
  * @returns {boolean}
  */
-export function isNameReadOnly(state: IState): boolean {
+export function isNameReadOnly(state: IReduxState): boolean {
     return Boolean(state['features/base/config'].disableProfile
         || state['features/base/config'].readOnlyName);
 }
@@ -207,7 +207,7 @@ export function isNameReadOnly(state: IState): boolean {
  * @param {Object} state - The state of the app.
  * @returns {boolean}
  */
-export function isDisplayNameVisible(state: IState): boolean {
+export function isDisplayNameVisible(state: IReduxState): boolean {
     return !state['features/base/config'].hideDisplayName;
 }
 
@@ -217,7 +217,7 @@ export function isDisplayNameVisible(state: IState): boolean {
  * @param {Object} state - The state of the app.
  * @returns {boolean}
  */
-export function isUnifiedPlanEnabled(state: IState): boolean {
+export function isUnifiedPlanEnabled(state: IReduxState): boolean {
     const { enableUnifiedOnChrome = true } = state['features/base/config'];
 
     return browser.supportsUnifiedPlan()
diff --git a/react/features/base/config/functions.native.ts b/react/features/base/config/functions.native.ts
index b39a1a6c8..5ed560101 100644
--- a/react/features/base/config/functions.native.ts
+++ b/react/features/base/config/functions.native.ts
@@ -1,6 +1,6 @@
 import { NativeModules } from 'react-native';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { REPLACE_PARTICIPANT } from '../flags/constants';
 import { getFeatureFlag } from '../flags/functions';
 
@@ -32,6 +32,6 @@ export function _cleanupConfig(config: IConfig) {
  * @param {Object} state - The state of the app.
  * @returns {boolean}
  */
-export function getReplaceParticipant(state: IState): string {
+export function getReplaceParticipant(state: IReduxState): string {
     return getFeatureFlag(state, REPLACE_PARTICIPANT, false);
 }
diff --git a/react/features/base/config/functions.web.ts b/react/features/base/config/functions.web.ts
index 3d19866ac..a16e62f73 100644
--- a/react/features/base/config/functions.web.ts
+++ b/react/features/base/config/functions.web.ts
@@ -1,4 +1,4 @@
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 
 import { IConfig } from './configType';
 import { TOOLBAR_BUTTONS } from './constants';
@@ -20,7 +20,7 @@ export function _cleanupConfig(config: IConfig) { // eslint-disable-line @typesc
  * @param {Object} state - The state of the app.
  * @returns {string}
  */
-export function getDialOutStatusUrl(state: IState): string | undefined {
+export function getDialOutStatusUrl(state: IReduxState): string | undefined {
     return state['features/base/config'].guestDialOutStatusUrl;
 }
 
@@ -30,7 +30,7 @@ export function getDialOutStatusUrl(state: IState): string | undefined {
  * @param {Object} state - The state of the app.
  * @returns {string}
  */
-export function getDialOutUrl(state: IState): string | undefined {
+export function getDialOutUrl(state: IReduxState): string | undefined {
     return state['features/base/config'].guestDialOutUrl;
 }
 
@@ -40,7 +40,7 @@ export function getDialOutUrl(state: IState): string | undefined {
  * @param {Object} state - The state of the app.
  * @returns {boolean}
  */
-export function getReplaceParticipant(state: IState): string | undefined {
+export function getReplaceParticipant(state: IReduxState): string | undefined {
     return state['features/base/config'].replaceParticipant;
 }
 
@@ -50,7 +50,7 @@ export function getReplaceParticipant(state: IState): string | undefined {
  * @param {Object} state - The redux state.
  * @returns {Array<string>} - The list of enabled toolbar buttons.
  */
-export function getToolbarButtons(state: IState): Array<string> {
+export function getToolbarButtons(state: IReduxState): Array<string> {
     const { toolbarButtons } = state['features/base/config'];
 
     return Array.isArray(toolbarButtons) ? toolbarButtons : TOOLBAR_BUTTONS;
@@ -64,7 +64,7 @@ export function getToolbarButtons(state: IState): Array<string> {
  * @param {Object|Array<string>} state - The redux state or the array with the enabled buttons.
  * @returns {boolean} - True if the button is enabled and false otherwise.
  */
-export function isToolbarButtonEnabled(buttonName: string, state: IState | Array<string>) {
+export function isToolbarButtonEnabled(buttonName: string, state: IReduxState | Array<string>) {
     const buttons = Array.isArray(state) ? state : getToolbarButtons(state);
 
     return buttons.includes(buttonName);
@@ -76,7 +76,7 @@ export function isToolbarButtonEnabled(buttonName: string, state: IState | Array
  * @param {Object} state - The state of the app.
  * @returns {boolean}
  */
-export function areAudioLevelsEnabled(state: IState): boolean {
+export function areAudioLevelsEnabled(state: IReduxState): boolean {
     // Default to false for React Native as audio levels are of no interest to the mobile app.
     return navigator.product !== 'ReactNative' && !state['features/base/config'].disableAudioLevels;
 }
diff --git a/react/features/base/connection/actions.any.ts b/react/features/base/connection/actions.any.ts
index 8f93db080..b47b472a8 100644
--- a/react/features/base/connection/actions.any.ts
+++ b/react/features/base/connection/actions.any.ts
@@ -1,6 +1,6 @@
 import _ from 'lodash';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import {
     appendURLParam,
     getBackendSafeRoomName,
@@ -140,7 +140,7 @@ export function connectionFailed(
  * @returns {Object} The options to be passed to the constructor of
  * {@code JitsiConnection}.
  */
-export function constructOptions(state: IState) {
+export function constructOptions(state: IReduxState) {
     // Deep clone the options to make sure we don't modify the object in the
     // redux store.
     const options = _.cloneDeep(state['features/base/config']);
diff --git a/react/features/base/devices/functions.ts b/react/features/base/devices/functions.ts
index fda8a3694..45a5a4c10 100644
--- a/react/features/base/devices/functions.ts
+++ b/react/features/base/devices/functions.ts
@@ -1,4 +1,4 @@
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import JitsiMeetJS from '../lib-jitsi-meet';
 import { updateSettings } from '../settings/actions';
 import { ISettingsState } from '../settings/reducer';
@@ -24,7 +24,7 @@ const webrtcKindToJitsiKindTranslator = {
  * @returns {boolean} - True if the labels are already initialized and false
  * otherwise.
  */
-export function areDeviceLabelsInitialized(state: IState) {
+export function areDeviceLabelsInitialized(state: IReduxState) {
     // TODO: Replace with something that doesn't use APP when the conference.js logic is reactified.
     if (APP.conference._localTracksInitialized) {
         return true;
@@ -60,7 +60,7 @@ export function getAudioOutputDeviceId() {
  * of the preceding types.
  * @returns {string|undefined}
  */
-export function getDefaultDeviceId(state: IState, kind: string) {
+export function getDefaultDeviceId(state: IReduxState, kind: string) {
     const kindToSearch = webrtcKindToJitsiKindTranslator[kind as keyof typeof webrtcKindToJitsiKindTranslator] || kind;
     const availableDevices = state['features/base/devices'].availableDevices;
     const defaultDevice = (availableDevices[kindToSearch as keyof typeof availableDevices] || [])
@@ -85,7 +85,7 @@ export function getDefaultDeviceId(state: IState, kind: string) {
  * of the preceding types.
  * @returns {string|undefined}
  */
-export function getDeviceIdByLabel(state: IState, label: string, kind: string) {
+export function getDeviceIdByLabel(state: IReduxState, label: string, kind: string) {
     const kindToSearch = webrtcKindToJitsiKindTranslator[kind as keyof typeof webrtcKindToJitsiKindTranslator] || kind;
 
     const availableDevices = state['features/base/devices'].availableDevices;
@@ -108,7 +108,7 @@ export function getDeviceIdByLabel(state: IState, label: string, kind: string) {
  * of the preceding types.
  * @returns {string|undefined}
  */
-export function getDeviceLabelById(state: IState, id: string, kind: string) {
+export function getDeviceLabelById(state: IReduxState, id: string, kind: string) {
     const kindToSearch = webrtcKindToJitsiKindTranslator[kind as keyof typeof webrtcKindToJitsiKindTranslator] || kind;
 
     const availableDevices = state['features/base/devices'].availableDevices;
@@ -127,7 +127,7 @@ export function getDeviceLabelById(state: IState, id: string, kind: string) {
  * @param {Object} state - The redux state.
  * @returns {Object|undefined}
  */
-export function getDevicesFromURL(state: IState) {
+export function getDevicesFromURL(state: IReduxState) {
     const urlParams
         = parseURLParams(state['features/base/connection'].locationURL ?? '');
 
@@ -204,7 +204,7 @@ export function formatDeviceLabel(label: string) {
  * @param {Object} state - The state of the application.
  * @returns {Object[]}
  */
-export function getAudioInputDeviceData(state: IState) {
+export function getAudioInputDeviceData(state: IReduxState) {
     return state['features/base/devices'].availableDevices.audioInput?.map(
         ({ deviceId, label }) => {
             return {
@@ -220,7 +220,7 @@ export function getAudioInputDeviceData(state: IState) {
  * @param {Object} state - The state of the application.
  * @returns {Object[]}
  */
-export function getAudioOutputDeviceData(state: IState) {
+export function getAudioOutputDeviceData(state: IReduxState) {
     return state['features/base/devices'].availableDevices.audioOutput?.map(
         ({ deviceId, label }) => {
             return {
@@ -236,7 +236,7 @@ export function getAudioOutputDeviceData(state: IState) {
  * @param {Object} state - The state of the application.
  * @returns {string[]}
  */
-export function getVideoDeviceIds(state: IState) {
+export function getVideoDeviceIds(state: IReduxState) {
     return state['features/base/devices'].availableDevices.videoInput?.map(({ deviceId }) => deviceId);
 }
 
@@ -248,7 +248,7 @@ export function getVideoDeviceIds(state: IState) {
  *
  * @returns {boolean}
  */
-export function hasAvailableDevices(state: IState, type: string) {
+export function hasAvailableDevices(state: IReduxState, type: string) {
     if (state['features/base/devices'] === undefined) {
         return true;
     }
diff --git a/react/features/base/dialog/components/AbstractDialogContainer.ts b/react/features/base/dialog/components/AbstractDialogContainer.ts
index 278e78b9e..5c4e6dc8b 100644
--- a/react/features/base/dialog/components/AbstractDialogContainer.ts
+++ b/react/features/base/dialog/components/AbstractDialogContainer.ts
@@ -1,12 +1,12 @@
 import React, { Component, ComponentType } from 'react';
 
-import { IState } from '../../../app/types';
-import { ReactionEmojiProps } from '../../../reactions/constants';
+import { IReduxState } from '../../../app/types';
+import { IReactionEmojiProps } from '../../../reactions/constants';
 
 /**
  * The type of the React {@code Component} props of {@link DialogContainer}.
  */
-interface Props {
+interface IProps {
 
     /**
      * The component to render.
@@ -21,7 +21,7 @@ interface Props {
     /**
      * Array of reactions to be displayed.
      */
-    _reactionsQueue: Array<ReactionEmojiProps>;
+    _reactionsQueue: Array<IReactionEmojiProps>;
 
     /**
      * True if the UI is in a compact state where we don't show dialogs.
@@ -32,7 +32,7 @@ interface Props {
 /**
  * Implements a DialogContainer responsible for showing all dialogs.
  */
-export default class AbstractDialogContainer extends Component<Props> {
+export default class AbstractDialogContainer extends Component<IProps> {
     /**
      * Returns the dialog to be displayed.
      *
@@ -58,9 +58,9 @@ export default class AbstractDialogContainer extends Component<Props> {
  *
  * @param {Object} state - The redux state.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-export function abstractMapStateToProps(state: IState) {
+export function abstractMapStateToProps(state: IReduxState) {
     const stateFeaturesBaseDialog = state['features/base/dialog'];
     const { reducedUI } = state['features/base/responsive-ui'];
 
diff --git a/react/features/base/dialog/components/native/BottomSheetContainer.tsx b/react/features/base/dialog/components/native/BottomSheetContainer.tsx
index e90ef112a..7a7d6011e 100644
--- a/react/features/base/dialog/components/native/BottomSheetContainer.tsx
+++ b/react/features/base/dialog/components/native/BottomSheetContainer.tsx
@@ -1,12 +1,12 @@
 import React, { Fragment } from 'react';
 import { useSelector } from 'react-redux';
 
-import { IState } from '../../../../app/types';
+import { IReduxState } from '../../../../app/types';
 
 
 const BottomSheetContainer: () => JSX.Element | null = (): JSX.Element | null => {
-    const { sheet, sheetProps } = useSelector((state: IState) => state['features/base/dialog']);
-    const { reducedUI } = useSelector((state: IState) => state['features/base/responsive-ui']);
+    const { sheet, sheetProps } = useSelector((state: IReduxState) => state['features/base/dialog']);
+    const { reducedUI } = useSelector((state: IReduxState) => state['features/base/responsive-ui']);
 
     if (!sheet || reducedUI) {
         return null;
diff --git a/react/features/base/dialog/components/web/ModalHeader.tsx b/react/features/base/dialog/components/web/ModalHeader.tsx
index 0e09fed8a..8bf0952c8 100644
--- a/react/features/base/dialog/components/web/ModalHeader.tsx
+++ b/react/features/base/dialog/components/web/ModalHeader.tsx
@@ -34,7 +34,7 @@ const TitleIcon = ({ appearance }: { appearance?: 'danger' | 'warning'; }) => {
     );
 };
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
     appearance?: 'danger' | 'warning';
     classes: any;
     heading: string;
@@ -84,9 +84,9 @@ const styles = (theme: Theme) => {
  * A default header for modal-dialog components.
  *
  * @class ModalHeader
- * @augments {React.Component<Props>}
+ * @augments {React.Component<IProps>}
  */
-class ModalHeader extends React.Component<Props> {
+class ModalHeader extends React.Component<IProps> {
     static defaultProps = {
         isHeadingMultiline: true
     };
@@ -97,7 +97,7 @@ class ModalHeader extends React.Component<Props> {
      * @param {*} props - The read-only properties with which the new instance
      * is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         // Bind event handler so it is only bound once for every instance.
diff --git a/react/features/base/dialog/components/web/StatelessDialog.tsx b/react/features/base/dialog/components/web/StatelessDialog.tsx
index 35894ae17..581c55cb3 100644
--- a/react/features/base/dialog/components/web/StatelessDialog.tsx
+++ b/react/features/base/dialog/components/web/StatelessDialog.tsx
@@ -31,7 +31,7 @@ const OK_BUTTON_ID = 'modal-dialog-ok-button';
  *
  * @static
  */
-interface Props extends DialogProps, WithTranslation {
+interface IProps extends DialogProps, WithTranslation {
 
     /**
      * An object containing the CSS classes.
@@ -127,7 +127,7 @@ const styles = (theme: Theme) => {
 /**
  * Web dialog that uses atlaskit modal-dialog to display dialogs.
  */
-class StatelessDialog extends Component<Props> {
+class StatelessDialog extends Component<IProps> {
     static defaultProps = {
         hideCloseIconButton: false
     };
@@ -138,7 +138,7 @@ class StatelessDialog extends Component<Props> {
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         // Bind event handlers so they are only bound once for every instance.
diff --git a/react/features/base/dialog/functions.ts b/react/features/base/dialog/functions.ts
index 7fe1482b9..2741c2aad 100644
--- a/react/features/base/dialog/functions.ts
+++ b/react/features/base/dialog/functions.ts
@@ -1,6 +1,6 @@
 import { ComponentType } from 'react';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { IStateful } from '../app/types';
 // eslint-disable-next-line lines-around-comment
 // @ts-ignore
@@ -35,12 +35,12 @@ export function isDialogOpen(stateful: IStateful, component: ComponentType) {
 /**
  * Maps part of the Redux state to the props of any Dialog based component.
  *
- * @param {IState} state - The Redux state.
+ * @param {IReduxState} state - The Redux state.
  * @returns {{
  *     _dialogStyles: StyleType
  * }}
  */
-export function _abstractMapStateToProps(state: IState) {
+export function _abstractMapStateToProps(state: IReduxState) {
     return {
         _dialogStyles: ColorSchemeRegistry.get(state, 'Dialog')
     };
diff --git a/react/features/base/jwt/functions.ts b/react/features/base/jwt/functions.ts
index e2fbe3431..1ed3211de 100644
--- a/react/features/base/jwt/functions.ts
+++ b/react/features/base/jwt/functions.ts
@@ -1,7 +1,7 @@
 // @ts-ignore
 import jwtDecode from 'jwt-decode';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { getLocalParticipant } from '../participants/functions';
 import { parseURLParams } from '../util/parseURLParams';
 
@@ -24,10 +24,10 @@ export function parseJWTFromURLParams(url: URL | Location = window.location) {
 /**
  * Returns the user name after decoding the jwt.
  *
- * @param {IState} state - The app state.
+ * @param {IReduxState} state - The app state.
  * @returns {string}
  */
-export function getJwtName(state: IState) {
+export function getJwtName(state: IReduxState) {
     const { user } = state['features/base/jwt'];
 
     return user?.name;
@@ -36,13 +36,13 @@ export function getJwtName(state: IState) {
 /**
  * Check if the given JWT feature is enabled.
  *
- * @param {IState} state - The app state.
+ * @param {IReduxState} state - The app state.
  * @param {string} feature - The feature we want to check.
  * @param {boolean} ifNoToken - Default value if there is no token.
  * @param {boolean} ifNotInFeatures - Default value if features prop exists but does not have the {@code feature}.
  * @returns {bolean}
  */
-export function isJwtFeatureEnabled(state: IState, feature: string, ifNoToken = false, ifNotInFeatures = false) {
+export function isJwtFeatureEnabled(state: IReduxState, feature: string, ifNoToken = false, ifNotInFeatures = false) {
     const { jwt } = state['features/base/jwt'];
 
     if (!jwt) {
diff --git a/react/features/base/jwt/middleware.ts b/react/features/base/jwt/middleware.ts
index aecc7d16e..dec41abaa 100644
--- a/react/features/base/jwt/middleware.ts
+++ b/react/features/base/jwt/middleware.ts
@@ -7,7 +7,7 @@ import { SET_CONFIG } from '../config/actionTypes';
 import { SET_LOCATION_URL } from '../connection/actionTypes';
 import { participantUpdated } from '../participants/actions';
 import { getLocalParticipant } from '../participants/functions';
-import { Participant } from '../participants/types';
+import { IParticipant } from '../participants/types';
 import MiddlewareRegistry from '../redux/MiddlewareRegistry';
 
 import { SET_JWT } from './actionTypes';
@@ -56,7 +56,7 @@ function _overwriteLocalParticipant(
 
     if ((avatarURL || email || name)
             && (localParticipant = getLocalParticipant(getState))) {
-        const newProperties: Participant = {
+        const newProperties: IParticipant = {
             id: localParticipant.id,
             local: true
         };
@@ -191,7 +191,7 @@ function _undoOverwriteLocalParticipant(
 
     if ((avatarURL || name || email)
             && (localParticipant = getLocalParticipant(getState))) {
-        const newProperties: Participant = {
+        const newProperties: IParticipant = {
             id: localParticipant.id,
             local: true
         };
diff --git a/react/features/base/label/components/web/Label.tsx b/react/features/base/label/components/web/Label.tsx
index c0017e556..aa08183fc 100644
--- a/react/features/base/label/components/web/Label.tsx
+++ b/react/features/base/label/components/web/Label.tsx
@@ -6,7 +6,7 @@ import Icon from '../../../icons/components/Icon';
 import { withPixelLineHeight } from '../../../styles/functions.web';
 import { COLORS } from '../../constants';
 
-interface Props {
+interface IProps {
 
     /**
      * Own CSS class name.
@@ -89,7 +89,7 @@ const Label = ({
     id,
     onClick,
     text
-}: Props) => {
+}: IProps) => {
     const { classes, cx } = useStyles();
 
     return (
diff --git a/react/features/base/media/subscriber.ts b/react/features/base/media/subscriber.ts
index 8c7188ccd..524f2d257 100644
--- a/react/features/base/media/subscriber.ts
+++ b/react/features/base/media/subscriber.ts
@@ -1,4 +1,4 @@
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import StateListenerRegistry from '../redux/StateListenerRegistry';
 
 
@@ -8,7 +8,7 @@ declare let APP: any;
  * Notifies when the local audio mute state changes.
  */
 StateListenerRegistry.register(
-    /* selector */ (state: IState) => state['features/base/media'].audio.muted,
+    /* selector */ (state: IReduxState) => state['features/base/media'].audio.muted,
     /* listener */ (muted: boolean, store: IStore, previousMuted: boolean) => {
         if (typeof APP !== 'object') {
             return;
diff --git a/react/features/base/net-info/selectors.ts b/react/features/base/net-info/selectors.ts
index a00a41db3..aeaaacae0 100644
--- a/react/features/base/net-info/selectors.ts
+++ b/react/features/base/net-info/selectors.ts
@@ -1,13 +1,13 @@
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 
 import { STORE_NAME } from './constants';
 
 /**
  * A selector for the internet online status.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {boolean}
  */
-export function isOnline(state: IState) {
+export function isOnline(state: IReduxState) {
     return state[STORE_NAME].isOnline;
 }
diff --git a/react/features/base/participants/actions.ts b/react/features/base/participants/actions.ts
index 8924767eb..e6dd75209 100644
--- a/react/features/base/participants/actions.ts
+++ b/react/features/base/participants/actions.ts
@@ -36,7 +36,7 @@ import {
     getVirtualScreenshareParticipantOwnerId
 } from './functions';
 import logger from './logger';
-import { FakeParticipant, Participant } from './types';
+import { FakeParticipant, IParticipant } from './types';
 
 /**
  * Create an action for when dominant speaker changes.
@@ -153,13 +153,13 @@ export function localParticipantIdChanged(id: string) {
 /**
  * Action to signal that a local participant has joined.
  *
- * @param {Participant} participant={} - Information about participant.
+ * @param {IParticipant} participant={} - Information about participant.
  * @returns {{
  *     type: PARTICIPANT_JOINED,
- *     participant: Participant
+ *     participant: IParticipant
  * }}
  */
-export function localParticipantJoined(participant: Participant = { id: '' }) {
+export function localParticipantJoined(participant: IParticipant = { id: '' }) {
     return participantJoined(set(participant, 'local', true));
 }
 
@@ -254,13 +254,13 @@ export function participantConnectionStatusChanged(id: string, connectionStatus:
 /**
  * Action to signal that a participant has joined.
  *
- * @param {Participant} participant - Information about participant.
+ * @param {IParticipant} participant - Information about participant.
  * @returns {{
  *     type: PARTICIPANT_JOINED,
- *     participant: Participant
+ *     participant: IParticipant
  * }}
  */
-export function participantJoined(participant: Participant) {
+export function participantJoined(participant: IParticipant) {
     // Only the local participant is not identified with an id-conference pair.
     if (participant.local) {
         return {
@@ -304,7 +304,7 @@ export function participantJoined(participant: Participant) {
  * @param {JitsiParticipant} jitsiParticipant - The ID of the participant.
  * @returns {{
 *     type: PARTICIPANT_UPDATED,
-*     participant: Participant
+*     participant: IParticipant
 * }}
 */
 export function updateRemoteParticipantFeatures(jitsiParticipant: any) {
@@ -471,16 +471,16 @@ export function screenshareParticipantDisplayNameChanged(id: string, name: strin
 /**
  * Action to signal that some of participant properties has been changed.
  *
- * @param {Participant} participant={} - Information about participant. To
+ * @param {IParticipant} participant={} - Information about participant. To
  * identify the participant the object should contain either property id with
  * value the id of the participant or property local with value true (if the
  * local participant hasn't joined the conference yet).
  * @returns {{
  *     type: PARTICIPANT_UPDATED,
- *     participant: Participant
+ *     participant: IParticipant
  * }}
  */
-export function participantUpdated(participant: Participant = { id: '' }) {
+export function participantUpdated(participant: IParticipant = { id: '' }) {
     const participantToUpdate = {
         ...participant
     };
@@ -645,7 +645,7 @@ export function raiseHand(enabled: boolean) {
  *      participant: Object
  * }}
  */
-export function raiseHandUpdateQueue(participant: Participant) {
+export function raiseHandUpdateQueue(participant: IParticipant) {
     return {
         type: RAISE_HAND_UPDATED,
         participant
@@ -689,7 +689,7 @@ export function overwriteParticipantName(id: string, name: string) {
  * @param {Array<Object>} participantList - The list of participants to overwrite.
  * @returns {Object}
  */
-export function overwriteParticipantsNames(participantList: Participant[]) {
+export function overwriteParticipantsNames(participantList: IParticipant[]) {
     return {
         type: OVERWRITE_PARTICIPANTS_NAMES,
         participantList
diff --git a/react/features/base/participants/functions.ts b/react/features/base/participants/functions.ts
index c41022894..60a5dbd6b 100644
--- a/react/features/base/participants/functions.ts
+++ b/react/features/base/participants/functions.ts
@@ -2,7 +2,7 @@
 // @ts-ignore
 import { getGravatarURL } from '@jitsi/js-utils/avatar';
 
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 // @ts-ignore
 import { isStageFilmstripAvailable } from '../../filmstrip/functions';
 import { IStateful } from '../app/types';
@@ -23,7 +23,7 @@ import {
 } from './constants';
 // @ts-ignore
 import { preloadImage } from './preloadImage';
-import { FakeParticipant, Participant } from './types';
+import { FakeParticipant, IParticipant } from './types';
 
 /**
  * Temp structures for avatar urls to be checked/preloaded.
@@ -32,16 +32,16 @@ const AVATAR_QUEUE: Object[] = [];
 const AVATAR_CHECKED_URLS = new Map();
 /* eslint-disable arrow-body-style, no-unused-vars */
 const AVATAR_CHECKER_FUNCTIONS = [
-    (participant: Participant) => {
+    (participant: IParticipant) => {
         return isJigasiParticipant(participant) ? JIGASI_PARTICIPANT_ICON : null;
     },
-    (participant: Participant) => {
+    (participant: IParticipant) => {
         return isWhiteboardParticipant(participant) ? WHITEBOARD_PARTICIPANT_ICON : null;
     },
-    (participant: Participant) => {
+    (participant: IParticipant) => {
         return participant?.avatarURL ? participant.avatarURL : null;
     },
-    (participant: Participant, store: IStore) => {
+    (participant: IParticipant, store: IStore) => {
         const config = store.getState()['features/base/config'];
         const isGravatarDisabled = config.gravatar?.disabled;
 
@@ -132,7 +132,7 @@ export function getActiveSpeakersToBeDisplayed(stateful: IStateful) {
  * @param {Store} store - Redux store.
  * @returns {Promise}
  */
-export function getFirstLoadableAvatarUrl(participant: Participant, store: IStore) {
+export function getFirstLoadableAvatarUrl(participant: IParticipant, store: IStore) {
     const deferred: any = createDeferred();
     const fullPromise = deferred.promise
         .then(() => _getFirstLoadableAvatarUrl(participant, store))
@@ -162,7 +162,7 @@ export function getFirstLoadableAvatarUrl(participant: Participant, store: IStor
  * @param {(Function|Object)} stateful - The (whole) redux state, or redux's
  * {@code getState} function to be used to retrieve the state
  * features/base/participants.
- * @returns {(Participant|undefined)}
+ * @returns {(IParticipant|undefined)}
  */
 export function getLocalParticipant(stateful: IStateful) {
     const state = toState(stateful)['features/base/participants'];
@@ -175,7 +175,7 @@ export function getLocalParticipant(stateful: IStateful) {
  *
  * @param {(Function|Object)} stateful - The (whole) redux state, or redux's
  * {@code getState} function to be used to retrieve the state features/base/participants.
- * @returns {(Participant|undefined)}
+ * @returns {(IParticipant|undefined)}
  */
 export function getLocalScreenShareParticipant(stateful: IStateful) {
     const state = toState(stateful)['features/base/participants'];
@@ -189,7 +189,7 @@ export function getLocalScreenShareParticipant(stateful: IStateful) {
  * @param {(Function|Object)} stateful - The (whole) redux state, or redux's {@code getState} function to be used to
  * retrieve the state features/base/participants.
  * @param {string} id - The owner ID of the screenshare participant to retrieve.
- * @returns {(Participant|undefined)}
+ * @returns {(IParticipant|undefined)}
  */
 export function getVirtualScreenshareParticipantByOwnerId(stateful: IStateful, id: string) {
     const state = toState(stateful);
@@ -226,9 +226,9 @@ export function getNormalizedDisplayName(name: string) {
  * features/base/participants.
  * @param {string} id - The ID of the participant to retrieve.
  * @private
- * @returns {(Participant|undefined)}
+ * @returns {(IParticipant|undefined)}
  */
-export function getParticipantById(stateful: IStateful, id: string): Participant | undefined {
+export function getParticipantById(stateful: IStateful, id: string): IParticipant | undefined {
     const state = toState(stateful)['features/base/participants'];
     const { local, localScreenShare, remote } = state;
 
@@ -245,7 +245,7 @@ export function getParticipantById(stateful: IStateful, id: string): Participant
  * {@code getState} function to be used to retrieve the state
  * features/base/participants.
  * @param {string|undefined} [participantID] - An optional partipantID argument.
- * @returns {Participant|undefined}
+ * @returns {IParticipant|undefined}
  */
 export function getParticipantByIdOrUndefined(stateful: IStateful, participantID?: string) {
     return participantID ? getParticipantById(stateful, participantID) : getLocalParticipant(stateful);
@@ -294,7 +294,7 @@ export function getVirtualScreenshareParticipantOwnerId(id: string) {
  * @param {(Function|Object)} stateful - The (whole) redux state, or redux's
  * {@code getState} function to be used to retrieve the state
  * features/base/participants.
- * @returns {Map<string, Participant>} - The Map with fake participants.
+ * @returns {Map<string, IParticipant>} - The Map with fake participants.
  */
 export function getFakeParticipants(stateful: IStateful) {
     return toState(stateful)['features/base/participants'].fakeParticipants;
@@ -303,41 +303,41 @@ export function getFakeParticipants(stateful: IStateful) {
 /**
  * Returns whether the fake participant is Jigasi.
  *
- * @param {Participant|undefined} participant - The participant entity.
+ * @param {IParticipant|undefined} participant - The participant entity.
  * @returns {boolean} - True if it's a Jigasi participant.
  */
-function isJigasiParticipant(participant?: Participant): boolean {
+function isJigasiParticipant(participant?: IParticipant): boolean {
     return participant?.fakeParticipant === FakeParticipant.Jigasi;
 }
 
 /**
  * Returns whether the fake participant is a local screenshare.
  *
- * @param {Participant|undefined} participant - The participant entity.
+ * @param {IParticipant|undefined} participant - The participant entity.
  * @returns {boolean} - True if it's a local screenshare participant.
  */
-export function isLocalScreenshareParticipant(participant?: Participant): boolean {
+export function isLocalScreenshareParticipant(participant?: IParticipant): boolean {
     return participant?.fakeParticipant === FakeParticipant.LocalScreenShare;
 }
 
 /**
  * Returns whether the fake participant is a remote screenshare.
  *
- * @param {Participant|undefined} participant - The participant entity.
+ * @param {IParticipant|undefined} participant - The participant entity.
  * @returns {boolean} - True if it's a remote screenshare participant.
  */
-export function isRemoteScreenshareParticipant(participant?: Participant): boolean {
+export function isRemoteScreenshareParticipant(participant?: IParticipant): boolean {
     return participant?.fakeParticipant === FakeParticipant.RemoteScreenShare;
 }
 
 /**
  * Returns whether the fake participant is of local or virtual screenshare type.
  *
- * @param {IState} state - The (whole) redux state, or redux's.
+ * @param {IReduxState} state - The (whole) redux state, or redux's.
  * @param {string|undefined} participantId - The participant id.
  * @returns {boolean} - True if it's one of the two.
  */
-export function isScreenShareParticipantById(state: IState, participantId?: string): boolean {
+export function isScreenShareParticipantById(state: IReduxState, participantId?: string): boolean {
     const participant = getParticipantByIdOrUndefined(state, participantId);
 
     return isScreenShareParticipant(participant);
@@ -346,30 +346,30 @@ export function isScreenShareParticipantById(state: IState, participantId?: stri
 /**
  * Returns whether the fake participant is of local or virtual screenshare type.
  *
- * @param {Participant|undefined} participant - The participant entity.
+ * @param {IParticipant|undefined} participant - The participant entity.
  * @returns {boolean} - True if it's one of the two.
  */
-export function isScreenShareParticipant(participant?: Participant): boolean {
+export function isScreenShareParticipant(participant?: IParticipant): boolean {
     return isLocalScreenshareParticipant(participant) || isRemoteScreenshareParticipant(participant);
 }
 
 /**
  * Returns whether the (fake) participant is a shared video.
  *
- * @param {Participant|undefined} participant - The participant entity.
+ * @param {IParticipant|undefined} participant - The participant entity.
  * @returns {boolean} - True if it's a shared video participant.
  */
-export function isSharedVideoParticipant(participant?: Participant): boolean {
+export function isSharedVideoParticipant(participant?: IParticipant): boolean {
     return participant?.fakeParticipant === FakeParticipant.SharedVideo;
 }
 
 /**
  * Returns whether the fake participant is a whiteboard.
  *
- * @param {Participant|undefined} participant - The participant entity.
+ * @param {IParticipant|undefined} participant - The participant entity.
  * @returns {boolean} - True if it's a whiteboard participant.
  */
-export function isWhiteboardParticipant(participant?: Participant): boolean {
+export function isWhiteboardParticipant(participant?: IParticipant): boolean {
     return participant?.fakeParticipant === FakeParticipant.Whiteboard;
 }
 
@@ -501,7 +501,7 @@ export function getParticipantPresenceStatus(stateful: IStateful, id: string) {
  * features/base/participants.
  * @returns {Map<string, Object>}
  */
-export function getRemoteParticipants(stateful: IStateful): Map<string, Participant> {
+export function getRemoteParticipants(stateful: IStateful): Map<string, IParticipant> {
     return toState(stateful)['features/base/participants'].remote;
 }
 
@@ -522,7 +522,7 @@ export function getRemoteParticipantsSorted(stateful: IStateful) {
  * @param {(Function|Object)} stateful - The (whole) redux state, or redux's
  * {@code getState} function to be used to retrieve the state
  * features/base/participants.
- * @returns {(Participant|undefined)}
+ * @returns {(IParticipant|undefined)}
  */
 export function getPinnedParticipant(stateful: IStateful) {
     const state = toState(stateful);
@@ -549,7 +549,7 @@ export function getPinnedParticipant(stateful: IStateful) {
  * @param {string} participant - Participant object.
  * @returns {boolean}
  */
-export function isParticipantModerator(participant?: Participant) {
+export function isParticipantModerator(participant?: IParticipant) {
     return participant?.role === PARTICIPANT_ROLE.MODERATOR;
 }
 
@@ -558,7 +558,7 @@ export function isParticipantModerator(participant?: Participant) {
  *
  * @param {(Function|Object)} stateful - The (whole) redux state or redux's
  * {@code getState} function to be used to retrieve the state features/base/participants.
- * @returns {Participant} - The participant from the redux store.
+ * @returns {IParticipant} - The participant from the redux store.
  */
 export function getDominantSpeakerParticipant(stateful: IStateful) {
     const state = toState(stateful)['features/base/participants'];
@@ -621,7 +621,7 @@ export function isLocalParticipantModerator(stateful: IStateful) {
  * @param {Store} store - Redux store.
  * @returns {?string}
  */
-async function _getFirstLoadableAvatarUrl(participant: Participant, store: IStore) {
+async function _getFirstLoadableAvatarUrl(participant: IParticipant, store: IStore) {
     for (let i = 0; i < AVATAR_CHECKER_FUNCTIONS.length; i++) {
         const url = AVATAR_CHECKER_FUNCTIONS[i](participant, store);
 
@@ -683,6 +683,6 @@ export function getRaiseHandsQueue(stateful: IStateful): Array<{ id: string; rai
  * @param {Object} participant - The participant.
  * @returns {boolean} - Whether participant has raise hand or not.
  */
-export function hasRaisedHand(participant?: Participant): boolean {
+export function hasRaisedHand(participant?: IParticipant): boolean {
     return Boolean(participant?.raisedHandTimestamp);
 }
diff --git a/react/features/base/participants/reducer.ts b/react/features/base/participants/reducer.ts
index 98c0be1cb..92b5286ab 100644
--- a/react/features/base/participants/reducer.ts
+++ b/react/features/base/participants/reducer.ts
@@ -23,7 +23,7 @@ import {
     isRemoteScreenshareParticipant,
     isScreenShareParticipant
 } from './functions';
-import { LocalParticipant, Participant } from './types';
+import { ILocalParticipant, IParticipant } from './types';
 
 /**
  * Participant object.
@@ -81,13 +81,13 @@ const DEFAULT_STATE = {
 export interface IParticipantsState {
     dominantSpeaker?: string;
     everyoneIsModerator: boolean;
-    fakeParticipants: Map<string, Participant>;
-    local?: LocalParticipant;
-    localScreenShare?: Participant;
+    fakeParticipants: Map<string, IParticipant>;
+    local?: ILocalParticipant;
+    localScreenShare?: IParticipant;
     overwrittenNameList: { [id: string]: string; };
     pinnedParticipant?: string;
     raisedHandsQueue: Array<{ id: string; raisedHandTimestamp: number; }>;
-    remote: Map<string, Participant>;
+    remote: Map<string, IParticipant>;
     sortedRemoteParticipants: Map<string, string>;
     sortedRemoteScreenshares: Map<string, string>;
     sortedRemoteVirtualScreenshareParticipants: Map<string, string>;
@@ -98,12 +98,12 @@ export interface IParticipantsState {
  * Listen for actions which add, remove, or update the set of participants in
  * the conference.
  *
- * @param {Participant[]} state - List of participants to be modified.
+ * @param {IParticipant[]} state - List of participants to be modified.
  * @param {Object} action - Action object.
  * @param {string} action.type - Type of action.
- * @param {Participant} action.participant - Information about participant to be
+ * @param {IParticipant} action.participant - Information about participant to be
  * added/removed/modified.
- * @returns {Participant[]}
+ * @returns {IParticipant[]}
  */
 ReducerRegistry.register<IParticipantsState>('features/base/participants',
 (state = DEFAULT_STATE, action): IParticipantsState => {
@@ -200,7 +200,7 @@ ReducerRegistry.register<IParticipantsState>('features/base/participants',
             id = LOCAL_PARTICIPANT_DEFAULT_ID;
         }
 
-        let newParticipant: Participant | null = null;
+        let newParticipant: IParticipant | null = null;
 
         if (state.remote.has(id)) {
             newParticipant = _participant(state.remote.get(id), action);
@@ -462,16 +462,17 @@ function _isEveryoneModerator(state: IParticipantsState) {
 /**
  * Reducer function for a single participant.
  *
- * @param {Participant|undefined} state - Participant to be modified.
+ * @param {IParticipant|undefined} state - Participant to be modified.
  * @param {Object} action - Action object.
  * @param {string} action.type - Type of action.
- * @param {Participant} action.participant - Information about participant to be
+ * @param {IParticipant} action.participant - Information about participant to be
  * added/modified.
  * @param {JitsiConference} action.conference - Conference instance.
  * @private
- * @returns {Participant}
+ * @returns {IParticipant}
  */
-function _participant(state: Participant | LocalParticipant = { id: '' }, action: any): Participant | LocalParticipant {
+function _participant(state: IParticipant | ILocalParticipant = { id: '' },
+        action: any): IParticipant | ILocalParticipant {
     switch (action.type) {
     case SET_LOADABLE_AVATAR_URL:
     case PARTICIPANT_UPDATED: {
@@ -507,7 +508,7 @@ function _participant(state: Participant | LocalParticipant = { id: '' }, action
  * base/participants after the reduction of the specified
  * {@code action}.
  */
-function _participantJoined({ participant }: { participant: Participant; }) {
+function _participantJoined({ participant }: { participant: IParticipant; }) {
     const {
         avatarURL,
         botType,
@@ -572,18 +573,18 @@ function _updateParticipantProperty(state: IParticipantsState, id: string, prope
         remote.set(id, set(remote.get(id) ?? {
             id: '',
             name: ''
-        }, property as keyof Participant, value));
+        }, property as keyof IParticipant, value));
 
         return true;
     } else if (local?.id === id || local?.id === 'local') {
         // The local participant's ID can chance from something to "local" when
         // not in a conference.
-        state.local = set(local, property as keyof LocalParticipant, value);
+        state.local = set(local, property as keyof ILocalParticipant, value);
 
         return true;
 
     } else if (localScreenShare?.id === id) {
-        state.localScreenShare = set(localScreenShare, property as keyof Participant, value);
+        state.localScreenShare = set(localScreenShare, property as keyof IParticipant, value);
 
         return true;
     }
diff --git a/react/features/base/participants/types.ts b/react/features/base/participants/types.ts
index c7210bb53..3c9a67087 100644
--- a/react/features/base/participants/types.ts
+++ b/react/features/base/participants/types.ts
@@ -6,7 +6,7 @@ export enum FakeParticipant {
     Whiteboard = 'Whiteboard'
 }
 
-export interface Participant {
+export interface IParticipant {
     avatarURL?: string;
     botType?: string;
     conference?: Object;
@@ -39,7 +39,7 @@ export interface Participant {
     supportsRemoteControl?: boolean;
 }
 
-export interface LocalParticipant extends Participant {
+export interface ILocalParticipant extends IParticipant {
     audioOutputDeviceId?: string;
     cameraDeviceId?: string;
     jwtId?: string;
diff --git a/react/features/base/premeeting/components/web/ConnectionStatus.tsx b/react/features/base/premeeting/components/web/ConnectionStatus.tsx
index a75772eda..4c363dbfd 100644
--- a/react/features/base/premeeting/components/web/ConnectionStatus.tsx
+++ b/react/features/base/premeeting/components/web/ConnectionStatus.tsx
@@ -3,7 +3,7 @@ import React, { useCallback, useState } from 'react';
 import { WithTranslation } from 'react-i18next';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../../app/types';
+import { IReduxState } from '../../../../app/types';
 import { translate } from '../../../i18n/functions';
 import Icon from '../../../icons/components/Icon';
 import { IconArrowDownSmall, IconWifi1Bar, IconWifi2Bars, IconWifi3Bars } from '../../../icons/svg';
@@ -12,7 +12,7 @@ import { PREJOIN_DEFAULT_CONTENT_WIDTH } from '../../../ui/components/variables'
 import { CONNECTION_TYPE } from '../../constants';
 import { getConnectionData } from '../../functions';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * List of strings with details about the connection.
@@ -145,10 +145,10 @@ const CONNECTION_TYPE_MAP: {
 /**
  * Component displaying information related to the connection & audio/video quality.
  *
- * @param {Props} props - The props of the component.
+ * @param {IProps} props - The props of the component.
  * @returns {ReactElement}
  */
-function ConnectionStatus({ connectionDetails, t, connectionType }: Props) {
+function ConnectionStatus({ connectionDetails, t, connectionType }: IProps) {
     const { classes } = useStyles();
 
     const [ showDetails, toggleDetails ] = useState(false);
@@ -219,7 +219,7 @@ function ConnectionStatus({ connectionDetails, t, connectionType }: Props) {
  * @param {Object} state - The redux state.
  * @returns {Object}
  */
-function mapStateToProps(state: IState): Object {
+function mapStateToProps(state: IReduxState): Object {
     const { connectionDetails, connectionType } = getConnectionData(state);
 
     return {
diff --git a/react/features/base/premeeting/components/web/PreMeetingScreen.tsx b/react/features/base/premeeting/components/web/PreMeetingScreen.tsx
index 57a01e213..2d21ffb5a 100644
--- a/react/features/base/premeeting/components/web/PreMeetingScreen.tsx
+++ b/react/features/base/premeeting/components/web/PreMeetingScreen.tsx
@@ -3,7 +3,7 @@ import { Theme } from '@mui/material';
 import React, { ReactNode } from 'react';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../../app/types';
+import { IReduxState } from '../../../../app/types';
 import DeviceStatus from '../../../../prejoin/components/preview/DeviceStatus';
 // @ts-ignore
 import { Toolbox } from '../../../../toolbox/components/web';
@@ -17,7 +17,7 @@ import ConnectionStatus from './ConnectionStatus';
 // @ts-ignore
 import Preview from './Preview';
 
-interface Props {
+interface IProps {
 
     /**
      * The list of toolbar buttons to render.
@@ -111,7 +111,7 @@ const PreMeetingScreen = ({
     title,
     videoMuted,
     videoTrack
-}: Props) => {
+}: IProps) => {
     const { classes } = useStyles();
     const containerClassName = `premeeting-screen ${className ? className : ''}`;
     const style = _premeetingBackground ? {
@@ -157,7 +157,7 @@ const PreMeetingScreen = ({
  * @param {Object} ownProps - The props passed to the component.
  * @returns {Object}
  */
-function mapStateToProps(state: IState, ownProps: Partial<Props>) {
+function mapStateToProps(state: IReduxState, ownProps: Partial<IProps>) {
     const { hiddenPremeetingButtons, hideConferenceSubject } = state['features/base/config'];
     const toolbarButtons = getToolbarButtons(state);
     const premeetingButtons = (ownProps.thirdParty
diff --git a/react/features/base/premeeting/functions.ts b/react/features/base/premeeting/functions.ts
index 6c2791486..613de0c85 100644
--- a/react/features/base/premeeting/functions.ts
+++ b/react/features/base/premeeting/functions.ts
@@ -1,6 +1,6 @@
 import { findIndex } from 'lodash';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 
 import { CONNECTION_TYPE } from './constants';
 
@@ -191,7 +191,7 @@ function _getConnectionDataFromTestResults({ fractionalLoss: l, throughput: t }:
  *   connectionDetails: string[]
  * }}
  */
-export function getConnectionData(state: IState) {
+export function getConnectionData(state: IReduxState) {
     const { precallTestResults } = state['features/prejoin'];
 
     if (precallTestResults) {
diff --git a/react/features/base/react/components/web/BaseIndicator.tsx b/react/features/base/react/components/web/BaseIndicator.tsx
index 300a5eef6..e6db20c44 100644
--- a/react/features/base/react/components/web/BaseIndicator.tsx
+++ b/react/features/base/react/components/web/BaseIndicator.tsx
@@ -11,7 +11,7 @@ import { Tooltip } from '../../../tooltip';
 /**
  * The type of the React {@code Component} props of {@link BaseIndicator}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Additional CSS class name.
@@ -89,7 +89,7 @@ const BaseIndicator = ({
     t,
     tooltipKey,
     tooltipPosition = 'top'
-}: Props) => {
+}: IProps) => {
     const { classes: styles } = useStyles();
     const style: any = {};
 
diff --git a/react/features/base/react/types.ts b/react/features/base/react/types.ts
index a855028a3..de576f1a4 100644
--- a/react/features/base/react/types.ts
+++ b/react/features/base/react/types.ts
@@ -1,4 +1,4 @@
-export interface IconButtonProps {
+export interface IIconButtonProps {
     accessibilityLabel?: string;
     color?: string;
     disabled?: boolean;
diff --git a/react/features/base/redux/MiddlewareRegistry.ts b/react/features/base/redux/MiddlewareRegistry.ts
index a67df7af6..816c152ce 100644
--- a/react/features/base/redux/MiddlewareRegistry.ts
+++ b/react/features/base/redux/MiddlewareRegistry.ts
@@ -1,6 +1,6 @@
 import { Middleware, applyMiddleware } from 'redux';
 
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 
 /**
  * A registry for Redux middleware, allowing features to register their
@@ -42,7 +42,7 @@ class MiddlewareRegistry {
      * @param {Middleware} middleware - A Redux middleware.
      * @returns {void}
      */
-    register(middleware: Middleware<any, IState, IStore['dispatch']>) {
+    register(middleware: Middleware<any, IReduxState, IStore['dispatch']>) {
         this._elements.push(middleware);
     }
 }
diff --git a/react/features/base/redux/StateListenerRegistry.ts b/react/features/base/redux/StateListenerRegistry.ts
index d8e27e69a..6478dfe3a 100644
--- a/react/features/base/redux/StateListenerRegistry.ts
+++ b/react/features/base/redux/StateListenerRegistry.ts
@@ -1,6 +1,6 @@
 import { Store } from 'redux';
 
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 
 import { equals } from './functions';
 import logger from './logger';
@@ -26,7 +26,7 @@ type Listener
  * The type selector supported for registration with
  * {@link StateListenerRegistry} in association with a {@link Listener}.
  *
- * @param {IState} state - The redux state from which the {@code Selector} is to
+ * @param {IReduxState} state - The redux state from which the {@code Selector} is to
  * derive data.
  * @param {any} prevSelection - The value previously derived from the redux
  * store/state by the {@code Selector}. Provided in case the {@code Selector}
@@ -36,7 +36,7 @@ type Listener
  * {@code prevSelection}. The associated {@code Listener} will only be invoked
  * if the returned value is other than {@code prevSelection}.
  */
-type Selector = (state: IState, prevSelection: any) => any;
+type Selector = (state: IReduxState, prevSelection: any) => any;
 
 /**
  * Options that can be passed to the register method.
diff --git a/react/features/base/redux/functions.ts b/react/features/base/redux/functions.ts
index 100802134..3ce849efa 100644
--- a/react/features/base/redux/functions.ts
+++ b/react/features/base/redux/functions.ts
@@ -1,7 +1,7 @@
 import _ from 'lodash';
 import { connect as reduxConnect } from 'react-redux';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { IStateful } from '../app/types';
 
 /**
@@ -136,7 +136,7 @@ function _set<T extends Object>(
  * returned.
  * @returns {Object} The redux state.
  */
-export function toState(stateful: IStateful): IState {
+export function toState(stateful: IStateful): IReduxState {
     if (stateful) {
         if (typeof stateful === 'function') {
             return stateful();
diff --git a/react/features/base/settings/functions.any.ts b/react/features/base/settings/functions.any.ts
index 47b75fe09..603af749b 100644
--- a/react/features/base/settings/functions.any.ts
+++ b/react/features/base/settings/functions.any.ts
@@ -1,4 +1,4 @@
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { IStateful } from '../app/types';
 import CONFIG_WHITELIST from '../config/configWhitelist';
 import { IConfigState } from '../config/reducer';
@@ -263,7 +263,7 @@ function _getUserSelectedDeviceId(options: {
  * @param {Object} state - The state of the application.
  * @returns {boolean}
  */
-export function shouldHideShareAudioHelper(state: IState): boolean | undefined {
+export function shouldHideShareAudioHelper(state: IReduxState): boolean | undefined {
 
     return state['features/base/settings'].hideShareAudioHelper;
 }
@@ -274,7 +274,7 @@ export function shouldHideShareAudioHelper(state: IState): boolean | undefined {
  * @param {Object} state - Redux state.
  * @returns {boolean}
  */
-export function shouldHideSelfView(state: IState) {
+export function shouldHideSelfView(state: IReduxState) {
     return getParticipantCount(state) === 1 ? false : getHideSelfView(state);
 }
 
@@ -284,6 +284,6 @@ export function shouldHideSelfView(state: IState) {
  * @param {Object} state - Redux state.
  * @returns {boolean}
  */
-export function getHideSelfView(state: IState) {
+export function getHideSelfView(state: IReduxState) {
     return state['features/base/config'].disableSelfView || state['features/base/settings'].disableSelfView;
 }
diff --git a/react/features/base/settings/functions.web.ts b/react/features/base/settings/functions.web.ts
index 0819fba6f..a39ff1392 100644
--- a/react/features/base/settings/functions.web.ts
+++ b/react/features/base/settings/functions.web.ts
@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 
 export * from './functions.any';
 
@@ -9,7 +9,7 @@ export * from './functions.any';
  * @param {Object} state - The state of the application.
  * @returns {void}
  */
-export function getCurrentCameraDeviceId(state: IState) {
+export function getCurrentCameraDeviceId(state: IReduxState) {
     return getDeviceIdByType(state, 'isVideoTrack');
 }
 
@@ -19,7 +19,7 @@ export function getCurrentCameraDeviceId(state: IState) {
  * @param {Object} state - The state of the application.
  * @returns {void}
  */
-export function getCurrentMicDeviceId(state: IState) {
+export function getCurrentMicDeviceId(state: IReduxState) {
     return getDeviceIdByType(state, 'isAudioTrack');
 }
 
@@ -29,7 +29,7 @@ export function getCurrentMicDeviceId(state: IState) {
  * @param {Object} state - The state of the application.
  * @returns {void}
  */
-export function getCurrentOutputDeviceId(state: IState) {
+export function getCurrentOutputDeviceId(state: IReduxState) {
     return state['features/base/settings'].audioOutputDeviceId;
 }
 
@@ -40,7 +40,7 @@ export function getCurrentOutputDeviceId(state: IState) {
  * @param {string} isType - Can be 'isVideoTrack' | 'isAudioTrack'.
  * @returns {string}
  */
-function getDeviceIdByType(state: IState, isType: string) {
+function getDeviceIdByType(state: IReduxState, isType: string) {
     const [ deviceId ] = state['features/base/tracks']
         .map(t => t.jitsiTrack)
         .filter(t => t?.isLocal() && t[isType as keyof typeof t]())
@@ -55,7 +55,7 @@ function getDeviceIdByType(state: IState, isType: string) {
  * @param {Object} state - The state of the application.
  * @returns {string}
  */
-export function getDisplayName(state: IState): string {
+export function getDisplayName(state: IReduxState): string {
     return state['features/base/settings'].displayName || '';
 }
 
diff --git a/react/features/base/sounds/functions.any.ts b/react/features/base/sounds/functions.any.ts
index ddb586657..9738f676a 100644
--- a/react/features/base/sounds/functions.any.ts
+++ b/react/features/base/sounds/functions.any.ts
@@ -1,4 +1,4 @@
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 
 /**
  * Selector for retrieving the disabled sounds array.
@@ -6,6 +6,6 @@ import { IState } from '../../app/types';
  * @param {Object} state - The Redux state.
  * @returns {Array<string>} - The disabled sound id's array.
  */
-export function getDisabledSounds(state: IState) {
+export function getDisabledSounds(state: IReduxState) {
     return state['features/base/config'].disabledSounds || [];
 }
diff --git a/react/features/base/testing/functions.ts b/react/features/base/testing/functions.ts
index 34df04aef..c974b5568 100644
--- a/react/features/base/testing/functions.ts
+++ b/react/features/base/testing/functions.ts
@@ -1,4 +1,4 @@
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import { getMultipleVideoSupportFeatureFlag } from '../config/functions.any';
 import { MEDIA_TYPE, VIDEO_TYPE } from '../media/constants';
 import { getParticipantById, isScreenShareParticipant } from '../participants/functions';
@@ -9,10 +9,10 @@ import { getTrackByMediaTypeAndParticipant, getVirtualScreenshareParticipantTrac
  * {@link TestHint} and other components from the testing package will be
  * rendered in various places across the app to help with automatic testing.
  *
- * @param {IState} state - The redux store state.
+ * @param {IReduxState} state - The redux store state.
  * @returns {boolean}
  */
-export function isTestModeEnabled(state: IState): boolean {
+export function isTestModeEnabled(state: IReduxState): boolean {
     const testingConfig = state['features/base/config'].testing;
 
     return Boolean(testingConfig?.testMode);
diff --git a/react/features/base/tracks/actions.any.ts b/react/features/base/tracks/actions.any.ts
index 40e8101ef..ed0b512ac 100644
--- a/react/features/base/tracks/actions.any.ts
+++ b/react/features/base/tracks/actions.any.ts
@@ -41,7 +41,7 @@ import {
     getTrackByJitsiTrack
 } from './functions';
 import logger from './logger';
-import { TrackOptions } from './types';
+import { ITrackOptions } from './types';
 
 /**
  * Add a given local track to the conference.
@@ -131,7 +131,7 @@ export function createDesiredLocalTracks(...desiredTypes: any) {
  * @param {Object} [options] - For info @see JitsiMeetJS.createLocalTracks.
  * @returns {Function}
  */
-export function createLocalTracksA(options: TrackOptions = {}) {
+export function createLocalTracksA(options: ITrackOptions = {}) {
     return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
         const devices
             = options.devices || [ MEDIA_TYPE.AUDIO, MEDIA_TYPE.VIDEO ];
diff --git a/react/features/base/tracks/actions.native.ts b/react/features/base/tracks/actions.native.ts
index a9c879961..0bd85008d 100644
--- a/react/features/base/tracks/actions.native.ts
+++ b/react/features/base/tracks/actions.native.ts
@@ -1,5 +1,5 @@
 /* eslint-disable lines-around-comment */
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 // @ts-ignore
 import { setPictureInPictureEnabled } from '../../mobile/picture-in-picture/functions';
 import { setAudioOnly } from '../audio-only/actions';
@@ -42,7 +42,7 @@ export function toggleScreensharing(enabled: boolean): Function {
  * @param {Object} state - The redux state.
  * @returns {void}
  */
-function _startScreenSharing(dispatch: Function, state: IState) {
+function _startScreenSharing(dispatch: Function, state: IReduxState) {
     setPictureInPictureEnabled(false);
 
     JitsiMeetJS.createLocalTracks({ devices: [ 'desktop' ] })
diff --git a/react/features/base/tracks/actions.web.ts b/react/features/base/tracks/actions.web.ts
index 31fc2d508..cdd650b59 100644
--- a/react/features/base/tracks/actions.web.ts
+++ b/react/features/base/tracks/actions.web.ts
@@ -1,7 +1,7 @@
 /* eslint-disable lines-around-comment */
 // @ts-expect-error
 import { AUDIO_ONLY_SCREEN_SHARE_NO_TRACK } from '../../../../modules/UI/UIErrors';
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import { showModeratedNotification } from '../../av-moderation/actions';
 import { shouldShowModeratedNotification } from '../../av-moderation/functions';
 import { setNoiseSuppressionEnabled } from '../../noise-suppression/actions';
@@ -34,7 +34,7 @@ import {
     getLocalDesktopTrack,
     getLocalJitsiAudioTrack
 } from './functions';
-import { ShareOptions, ToggleScreenSharingOptions } from './types';
+import { IShareOptions, IToggleScreenSharingOptions } from './types';
 
 export * from './actions.any';
 
@@ -53,7 +53,7 @@ export function toggleScreensharing(
         enabled?: boolean,
         audioOnly = false,
         ignoreDidHaveVideo = false,
-        shareOptions: ShareOptions = {}) {
+        shareOptions: IShareOptions = {}) {
     return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
         // check for A/V Moderation when trying to start screen sharing
         if ((enabled || enabled === undefined)
@@ -129,7 +129,7 @@ function _handleScreensharingError(
  * @param {*} state - The redux state.
  * @returns {void}
  */
-async function _maybeApplyAudioMixerEffect(desktopAudioTrack: any, state: IState): Promise<void> {
+async function _maybeApplyAudioMixerEffect(desktopAudioTrack: any, state: IReduxState): Promise<void> {
     const localAudio = getLocalJitsiAudioTrack(state);
     const conference = getCurrentConference(state);
 
@@ -159,7 +159,7 @@ async function _toggleScreenSharing(
             enabled,
             audioOnly = false,
             shareOptions = {}
-        }: ToggleScreenSharingOptions,
+        }: IToggleScreenSharingOptions,
         store: IStore
 ): Promise<void> {
     const { dispatch, getState } = store;
diff --git a/react/features/base/tracks/functions.ts b/react/features/base/tracks/functions.ts
index 58f4d7ac2..ba054067a 100644
--- a/react/features/base/tracks/functions.ts
+++ b/react/features/base/tracks/functions.ts
@@ -1,4 +1,4 @@
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import { IStateful } from '../app/types';
 import {
     getMultipleVideoSendingSupportFeatureFlag,
@@ -13,7 +13,7 @@ import {
     getVirtualScreenshareParticipantOwnerId,
     isScreenShareParticipant
 } from '../participants/functions';
-import { Participant } from '../participants/types';
+import { IParticipant } from '../participants/types';
 import { toState } from '../redux/functions';
 import {
     getUserSelectedCameraDeviceId,
@@ -24,25 +24,25 @@ import {
 import loadEffects from './loadEffects';
 import logger from './logger';
 import { ITrack } from './reducer';
-import { TrackOptions } from './types';
+import { ITrackOptions } from './types';
 
 /**
  * Returns root tracks state.
  *
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {Object} Tracks state.
  */
-export const getTrackState = (state: IState) => state['features/base/tracks'];
+export const getTrackState = (state: IReduxState) => state['features/base/tracks'];
 
 /**
  * Checks if the passed media type is muted for the participant.
  *
- * @param {Participant} participant - Participant reference.
+ * @param {IParticipant} participant - Participant reference.
  * @param {MediaType} mediaType - Media type.
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {boolean} - Is the media type muted for the participant.
  */
-export function isParticipantMediaMuted(participant: Participant, mediaType: MediaType, state: IState) {
+export function isParticipantMediaMuted(participant: IParticipant, mediaType: MediaType, state: IReduxState) {
     if (!participant) {
         return false;
     }
@@ -61,22 +61,22 @@ export function isParticipantMediaMuted(participant: Participant, mediaType: Med
 /**
  * Checks if the participant is audio muted.
  *
- * @param {Participant} participant - Participant reference.
- * @param {IState} state - Global state.
+ * @param {IParticipant} participant - Participant reference.
+ * @param {IReduxState} state - Global state.
  * @returns {boolean} - Is audio muted for the participant.
  */
-export function isParticipantAudioMuted(participant: Participant, state: IState) {
+export function isParticipantAudioMuted(participant: IParticipant, state: IReduxState) {
     return isParticipantMediaMuted(participant, MEDIA_TYPE.AUDIO, state);
 }
 
 /**
  * Checks if the participant is video muted.
  *
- * @param {Participant} participant - Participant reference.
- * @param {IState} state - Global state.
+ * @param {IParticipant} participant - Participant reference.
+ * @param {IReduxState} state - Global state.
  * @returns {boolean} - Is video muted for the participant.
  */
-export function isParticipantVideoMuted(participant: Participant, state: IState) {
+export function isParticipantVideoMuted(participant: IParticipant, state: IReduxState) {
     return isParticipantMediaMuted(participant, MEDIA_TYPE.VIDEO, state);
 }
 
@@ -92,7 +92,7 @@ export function isParticipantVideoMuted(participant: Participant, state: IState)
  * shared.
  * @returns {Promise<JitsiLocalTrack>}
  */
-export async function createLocalPresenterTrack(options: TrackOptions, desktopHeight: number) {
+export async function createLocalPresenterTrack(options: ITrackOptions, desktopHeight: number) {
     const { cameraDeviceId } = options;
 
     // compute the constraints of the camera track based on the resolution
@@ -140,7 +140,7 @@ export async function createLocalPresenterTrack(options: TrackOptions, desktopHe
  * is to execute and from which state such as {@code config} is to be retrieved.
  * @returns {Promise<JitsiLocalTrack[]>}
  */
-export function createLocalTracksF(options: TrackOptions = {}, store?: IStore) {
+export function createLocalTracksF(options: ITrackOptions = {}, store?: IStore) {
     let { cameraDeviceId, micDeviceId } = options;
     const {
         desktopSharingSourceDevice,
@@ -325,10 +325,10 @@ export function getLocalDesktopTrack(tracks: ITrack[], includePending = false) {
 /**
  * Returns the stored local desktop jitsiLocalTrack.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {JitsiLocalTrack|undefined}
  */
-export function getLocalJitsiDesktopTrack(state: IState) {
+export function getLocalJitsiDesktopTrack(state: IReduxState) {
     const track = getLocalDesktopTrack(getTrackState(state));
 
     return track?.jitsiTrack;
@@ -400,10 +400,10 @@ export function getLocalVideoType(tracks: ITrack[]) {
 /**
  * Returns the stored local video track.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {Object}
  */
-export function getLocalJitsiVideoTrack(state: IState) {
+export function getLocalJitsiVideoTrack(state: IReduxState) {
     const track = getLocalVideoTrack(getTrackState(state));
 
     return track?.jitsiTrack;
@@ -412,10 +412,10 @@ export function getLocalJitsiVideoTrack(state: IState) {
 /**
  * Returns the stored local audio track.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {Object}
  */
-export function getLocalJitsiAudioTrack(state: IState) {
+export function getLocalJitsiAudioTrack(state: IReduxState) {
     const track = getLocalAudioTrack(getTrackState(state));
 
     return track?.jitsiTrack;
@@ -424,13 +424,13 @@ export function getLocalJitsiAudioTrack(state: IState) {
 /**
  * Returns track of specified media type for specified participant.
  *
- * @param {IState} state - The redux state.
- * @param {Participant} participant - Participant Object.
+ * @param {IReduxState} state - The redux state.
+ * @param {IParticipant} participant - Participant Object.
  * @returns {(Track|undefined)}
  */
 export function getVideoTrackByParticipant(
-        state: IState,
-        participant?: Participant) {
+        state: IReduxState,
+        participant?: IParticipant) {
 
     if (!participant) {
         return;
@@ -448,11 +448,11 @@ export function getVideoTrackByParticipant(
 /**
  * Returns source name for specified participant id.
  *
- * @param {IState} state - The Redux state.
+ * @param {IReduxState} state - The Redux state.
  * @param {string} participantId - Participant ID.
  * @returns {string | undefined}
  */
-export function getSourceNameByParticipantId(state: IState, participantId: string) {
+export function getSourceNameByParticipantId(state: IReduxState, participantId: string) {
     const participant = getParticipantByIdOrUndefined(state, participantId);
     const track = getVideoTrackByParticipant(state, participant);
 
@@ -492,11 +492,11 @@ export function getVirtualScreenshareParticipantTrack(tracks: ITrack[], virtualS
 /**
  * Returns track source names of given screen share participant ids.
  *
- * @param {IState} state - The entire redux state.
+ * @param {IReduxState} state - The entire redux state.
  * @param {string[]} screenShareParticipantIds - Participant ID.
  * @returns {(string[])}
  */
-export function getRemoteScreenSharesSourceNames(state: IState, screenShareParticipantIds = []) {
+export function getRemoteScreenSharesSourceNames(state: IReduxState, screenShareParticipantIds = []) {
     const tracks = state['features/base/tracks'];
 
     return getMultipleVideoSupportFeatureFlag(state)
@@ -611,10 +611,10 @@ export function isLocalTrackMuted(tracks: ITrack[], mediaType: MediaType) {
 /**
  * Checks if the local video track is of type DESKtOP.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {boolean}
  */
-export function isLocalVideoTrackDesktop(state: IState) {
+export function isLocalVideoTrackDesktop(state: IReduxState) {
     const videoTrack = getLocalVideoTrack(getTrackState(state));
 
     return videoTrack && videoTrack.videoType === VIDEO_TYPE.DESKTOP;
@@ -641,10 +641,10 @@ export function isRemoteTrackMuted(tracks: ITrack[], mediaType: MediaType, parti
  * Returns whether or not the current environment needs a user interaction with
  * the page before any unmute can occur.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {boolean}
  */
-export function isUserInteractionRequiredForUnmute(state: IState) {
+export function isUserInteractionRequiredForUnmute(state: IReduxState) {
     return browser.isUserInteractionRequiredForUnmute()
         && window
         && window.self !== window.top
@@ -660,7 +660,7 @@ export function isUserInteractionRequiredForUnmute(state: IState) {
  * @param {Object} state - The redux state.
  * @returns {Promise}
  */
-export function setTrackMuted(track: any, muted: boolean, state: IState) {
+export function setTrackMuted(track: any, muted: boolean, state: IReduxState) {
     muted = Boolean(muted); // eslint-disable-line no-param-reassign
 
     // Ignore the check for desktop track muted operation. When the screenshare is terminated by clicking on the
diff --git a/react/features/base/tracks/types.ts b/react/features/base/tracks/types.ts
index ea83c24d4..db72cf0a3 100644
--- a/react/features/base/tracks/types.ts
+++ b/react/features/base/tracks/types.ts
@@ -1,4 +1,4 @@
-export interface TrackOptions {
+export interface ITrackOptions {
     cameraDeviceId?: string | null;
     constraints?: {
         video?: {
@@ -18,13 +18,13 @@ export interface TrackOptions {
     timeout?: number;
 }
 
-export interface ToggleScreenSharingOptions {
+export interface IToggleScreenSharingOptions {
     audioOnly: boolean;
     enabled?: boolean;
-    shareOptions: ShareOptions;
+    shareOptions: IShareOptions;
 }
 
-export interface ShareOptions {
+export interface IShareOptions {
     desktopSharingSourceDevice?: string;
     desktopSharingSources?: string[];
     desktopStream?: any;
diff --git a/react/features/base/ui/components/JitsiThemeProvider.web.tsx b/react/features/base/ui/components/JitsiThemeProvider.web.tsx
index 553e7d0f9..2c91a340f 100644
--- a/react/features/base/ui/components/JitsiThemeProvider.web.tsx
+++ b/react/features/base/ui/components/JitsiThemeProvider.web.tsx
@@ -2,7 +2,7 @@ import { StyledEngineProvider, ThemeProvider } from '@mui/material/styles';
 import * as React from 'react';
 import { connect } from 'react-redux';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 
 import BaseTheme from './BaseTheme.web';
 
@@ -39,7 +39,7 @@ function JitsiThemeProvider(props: Props) {
  * @param {Object} state - The Redux state.
  * @returns {Props}
  */
-function _mapStateToProps(state: IState) {
+function _mapStateToProps(state: IReduxState) {
     const { muiBrandedTheme } = state['features/dynamic-branding'];
 
     return {
diff --git a/react/features/base/ui/components/native/Button.tsx b/react/features/base/ui/components/native/Button.tsx
index 78d754a73..172750f6c 100644
--- a/react/features/base/ui/components/native/Button.tsx
+++ b/react/features/base/ui/components/native/Button.tsx
@@ -8,18 +8,18 @@ import {
 
 import { BUTTON_MODES, BUTTON_TYPES } from '../../constants';
 import BaseTheme from '../BaseTheme.native';
-import { ButtonProps } from '../types';
+import { IButtonProps } from '../types';
 
 import styles from './buttonStyles';
 
-export interface IButtonProps extends ButtonProps {
+export interface IProps extends IButtonProps {
     color?: string;
     contentStyle?: Object | undefined;
     labelStyle?: Object | undefined;
     style?: Object | undefined;
 }
 
-const Button: React.FC<IButtonProps> = ({
+const Button: React.FC<IProps> = ({
     accessibilityLabel,
     color: buttonColor,
     contentStyle,
@@ -30,7 +30,7 @@ const Button: React.FC<IButtonProps> = ({
     onClick: onPress,
     style,
     type
-}: IButtonProps) => {
+}: IProps) => {
     const { t } = useTranslation();
     const { CONTAINED } = BUTTON_MODES;
     const { DESTRUCTIVE, PRIMARY, SECONDARY, TERTIARY } = BUTTON_TYPES;
diff --git a/react/features/base/ui/components/native/Input.tsx b/react/features/base/ui/components/native/Input.tsx
index d73cb9736..ac0252644 100644
--- a/react/features/base/ui/components/native/Input.tsx
+++ b/react/features/base/ui/components/native/Input.tsx
@@ -13,19 +13,19 @@ import {
 import Icon from '../../../icons/components/Icon';
 import { IconCloseCircle } from '../../../icons/svg';
 import BaseTheme from '../../../ui/components/BaseTheme.native';
-import { InputProps } from '../types';
+import { IInputProps } from '../types';
 
 import styles from './inputStyles';
 
-interface IInputProps extends InputProps {
+interface IProps extends IInputProps {
 
     /**
      * Custom styles to be applied to the component.
      */
-    customStyles?: CustomStyles;
+    customStyles?: ICustomStyles;
 }
 
-interface CustomStyles {
+interface ICustomStyles {
     container?: Object;
     input?: Object;
 }
@@ -40,7 +40,7 @@ const Input = ({
     onChange,
     placeholder,
     value
-}: IInputProps) => {
+}: IProps) => {
     const [ focused, setFocused ] = useState(false);
     const handleChange = useCallback((e: NativeSyntheticEvent<TextInputChangeEventData>) => {
         const { nativeEvent: { text } } = e;
diff --git a/react/features/base/ui/components/native/Switch.tsx b/react/features/base/ui/components/native/Switch.tsx
index 7018906a8..636d78bf9 100644
--- a/react/features/base/ui/components/native/Switch.tsx
+++ b/react/features/base/ui/components/native/Switch.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { ColorValue } from 'react-native';
 import { Switch as NativeSwitch } from 'react-native-paper';
 
-import { SwitchProps } from '../types';
+import { ISwitchProps } from '../types';
 
 import {
     DISABLED_TRACK_COLOR,
@@ -10,7 +10,7 @@ import {
     THUMB_COLOR
 } from './switchStyles';
 
-interface Props extends SwitchProps {
+interface IProps extends ISwitchProps {
 
     /**
      * Custom styles for the switch.
@@ -38,7 +38,7 @@ const Switch = ({
         false: DISABLED_TRACK_COLOR
     },
     style
-}: Props) => (
+}: IProps) => (
     <NativeSwitch
         disabled = { disabled }
         onValueChange = { onChange }
diff --git a/react/features/base/ui/components/types.ts b/react/features/base/ui/components/types.ts
index b27b5ade6..480973ee6 100644
--- a/react/features/base/ui/components/types.ts
+++ b/react/features/base/ui/components/types.ts
@@ -2,7 +2,7 @@ import { GestureResponderEvent } from 'react-native';
 
 import { BUTTON_TYPES } from '../constants';
 
-export interface ButtonProps {
+export interface IButtonProps {
 
     /**
      * Label used for accessibility.
@@ -40,7 +40,7 @@ export interface ButtonProps {
     type?: BUTTON_TYPES;
 }
 
-export interface InputProps {
+export interface IInputProps {
 
     /**
      * Whether the input is be clearable. (show clear button).
@@ -83,7 +83,7 @@ export interface InputProps {
     value: string | number;
 }
 
-export interface SwitchProps {
+export interface ISwitchProps {
 
     /**
      * Whether or not the toggle is on.
diff --git a/react/features/base/ui/components/web/Button.tsx b/react/features/base/ui/components/web/Button.tsx
index 367b959fe..eadb062f2 100644
--- a/react/features/base/ui/components/web/Button.tsx
+++ b/react/features/base/ui/components/web/Button.tsx
@@ -6,9 +6,9 @@ import { makeStyles } from 'tss-react/mui';
 import Icon from '../../../icons/components/Icon';
 import { withPixelLineHeight } from '../../../styles/functions.web';
 import { BUTTON_TYPES } from '../../constants';
-import { ButtonProps } from '../types';
+import { IButtonProps } from '../types';
 
-interface IButtonProps extends ButtonProps {
+interface IProps extends IButtonProps {
 
     /**
      * Class name used for additional styles.
@@ -191,7 +191,7 @@ const Button = React.forwardRef<any, any>(({
     size = 'medium',
     testId,
     type = BUTTON_TYPES.PRIMARY
-}: IButtonProps, ref) => {
+}: IProps, ref) => {
     const { classes: styles, cx } = useStyles();
     const { t } = useTranslation();
 
diff --git a/react/features/base/ui/components/web/Checkbox.tsx b/react/features/base/ui/components/web/Checkbox.tsx
index f50288dc3..56cac4757 100644
--- a/react/features/base/ui/components/web/Checkbox.tsx
+++ b/react/features/base/ui/components/web/Checkbox.tsx
@@ -7,7 +7,7 @@ import Icon from '../../../icons/components/Icon';
 import { IconCheckMark } from '../../../icons/svg';
 import { withPixelLineHeight } from '../../../styles/functions.web';
 
-interface CheckboxProps {
+interface ICheckboxProps {
 
     /**
      * Whether the input is checked or not.
@@ -149,7 +149,7 @@ const Checkbox = ({
     label,
     name,
     onChange
-}: CheckboxProps) => {
+}: ICheckboxProps) => {
     const { classes: styles, cx, theme } = useStyles();
     const isMobile = isMobileBrowser();
 
diff --git a/react/features/base/ui/components/web/Dialog.tsx b/react/features/base/ui/components/web/Dialog.tsx
index 699b726ef..7f7321e49 100644
--- a/react/features/base/ui/components/web/Dialog.tsx
+++ b/react/features/base/ui/components/web/Dialog.tsx
@@ -172,7 +172,7 @@ const useStyles = makeStyles()((theme: Theme) => {
     };
 });
 
-interface DialogProps {
+interface IDialogProps {
     back?: {
         hidden?: boolean;
         onClick?: () => void;
@@ -215,7 +215,7 @@ const Dialog = ({
     size = 'medium',
     title,
     titleKey
-}: DialogProps) => {
+}: IDialogProps) => {
     const { classes, cx } = useStyles();
     const { t } = useTranslation();
     const { isUnmounting } = useContext(DialogTransitionContext);
diff --git a/react/features/base/ui/components/web/DialogContainer.tsx b/react/features/base/ui/components/web/DialogContainer.tsx
index b42d51bc1..fc1b32c12 100644
--- a/react/features/base/ui/components/web/DialogContainer.tsx
+++ b/react/features/base/ui/components/web/DialogContainer.tsx
@@ -1,13 +1,13 @@
 import { ModalTransition } from '@atlaskit/modal-dialog';
 import React, { Component, ComponentType } from 'react';
 
-import { IState } from '../../../../app/types';
-import { ReactionEmojiProps } from '../../../../reactions/constants';
+import { IReduxState } from '../../../../app/types';
+import { IReactionEmojiProps } from '../../../../reactions/constants';
 import { connect } from '../../../redux/functions';
 
 import DialogTransition from './DialogTransition';
 
-interface Props {
+interface IProps {
 
     /**
      * The component to render.
@@ -27,7 +27,7 @@ interface Props {
     /**
      * Array of reactions to be displayed.
      */
-    _reactionsQueue: Array<ReactionEmojiProps>;
+    _reactionsQueue: Array<IReactionEmojiProps>;
 
     /**
      * True if the UI is in a compact state where we don't show dialogs.
@@ -40,7 +40,7 @@ interface Props {
  * for supporting @atlaskit's modal animations.
  *
  */
-class DialogContainer extends Component<Props> {
+class DialogContainer extends Component<IProps> {
 
     /**
      * Returns the dialog to be displayed.
@@ -85,9 +85,9 @@ class DialogContainer extends Component<Props> {
  *
  * @param {Object} state - The redux state.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function mapStateToProps(state: IState) {
+function mapStateToProps(state: IReduxState) {
     const stateFeaturesBaseDialog = state['features/base/dialog'];
     const { reducedUI } = state['features/base/responsive-ui'];
 
diff --git a/react/features/base/ui/components/web/Input.tsx b/react/features/base/ui/components/web/Input.tsx
index 038c7d01a..f4a843155 100644
--- a/react/features/base/ui/components/web/Input.tsx
+++ b/react/features/base/ui/components/web/Input.tsx
@@ -7,9 +7,9 @@ import { isMobileBrowser } from '../../../environment/utils';
 import Icon from '../../../icons/components/Icon';
 import { IconCloseCircle } from '../../../icons/svg';
 import { withPixelLineHeight } from '../../../styles/functions.web';
-import { InputProps } from '../types';
+import { IInputProps } from '../types';
 
-interface IInputProps extends InputProps {
+interface IProps extends IInputProps {
     accessibilityLabel?: string;
     autoFocus?: boolean;
     bottomLabel?: string;
@@ -127,7 +127,7 @@ const useStyles = makeStyles()((theme: Theme) => {
     };
 });
 
-const Input = React.forwardRef<any, IInputProps>(({
+const Input = React.forwardRef<any, IProps>(({
     accessibilityLabel,
     autoFocus,
     bottomLabel,
@@ -149,7 +149,7 @@ const Input = React.forwardRef<any, IInputProps>(({
     textarea = false,
     type = 'text',
     value
-}: IInputProps, ref) => {
+}: IProps, ref) => {
     const { classes: styles, cx } = useStyles();
     const isMobile = isMobileBrowser();
 
diff --git a/react/features/base/ui/components/web/Select.tsx b/react/features/base/ui/components/web/Select.tsx
index 8fa50fa09..322e0eb47 100644
--- a/react/features/base/ui/components/web/Select.tsx
+++ b/react/features/base/ui/components/web/Select.tsx
@@ -7,7 +7,7 @@ import Icon from '../../../icons/components/Icon';
 import { IconArrowDown } from '../../../icons/svg';
 import { withPixelLineHeight } from '../../../styles/functions.web';
 
-interface SelectProps {
+interface ISelectProps {
 
     /**
      * Helper text to be displayed below the select.
@@ -144,7 +144,7 @@ const Select = ({
     label,
     onChange,
     options,
-    value }: SelectProps) => {
+    value }: ISelectProps) => {
     const { classes, cx, theme } = useStyles();
     const isMobile = isMobileBrowser();
 
diff --git a/react/features/base/ui/components/web/Switch.tsx b/react/features/base/ui/components/web/Switch.tsx
index 1c9f5d945..0f9f2c3a1 100644
--- a/react/features/base/ui/components/web/Switch.tsx
+++ b/react/features/base/ui/components/web/Switch.tsx
@@ -3,9 +3,9 @@ import React, { useCallback } from 'react';
 import { makeStyles } from 'tss-react/mui';
 
 import { isMobileBrowser } from '../../../environment/utils';
-import { SwitchProps } from '../types';
+import { ISwitchProps } from '../types';
 
-interface Props extends SwitchProps {
+interface IProps extends ISwitchProps {
 
     /**
      * Id of the toggle.
@@ -78,7 +78,7 @@ const useStyles = makeStyles()((theme: Theme) => {
     };
 });
 
-const Switch = ({ id, checked, disabled, onChange }: Props) => {
+const Switch = ({ id, checked, disabled, onChange }: IProps) => {
     const { classes: styles, cx } = useStyles();
     const isMobile = isMobileBrowser();
 
diff --git a/react/features/base/ui/components/web/Tabs.tsx b/react/features/base/ui/components/web/Tabs.tsx
index e5d8e3dc8..aad1d47a2 100644
--- a/react/features/base/ui/components/web/Tabs.tsx
+++ b/react/features/base/ui/components/web/Tabs.tsx
@@ -5,7 +5,7 @@ import { makeStyles } from 'tss-react/mui';
 import { isMobileBrowser } from '../../../environment/utils';
 import { withPixelLineHeight } from '../../../styles/functions.web';
 
-interface TabProps {
+interface ITabProps {
     accessibilityLabel: string;
     onChange: (id: string) => void;
     selected: string;
@@ -83,7 +83,7 @@ const Tabs = ({
     onChange,
     selected,
     accessibilityLabel
-}: TabProps) => {
+}: ITabProps) => {
     const { classes, cx } = useStyles();
     const isMobile = isMobileBrowser();
 
diff --git a/react/features/base/ui/functions.web.ts b/react/features/base/ui/functions.web.ts
index 40b1fcf9b..3c4ee6e5c 100644
--- a/react/features/base/ui/functions.web.ts
+++ b/react/features/base/ui/functions.web.ts
@@ -1,6 +1,7 @@
+/* eslint-disable @typescript-eslint/naming-convention */
 import { adaptV4Theme, createTheme } from '@mui/material/styles';
 
-import { Palette as Palette1, Typography } from '../ui/types';
+import { ITypography, IPalette as Palette1 } from '../ui/types';
 
 import { createColorTokens } from './utils';
 
@@ -9,7 +10,7 @@ declare module '@mui/material/styles' {
     interface Palette extends Palette1 {}
 
     // eslint-disable-next-line @typescript-eslint/no-empty-interface
-    interface TypographyVariants extends Typography {}
+    interface TypographyVariants extends ITypography {}
 }
 
 interface ThemeProps {
diff --git a/react/features/base/ui/types.ts b/react/features/base/ui/types.ts
index 1d1de7f63..d1bd1c90b 100644
--- a/react/features/base/ui/types.ts
+++ b/react/features/base/ui/types.ts
@@ -1,11 +1,11 @@
-interface TypographyType {
+interface ITypographyType {
     fontSize: number;
     fontWeight: string;
     letterSpacing: number;
     lineHeight: number;
 }
 
-export interface Palette {
+export interface IPalette {
     action01: string;
     action01Active: string;
     action01Hover: string;
@@ -60,21 +60,21 @@ export interface Palette {
     warning02: string;
 }
 
-export interface Typography {
-    bodyLongBold: TypographyType;
-    bodyLongBoldLarge: TypographyType;
-    bodyLongRegular: TypographyType;
-    bodyLongRegularLarge: TypographyType;
-    bodyShortBold: TypographyType;
-    bodyShortBoldLarge: TypographyType;
-    bodyShortRegular: TypographyType;
-    bodyShortRegularLarge: TypographyType;
-    heading1: TypographyType;
-    heading2: TypographyType;
-    heading3: TypographyType;
-    heading4: TypographyType;
-    heading5: TypographyType;
-    heading6: TypographyType;
-    labelBold: TypographyType;
-    labelRegular: TypographyType;
+export interface ITypography {
+    bodyLongBold: ITypographyType;
+    bodyLongBoldLarge: ITypographyType;
+    bodyLongRegular: ITypographyType;
+    bodyLongRegularLarge: ITypographyType;
+    bodyShortBold: ITypographyType;
+    bodyShortBoldLarge: ITypographyType;
+    bodyShortRegular: ITypographyType;
+    bodyShortRegularLarge: ITypographyType;
+    heading1: ITypographyType;
+    heading2: ITypographyType;
+    heading3: ITypographyType;
+    heading4: ITypographyType;
+    heading5: ITypographyType;
+    heading6: ITypographyType;
+    labelBold: ITypographyType;
+    labelRegular: ITypographyType;
 }
diff --git a/react/features/chat/actions.any.ts b/react/features/chat/actions.any.ts
index 042c06817..e36901f10 100644
--- a/react/features/chat/actions.any.ts
+++ b/react/features/chat/actions.any.ts
@@ -1,7 +1,7 @@
 import { IStore } from '../app/types';
 import { getCurrentConference } from '../base/conference/functions';
 import { getLocalParticipant } from '../base/participants/functions';
-import { Participant } from '../base/participants/types';
+import { IParticipant } from '../base/participants/types';
 import { LOBBY_CHAT_INITIALIZED } from '../lobby/constants';
 
 import {
@@ -114,9 +114,9 @@ export function sendMessage(message: string, ignorePrivacy = false) {
 /**
  * Initiates the sending of a private message to the supplied participant.
  *
- * @param {Participant} participant - The participant to set the recipient to.
+ * @param {IParticipant} participant - The participant to set the recipient to.
  * @returns {{
- *     participant: Participant,
+ *     participant: IParticipant,
  *     type: SET_PRIVATE_MESSAGE_RECIPIENT
  * }}
  */
@@ -148,7 +148,7 @@ export function setIsPollsTabFocused(isPollsTabFocused: boolean) {
  *
  * @returns {Function}
  */
-export function onLobbyChatInitialized(lobbyChatInitializedInfo: { attendee: Participant; moderator: Participant; }) {
+export function onLobbyChatInitialized(lobbyChatInitializedInfo: { attendee: IParticipant; moderator: IParticipant; }) {
     return async (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
         const state = getState();
         const conference = getCurrentConference(state);
diff --git a/react/features/chat/components/AbstractChatPrivacyDialog.tsx b/react/features/chat/components/AbstractChatPrivacyDialog.tsx
index 175063dcf..5785bfd82 100644
--- a/react/features/chat/components/AbstractChatPrivacyDialog.tsx
+++ b/react/features/chat/components/AbstractChatPrivacyDialog.tsx
@@ -1,12 +1,12 @@
 import { PureComponent } from 'react';
 import { WithTranslation } from 'react-i18next';
 
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import { getParticipantById } from '../../base/participants/functions';
-import { Participant } from '../../base/participants/types';
+import { IParticipant } from '../../base/participants/types';
 import { sendMessage, setPrivateMessageRecipient } from '../actions';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Prop to be invoked on sending the message.
@@ -37,13 +37,13 @@ interface Props extends WithTranslation {
 /**
  * Abstract class for the dialog displayed to avoid mis-sending private messages.
  */
-export class AbstractChatPrivacyDialog extends PureComponent<Props> {
+export class AbstractChatPrivacyDialog extends PureComponent<IProps> {
     /**
      * Instantiates a new instance.
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onSendGroupMessage = this._onSendGroupMessage.bind(this);
@@ -80,7 +80,7 @@ export class AbstractChatPrivacyDialog extends PureComponent<Props> {
  * Maps part of the props of this component to Redux actions.
  *
  * @param {Function} dispatch - The Redux dispatch function.
- * @returns {Props}
+ * @returns {IProps}
  */
 export function _mapDispatchToProps(dispatch: IStore['dispatch']) {
     return {
@@ -88,7 +88,7 @@ export function _mapDispatchToProps(dispatch: IStore['dispatch']) {
             dispatch(sendMessage(message, true));
         },
 
-        _onSetMessageRecipient: (participant: Participant) => {
+        _onSetMessageRecipient: (participant: IParticipant) => {
             dispatch(setPrivateMessageRecipient(participant));
         }
     };
@@ -97,11 +97,11 @@ export function _mapDispatchToProps(dispatch: IStore['dispatch']) {
 /**
  * Maps part of the Redux store to the props of this component.
  *
- * @param {IState} state - The Redux state.
- * @param {Props} ownProps - The own props of the component.
- * @returns {Props}
+ * @param {IReduxState} state - The Redux state.
+ * @param {IProps} ownProps - The own props of the component.
+ * @returns {IProps}
  */
-export function _mapStateToProps(state: IState, ownProps: Props) {
+export function _mapStateToProps(state: IReduxState, ownProps: IProps) {
     return {
         _participant: getParticipantById(state, ownProps.participantID)
     };
diff --git a/react/features/chat/components/AbstractMessageContainer.ts b/react/features/chat/components/AbstractMessageContainer.ts
index 9d69b6374..b745ffcf7 100644
--- a/react/features/chat/components/AbstractMessageContainer.ts
+++ b/react/features/chat/components/AbstractMessageContainer.ts
@@ -2,7 +2,7 @@ import { Component } from 'react';
 
 import { IMessage } from '../reducer';
 
-export interface Props {
+export interface IProps {
 
     /**
      * The messages array to render.
@@ -15,7 +15,7 @@ export interface Props {
  *
  * @augments PureComponent
  */
-export default class AbstractMessageContainer<P extends Props, S> extends Component<P, S> {
+export default class AbstractMessageContainer<P extends IProps, S> extends Component<P, S> {
     static defaultProps = {
         messages: [] as IMessage[]
     };
diff --git a/react/features/chat/components/web/ChatInput.tsx b/react/features/chat/components/web/ChatInput.tsx
index 7b2f72e7b..342a8586c 100644
--- a/react/features/chat/components/web/ChatInput.tsx
+++ b/react/features/chat/components/web/ChatInput.tsx
@@ -1,7 +1,7 @@
 import React, { Component, RefObject } from 'react';
 import { WithTranslation } from 'react-i18next';
 
-import { IState, IStore } from '../../../app/types';
+import { IReduxState, IStore } from '../../../app/types';
 import { isMobileBrowser } from '../../../base/environment/utils';
 import { translate } from '../../../base/i18n/functions';
 import { IconPlane, IconSmile } from '../../../base/icons/svg';
@@ -16,7 +16,7 @@ import SmileysPanel from './SmileysPanel';
 /**
  * The type of the React {@code Component} props of {@link ChatInput}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Whether chat emoticons are disabled.
@@ -55,7 +55,7 @@ type State = {
  *
  * @augments Component
  */
-class ChatInput extends Component<Props, State> {
+class ChatInput extends Component<IProps, State> {
     _textArea?: RefObject<HTMLTextAreaElement>;
 
     state = {
@@ -69,7 +69,7 @@ class ChatInput extends Component<Props, State> {
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._textArea = React.createRef<HTMLTextAreaElement>();
@@ -254,7 +254,7 @@ class ChatInput extends Component<Props, State> {
  *     _areSmileysDisabled: boolean
  * }}
  */
-const mapStateToProps = (state: IState) => {
+const mapStateToProps = (state: IReduxState) => {
     return {
         _areSmileysDisabled: areSmileysDisabled(state)
     };
diff --git a/react/features/chat/components/web/DisplayNameForm.tsx b/react/features/chat/components/web/DisplayNameForm.tsx
index df550524d..54867d8e1 100644
--- a/react/features/chat/components/web/DisplayNameForm.tsx
+++ b/react/features/chat/components/web/DisplayNameForm.tsx
@@ -14,7 +14,7 @@ import KeyboardAvoider from './KeyboardAvoider';
 /**
  * The type of the React {@code Component} props of {@DisplayNameForm}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Invoked to set the local participant display name.
@@ -43,7 +43,7 @@ type State = {
  *
  * @augments Component
  */
-class DisplayNameForm extends Component<Props, State> {
+class DisplayNameForm extends Component<IProps, State> {
     state = {
         displayName: ''
     };
@@ -54,7 +54,7 @@ class DisplayNameForm extends Component<Props, State> {
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         // Bind event handlers so they are only bound once for every instance.
diff --git a/react/features/chat/components/web/MessageContainer.tsx b/react/features/chat/components/web/MessageContainer.tsx
index f24dd1998..c1038c452 100644
--- a/react/features/chat/components/web/MessageContainer.tsx
+++ b/react/features/chat/components/web/MessageContainer.tsx
@@ -3,13 +3,13 @@ import React, { RefObject } from 'react';
 import { scrollIntoView } from 'seamless-scroll-polyfill';
 
 import { MESSAGE_TYPE_REMOTE } from '../../constants';
-import AbstractMessageContainer, { Props } from '../AbstractMessageContainer';
+import AbstractMessageContainer, { IProps } from '../AbstractMessageContainer';
 
 // @ts-ignore
 import ChatMessageGroup from './ChatMessageGroup';
 import NewMessagesButton from './NewMessagesButton';
 
-interface State {
+interface IState {
 
     /**
      * Whether or not message container has received new messages.
@@ -32,12 +32,12 @@ interface State {
  *
  * @augments AbstractMessageContainer
  */
-export default class MessageContainer extends AbstractMessageContainer<Props, State> {
+export default class MessageContainer extends AbstractMessageContainer<IProps, IState> {
     /**
      * Component state used to decide when the hasNewMessages button to appear
      * and where to scroll when click on hasNewMessages button.
      */
-    state: State = {
+    state: IState = {
         hasNewMessages: false,
         isScrolledToBottom: true,
         lastReadMessageId: ''
@@ -63,10 +63,10 @@ export default class MessageContainer extends AbstractMessageContainer<Props, St
     /**
      * Initializes a new {@code MessageContainer} instance.
      *
-     * @param {Props} props - The React {@code Component} props to initialize
+     * @param {IProps} props - The React {@code Component} props to initialize
      * the new {@code MessageContainer} instance with.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._messageListRef = React.createRef<HTMLDivElement>();
@@ -141,7 +141,7 @@ export default class MessageContainer extends AbstractMessageContainer<Props, St
      * @inheritdoc
      * @returns {void}
      */
-    componentDidUpdate(prevProps: Props) {
+    componentDidUpdate(prevProps: IProps) {
         const hasNewMessages = this.props.messages.length !== prevProps.messages.length;
 
         if (hasNewMessages) {
diff --git a/react/features/chat/functions.ts b/react/features/chat/functions.ts
index 981c567ae..a69895d8e 100644
--- a/react/features/chat/functions.ts
+++ b/react/features/chat/functions.ts
@@ -4,7 +4,7 @@ import aliases from 'react-emoji-render/data/aliases';
 // @ts-ignore
 import emojiAsciiAliases from 'react-emoji-render/data/asciiAliases';
 
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { escapeRegexp } from '../base/util/helpers';
 
 import { IMessage } from './reducer';
@@ -83,10 +83,10 @@ export function replaceNonUnicodeEmojis(message: string) {
 /**
  * Selector for calculating the number of unread chat messages.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {number} The number of unread messages.
  */
-export function getUnreadCount(state: IState) {
+export function getUnreadCount(state: IReduxState) {
     const { lastReadMessage, messages } = state['features/chat'];
     const messagesCount = messages.length;
 
@@ -124,10 +124,10 @@ export function getUnreadCount(state: IState) {
 /**
  * Get whether the chat smileys are disabled or not.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {boolean} The disabled flag.
  */
-export function areSmileysDisabled(state: IState) {
+export function areSmileysDisabled(state: IReduxState) {
     const disableChatSmileys = state['features/base/config']?.disableChatSmileys === true;
 
     return disableChatSmileys;
diff --git a/react/features/chat/middleware.ts b/react/features/chat/middleware.ts
index 6952d18e8..cb71ed8db 100644
--- a/react/features/chat/middleware.ts
+++ b/react/features/chat/middleware.ts
@@ -1,7 +1,7 @@
 /* eslint-disable lines-around-comment */
 import { AnyAction } from 'redux';
 
-import { IState, IStore } from '../app/types';
+import { IReduxState, IStore } from '../app/types';
 import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../base/app/actionTypes';
 import { CONFERENCE_JOINED } from '../base/conference/actionTypes';
 import { getCurrentConference } from '../base/conference/functions';
@@ -366,7 +366,7 @@ export function handleLobbyMessageReceived(message: string, participantId: strin
  * @param {string} id - The knocking participant id.
  * @returns {string}
  */
-function getLobbyChatDisplayName(state: IState, id: string) {
+function getLobbyChatDisplayName(state: IReduxState, id: string) {
     const { knockingParticipants } = state['features/lobby'];
     const { lobbyMessageRecipient } = state['features/chat'];
 
@@ -508,7 +508,7 @@ function _persistSentPrivateMessage({ dispatch, getState }: IStore, recipientID:
  * @param {Object} action - The action being dispatched now.
  * @returns {string?}
  */
-function _shouldSendPrivateMessageTo(state: IState, action: AnyAction) {
+function _shouldSendPrivateMessageTo(state: IReduxState, action: AnyAction) {
     if (action.ignorePrivacy) {
         // Shortcut: this is only true, if we already displayed the notice, so no need to show it again.
         return undefined;
diff --git a/react/features/chat/reducer.ts b/react/features/chat/reducer.ts
index f0fc47e18..83e61daf4 100644
--- a/react/features/chat/reducer.ts
+++ b/react/features/chat/reducer.ts
@@ -1,6 +1,6 @@
 import { v4 as uuidv4 } from 'uuid';
 
-import { LocalParticipant, Participant } from '../base/participants/types';
+import { ILocalParticipant, IParticipant } from '../base/participants/types';
 import ReducerRegistry from '../base/redux/ReducerRegistry';
 
 import {
@@ -49,10 +49,10 @@ export interface IChatState {
     lobbyMessageRecipient?: {
         id: string;
         name: string;
-    } | LocalParticipant;
+    } | ILocalParticipant;
     messages: IMessage[];
     nbUnreadMessages: number;
-    privateMessageRecipient?: Participant;
+    privateMessageRecipient?: IParticipant;
 }
 
 ReducerRegistry.register<IChatState>('features/chat', (state = DEFAULT_STATE, action): IChatState => {
diff --git a/react/features/conference/components/native/carmode/MicrophoneButton.tsx b/react/features/conference/components/native/carmode/MicrophoneButton.tsx
index fc930838d..fc260c28e 100644
--- a/react/features/conference/components/native/carmode/MicrophoneButton.tsx
+++ b/react/features/conference/components/native/carmode/MicrophoneButton.tsx
@@ -9,7 +9,7 @@ import {
     createShortcutEvent
 } from '../../../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../../../analytics/functions';
-import { IState } from '../../../../app/types';
+import { IReduxState } from '../../../../app/types';
 import { AUDIO_MUTE_BUTTON_ENABLED } from '../../../../base/flags/constants';
 import { getFeatureFlag } from '../../../../base/flags/functions';
 import Icon from '../../../../base/icons/components/Icon';
@@ -32,10 +32,10 @@ const LONG_PRESS = 'long.press';
  */
 const MicrophoneButton = (): JSX.Element | null => {
     const dispatch = useDispatch();
-    const audioMuted = useSelector((state: IState) => isLocalTrackMuted(state['features/base/tracks'],
+    const audioMuted = useSelector((state: IReduxState) => isLocalTrackMuted(state['features/base/tracks'],
         MEDIA_TYPE.AUDIO));
     const disabled = useSelector(isAudioMuteButtonDisabled);
-    const enabledFlag = useSelector((state: IState) => getFeatureFlag(state, AUDIO_MUTE_BUTTON_ENABLED, true));
+    const enabledFlag = useSelector((state: IReduxState) => getFeatureFlag(state, AUDIO_MUTE_BUTTON_ENABLED, true));
     const [ longPress, setLongPress ] = useState(false);
 
     if (!enabledFlag) {
diff --git a/react/features/conference/components/native/carmode/TitleBar.tsx b/react/features/conference/components/native/carmode/TitleBar.tsx
index 2db7409b5..d3688f001 100644
--- a/react/features/conference/components/native/carmode/TitleBar.tsx
+++ b/react/features/conference/components/native/carmode/TitleBar.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import { StyleProp, Text, View, ViewStyle } from 'react-native';
 import { useSelector } from 'react-redux';
 
-import { IState } from '../../../../app/types';
+import { IReduxState } from '../../../../app/types';
 import { getConferenceName } from '../../../../base/conference/functions';
 import { MEETING_NAME_ENABLED } from '../../../../base/flags/constants';
 import { getFeatureFlag } from '../../../../base/flags/functions';
@@ -85,7 +85,7 @@ const TitleBar = (props: Props): JSX.Element => {
  * @param {Object} state - The Redux state.
  * @returns {Props}
  */
-function _mapStateToProps(state: IState) {
+function _mapStateToProps(state: IReduxState) {
     const { hideConferenceSubject } = state['features/base/config'];
 
     return {
diff --git a/react/features/conference/components/web/RaisedHandsCountLabel.tsx b/react/features/conference/components/web/RaisedHandsCountLabel.tsx
index bb664e3ad..0a503ec0c 100644
--- a/react/features/conference/components/web/RaisedHandsCountLabel.tsx
+++ b/react/features/conference/components/web/RaisedHandsCountLabel.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { IconRaisedHand } from '../../../base/icons/svg';
 import Label from '../../../base/label/components/web/Label';
 // eslint-disable-next-line lines-around-comment
@@ -25,7 +25,7 @@ const useStyles = makeStyles()((theme: Theme) => {
 const RaisedHandsCountLabel = () => {
     const { classes: styles, theme } = useStyles();
     const dispatch = useDispatch();
-    const raisedHandsCount = useSelector((state: IState) =>
+    const raisedHandsCount = useSelector((state: IReduxState) =>
         (state['features/base/participants'].raisedHandsQueue || []).length);
     const { t } = useTranslation();
     const onClick = useCallback(() => {
diff --git a/react/features/conference/components/web/ToggleTopPanelLabel.tsx b/react/features/conference/components/web/ToggleTopPanelLabel.tsx
index 66c21ae1c..341232236 100644
--- a/react/features/conference/components/web/ToggleTopPanelLabel.tsx
+++ b/react/features/conference/components/web/ToggleTopPanelLabel.tsx
@@ -3,7 +3,7 @@ import React, { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { IconMenuDown } from '../../../base/icons/svg/index';
 import Label from '../../../base/label/components/web/Label';
 // @ts-ignore
@@ -14,7 +14,7 @@ import { setTopPanelVisible } from '../../../filmstrip/actions.web';
 const ToggleTopPanelLabel = () => {
     const dispatch = useDispatch();
     const { t } = useTranslation();
-    const topPanelHidden = !useSelector((state: IState) => state['features/filmstrip'].topPanelVisible);
+    const topPanelHidden = !useSelector((state: IReduxState) => state['features/filmstrip'].topPanelVisible);
     const onClick = useCallback(() => {
         dispatch(setTopPanelVisible(true));
     }, []);
diff --git a/react/features/connection-indicator/components/web/ConnectionIndicator.tsx b/react/features/connection-indicator/components/web/ConnectionIndicator.tsx
index db318eb75..b2c8ff0ab 100644
--- a/react/features/connection-indicator/components/web/ConnectionIndicator.tsx
+++ b/react/features/connection-indicator/components/web/ConnectionIndicator.tsx
@@ -7,7 +7,7 @@ import React from 'react';
 import { WithTranslation } from 'react-i18next';
 import { connect } from 'react-redux';
 
-import { IState, IStore } from '../../../app/types';
+import { IReduxState, IStore } from '../../../app/types';
 import { getSourceNameSignalingFeatureFlag } from '../../../base/config/functions.any';
 import { translate } from '../../../base/i18n/functions';
 import { MEDIA_TYPE } from '../../../base/media/constants';
@@ -394,7 +394,7 @@ class ConnectionIndicator extends AbstractConnectionIndicator<Props, State> {
  * @param {Props} ownProps - The own props of the component.
  * @returns {Props}
  */
-export function _mapStateToProps(state: IState, ownProps: Props) {
+export function _mapStateToProps(state: IReduxState, ownProps: Props) {
     const { participantId } = ownProps;
     const tracks = state['features/base/tracks'];
     const sourceNameSignalingEnabled = getSourceNameSignalingFeatureFlag(state);
diff --git a/react/features/connection-indicator/functions.ts b/react/features/connection-indicator/functions.ts
index 44deec3af..65fcb24a5 100644
--- a/react/features/connection-indicator/functions.ts
+++ b/react/features/connection-indicator/functions.ts
@@ -1,5 +1,5 @@
 import { JitsiParticipantConnectionStatus, JitsiTrackStreamingStatus } from '../base/lib-jitsi-meet';
-import { Participant } from '../base/participants/types';
+import { IParticipant } from '../base/participants/types';
 import { ITrack } from '../base/tracks/reducer';
 
 /**
@@ -44,7 +44,7 @@ export function isTrackStreamingStatusInterrupted(videoTrack?: ITrack) {
  * @param {Object} participant - Participant reference.
  * @returns {boolean} - Is connection status active.
  */
-export function isParticipantConnectionStatusActive(participant: Participant) {
+export function isParticipantConnectionStatusActive(participant: IParticipant) {
     const connectionStatus = participant?.connectionStatus;
 
     return connectionStatus === JitsiParticipantConnectionStatus.ACTIVE;
@@ -56,7 +56,7 @@ export function isParticipantConnectionStatusActive(participant: Participant) {
  * @param {Object} participant - Participant reference.
  * @returns {boolean} - Is connection status inactive.
  */
-export function isParticipantConnectionStatusInactive(participant?: Participant) {
+export function isParticipantConnectionStatusInactive(participant?: IParticipant) {
     const connectionStatus = participant?.connectionStatus;
 
     return connectionStatus === JitsiParticipantConnectionStatus.INACTIVE;
@@ -68,7 +68,7 @@ export function isParticipantConnectionStatusInactive(participant?: Participant)
  * @param {Object} participant - Participant reference.
  * @returns {boolean} - Is connection status interrupted.
  */
-export function isParticipantConnectionStatusInterrupted(participant?: Participant) {
+export function isParticipantConnectionStatusInterrupted(participant?: IParticipant) {
     const connectionStatus = participant?.connectionStatus;
 
     return connectionStatus === JitsiParticipantConnectionStatus.INTERRUPTED;
diff --git a/react/features/connection-indicator/statsEmitter.ts b/react/features/connection-indicator/statsEmitter.ts
index e868375df..b5d0c34c8 100644
--- a/react/features/connection-indicator/statsEmitter.ts
+++ b/react/features/connection-indicator/statsEmitter.ts
@@ -14,7 +14,7 @@ import {
  */
 const subscribers: any = {};
 
-interface Stats {
+interface IStats {
     codec?: Object;
     framerate?: Object;
     resolution?: Object;
@@ -34,10 +34,10 @@ const statsEmitter = {
      */
     startListeningForStats(conference: IJitsiConference) {
         conference.on(JitsiConnectionQualityEvents.LOCAL_STATS_UPDATED,
-            (stats: Stats) => this._onStatsUpdated(conference.myUserId(), stats));
+            (stats: IStats) => this._onStatsUpdated(conference.myUserId(), stats));
 
         conference.on(JitsiConnectionQualityEvents.REMOTE_STATS_UPDATED,
-            (id: string, stats: Stats) => this._emitStatsUpdate(id, stats));
+            (id: string, stats: IStats) => this._emitStatsUpdate(id, stats));
     },
 
     /**
@@ -94,7 +94,7 @@ const statsEmitter = {
      * @param {Object} stats - New connection stats for the user.
      * @returns {void}
      */
-    _emitStatsUpdate(id: string, stats: Stats = {}) {
+    _emitStatsUpdate(id: string, stats: IStats = {}) {
         const callbacks = subscribers[id] || [];
 
         callbacks.forEach((callback: Function) => {
@@ -112,7 +112,7 @@ const statsEmitter = {
      * by the library.
      * @returns {void}
      */
-    _onStatsUpdated(localUserId: string, stats: Stats) {
+    _onStatsUpdated(localUserId: string, stats: IStats) {
         const allUserFramerates = stats.framerate || {};
         const allUserResolutions = stats.resolution || {};
         const allUserCodecs = stats.codec || {};
@@ -138,7 +138,7 @@ const statsEmitter = {
         _.union(framerateUserIds, resolutionUserIds, codecUserIds)
             .filter(id => id !== localUserId)
             .forEach(id => {
-                const remoteUserStats: Stats = {};
+                const remoteUserStats: IStats = {};
 
                 const framerate = allUserFramerates[id as keyof typeof allUserFramerates];
 
diff --git a/react/features/connection-stats/components/ConnectionStatsTable.tsx b/react/features/connection-stats/components/ConnectionStatsTable.tsx
index 0ca1a14a8..2c3f1341a 100644
--- a/react/features/connection-stats/components/ConnectionStatsTable.tsx
+++ b/react/features/connection-stats/components/ConnectionStatsTable.tsx
@@ -17,7 +17,7 @@ type DownloadUpload = {
  * The type of the React {@code Component} props of
  * {@link ConnectionStatsTable}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The audio SSRC of this client.
@@ -246,7 +246,7 @@ const styles = (theme: Theme) => {
  *
  * @augments Component
  */
-class ConnectionStatsTable extends Component<Props> {
+class ConnectionStatsTable extends Component<IProps> {
     /**
      * Implements React's {@link Component#render()}.
      *
diff --git a/react/features/desktop-picker/components/DesktopPicker.tsx b/react/features/desktop-picker/components/DesktopPicker.tsx
index 3df19c583..cf12508c5 100644
--- a/react/features/desktop-picker/components/DesktopPicker.tsx
+++ b/react/features/desktop-picker/components/DesktopPicker.tsx
@@ -48,7 +48,7 @@ const VALID_TYPES = Object.keys(TAB_LABELS);
 /**
  * The type of the React {@code Component} props of {@link DesktopPicker}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * An array with desktop sharing sources to be displayed.
@@ -104,13 +104,13 @@ type State = {
  *
  * @augments Component
  */
-class DesktopPicker extends PureComponent<Props, State> {
+class DesktopPicker extends PureComponent<IProps, State> {
     /**
      * Implements React's {@link Component#getDerivedStateFromProps()}.
      *
      * @inheritdoc
      */
-    static getDerivedStateFromProps(props: Props) {
+    static getDerivedStateFromProps(props: IProps) {
         return {
             types: DesktopPicker._getValidTypes(props.desktopSharingSources)
         };
@@ -151,7 +151,7 @@ class DesktopPicker extends PureComponent<Props, State> {
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         // Bind event handlers so they are only bound once per instance.
diff --git a/react/features/display-name/components/AbstractDisplayNamePrompt.tsx b/react/features/display-name/components/AbstractDisplayNamePrompt.tsx
index 41f327dd6..2e2053ca9 100644
--- a/react/features/display-name/components/AbstractDisplayNamePrompt.tsx
+++ b/react/features/display-name/components/AbstractDisplayNamePrompt.tsx
@@ -8,7 +8,7 @@ import { updateSettings } from '../../base/settings/actions';
  * The type of the React {@code Component} props of
  * {@link AbstractDisplayNamePrompt}.
  */
-export interface Props extends WithTranslation {
+export interface IProps extends WithTranslation {
 
     /**
      * Invoked to update the local participant's display name.
@@ -25,13 +25,13 @@ export interface Props extends WithTranslation {
  * Implements an abstract class for {@code DisplayNamePrompt}.
  */
 export default class AbstractDisplayNamePrompt<S>
-    extends Component<Props, S> {
+    extends Component<IProps, S> {
     /**
      * Instantiates a new component.
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onSetDisplayName = this._onSetDisplayName.bind(this);
diff --git a/react/features/display-name/components/native/DisplayNameLabel.tsx b/react/features/display-name/components/native/DisplayNameLabel.tsx
index 5d7488b22..080b162f5 100644
--- a/react/features/display-name/components/native/DisplayNameLabel.tsx
+++ b/react/features/display-name/components/native/DisplayNameLabel.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Text, View } from 'react-native';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import {
     getParticipantById,
     getParticipantDisplayName,
@@ -68,7 +68,7 @@ class DisplayNameLabel extends React.Component<Props> {
  * @param {Props} ownProps - The own props of the component.
  * @returns {Props}
  */
-function _mapStateToProps(state: IState, ownProps: Partial<Props>) {
+function _mapStateToProps(state: IReduxState, ownProps: Partial<Props>) {
     const participant = getParticipantById(state, ownProps.participantId ?? '');
 
     return {
diff --git a/react/features/display-name/components/web/DisplayName.tsx b/react/features/display-name/components/web/DisplayName.tsx
index 35ed12847..512c2c550 100644
--- a/react/features/display-name/components/web/DisplayName.tsx
+++ b/react/features/display-name/components/web/DisplayName.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import {
     getParticipantById,
     getParticipantDisplayName
@@ -21,7 +21,7 @@ import { appendSuffix } from '../../functions';
 /**
  * The type of the React {@code Component} props of {@link DisplayName}.
  */
-interface Props {
+interface IProps {
 
     /**
      * Whether or not the display name should be editable on click.
@@ -78,10 +78,11 @@ const DisplayName = ({
     elementID,
     participantID,
     thumbnailType
-}: Props) => {
+}: IProps) => {
     const { classes } = useStyles();
-    const configuredDisplayName = useSelector((state: IState) => getParticipantById(state, participantID))?.name ?? '';
-    const nameToDisplay = useSelector((state: IState) => getParticipantDisplayName(state, participantID));
+    const configuredDisplayName = useSelector((state: IReduxState) =>
+        getParticipantById(state, participantID))?.name ?? '';
+    const nameToDisplay = useSelector((state: IReduxState) => getParticipantDisplayName(state, participantID));
     const [ editDisplayNameValue, setEditDisplayNameValue ] = useState('');
     const [ isEditing, setIsEditing ] = useState(false);
     const dispatch = useDispatch();
diff --git a/react/features/display-name/components/web/DisplayNamePrompt.tsx b/react/features/display-name/components/web/DisplayNamePrompt.tsx
index 971918f81..0790e23ad 100644
--- a/react/features/display-name/components/web/DisplayNamePrompt.tsx
+++ b/react/features/display-name/components/web/DisplayNamePrompt.tsx
@@ -4,7 +4,7 @@ import { translate } from '../../../base/i18n/functions';
 import { connect } from '../../../base/redux/functions';
 import Dialog from '../../../base/ui/components/web/Dialog';
 import Input from '../../../base/ui/components/web/Input';
-import AbstractDisplayNamePrompt, { Props } from '../AbstractDisplayNamePrompt';
+import AbstractDisplayNamePrompt, { IProps } from '../AbstractDisplayNamePrompt';
 
 /**
  * The type of the React {@code Component} props of {@link DisplayNamePrompt}.
@@ -30,7 +30,7 @@ class DisplayNamePrompt extends AbstractDisplayNamePrompt<State> {
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this.state = {
diff --git a/react/features/display-name/components/web/StageParticipantNameLabel.tsx b/react/features/display-name/components/web/StageParticipantNameLabel.tsx
index 29ca6f9e9..d1e1ae21d 100644
--- a/react/features/display-name/components/web/StageParticipantNameLabel.tsx
+++ b/react/features/display-name/components/web/StageParticipantNameLabel.tsx
@@ -5,14 +5,14 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { isDisplayNameVisible } from '../../../base/config/functions.any';
 import {
     getLocalParticipant,
     getParticipantDisplayName,
     isWhiteboardParticipant
 } from '../../../base/participants/functions';
-import { Participant } from '../../../base/participants/types';
+import { IParticipant } from '../../../base/participants/types';
 import { withPixelLineHeight } from '../../../base/styles/functions.web';
 // @ts-ignore
 import { getLargeVideoParticipant } from '../../../large-video/functions';
@@ -51,9 +51,9 @@ const useStyles = makeStyles()((theme: Theme) => {
  */
 const StageParticipantNameLabel = () => {
     const { classes, cx } = useStyles();
-    const largeVideoParticipant: Participant = useSelector(getLargeVideoParticipant);
+    const largeVideoParticipant: IParticipant = useSelector(getLargeVideoParticipant);
     const selectedId = largeVideoParticipant?.id;
-    const nameToDisplay = useSelector((state: IState) => getParticipantDisplayName(state, selectedId));
+    const nameToDisplay = useSelector((state: IReduxState) => getParticipantDisplayName(state, selectedId));
 
     const localParticipant = useSelector(getLocalParticipant);
     const localId = localParticipant?.id;
diff --git a/react/features/dynamic-branding/components/native/BrandingImageBackground.tsx b/react/features/dynamic-branding/components/native/BrandingImageBackground.tsx
index 05a84e7eb..3519d6696 100644
--- a/react/features/dynamic-branding/components/native/BrandingImageBackground.tsx
+++ b/react/features/dynamic-branding/components/native/BrandingImageBackground.tsx
@@ -2,23 +2,23 @@ import React from 'react';
 import { Image, ImageStyle, StyleProp, ViewStyle } from 'react-native';
 import { SvgUri } from 'react-native-svg';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { connect } from '../../../base/redux/functions';
 
 import styles from './styles';
 
 
-interface Props {
+interface IProps {
     uri?: string;
 }
 
 /**
  * Component that displays a branding background image.
  *
- * @param {Props} props - The props of the component.
+ * @param {IProps} props - The props of the component.
  * @returns {ReactElement}
  */
-const BrandingImageBackground: React.FC<Props> = ({ uri }: Props) => {
+const BrandingImageBackground: React.FC<IProps> = ({ uri }: IProps) => {
     const imageType = uri?.substr(uri.lastIndexOf('/') + 1);
     const imgSrc = uri ? uri : undefined;
 
@@ -63,9 +63,9 @@ const BrandingImageBackground: React.FC<Props> = ({ uri }: Props) => {
  *
  * @param {Object} state - The Redux state.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function _mapStateToProps(state: IState) {
+function _mapStateToProps(state: IReduxState) {
     const { backgroundImageUrl } = state['features/dynamic-branding'];
 
     return {
diff --git a/react/features/dynamic-branding/functions.any.ts b/react/features/dynamic-branding/functions.any.ts
index 73bf3b8bc..3bdd63c80 100644
--- a/react/features/dynamic-branding/functions.any.ts
+++ b/react/features/dynamic-branding/functions.any.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { IStateful } from '../base/app/types';
 import { toState } from '../base/redux/functions';
 
@@ -10,7 +10,7 @@ import { toState } from '../base/redux/functions';
  * @param {Object} state - A redux state.
  * @returns {string}
  */
-export function extractFqnFromPath(state?: IState) {
+export function extractFqnFromPath(state?: IReduxState) {
     let pathname;
 
     if (window.location.pathname) {
@@ -61,6 +61,6 @@ export async function getDynamicBrandingUrl(stateful: IStateful) {
  * @param {Object} state - Global state of the app.
  * @returns {boolean}
  */
-export function isDynamicBrandingDataLoaded(state: IState) {
+export function isDynamicBrandingDataLoaded(state: IReduxState) {
     return state['features/dynamic-branding'].customizationReady;
 }
diff --git a/react/features/e2ee/components/E2EESection.tsx b/react/features/e2ee/components/E2EESection.tsx
index c34dfa255..36096c62d 100644
--- a/react/features/e2ee/components/E2EESection.tsx
+++ b/react/features/e2ee/components/E2EESection.tsx
@@ -3,7 +3,7 @@ import { WithTranslation } from 'react-i18next';
 
 import { createE2EEEvent } from '../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../analytics/functions';
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import { translate } from '../../base/i18n/functions';
 import { connect } from '../../base/redux/functions';
 import Switch from '../../base/ui/components/web/Switch';
@@ -11,7 +11,7 @@ import { toggleE2EE } from '../actions';
 import { MAX_MODE } from '../constants';
 import { doesEveryoneSupportE2EE } from '../functions';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The resource for the description, computed based on the maxMode and whether the switch is toggled or not.
@@ -58,13 +58,13 @@ type State = {
  *
  * @augments Component
  */
-class E2EESection extends Component<Props, State> {
+class E2EESection extends Component<IProps, State> {
     /**
      * Implements React's {@link Component#getDerivedStateFromProps()}.
      *
      * @inheritdoc
      */
-    static getDerivedStateFromProps(props: Props, state: State) {
+    static getDerivedStateFromProps(props: IProps, state: State) {
         if (props._toggled !== state.toggled) {
 
             return {
@@ -80,7 +80,7 @@ class E2EESection extends Component<Props, State> {
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this.state = {
@@ -151,9 +151,9 @@ class E2EESection extends Component<Props, State> {
  *
  * @param {Object} state - The Redux state.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function mapStateToProps(state: IState) {
+function mapStateToProps(state: IReduxState) {
     const { enabled: e2eeEnabled, maxMode } = state['features/e2ee'];
     const { e2eeLabels } = state['features/base/config'];
 
diff --git a/react/features/embed-meeting/components/EmbedMeetingDialog.tsx b/react/features/embed-meeting/components/EmbedMeetingDialog.tsx
index 03590c58c..56cbeee9b 100644
--- a/react/features/embed-meeting/components/EmbedMeetingDialog.tsx
+++ b/react/features/embed-meeting/components/EmbedMeetingDialog.tsx
@@ -2,13 +2,13 @@ import React from 'react';
 import { WithTranslation } from 'react-i18next';
 import { connect } from 'react-redux';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import CopyButton from '../../base/buttons/CopyButton.web';
 import { getInviteURL } from '../../base/connection/functions';
 import { translate } from '../../base/i18n/functions';
 import Dialog from '../../base/ui/components/web/Dialog';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The URL of the conference.
@@ -21,7 +21,7 @@ interface Props extends WithTranslation {
  *
  * @returns {React$Element<any>}
  */
-function EmbedMeeting({ t, url }: Props) {
+function EmbedMeeting({ t, url }: IProps) {
     /**
      * Get the embed code for a jitsi meeting.
      *
@@ -54,7 +54,7 @@ function EmbedMeeting({ t, url }: Props) {
     );
 }
 
-const mapStateToProps = (state: IState) => {
+const mapStateToProps = (state: IReduxState) => {
     return {
         url: getInviteURL(state)
     };
diff --git a/react/features/face-landmarks/FaceLandmarksHelper.ts b/react/features/face-landmarks/FaceLandmarksHelper.ts
index 8750a7ea8..2aba627e0 100644
--- a/react/features/face-landmarks/FaceLandmarksHelper.ts
+++ b/react/features/face-landmarks/FaceLandmarksHelper.ts
@@ -4,7 +4,7 @@ import { Config, FaceResult, Human } from '@vladmandic/human';
 import { DETECTION_TYPES, FACE_DETECTION_SCORE_THRESHOLD, FACE_EXPRESSIONS_NAMING_MAPPING } from './constants';
 import { DetectInput, DetectOutput, FaceBox, InitInput } from './types';
 
-export interface FaceLandmarksHelper {
+export interface IFaceLandmarksHelper {
     detect: ({ image, threshold }: DetectInput) => Promise<DetectOutput>;
     getDetectionInProgress: () => boolean;
     getDetections: (image: ImageBitmap | ImageData) => Promise<Array<FaceResult>>;
@@ -17,7 +17,7 @@ export interface FaceLandmarksHelper {
 /**
  * Helper class for human library.
  */
-export class HumanHelper implements FaceLandmarksHelper {
+export class HumanHelper implements IFaceLandmarksHelper {
     protected human: Human | undefined;
     protected faceDetectionTypes: string[];
     protected baseUrl: string;
diff --git a/react/features/face-landmarks/faceLandmarksWorker.ts b/react/features/face-landmarks/faceLandmarksWorker.ts
index 88b86d9c5..b94fbe17e 100644
--- a/react/features/face-landmarks/faceLandmarksWorker.ts
+++ b/react/features/face-landmarks/faceLandmarksWorker.ts
@@ -1,7 +1,7 @@
-import { FaceLandmarksHelper, HumanHelper } from './FaceLandmarksHelper';
+import { HumanHelper, IFaceLandmarksHelper } from './FaceLandmarksHelper';
 import { DETECT_FACE, INIT_WORKER } from './constants';
 
-let helper: FaceLandmarksHelper;
+let helper: IFaceLandmarksHelper;
 
 onmessage = async function({ data }: MessageEvent<any>) {
     switch (data.type) {
diff --git a/react/features/face-landmarks/functions.ts b/react/features/face-landmarks/functions.ts
index 30132d13f..5602eb57c 100644
--- a/react/features/face-landmarks/functions.ts
+++ b/react/features/face-landmarks/functions.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { getLocalParticipant } from '../base/participants/functions';
 import { extractFqnFromPath } from '../dynamic-branding/functions.any';
 
@@ -89,7 +89,7 @@ export function sendFaceExpressionToServer(
  * @param  {Object} state - Redux state.
  * @returns {boolean} - True if sent, false otherwise.
  */
-export async function sendFaceExpressionsWebhook(state: IState) {
+export async function sendFaceExpressionsWebhook(state: IReduxState) {
     const { webhookProxyUrl: url } = state['features/base/config'];
     const { conference } = state['features/base/conference'];
     const { jwt } = state['features/base/jwt'];
@@ -191,21 +191,21 @@ export async function sendDataToWorker(
  * Gets face box for a participant id.
  *
  * @param {string} id - The participant id.
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {Object}
  */
-function getFaceBoxForId(id: string, state: IState) {
+function getFaceBoxForId(id: string, state: IReduxState) {
     return state['features/face-landmarks'].faceBoxes[id];
 }
 
 /**
  * Gets the video object position for a participant id.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @param {string} id - The participant id.
  * @returns {string} - CSS object-position in the shape of '{horizontalPercentage}% {verticalPercentage}%'.
  */
-export function getVideoObjectPosition(state: IState, id?: string) {
+export function getVideoObjectPosition(state: IReduxState, id?: string) {
     const faceBox = id && getFaceBoxForId(id, state);
 
     if (faceBox) {
@@ -222,10 +222,10 @@ export function getVideoObjectPosition(state: IState, id?: string) {
 /**
  * Gets the video object position for a participant id.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {number} - Number of milliseconds for doing face detection.
  */
-export function getDetectionInterval(state: IState) {
+export function getDetectionInterval(state: IReduxState) {
     const { faceLandmarks } = state['features/base/config'];
 
     return Math.max(faceLandmarks?.captureInterval || SEND_IMAGE_INTERVAL_MS);
@@ -234,10 +234,10 @@ export function getDetectionInterval(state: IState) {
 /**
  * Returns the duration in seconds of a face expression.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @param {number} faceExpressionCount - The number of consecutive face expressions.
  * @returns {number} - Duration of face expression in seconds.
  */
-export function getFaceExpressionDuration(state: IState, faceExpressionCount: number) {
+export function getFaceExpressionDuration(state: IReduxState, faceExpressionCount: number) {
     return faceExpressionCount * (getDetectionInterval(state) / 1000);
 }
diff --git a/react/features/face-landmarks/middleware.ts b/react/features/face-landmarks/middleware.ts
index 7fdcc6c5d..2ba9aa61f 100644
--- a/react/features/face-landmarks/middleware.ts
+++ b/react/features/face-landmarks/middleware.ts
@@ -6,7 +6,7 @@ import {
 import { getCurrentConference } from '../base/conference/functions';
 import { JitsiConferenceEvents } from '../base/lib-jitsi-meet';
 import { getLocalParticipant, getParticipantCount } from '../base/participants/functions';
-import { Participant } from '../base/participants/types';
+import { IParticipant } from '../base/participants/types';
 import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
 import { TRACK_ADDED, TRACK_REMOVED, TRACK_UPDATED } from '../base/tracks/actionTypes';
 
@@ -32,7 +32,7 @@ MiddlewareRegistry.register((store: IStore) => (next: Function) => (action: any)
         // allow using remote face centering data when local face centering is not enabled
         action.conference.on(
             JitsiConferenceEvents.ENDPOINT_MESSAGE_RECEIVED,
-            (participant: Participant | undefined, eventData: any) => {
+            (participant: IParticipant | undefined, eventData: any) => {
                 if (!participant || !eventData || !participant.getId) {
                     return;
                 }
diff --git a/react/features/filmstrip/components/web/Filmstrip.tsx b/react/features/filmstrip/components/web/Filmstrip.tsx
index 5101589ba..5c66cb47c 100644
--- a/react/features/filmstrip/components/web/Filmstrip.tsx
+++ b/react/features/filmstrip/components/web/Filmstrip.tsx
@@ -8,13 +8,13 @@ import { FixedSizeGrid, FixedSizeList } from 'react-window';
 
 import { ACTION_SHORTCUT_TRIGGERED, createShortcutEvent, createToolbarEvent } from '../../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../../analytics/functions';
-import { IState, IStore } from '../../../app/types';
+import { IReduxState, IStore } from '../../../app/types';
 import { getSourceNameSignalingFeatureFlag, getToolbarButtons } from '../../../base/config/functions.web';
 import { isMobileBrowser } from '../../../base/environment/utils';
 import { translate } from '../../../base/i18n/functions';
 import Icon from '../../../base/icons/components/Icon';
 import { IconMenuDown, IconMenuUp } from '../../../base/icons/svg';
-import { Participant } from '../../../base/participants/types';
+import { IParticipant } from '../../../base/participants/types';
 import { connect } from '../../../base/redux/functions';
 import { shouldHideSelfView } from '../../../base/settings/functions.any';
 // @ts-ignore
@@ -62,7 +62,7 @@ declare let APP: any;
 /**
  * The type of the React {@code Component} props of {@link Filmstrip}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Additional CSS class names top add to the root.
@@ -122,7 +122,7 @@ interface Props extends WithTranslation {
     /**
      * The local screen share participant. This prop is behind the sourceNameSignaling feature flag.
      */
-    _localScreenShare: Participant;
+    _localScreenShare: IParticipant;
 
     /**
      * Whether or not the filmstrip videos should currently be displayed.
@@ -264,7 +264,7 @@ type State = {
  *
  * @augments Component
  */
-class Filmstrip extends PureComponent <Props, State> {
+class Filmstrip extends PureComponent <IProps, State> {
 
     _throttledResize: Function;
 
@@ -274,7 +274,7 @@ class Filmstrip extends PureComponent <Props, State> {
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this.state = {
@@ -878,9 +878,9 @@ class Filmstrip extends PureComponent <Props, State> {
  * @param {Object} state - The Redux state.
  * @param {Object} ownProps - The own props of the component.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function _mapStateToProps(state: IState, ownProps: Partial<Props>) {
+function _mapStateToProps(state: IReduxState, ownProps: Partial<IProps>) {
     const { _hasScroll = false, filmstripType, _topPanelFilmstrip, _remoteParticipants } = ownProps;
     const toolbarButtons = getToolbarButtons(state);
     const { testing = {}, iAmRecorder } = state['features/base/config'];
diff --git a/react/features/filmstrip/components/web/PinnedIndicator.tsx b/react/features/filmstrip/components/web/PinnedIndicator.tsx
index a54916365..4f10eb3b0 100644
--- a/react/features/filmstrip/components/web/PinnedIndicator.tsx
+++ b/react/features/filmstrip/components/web/PinnedIndicator.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { IconPinParticipant } from '../../../base/icons/svg';
 import { getParticipantById } from '../../../base/participants/functions';
 import BaseIndicator from '../../../base/react/components/web/BaseIndicator';
@@ -56,7 +56,7 @@ const PinnedIndicator = ({
     tooltipPosition
 }: Props) => {
     const stageFilmstrip = useSelector(isStageFilmstripAvailable);
-    const pinned = useSelector((state: IState) => getParticipantById(state, participantId))?.pinned;
+    const pinned = useSelector((state: IReduxState) => getParticipantById(state, participantId))?.pinned;
     const activePinnedParticipants: Array<{ participantId: string; pinned: boolean; }>
         = useSelector(getPinnedActiveParticipants);
     const isPinned = activePinnedParticipants.find(p => p.participantId === participantId);
diff --git a/react/features/filmstrip/components/web/RaisedHandIndicator.tsx b/react/features/filmstrip/components/web/RaisedHandIndicator.tsx
index b8e4cc983..552153a08 100644
--- a/react/features/filmstrip/components/web/RaisedHandIndicator.tsx
+++ b/react/features/filmstrip/components/web/RaisedHandIndicator.tsx
@@ -3,10 +3,10 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { IconRaisedHand } from '../../../base/icons/svg';
 import { getParticipantById, hasRaisedHand } from '../../../base/participants/functions';
-import { Participant } from '../../../base/participants/types';
+import { IParticipant } from '../../../base/participants/types';
 import BaseIndicator from '../../../base/react/components/web/BaseIndicator';
 
 /**
@@ -54,7 +54,7 @@ const RaisedHandIndicator = ({
     participantId,
     tooltipPosition
 }: Props) => {
-    const participant: Participant | undefined = useSelector((state: IState) =>
+    const participant: IParticipant | undefined = useSelector((state: IReduxState) =>
         getParticipantById(state, participantId));
     const _raisedHand = hasRaisedHand(participant);
     const { classes: styles, theme } = useStyles();
diff --git a/react/features/filmstrip/components/web/Thumbnail.tsx b/react/features/filmstrip/components/web/Thumbnail.tsx
index 07ecb0e48..a8aee9b55 100644
--- a/react/features/filmstrip/components/web/Thumbnail.tsx
+++ b/react/features/filmstrip/components/web/Thumbnail.tsx
@@ -8,7 +8,7 @@ import { connect } from 'react-redux';
 
 import { createScreenSharingIssueEvent } from '../../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../../analytics/functions';
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 // @ts-ignore
 import { Avatar } from '../../../base/avatar';
 import {
@@ -29,7 +29,7 @@ import {
     isScreenShareParticipant,
     isWhiteboardParticipant
 } from '../../../base/participants/functions';
-import { Participant } from '../../../base/participants/types';
+import { IParticipant } from '../../../base/participants/types';
 import { ASPECT_RATIO_NARROW } from '../../../base/responsive-ui/constants';
 import { isTestModeEnabled } from '../../../base/testing/functions';
 import { trackStreamingStatusChanged, updateLastTrackVideoMediaEvent } from '../../../base/tracks/actions';
@@ -198,7 +198,7 @@ export type Props = {
     /**
      * An object with information about the participant related to the thumbnail.
      */
-    _participant: Participant;
+    _participant: IParticipant;
 
     /**
      * Whether or not the participant has the hand raised.
@@ -1171,7 +1171,7 @@ class Thumbnail extends Component<Props, State> {
  * @private
  * @returns {Props}
  */
-function _mapStateToProps(state: IState, ownProps: any): Object {
+function _mapStateToProps(state: IReduxState, ownProps: any): Object {
     const { participantID, filmstripType = FILMSTRIP_TYPE.MAIN } = ownProps;
 
     const participant = getParticipantByIdOrUndefined(state, participantID);
diff --git a/react/features/filmstrip/components/web/ThumbnailBottomIndicators.tsx b/react/features/filmstrip/components/web/ThumbnailBottomIndicators.tsx
index 5e95f9626..a68b9d69b 100644
--- a/react/features/filmstrip/components/web/ThumbnailBottomIndicators.tsx
+++ b/react/features/filmstrip/components/web/ThumbnailBottomIndicators.tsx
@@ -4,7 +4,7 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import {
     getMultipleVideoSupportFeatureFlag,
     isDisplayNameVisible,
@@ -79,7 +79,7 @@ const ThumbnailBottomIndicators = ({
     const _isMultiStreamEnabled = useSelector(getMultipleVideoSupportFeatureFlag);
     const _showDisplayName = useSelector(isDisplayNameVisible);
     const isVirtualScreenshareParticipant = useSelector(
-        (state: IState) => isScreenShareParticipantById(state, participantId)
+        (state: IReduxState) => isScreenShareParticipantById(state, participantId)
     );
 
     return (<div className = { className }>
diff --git a/react/features/filmstrip/components/web/ThumbnailTopIndicators.tsx b/react/features/filmstrip/components/web/ThumbnailTopIndicators.tsx
index 9d2530ba3..267e5787f 100644
--- a/react/features/filmstrip/components/web/ThumbnailTopIndicators.tsx
+++ b/react/features/filmstrip/components/web/ThumbnailTopIndicators.tsx
@@ -4,7 +4,7 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { getMultipleVideoSupportFeatureFlag } from '../../../base/config/functions.any';
 import { isMobileBrowser } from '../../../base/environment/utils';
 import { isScreenShareParticipantById } from '../../../base/participants/functions';
@@ -98,13 +98,13 @@ const ThumbnailTopIndicators = ({
     const { NORMAL = 16 } = interfaceConfig.INDICATOR_FONT_SIZES || {};
     const _indicatorIconSize = NORMAL;
     const _connectionIndicatorAutoHideEnabled = Boolean(
-        useSelector((state: IState) => state['features/base/config'].connectionIndicators?.autoHide) ?? true);
+        useSelector((state: IReduxState) => state['features/base/config'].connectionIndicators?.autoHide) ?? true);
     const _connectionIndicatorDisabled = _isMobile || disableConnectionIndicator
-        || Boolean(useSelector((state: IState) => state['features/base/config'].connectionIndicators?.disabled));
+        || Boolean(useSelector((state: IReduxState) => state['features/base/config'].connectionIndicators?.disabled));
     const _isMultiStreamEnabled = useSelector(getMultipleVideoSupportFeatureFlag);
     const showConnectionIndicator = isHovered || !_connectionIndicatorAutoHideEnabled;
     const isVirtualScreenshareParticipant = useSelector(
-        (state: IState) => isScreenShareParticipantById(state, participantId)
+        (state: IReduxState) => isScreenShareParticipantById(state, participantId)
     );
 
     if (_isMultiStreamEnabled && isVirtualScreenshareParticipant) {
diff --git a/react/features/filmstrip/reducer.ts b/react/features/filmstrip/reducer.ts
index d2622336f..b7839593d 100644
--- a/react/features/filmstrip/reducer.ts
+++ b/react/features/filmstrip/reducer.ts
@@ -178,12 +178,12 @@ const DEFAULT_STATE = {
     }
 };
 
-interface Dimensions {
+interface IDimensions {
     height: number;
     width: number;
 }
 
-interface FilmstripDimensions {
+interface IFilmstripDimensions {
     filmstripHeight?: number;
     filmstripWidth?: number;
     gridDimensions?: {
@@ -191,7 +191,7 @@ interface FilmstripDimensions {
         rows: number;
     };
     hasScroll?: boolean;
-    thumbnailSize?: Dimensions;
+    thumbnailSize?: IDimensions;
 }
 
 export interface IFilmstripState {
@@ -202,9 +202,9 @@ export interface IFilmstripState {
     enabled: boolean;
     horizontalViewDimensions: {
         hasScroll?: boolean;
-        local?: Dimensions;
-        remote?: Dimensions;
-        remoteVideosContainer?: Dimensions;
+        local?: IDimensions;
+        remote?: IDimensions;
+        remoteVideosContainer?: IDimensions;
     };
     isResizing: boolean;
     participantsVolume: {
@@ -214,11 +214,11 @@ export interface IFilmstripState {
     screenshareFilmstripDimensions: {
         filmstripHeight?: number;
         filmstripWidth?: number;
-        thumbnailSize?: Dimensions;
+        thumbnailSize?: IDimensions;
     };
     screenshareFilmstripParticipantId?: string | null;
-    stageFilmstripDimensions: FilmstripDimensions;
-    tileViewDimensions?: FilmstripDimensions;
+    stageFilmstripDimensions: IFilmstripDimensions;
+    tileViewDimensions?: IFilmstripDimensions;
     topPanelHeight: {
         current: number | null;
         userSet: number | null;
@@ -231,12 +231,12 @@ export interface IFilmstripState {
                 rows: number;
             };
             hasScroll: boolean;
-            thumbnailSize: Dimensions;
+            thumbnailSize: IDimensions;
         };
         hasScroll?: boolean;
-        local?: Dimensions;
-        remote?: Dimensions;
-        remoteVideosContainer?: Dimensions;
+        local?: IDimensions;
+        remote?: IDimensions;
+        remoteVideosContainer?: IDimensions;
     };
     visible: boolean;
     visibleParticipantsEndIndex: number;
diff --git a/react/features/gifs/components/web/GifsMenu.tsx b/react/features/gifs/components/web/GifsMenu.tsx
index 51e03fd6b..995fd1a47 100644
--- a/react/features/gifs/components/web/GifsMenu.tsx
+++ b/react/features/gifs/components/web/GifsMenu.tsx
@@ -9,7 +9,7 @@ import { makeStyles } from 'tss-react/mui';
 
 import { createGifSentEvent } from '../../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../../analytics/functions';
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import Input from '../../../base/ui/components/web/Input';
 import { sendMessage } from '../../../chat/actions.any';
 import { SCROLL_SIZE } from '../../../filmstrip/constants';
@@ -87,7 +87,7 @@ function GifsMenu() {
     const dispatch = useDispatch();
     const { t } = useTranslation();
     const overflowDrawer: boolean = useSelector(showOverflowDrawer);
-    const { clientWidth } = useSelector((state: IState) => state['features/base/responsive-ui']);
+    const { clientWidth } = useSelector((state: IReduxState) => state['features/base/responsive-ui']);
 
     const fetchGifs = useCallback(async (offset = 0) => {
         const options: TrendingOptions = {
diff --git a/react/features/gifs/functions.ts b/react/features/gifs/functions.ts
index efb6c9d00..714176d53 100644
--- a/react/features/gifs/functions.ts
+++ b/react/features/gifs/functions.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { showOverflowDrawer } from '../toolbox/functions.web';
 
 import { GIF_PREFIX } from './constants';
@@ -7,11 +7,11 @@ import { IGif } from './reducer';
 /**
  * Gets the URL of the GIF for the given participant or null if there's none.
  *
- * @param {IState} state - Redux state.
+ * @param {IReduxState} state - Redux state.
  * @param {string} participantId - Id of the participant for which to remove the GIF.
  * @returns {Object}
  */
-export function getGifForParticipant(state: IState, participantId: string): IGif {
+export function getGifForParticipant(state: IReduxState, participantId: string): IGif {
     return isGifEnabled(state) ? state['features/gifs'].gifList.get(participantId) || {} : {};
 }
 
@@ -29,10 +29,10 @@ export function isGifMessage(message: string) {
 /**
  * Returns the visibility state of the gifs menu.
  *
- * @param {IState} state - The state of the application.
+ * @param {IReduxState} state - The state of the application.
  * @returns {boolean}
  */
-export function isGifsMenuOpen(state: IState) {
+export function isGifsMenuOpen(state: IReduxState) {
     const overflowDrawer = showOverflowDrawer(state);
     const { drawerVisible, menuOpen } = state['features/gifs'];
 
@@ -66,20 +66,20 @@ export function formatGifUrlMessage(url: string) {
 /**
  * Get the Giphy API Key from config.
  *
- * @param {IState} state - Redux state.
+ * @param {IReduxState} state - Redux state.
  * @returns {string}
  */
-export function getGifAPIKey(state: IState) {
+export function getGifAPIKey(state: IReduxState) {
     return state['features/base/config']?.giphy?.sdkKey ?? '';
 }
 
 /**
  * Returns whether or not the feature is enabled.
  *
- * @param {IState} state - Redux state.
+ * @param {IReduxState} state - Redux state.
  * @returns {boolean}
  */
-export function isGifEnabled(state: IState) {
+export function isGifEnabled(state: IReduxState) {
     const { disableThirdPartyRequests } = state['features/base/config'];
     const { giphy } = state['features/base/config'];
 
@@ -93,10 +93,10 @@ export function isGifEnabled(state: IState) {
 /**
  * Get the GIF display mode.
  *
- * @param {IState} state - Redux state.
+ * @param {IReduxState} state - Redux state.
  * @returns {string}
  */
-export function getGifDisplayMode(state: IState) {
+export function getGifDisplayMode(state: IReduxState) {
     const { giphy } = state['features/base/config'];
 
     return giphy?.displayMode || 'all';
diff --git a/react/features/gifs/middleware.any.ts b/react/features/gifs/middleware.any.ts
index da23750e7..b16e184e9 100644
--- a/react/features/gifs/middleware.any.ts
+++ b/react/features/gifs/middleware.any.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
 
 import { ADD_GIF_FOR_PARTICIPANT, HIDE_GIF_FOR_PARTICIPANT, SHOW_GIF_FOR_PARTICIPANT } from './actionTypes';
@@ -50,11 +50,11 @@ MiddlewareRegistry.register(store => next => action => {
 /**
  * Clears GIF timeout.
  *
- * @param {IState} state - Redux state.
+ * @param {IReduxState} state - Redux state.
  * @param {string} id - Id of the participant for whom to clear the timeout.
  * @returns {void}
  */
-function _clearGifTimeout(state: IState, id: string) {
+function _clearGifTimeout(state: IReduxState, id: string) {
     const gif = getGifForParticipant(state, id);
 
     clearTimeout(gif?.timeoutID);
diff --git a/react/features/invite/components/add-people-dialog/web/AddPeopleDialog.tsx b/react/features/invite/components/add-people-dialog/web/AddPeopleDialog.tsx
index 86a76f4a7..f8e621f54 100644
--- a/react/features/invite/components/add-people-dialog/web/AddPeopleDialog.tsx
+++ b/react/features/invite/components/add-people-dialog/web/AddPeopleDialog.tsx
@@ -4,7 +4,7 @@ import { WithTranslation } from 'react-i18next';
 
 import { createInviteDialogEvent } from '../../../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../../../analytics/functions';
-import { IState } from '../../../../app/types';
+import { IReduxState } from '../../../../app/types';
 import { getInviteURL } from '../../../../base/connection/functions';
 import { translate } from '../../../../base/i18n/functions';
 import { JitsiRecordingConstants } from '../../../../base/lib-jitsi-meet';
@@ -41,7 +41,7 @@ import InviteContactsSection from './InviteContactsSection';
 // @ts-ignore
 import LiveStreamSection from './LiveStreamSection';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The object representing the dialIn feature.
@@ -135,7 +135,7 @@ function AddPeopleDialog({
     _liveStreamViewURL,
     _phoneNumber,
     t,
-    updateNumbers }: Props) {
+    updateNumbers }: IProps) {
 
     /**
      * Updates the dial-in numbers.
@@ -207,9 +207,9 @@ function AddPeopleDialog({
  * @param {Object} state - The Redux state.
  * @param {Object} ownProps - The properties explicitly passed to the component.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function mapStateToProps(state: IState, ownProps: Partial<Props>) {
+function mapStateToProps(state: IReduxState, ownProps: Partial<IProps>) {
     const currentLiveStreamingSession
         = getActiveSession(state, JitsiRecordingConstants.mode.STREAM);
     const { iAmRecorder, inviteAppName } = state['features/base/config'];
@@ -244,7 +244,7 @@ function mapStateToProps(state: IState, ownProps: Partial<Props>) {
  * Maps dispatching of some action to React component props.
  *
  * @param {Function} dispatch - Redux action dispatcher.
- * @returns {Props}
+ * @returns {IProps}
  */
 const mapDispatchToProps = {
     updateNumbers: () => updateDialInNumbers()
diff --git a/react/features/jaas/functions.ts b/react/features/jaas/functions.ts
index 447366cdf..43e23ccfe 100644
--- a/react/features/jaas/functions.ts
+++ b/react/features/jaas/functions.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 
 import { VPAAS_TENANT_PREFIX } from './constants';
 import logger from './logger';
@@ -22,20 +22,20 @@ function extractVpaasTenantFromPath(path: string) {
 /**
  * Returns the vpaas tenant.
  *
- * @param {IState} state - The global state.
+ * @param {IReduxState} state - The global state.
  * @returns {string}
  */
-export function getVpaasTenant(state: IState) {
+export function getVpaasTenant(state: IReduxState) {
     return extractVpaasTenantFromPath(state['features/base/connection'].locationURL?.pathname ?? '');
 }
 
 /**
  * Returns true if the current meeting is a vpaas one.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {boolean}
  */
-export function isVpaasMeeting(state: IState) {
+export function isVpaasMeeting(state: IReduxState) {
     const connection = state['features/base/connection'];
 
     if (connection?.locationURL?.pathname) {
@@ -78,11 +78,11 @@ export async function sendGetDetailsRequest({ appId, baseUrl }: {
 /**
  * Returns the billing id for vpaas meetings.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @param {string} feature - Feature to be looked up for disable state.
  * @returns {boolean}
  */
-export function isFeatureDisabled(state: IState, feature: string) {
+export function isFeatureDisabled(state: IReduxState, feature: string) {
     return state['features/jaas'].disabledFeatures.includes(feature);
 }
 
@@ -119,10 +119,10 @@ export async function sendGetJWTRequest({ appId, baseUrl }: {
 /**
  * Gets a jaas JWT.
  *
- * @param {IState} state - Redux state.
+ * @param {IReduxState} state - Redux state.
  * @returns {string} The JWT.
  */
-export async function getJaasJWT(state: IState) {
+export async function getJaasJWT(state: IReduxState) {
     const baseUrl = state['features/base/config'].jaasTokenUrl;
     const appId = getVpaasTenant(state);
 
diff --git a/react/features/keyboard-shortcuts/components/web/KeyboardShortcutsDialog.tsx b/react/features/keyboard-shortcuts/components/web/KeyboardShortcutsDialog.tsx
index 42528382a..1358478bc 100644
--- a/react/features/keyboard-shortcuts/components/web/KeyboardShortcutsDialog.tsx
+++ b/react/features/keyboard-shortcuts/components/web/KeyboardShortcutsDialog.tsx
@@ -10,7 +10,7 @@ import Dialog from '../../../base/ui/components/web/Dialog';
  * The type of the React {@code Component} props of
  * {@link KeyboardShortcutsDialog}.
  */
-interface Props {
+interface IProps {
 
     /**
      * A Map with keyboard keys as keys and translation keys as values.
@@ -49,7 +49,7 @@ const useStyles = makeStyles()((theme: Theme) => {
     };
 });
 
-const KeyboardShortcutsDialog = ({ shortcutDescriptions }: Props) => {
+const KeyboardShortcutsDialog = ({ shortcutDescriptions }: IProps) => {
     const { classes, cx } = useStyles();
     const { t } = useTranslation();
 
diff --git a/react/features/lobby/components/web/LobbySection.tsx b/react/features/lobby/components/web/LobbySection.tsx
index 6d6eb8eca..6d1e0ce8d 100644
--- a/react/features/lobby/components/web/LobbySection.tsx
+++ b/react/features/lobby/components/web/LobbySection.tsx
@@ -1,7 +1,7 @@
 import React, { PureComponent } from 'react';
 import { WithTranslation } from 'react-i18next';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { translate } from '../../../base/i18n/functions';
 import { isLocalParticipantModerator } from '../../../base/participants/functions';
 import { connect } from '../../../base/redux/functions';
@@ -11,7 +11,7 @@ import { isInBreakoutRoom } from '../../../breakout-rooms/functions';
 // @ts-ignore
 import { toggleLobbyMode } from '../../actions';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * True if lobby is currently enabled in the conference.
@@ -40,13 +40,13 @@ type State = {
 /**
  * Implements a security feature section to control lobby mode.
  */
-class LobbySection extends PureComponent<Props, State> {
+class LobbySection extends PureComponent<IProps, State> {
     /**
      * Instantiates a new component.
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this.state = {
@@ -61,7 +61,7 @@ class LobbySection extends PureComponent<Props, State> {
      *
      * @inheritdoc
      */
-    static getDerivedStateFromProps(props: Props, state: State) {
+    static getDerivedStateFromProps(props: IProps, state: State) {
         if (props._lobbyEnabled !== state.lobbyEnabled) {
 
             return {
@@ -127,9 +127,9 @@ class LobbySection extends PureComponent<Props, State> {
  * Maps part of the Redux state to the props of this component.
  *
  * @param {Object} state - The Redux state.
- * @returns {Props}
+ * @returns {IProps}
  */
-function mapStateToProps(state: IState): Partial<Props> {
+function mapStateToProps(state: IReduxState): Partial<IProps> {
     const { conference } = state['features/base/conference'];
     const { hideLobbyButton } = state['features/base/config'];
 
diff --git a/react/features/lobby/reducer.ts b/react/features/lobby/reducer.ts
index 66a851ae2..c7283612f 100644
--- a/react/features/lobby/reducer.ts
+++ b/react/features/lobby/reducer.ts
@@ -1,5 +1,5 @@
 import { CONFERENCE_JOINED, CONFERENCE_LEFT, SET_PASSWORD } from '../base/conference/actionTypes';
-import { Participant } from '../base/participants/types';
+import { IParticipant } from '../base/participants/types';
 import ReducerRegistry from '../base/redux/ReducerRegistry';
 
 import {
@@ -21,13 +21,13 @@ const DEFAULT_STATE = {
     passwordJoinFailed: false
 };
 
-interface KnockingParticipant extends Participant {
+interface IKnockingParticipant extends IParticipant {
     chattingWithModerator?: string;
 }
 
 export interface ILobbyState {
     knocking: boolean;
-    knockingParticipants: KnockingParticipant[];
+    knockingParticipants: IKnockingParticipant[];
     lobbyEnabled: boolean;
     lobbyVisible: boolean;
     passwordJoinFailed: boolean;
@@ -123,7 +123,7 @@ ReducerRegistry.register<ILobbyState>('features/lobby', (state = DEFAULT_STATE,
  * @param {Object} state - The current Redux state of the feature.
  * @returns {Object}
  */
-function _knockingParticipantArrivedOrUpdated(participant: KnockingParticipant, state: ILobbyState) {
+function _knockingParticipantArrivedOrUpdated(participant: IKnockingParticipant, state: ILobbyState) {
     let existingParticipant = state.knockingParticipants.find(p => p.id === participant.id);
 
     existingParticipant = {
diff --git a/react/features/noise-suppression/components/NoiseSuppressionButton.tsx b/react/features/noise-suppression/components/NoiseSuppressionButton.tsx
index 5dc6fa828..8fb257273 100644
--- a/react/features/noise-suppression/components/NoiseSuppressionButton.tsx
+++ b/react/features/noise-suppression/components/NoiseSuppressionButton.tsx
@@ -1,5 +1,5 @@
 /* eslint-disable lines-around-comment */
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { translate } from '../../base/i18n/functions';
 import {
     IconNoiseSuppressionOff,
@@ -70,7 +70,7 @@ class NoiseSuppressionButton extends AbstractButton<Props, any, any> {
  * @private
  * @returns {Props}
  */
-function _mapStateToProps(state: IState): Object {
+function _mapStateToProps(state: IReduxState): Object {
     return {
         _isNoiseSuppressionEnabled: isNoiseSuppressionEnabled(state)
     };
diff --git a/react/features/noise-suppression/functions.ts b/react/features/noise-suppression/functions.ts
index b13fa9731..bcd6c5ede 100644
--- a/react/features/noise-suppression/functions.ts
+++ b/react/features/noise-suppression/functions.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { showWarningNotification } from '../notifications/actions';
 import { NOTIFICATION_TIMEOUT_TYPE } from '../notifications/constants';
 import { isScreenAudioShared } from '../screen-share/functions';
@@ -6,10 +6,10 @@ import { isScreenAudioShared } from '../screen-share/functions';
 /**
  * Is noise suppression currently enabled.
  *
- * @param {IState} state - The state of the application.
+ * @param {IReduxState} state - The state of the application.
  * @returns {boolean}
  */
-export function isNoiseSuppressionEnabled(state: IState): boolean {
+export function isNoiseSuppressionEnabled(state: IReduxState): boolean {
     return state['features/noise-suppression'].enabled;
 }
 
@@ -21,7 +21,7 @@ export function isNoiseSuppressionEnabled(state: IState): boolean {
  * @param {*} localAudio - Current local audio track.
  * @returns {boolean}
  */
-export function canEnableNoiseSuppression(state: IState, dispatch: Function, localAudio: any): boolean {
+export function canEnableNoiseSuppression(state: IReduxState, dispatch: Function, localAudio: any): boolean {
     if (!localAudio) {
         dispatch(showWarningNotification({
             titleKey: 'notify.noiseSuppressionFailedTitle',
diff --git a/react/features/notifications/components/web/NotificationsContainer.tsx b/react/features/notifications/components/web/NotificationsContainer.tsx
index 8ad47d6e5..ab75d86ba 100644
--- a/react/features/notifications/components/web/NotificationsContainer.tsx
+++ b/react/features/notifications/components/web/NotificationsContainer.tsx
@@ -7,7 +7,7 @@ import React, { Component } from 'react';
 import { WithTranslation } from 'react-i18next';
 import { CSSTransition, TransitionGroup } from 'react-transition-group';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { translate } from '../../../base/i18n/functions';
 import { connect } from '../../../base/redux/functions';
 import { hideNotification } from '../../actions';
@@ -16,7 +16,7 @@ import { areThereNotifications } from '../../functions';
 // @ts-ignore
 import Notification from './Notification';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Whether we are a SIP gateway or not.
@@ -122,7 +122,7 @@ const useStyles = (theme: Theme) => {
  *
  * @augments {Component}
  */
-class NotificationsContainer extends Component<Props> {
+class NotificationsContainer extends Component<IProps> {
     _api: Object;
     _timeouts: Map<string, number>;
 
@@ -131,7 +131,7 @@ class NotificationsContainer extends Component<Props> {
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._timeouts = new Map();
@@ -235,9 +235,9 @@ class NotificationsContainer extends Component<Props> {
  *
  * @param {Object} state - The Redux state.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function _mapStateToProps(state: IState) {
+function _mapStateToProps(state: IReduxState) {
     const { notifications } = state['features/notifications'];
     const { iAmSipGateway } = state['features/base/config'];
     const { isOpen: isChatOpen } = state['features/chat'];
diff --git a/react/features/notifications/middleware.ts b/react/features/notifications/middleware.ts
index fa009f0d9..7f9e3c848 100644
--- a/react/features/notifications/middleware.ts
+++ b/react/features/notifications/middleware.ts
@@ -1,4 +1,4 @@
-import { IState, IStore } from '../app/types';
+import { IReduxState, IStore } from '../app/types';
 import { getCurrentConference } from '../base/conference/functions';
 import {
     PARTICIPANT_JOINED,
@@ -70,7 +70,7 @@ const createTimeoutId = (notification: { timeout: number; uid: string; }, dispat
  * @param {Object} state - Global state.
  * @returns {Array<Object>} - Notifications state.
  */
-const getNotifications = (state: IState) => {
+const getNotifications = (state: IReduxState) => {
     const _visible = areThereNotifications(state);
     const { notifications } = state['features/notifications'];
 
diff --git a/react/features/participants-pane/components/breakout-rooms/components/web/CollapsibleRoom.tsx b/react/features/participants-pane/components/breakout-rooms/components/web/CollapsibleRoom.tsx
index 734d8b4c3..9b4e12099 100644
--- a/react/features/participants-pane/components/breakout-rooms/components/web/CollapsibleRoom.tsx
+++ b/react/features/participants-pane/components/breakout-rooms/components/web/CollapsibleRoom.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../../../app/types';
+import { IReduxState } from '../../../../../app/types';
 import ListItem from '../../../../../base/components/participants-pane-list/ListItem';
 import Icon from '../../../../../base/icons/components/Icon';
 import { IconArrowDown, IconArrowUp } from '../../../../../base/icons/svg';
@@ -128,7 +128,7 @@ export const CollapsibleRoom = ({
     const raiseMenu = useCallback(target => {
         onRaiseMenu(target);
     }, [ onRaiseMenu ]);
-    const { defaultRemoteDisplayName } = useSelector((state: IState) => state['features/base/config']);
+    const { defaultRemoteDisplayName } = useSelector((state: IReduxState) => state['features/base/config']);
     const overflowDrawer: boolean = useSelector(showOverflowDrawer);
     const moderator = useSelector(isLocalParticipantModerator);
 
diff --git a/react/features/participants-pane/components/native/RoomParticipantMenu.tsx b/react/features/participants-pane/components/native/RoomParticipantMenu.tsx
index d186a723d..03589200f 100644
--- a/react/features/participants-pane/components/native/RoomParticipantMenu.tsx
+++ b/react/features/participants-pane/components/native/RoomParticipantMenu.tsx
@@ -3,7 +3,7 @@ import React, { PureComponent } from 'react';
 import { WithTranslation } from 'react-i18next';
 import { Text, View } from 'react-native';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 // @ts-ignore
 import { Avatar } from '../../../base/avatar';
 // @ts-ignore
@@ -23,7 +23,7 @@ import styles from '../../../video-menu/components/native/styles';
  */
 const AVATAR_SIZE = 24;
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The list of all breakout rooms.
@@ -54,13 +54,13 @@ interface Props extends WithTranslation {
 /**
  * Class to implement a popup menu that opens upon long pressing a thumbnail.
  */
-class RoomParticipantMenu extends PureComponent<Props> {
+class RoomParticipantMenu extends PureComponent<IProps> {
     /**
      * Constructor of the component.
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onCancel = this._onCancel.bind(this);
@@ -137,9 +137,9 @@ class RoomParticipantMenu extends PureComponent<Props> {
  *
  * @param {Object} state - Redux state.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function _mapStateToProps(state: IState) {
+function _mapStateToProps(state: IReduxState) {
     return {
         _rooms: Object.values(getBreakoutRooms(state))
     };
diff --git a/react/features/participants-pane/components/web/FooterContextMenu.tsx b/react/features/participants-pane/components/web/FooterContextMenu.tsx
index a990382b4..c416373c3 100644
--- a/react/features/participants-pane/components/web/FooterContextMenu.tsx
+++ b/react/features/participants-pane/components/web/FooterContextMenu.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import {
     requestDisableAudioModeration,
     requestDisableVideoModeration,
@@ -88,7 +88,7 @@ type Props = {
 
 export const FooterContextMenu = ({ isOpen, onDrawerClose, onMouseLeave }: Props) => {
     const dispatch = useDispatch();
-    const isModerationSupported = useSelector((state: IState) => isAvModerationSupported()(state));
+    const isModerationSupported = useSelector((state: IReduxState) => isAvModerationSupported()(state));
     const allModerators = useSelector(isEveryoneModerator);
     const isModeratorSettingsTabEnabled = useSelector(shouldShowModeratorSettings);
     const participantCount = useSelector(getParticipantCount);
diff --git a/react/features/participants-pane/components/web/LobbyParticipantItem.tsx b/react/features/participants-pane/components/web/LobbyParticipantItem.tsx
index 7cd5431dd..c8e045901 100644
--- a/react/features/participants-pane/components/web/LobbyParticipantItem.tsx
+++ b/react/features/participants-pane/components/web/LobbyParticipantItem.tsx
@@ -6,7 +6,7 @@ import { makeStyles } from 'tss-react/mui';
 
 import { IconChat, IconCloseCircle, IconHorizontalPoints } from '../../../base/icons/svg';
 import { hasRaisedHand } from '../../../base/participants/functions';
-import { Participant } from '../../../base/participants/types';
+import { IParticipant } from '../../../base/participants/types';
 import Button from '../../../base/ui/components/web/Button';
 import ContextMenu from '../../../base/ui/components/web/ContextMenu';
 import ContextMenuItemGroup from '../../../base/ui/components/web/ContextMenuItemGroup';
@@ -34,7 +34,7 @@ type Props = {
     /**
      * Participant reference.
      */
-    participant: Participant;
+    participant: IParticipant;
 };
 
 const useStyles = makeStyles()((theme: Theme) => {
diff --git a/react/features/participants-pane/components/web/MeetingParticipants.tsx b/react/features/participants-pane/components/web/MeetingParticipants.tsx
index 70e9ab417..2b7c80d4a 100644
--- a/react/features/participants-pane/components/web/MeetingParticipants.tsx
+++ b/react/features/participants-pane/components/web/MeetingParticipants.tsx
@@ -6,7 +6,7 @@ import { useTranslation } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { rejectParticipantAudio } from '../../../av-moderation/actions';
 import participantsPaneTheme from '../../../base/components/themes/participantsPaneTheme.json';
 import { isToolbarButtonEnabled } from '../../../base/config/functions.web';
@@ -160,7 +160,7 @@ function MeetingParticipants({
  * @private
  * @returns {Props}
  */
-function _mapStateToProps(state: IState): Object {
+function _mapStateToProps(state: IReduxState): Object {
     let sortedParticipantIds: any = getSortedParticipantIds(state);
 
     // Filter out the virtual screenshare participants since we do not want them to be displayed as separate
diff --git a/react/features/participants-pane/components/web/ParticipantItem.tsx b/react/features/participants-pane/components/web/ParticipantItem.tsx
index 51a3b7ffc..34d8676de 100644
--- a/react/features/participants-pane/components/web/ParticipantItem.tsx
+++ b/react/features/participants-pane/components/web/ParticipantItem.tsx
@@ -19,7 +19,7 @@ import {
 
 import { RaisedHandIndicator } from './RaisedHandIndicator';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Type of trigger for the participant actions.
@@ -121,7 +121,7 @@ const useStyles = makeStyles()((theme: Theme) => {
 /**
  * A component representing a participant entry in ParticipantPane and Lobby.
  *
- * @param {Props} props - The props of the component.
+ * @param {IProps} props - The props of the component.
  * @returns {ReactNode}
  */
 function ParticipantItem({
@@ -141,7 +141,7 @@ function ParticipantItem({
     t,
     videoMediaState = MEDIA_STATE.NONE,
     youText
-}: Props) {
+}: IProps) {
     const onClick = useCallback(
         () => openDrawerForParticipant?.({
             participantID,
diff --git a/react/features/participants-pane/components/web/ParticipantsPane.tsx b/react/features/participants-pane/components/web/ParticipantsPane.tsx
index f1d63069d..8672663a1 100644
--- a/react/features/participants-pane/components/web/ParticipantsPane.tsx
+++ b/react/features/participants-pane/components/web/ParticipantsPane.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import participantsPaneTheme from '../../../base/components/themes/participantsPaneTheme.json';
 import { openDialog } from '../../../base/dialog/actions';
 import { IconClose, IconHorizontalPoints } from '../../../base/icons/svg';
@@ -97,7 +97,7 @@ const useStyles = makeStyles()((theme: Theme) => {
 const ParticipantsPane = () => {
     const { classes } = useStyles();
     const paneOpen = useSelector(getParticipantsPaneOpen);
-    const isBreakoutRoomsSupported = useSelector((state: IState) => state['features/base/conference'])
+    const isBreakoutRoomsSupported = useSelector((state: IReduxState) => state['features/base/conference'])
         .conference?.getBreakoutRooms()?.isSupported();
     const showAddRoomButton = useSelector(isAddBreakoutRoomButtonVisible);
     const showFooter = useSelector(isLocalParticipantModerator);
diff --git a/react/features/participants-pane/functions.ts b/react/features/participants-pane/functions.ts
index 61ec240b4..664a1e03e 100644
--- a/react/features/participants-pane/functions.ts
+++ b/react/features/participants-pane/functions.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import {
     isEnabledFromState,
     isLocalParticipantApprovedFromState,
@@ -17,7 +17,7 @@ import {
     isLocalParticipantModerator,
     isParticipantModerator
 } from '../base/participants/functions';
-import { Participant } from '../base/participants/types';
+import { IParticipant } from '../base/participants/types';
 import { toState } from '../base/redux/functions';
 import { normalizeAccents } from '../base/util/strings';
 import { isInBreakoutRoom } from '../breakout-rooms/functions';
@@ -42,12 +42,12 @@ export const findAncestorByClass = (target: HTMLElement | null, cssClass: string
 /**
  * Checks if a participant is force muted.
  *
- * @param {Participant|undefined} participant - The participant.
+ * @param {IParticipant|undefined} participant - The participant.
  * @param {MediaType} mediaType - The media type.
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {MediaState}
  */
-export function isForceMuted(participant: Participant | undefined, mediaType: MediaType, state: IState) {
+export function isForceMuted(participant: IParticipant | undefined, mediaType: MediaType, state: IReduxState) {
     if (isEnabledFromState(mediaType, state)) {
         if (participant?.local) {
             return !isLocalParticipantApprovedFromState(mediaType, state);
@@ -67,12 +67,12 @@ export function isForceMuted(participant: Participant | undefined, mediaType: Me
 /**
  * Determines the audio media state (the mic icon) for a participant.
  *
- * @param {Participant} participant - The participant.
+ * @param {IParticipant} participant - The participant.
  * @param {boolean} muted - The mute state of the participant.
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {MediaState}
  */
-export function getParticipantAudioMediaState(participant: Participant, muted: Boolean, state: IState) {
+export function getParticipantAudioMediaState(participant: IParticipant, muted: Boolean, state: IReduxState) {
     const dominantSpeaker = getDominantSpeakerParticipant(state);
 
     if (muted) {
@@ -93,12 +93,12 @@ export function getParticipantAudioMediaState(participant: Participant, muted: B
 /**
  * Determines the video media state (the mic icon) for a participant.
  *
- * @param {Participant} participant - The participant.
+ * @param {IParticipant} participant - The participant.
  * @param {boolean} muted - The mute state of the participant.
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {MediaState}
  */
-export function getParticipantVideoMediaState(participant: Participant, muted: Boolean, state: IState) {
+export function getParticipantVideoMediaState(participant: IParticipant, muted: Boolean, state: IReduxState) {
     if (muted) {
         if (isForceMuted(participant, MEDIA_TYPE.VIDEO, state)) {
             return MEDIA_STATE.FORCE_MUTED;
@@ -138,10 +138,10 @@ export const getComputedOuterHeight = (element: HTMLElement) => {
 /**
  * Returns this feature's root state.
  *
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {Object} Feature state.
  */
-const getState = (state: IState) => state[REDUCER_KEY];
+const getState = (state: IReduxState) => state[REDUCER_KEY];
 
 /**
  * Returns the participants pane config.
@@ -160,21 +160,21 @@ export const getParticipantsPaneConfig = (stateful: IStateful) => {
 /**
  * Is the participants pane open.
  *
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {boolean} Is the participants pane open.
  */
-export const getParticipantsPaneOpen = (state: IState) => Boolean(getState(state)?.isOpen);
+export const getParticipantsPaneOpen = (state: IReduxState) => Boolean(getState(state)?.isOpen);
 
 /**
  * Returns the type of quick action button to be displayed for a participant.
  * The button is displayed when hovering a participant from the participant list.
  *
- * @param {Participant} participant - The participant.
+ * @param {IParticipant} participant - The participant.
  * @param {boolean} isAudioMuted - If audio is muted for the participant.
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {string} - The type of the quick action button.
  */
-export function getQuickActionButtonType(participant: Participant, isAudioMuted: Boolean, state: IState) {
+export function getQuickActionButtonType(participant: IParticipant, isAudioMuted: Boolean, state: IReduxState) {
     // handled only by moderators
     if (isLocalParticipantModerator(state)) {
         if (!isAudioMuted) {
@@ -191,10 +191,10 @@ export function getQuickActionButtonType(participant: Participant, isAudioMuted:
 /**
  * Returns true if the invite button should be rendered.
  *
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {boolean}
  */
-export const shouldRenderInviteButton = (state: IState) => {
+export const shouldRenderInviteButton = (state: IReduxState) => {
     const { disableInviteFunctions } = toState(state)['features/base/config'];
     const flagEnabled = getFeatureFlag(state, INVITE_ENABLED, true);
     const inBreakoutRoom = isInBreakoutRoom(state);
@@ -282,10 +282,10 @@ export function participantMatchesSearch(participant: { displayName: string; jid
 /**
  * Returns whether the more actions button is visible.
  *
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {boolean}
  */
-export const isMoreActionsVisible = (state: IState) => {
+export const isMoreActionsVisible = (state: IReduxState) => {
     const isLocalModerator = isLocalParticipantModerator(state);
     const inBreakoutRoom = isInBreakoutRoom(state);
     const { hideMoreActionsButton } = getParticipantsPaneConfig(state);
@@ -296,10 +296,10 @@ export const isMoreActionsVisible = (state: IState) => {
 /**
  * Returns whether the mute all button is visible.
  *
- * @param {IState} state - Global state.
+ * @param {IReduxState} state - Global state.
  * @returns {boolean}
  */
-export const isMuteAllVisible = (state: IState) => {
+export const isMuteAllVisible = (state: IReduxState) => {
     const isLocalModerator = isLocalParticipantModerator(state);
     const inBreakoutRoom = isInBreakoutRoom(state);
     const { hideMuteAllButton } = getParticipantsPaneConfig(state);
diff --git a/react/features/participants-pane/hooks.ts b/react/features/participants-pane/hooks.ts
index 6a58c055d..ef4a6cb31 100644
--- a/react/features/participants-pane/hooks.ts
+++ b/react/features/participants-pane/hooks.ts
@@ -6,7 +6,7 @@ import { handleLobbyChatInitialized } from '../chat/actions.any';
 // @ts-ignore
 import { approveKnockingParticipant, rejectKnockingParticipant } from '../lobby/actions';
 
-interface DrawerParticipant {
+interface IDrawerParticipant {
     displayName?: string;
     participantID: string;
 }
@@ -18,7 +18,7 @@ interface DrawerParticipant {
  * @param {Function} closeDrawer - Callback for closing the drawer.
  * @returns {Array<Function>}
  */
-export function useLobbyActions(participant?: DrawerParticipant | null, closeDrawer?: Function) {
+export function useLobbyActions(participant?: IDrawerParticipant | null, closeDrawer?: Function) {
     const dispatch = useDispatch();
 
     return [
@@ -45,10 +45,10 @@ export function useLobbyActions(participant?: DrawerParticipant | null, closeDra
  * @returns {Array<any>}
  */
 export function useParticipantDrawer(): [
-    DrawerParticipant | null,
+    IDrawerParticipant | null,
     () => void,
-    (p: DrawerParticipant | null) => void ] {
-    const [ drawerParticipant, openDrawerForParticipant ] = useState<DrawerParticipant | null>(null);
+    (p: IDrawerParticipant | null) => void ] {
+    const [ drawerParticipant, openDrawerForParticipant ] = useState<IDrawerParticipant | null>(null);
     const closeDrawer = useCallback(() => {
         openDrawerForParticipant(null);
     }, []);
diff --git a/react/features/polls/actions.ts b/react/features/polls/actions.ts
index 3f2f54db3..84c72ac25 100644
--- a/react/features/polls/actions.ts
+++ b/react/features/polls/actions.ts
@@ -7,7 +7,7 @@ import {
     RESET_NB_UNREAD_POLLS,
     RETRACT_VOTE
 } from './actionTypes';
-import { Answer, Poll } from './types';
+import { IAnswer, IPoll } from './types';
 
 /**
  * Action to signal that existing polls needs to be cleared from state.
@@ -44,16 +44,16 @@ export const setVoteChanging = (pollId: string, value: boolean) => {
  * Action to signal that a new poll was received.
  *
  * @param {string} pollId - The id of the incoming poll.
- * @param {Poll} poll - The incoming Poll object.
+ * @param {IPoll} poll - The incoming Poll object.
  * @param {boolean} notify - Whether to send or not a notification.
  * @returns {{
  *     type: RECEIVE_POLL,
- *     poll: Poll,
+ *     poll: IPoll,
  *     pollId: string,
  *     notify: boolean
  * }}
  */
-export const receivePoll = (pollId: string, poll: Poll, notify: boolean) => {
+export const receivePoll = (pollId: string, poll: IPoll, notify: boolean) => {
     return {
         type: RECEIVE_POLL,
         poll,
@@ -66,14 +66,14 @@ export const receivePoll = (pollId: string, poll: Poll, notify: boolean) => {
  * Action to signal that a new answer was received.
  *
  * @param {string} pollId - The id of the incoming poll.
- * @param {Answer} answer - The incoming Answer object.
+ * @param {IAnswer} answer - The incoming Answer object.
  * @returns {{
  *     type: RECEIVE_ANSWER,
- *     answer: Answer,
+ *     answer: IAnswer,
  *     pollId: string
  * }}
  */
-export const receiveAnswer = (pollId: string, answer: Answer) => {
+export const receiveAnswer = (pollId: string, answer: IAnswer) => {
     return {
         type: RECEIVE_ANSWER,
         answer,
diff --git a/react/features/polls/components/AbstractPollAnswer.tsx b/react/features/polls/components/AbstractPollAnswer.tsx
index 4c3e05e35..5123c14c5 100644
--- a/react/features/polls/components/AbstractPollAnswer.tsx
+++ b/react/features/polls/components/AbstractPollAnswer.tsx
@@ -4,12 +4,12 @@ import { useDispatch, useSelector } from 'react-redux';
 
 import { createPollEvent } from '../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../analytics/functions';
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { getLocalParticipant, getParticipantById } from '../../base/participants/functions';
 import { useBoundSelector } from '../../base/util/hooks';
 import { registerVote, setVoteChanging } from '../actions';
 import { COMMAND_ANSWER_POLL } from '../constants';
-import { Poll } from '../types';
+import { IPoll } from '../types';
 
 /**
  * The type of the React {@code Component} props of inheriting component.
@@ -25,7 +25,7 @@ type InputProps = {
 export type AbstractProps = {
     checkBoxStates: boolean[];
     creatorName: string;
-    poll: Poll;
+    poll: IPoll;
     setCheckbox: Function;
     skipAnswer: () => void;
     skipChangeVote: () => void;
@@ -44,9 +44,9 @@ const AbstractPollAnswer = (Component: ComponentType<AbstractProps>) => (props:
 
     const { pollId } = props;
 
-    const conference: any = useSelector((state: IState) => state['features/base/conference'].conference);
+    const conference: any = useSelector((state: IReduxState) => state['features/base/conference'].conference);
 
-    const poll: Poll = useSelector((state: IState) => state['features/polls'].polls[pollId]);
+    const poll: IPoll = useSelector((state: IReduxState) => state['features/polls'].polls[pollId]);
 
     const { id: localId } = useSelector(getLocalParticipant) ?? { id: '' };
 
diff --git a/react/features/polls/functions.ts b/react/features/polls/functions.ts
index 6c37e87d8..83a69b818 100644
--- a/react/features/polls/functions.ts
+++ b/react/features/polls/functions.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 
 /**
  * Selector creator for determining if poll results should be displayed or not.
@@ -7,7 +7,7 @@ import { IState } from '../app/types';
  * @returns {Function}
  */
 export function shouldShowResults(id: string) {
-    return function(state: IState) {
+    return function(state: IReduxState) {
         return Boolean(state['features/polls']?.polls[id].showResults);
     };
 }
@@ -19,7 +19,7 @@ export function shouldShowResults(id: string) {
  * @returns {Function}
  */
 export function getPoll(pollId: string) {
-    return function(state: IState) {
+    return function(state: IReduxState) {
         return state['features/polls'].polls[pollId];
     };
 }
@@ -27,10 +27,10 @@ export function getPoll(pollId: string) {
 /**
  * Selector for calculating the number of unread poll messages.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {number} The number of unread messages.
  */
-export function getUnreadPollCount(state: IState) {
+export function getUnreadPollCount(state: IReduxState) {
     const { nbUnreadPolls } = state['features/polls'];
 
     return nbUnreadPolls;
diff --git a/react/features/polls/middleware.ts b/react/features/polls/middleware.ts
index a2f2624d8..5737eaf52 100644
--- a/react/features/polls/middleware.ts
+++ b/react/features/polls/middleware.ts
@@ -16,7 +16,7 @@ import {
     COMMAND_NEW_POLL,
     COMMAND_OLD_POLLS
 } from './constants';
-import { Answer, Poll, PollData } from './types';
+import { IAnswer, IPoll, IPollData } from './types';
 
 /**
  * Set up state change listener to perform maintenance tasks when the conference
@@ -33,7 +33,7 @@ StateListenerRegistry.register(
         }
     });
 
-const parsePollData = (pollData: PollData): Poll | null => {
+const parsePollData = (pollData: IPollData): IPoll | null => {
     if (typeof pollData !== 'object' || pollData === null) {
         return null;
     }
@@ -127,7 +127,7 @@ function _handleReceivePollsMessage(data: any, dispatch: IStore['dispatch']) {
             showResults: false,
             lastVote: null,
             question,
-            answers: answers.map((answer: Answer) => {
+            answers: answers.map((answer: IAnswer) => {
                 return {
                     name: answer,
                     voters: new Map()
@@ -148,7 +148,7 @@ function _handleReceivePollsMessage(data: any, dispatch: IStore['dispatch']) {
     case COMMAND_ANSWER_POLL: {
         const { pollId, answers, voterId, voterName } = data;
 
-        const receivedAnswer: Answer = {
+        const receivedAnswer: IAnswer = {
             voterId,
             voterName,
             pollId,
diff --git a/react/features/polls/reducer.ts b/react/features/polls/reducer.ts
index 06681afdd..b1f06de31 100644
--- a/react/features/polls/reducer.ts
+++ b/react/features/polls/reducer.ts
@@ -9,7 +9,7 @@ import {
     RESET_NB_UNREAD_POLLS,
     RETRACT_VOTE
 } from './actionTypes';
-import { Answer, Poll } from './types';
+import { IAnswer, IPoll } from './types';
 
 const INITIAL_STATE = {
     polls: {},
@@ -21,7 +21,7 @@ const INITIAL_STATE = {
 export interface IPollsState {
     nbUnreadPolls: number;
     polls: {
-        [pollId: string]: Poll;
+        [pollId: string]: IPoll;
     };
 }
 
@@ -71,7 +71,7 @@ ReducerRegistry.register<IPollsState>('features/polls', (state = INITIAL_STATE,
     // The answer is added  to an existing poll
     case RECEIVE_ANSWER: {
 
-        const { pollId, answer }: { answer: Answer; pollId: string; } = action;
+        const { pollId, answer }: { answer: IAnswer; pollId: string; } = action;
 
         // if the poll doesn't exist
         if (!(pollId in state.polls)) {
diff --git a/react/features/polls/types.ts b/react/features/polls/types.ts
index 7a05d099e..4d8911233 100644
--- a/react/features/polls/types.ts
+++ b/react/features/polls/types.ts
@@ -1,4 +1,4 @@
-export interface Answer {
+export interface IAnswer {
 
     /**
      * An array of boolean: true if the answer was chosen by the responder, else false.
@@ -21,7 +21,7 @@ export interface Answer {
     voterName: string;
 }
 
-export interface Poll {
+export interface IPoll {
 
     /**
      * An array of answers:
@@ -62,6 +62,6 @@ export interface Poll {
     showResults: boolean;
 }
 
-export interface PollData extends Poll {
+export interface IPollData extends IPoll {
     id: string;
 }
diff --git a/react/features/prejoin/components/Prejoin.native.tsx b/react/features/prejoin/components/Prejoin.native.tsx
index 6424c89ad..bbe386d6b 100644
--- a/react/features/prejoin/components/Prejoin.native.tsx
+++ b/react/features/prejoin/components/Prejoin.native.tsx
@@ -16,7 +16,7 @@ import { useDispatch, useSelector } from 'react-redux';
 
 // @ts-ignore
 import { appNavigate } from '../../app/actions.native';
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { setAudioOnly } from '../../base/audio-only/actions';
 import { getConferenceName } from '../../base/conference/functions';
 import { connect } from '../../base/connection/actions.native';
@@ -56,11 +56,11 @@ const Prejoin: React.FC<PrejoinProps> = ({ navigation }: PrejoinProps) => {
     const isFocused = useIsFocused();
     const { t } = useTranslation();
     const aspectRatio = useSelector(
-        (state: IState) => state['features/base/responsive-ui']?.aspectRatio
+        (state: IReduxState) => state['features/base/responsive-ui']?.aspectRatio
     );
-    const localParticipant = useSelector((state: IState) => getLocalParticipant(state));
-    const isDisplayNameMandatory = useSelector((state: IState) => isDisplayNameRequired(state));
-    const roomName = useSelector((state: IState) => getConferenceName(state));
+    const localParticipant = useSelector((state: IReduxState) => getLocalParticipant(state));
+    const isDisplayNameMandatory = useSelector((state: IReduxState) => isDisplayNameRequired(state));
+    const roomName = useSelector((state: IReduxState) => getConferenceName(state));
     const participantName = localParticipant?.name;
     const [ displayName, setDisplayName ]
         = useState(participantName || '');
diff --git a/react/features/prejoin/components/dialogs/CallingDialog.tsx b/react/features/prejoin/components/dialogs/CallingDialog.tsx
index 5d564bc3a..023d16624 100644
--- a/react/features/prejoin/components/dialogs/CallingDialog.tsx
+++ b/react/features/prejoin/components/dialogs/CallingDialog.tsx
@@ -13,7 +13,7 @@ import { IconClose } from '../../../base/icons/svg';
 // @ts-ignore
 import Label from '../Label';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The phone number that is being called.
@@ -63,10 +63,10 @@ const useStyles = makeStyles()((theme: Theme) => {
 /**
  * Dialog displayed when the user gets called by the meeting.
  *
- * @param {Props} props - The props of the component.
+ * @param {IProps} props - The props of the component.
  * @returns {ReactElement}
  */
-function CallingDialog(props: Props) {
+function CallingDialog(props: IProps) {
     const { number, onClose, status, t } = props;
     const { classes } = useStyles();
 
diff --git a/react/features/prejoin/components/dialogs/DialInDialog.tsx b/react/features/prejoin/components/dialogs/DialInDialog.tsx
index 0b59a1783..2fb764226 100644
--- a/react/features/prejoin/components/dialogs/DialInDialog.tsx
+++ b/react/features/prejoin/components/dialogs/DialInDialog.tsx
@@ -14,7 +14,7 @@ import { getCountryCodeFromPhone } from '../../utils';
 // @ts-ignore
 import Label from '../Label';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The number to call in order to join the conference.
@@ -98,10 +98,10 @@ const useStyles = makeStyles()((theme: Theme) => {
  * This component displays the dialog with all the information
  * to join a meeting by calling it.
  *
- * @param {Props} props - The props of the component.
+ * @param {IProps} props - The props of the component.
  * @returns {React$Element}
  */
-function DialinDialog(props: Props) {
+function DialinDialog(props: IProps) {
     const {
         number,
         onBack,
diff --git a/react/features/prejoin/components/dialogs/DialOutDialog.tsx b/react/features/prejoin/components/dialogs/DialOutDialog.tsx
index 21446a333..b71987797 100644
--- a/react/features/prejoin/components/dialogs/DialOutDialog.tsx
+++ b/react/features/prejoin/components/dialogs/DialOutDialog.tsx
@@ -14,7 +14,7 @@ import Label from '../Label';
 // @ts-ignore
 import CountryPicker from '../country-picker/CountryPicker';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Closes a dialog.
@@ -52,10 +52,10 @@ const useStyles = makeStyles()((theme: Theme) => {
  * This component displays the dialog from which the user can enter the
  * phone number in order to be called by the meeting.
  *
- * @param {Props} props - The props of the component.
+ * @param {IProps} props - The props of the component.
  * @returns {React$Element}
  */
-function DialOutDialog(props: Props) {
+function DialOutDialog(props: IProps) {
     const { onClose, onTextButtonClick, onSubmit, t } = props;
     const { classes } = useStyles();
 
diff --git a/react/features/prejoin/components/preview/DeviceStatus.tsx b/react/features/prejoin/components/preview/DeviceStatus.tsx
index 40dabc0f4..b7907a2e8 100644
--- a/react/features/prejoin/components/preview/DeviceStatus.tsx
+++ b/react/features/prejoin/components/preview/DeviceStatus.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import { WithTranslation } from 'react-i18next';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { translate } from '../../../base/i18n/functions';
 import Icon from '../../../base/icons/components/Icon';
 import { IconCheckSolid, IconExclamationTriangle } from '../../../base/icons/svg';
@@ -13,7 +13,7 @@ import {
     getDeviceStatusType
 } from '../../functions';
 
-export interface Props extends WithTranslation {
+export interface IProps extends WithTranslation {
 
     /**
      * The text to be displayed in relation to the status of the audio/video devices.
@@ -81,7 +81,7 @@ const iconMap = {
  *
  * @returns {ReactElement}
  */
-function DeviceStatus({ deviceStatusType, deviceStatusText, t }: Props) {
+function DeviceStatus({ deviceStatusType, deviceStatusText, t }: IProps) {
     const { classes, cx } = useStyles();
     const { src, className } = iconMap[deviceStatusType as keyof typeof iconMap];
     const hasError = deviceStatusType === 'warning';
@@ -109,7 +109,7 @@ function DeviceStatus({ deviceStatusType, deviceStatusText, t }: Props) {
  * @param {Object} state - The redux state.
  * @returns {{ deviceStatusText: string, deviceStatusText: string }}
  */
-function mapStateToProps(state: IState) {
+function mapStateToProps(state: IReduxState) {
     return {
         deviceStatusText: getDeviceStatusText(state),
         deviceStatusType: getDeviceStatusType(state)
diff --git a/react/features/prejoin/functions.ts b/react/features/prejoin/functions.ts
index 952131ea0..4f9c9cab7 100644
--- a/react/features/prejoin/functions.ts
+++ b/react/features/prejoin/functions.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { getRoomName } from '../base/conference/functions';
 import { getDialOutStatusUrl, getDialOutUrl } from '../base/config/functions.web';
 import { isAudioMuted, isVideoMutedByUser } from '../base/media/functions';
@@ -6,20 +6,20 @@ import { isAudioMuted, isVideoMutedByUser } from '../base/media/functions';
 /**
  * Selector for the visibility of the 'join by phone' button.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {boolean}
  */
-export function isJoinByPhoneButtonVisible(state: IState): boolean {
+export function isJoinByPhoneButtonVisible(state: IReduxState): boolean {
     return Boolean(getDialOutUrl(state) && getDialOutStatusUrl(state));
 }
 
 /**
  * Selector for determining if the device status strip is visible or not.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {boolean}
  */
-export function isDeviceStatusVisible(state: IState): boolean {
+export function isDeviceStatusVisible(state: IReduxState): boolean {
     return !(isAudioMuted(state) && isVideoMutedByUser(state))
     && !state['features/base/config'].startSilent;
 }
@@ -27,10 +27,10 @@ export function isDeviceStatusVisible(state: IState): boolean {
 /**
  * Selector for determining if the display name is mandatory.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {boolean}
  */
-export function isDisplayNameRequired(state: IState): boolean {
+export function isDisplayNameRequired(state: IReduxState): boolean {
     return Boolean(state['features/prejoin']?.isDisplayNameRequired
         || state['features/base/config']?.requireDisplayName);
 }
@@ -38,80 +38,80 @@ export function isDisplayNameRequired(state: IState): boolean {
 /**
  * Selector for determining if the prejoin display name field is visible.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {boolean}
  */
-export function isPrejoinDisplayNameVisible(state: IState): boolean {
+export function isPrejoinDisplayNameVisible(state: IReduxState): boolean {
     return !state['features/base/config'].prejoinConfig?.hideDisplayName;
 }
 
 /**
  * Returns the text for the prejoin status bar.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {string}
  */
-export function getDeviceStatusText(state: IState): string {
+export function getDeviceStatusText(state: IReduxState): string {
     return state['features/prejoin']?.deviceStatusText;
 }
 
 /**
  * Returns the type of the prejoin status bar: 'ok'|'warning'.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {string}
  */
-export function getDeviceStatusType(state: IState): string {
+export function getDeviceStatusType(state: IReduxState): string {
     return state['features/prejoin']?.deviceStatusType;
 }
 
 /**
  * Returns the 'conferenceUrl' used for dialing out.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {string}
  */
-export function getDialOutConferenceUrl(state: IState): string {
+export function getDialOutConferenceUrl(state: IReduxState): string {
     return `${getRoomName(state)}@${state['features/base/config'].hosts?.muc}`;
 }
 
 /**
  * Selector for getting the dial out country.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {Object}
  */
-export function getDialOutCountry(state: IState) {
+export function getDialOutCountry(state: IReduxState) {
     return state['features/prejoin'].dialOutCountry;
 }
 
 /**
  * Selector for getting the dial out number (without prefix).
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {string}
  */
-export function getDialOutNumber(state: IState): string {
+export function getDialOutNumber(state: IReduxState): string {
     return state['features/prejoin'].dialOutNumber;
 }
 
 /**
  * Selector for getting the dial out status while calling.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {string}
  */
-export function getDialOutStatus(state: IState): string {
+export function getDialOutStatus(state: IReduxState): string {
     return state['features/prejoin'].dialOutStatus;
 }
 
 /**
  * Returns the full dial out number (containing country code and +).
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {string}
  */
-export function getFullDialOutNumber(state: IState): string {
+export function getFullDialOutNumber(state: IReduxState): string {
     const dialOutNumber = getDialOutNumber(state);
     const country = getDialOutCountry(state);
 
@@ -121,20 +121,20 @@ export function getFullDialOutNumber(state: IState): string {
 /**
  * Selector for getting the error if any while creating streams.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {string}
  */
-export function getRawError(state: IState): string {
+export function getRawError(state: IReduxState): string {
     return state['features/prejoin']?.rawError;
 }
 
 /**
  * Selector for getting the visibility state for the 'JoinByPhoneDialog'.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {boolean}
  */
-export function isJoinByPhoneDialogVisible(state: IState): boolean {
+export function isJoinByPhoneDialogVisible(state: IReduxState): boolean {
     return state['features/prejoin']?.showJoinByPhoneDialog;
 }
 
@@ -142,10 +142,10 @@ export function isJoinByPhoneDialogVisible(state: IState): boolean {
  * Returns true if the prejoin page is enabled and no flag
  * to bypass showing the page is present.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {boolean}
  */
-export function isPrejoinPageVisible(state: IState): boolean {
+export function isPrejoinPageVisible(state: IReduxState): boolean {
     return Boolean(navigator.product !== 'ReactNative'
         && state['features/base/config'].prejoinConfig?.enabled
         && state['features/prejoin']?.showPrejoin
@@ -155,10 +155,10 @@ export function isPrejoinPageVisible(state: IState): boolean {
 /**
  * Returns true if we should auto-knock in case lobby is enabled for the room.
  *
- * @param {IState} state - The state of the app.
+ * @param {IReduxState} state - The state of the app.
  * @returns {boolean}
  */
-export function shouldAutoKnock(state: IState): boolean {
+export function shouldAutoKnock(state: IReduxState): boolean {
     const { iAmRecorder, iAmSipGateway, autoKnockLobby, prejoinConfig } = state['features/base/config'];
     const { userSelectedSkipPrejoin } = state['features/base/settings'];
     const isPrejoinEnabled = prejoinConfig?.enabled;
diff --git a/react/features/prejoin/types.ts b/react/features/prejoin/types.ts
index f1d7f3a03..a1d2512d9 100644
--- a/react/features/prejoin/types.ts
+++ b/react/features/prejoin/types.ts
@@ -1,3 +1,3 @@
-export interface PrejoinProps {
+export interface IPrejoinProps {
     navigation: any;
 }
diff --git a/react/features/reactions/actions.any.ts b/react/features/reactions/actions.any.ts
index 25d959220..1b661bdc0 100644
--- a/react/features/reactions/actions.any.ts
+++ b/react/features/reactions/actions.any.ts
@@ -6,16 +6,16 @@ import {
     SEND_REACTIONS,
     SET_REACTION_QUEUE
 } from './actionTypes';
-import { ReactionEmojiProps } from './constants';
-import { ReactionsAction } from './reducer';
+import { IReactionEmojiProps } from './constants';
+import { IReactionsAction } from './reducer';
 
 /**
  * Sets the reaction queue.
  *
  * @param {Array} queue - The new queue.
- * @returns {ReactionsAction}
+ * @returns {IReactionsAction}
  */
-export function setReactionQueue(queue: Array<ReactionEmojiProps>): ReactionsAction {
+export function setReactionQueue(queue: Array<IReactionEmojiProps>): IReactionsAction {
     return {
         type: SET_REACTION_QUEUE,
         queue
@@ -33,7 +33,7 @@ export function removeReaction(uid: string): any {
     return (dispatch: Function, getState: Function) => {
         const queue = getState()['features/reactions'].queue;
 
-        dispatch(setReactionQueue(queue.filter((reaction: ReactionEmojiProps) => reaction.uid !== uid)));
+        dispatch(setReactionQueue(queue.filter((reaction: IReactionEmojiProps) => reaction.uid !== uid)));
     };
 }
 
@@ -41,9 +41,9 @@ export function removeReaction(uid: string): any {
 /**
  * Sends the reactions buffer to everyone in the conference.
  *
- * @returns {ReactionsAction}
+ * @returns {IReactionsAction}
  */
-export function sendReactions(): ReactionsAction {
+export function sendReactions(): IReactionsAction {
     return {
         type: SEND_REACTIONS
     };
@@ -53,9 +53,9 @@ export function sendReactions(): ReactionsAction {
  * Adds a reaction to the local buffer.
  *
  * @param {string} reaction - The reaction to be added.
- * @returns {ReactionsAction}
+ * @returns {IReactionsAction}
  */
-export function addReactionToBuffer(reaction: string): ReactionsAction {
+export function addReactionToBuffer(reaction: string): IReactionsAction {
     return {
         type: ADD_REACTION_BUFFER,
         reaction
@@ -65,9 +65,9 @@ export function addReactionToBuffer(reaction: string): ReactionsAction {
 /**
  * Clears the reaction buffer.
  *
- * @returns {ReactionsAction}
+ * @returns {IReactionsAction}
  */
-export function flushReactionBuffer(): ReactionsAction {
+export function flushReactionBuffer(): IReactionsAction {
     return {
         type: FLUSH_REACTION_BUFFER
     };
@@ -77,9 +77,9 @@ export function flushReactionBuffer(): ReactionsAction {
  * Adds a reaction message to the chat.
  *
  * @param {string} message - The reaction message.
- * @returns {ReactionsAction}
+ * @returns {IReactionsAction}
  */
-export function addReactionsToChat(message: string): ReactionsAction {
+export function addReactionsToChat(message: string): IReactionsAction {
     return {
         type: ADD_REACTION_MESSAGE,
         message
@@ -90,9 +90,9 @@ export function addReactionsToChat(message: string): ReactionsAction {
  * Adds reactions to the animation queue.
  *
  * @param {Array} reactions - The reactions to be animated.
- * @returns {ReactionsAction}
+ * @returns {IReactionsAction}
  */
-export function pushReactions(reactions: Array<string>): ReactionsAction {
+export function pushReactions(reactions: Array<string>): IReactionsAction {
     return {
         type: PUSH_REACTIONS,
         reactions
diff --git a/react/features/reactions/actions.web.ts b/react/features/reactions/actions.web.ts
index 906f144f4..7082d1ea7 100644
--- a/react/features/reactions/actions.web.ts
+++ b/react/features/reactions/actions.web.ts
@@ -2,14 +2,14 @@ import {
     SHOW_SOUNDS_NOTIFICATION,
     TOGGLE_REACTIONS_VISIBLE
 } from './actionTypes';
-import { ReactionsAction } from './reducer';
+import { IReactionsAction } from './reducer';
 
 /**
  * Toggles the visibility of the reactions menu.
  *
  * @returns {void}
  */
-export function toggleReactionsMenuVisibility(): ReactionsAction {
+export function toggleReactionsMenuVisibility(): IReactionsAction {
     return {
         type: TOGGLE_REACTIONS_VISIBLE
     };
@@ -20,7 +20,7 @@ export function toggleReactionsMenuVisibility(): ReactionsAction {
  *
  * @returns {void}
  */
-export function displayReactionSoundsNotification(): ReactionsAction {
+export function displayReactionSoundsNotification(): IReactionsAction {
     return {
         type: SHOW_SOUNDS_NOTIFICATION
     };
diff --git a/react/features/reactions/components/web/ReactionsMenu.tsx b/react/features/reactions/components/web/ReactionsMenu.tsx
index 883d9f7f1..6630ea78e 100644
--- a/react/features/reactions/components/web/ReactionsMenu.tsx
+++ b/react/features/reactions/components/web/ReactionsMenu.tsx
@@ -8,7 +8,7 @@ import { connect } from 'react-redux';
 
 import { createReactionMenuEvent, createToolbarEvent } from '../../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../../analytics/functions';
-import { IState, IStore } from '../../../app/types';
+import { IReduxState, IStore } from '../../../app/types';
 import { isMobileBrowser } from '../../../base/environment/utils';
 import { translate } from '../../../base/i18n/functions';
 import { raiseHand } from '../../../base/participants/actions';
@@ -26,7 +26,7 @@ import { REACTIONS, REACTIONS_MENU_HEIGHT } from '../../constants';
 // @ts-ignore
 import ReactionButton from './ReactionButton';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Docks the toolbox.
@@ -94,14 +94,14 @@ const styles = (theme: Theme) => {
  *
  * @returns {ReactElement}
  */
-class ReactionsMenu extends Component<Props> {
+class ReactionsMenu extends Component<IProps> {
     /**
      * Initializes a new {@code ReactionsMenu} instance.
      *
-     * @param {Props} props - The read-only React {@code Component} props with
+     * @param {IProps} props - The read-only React {@code Component} props with
      * which the new instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onToolbarToggleRaiseHand = this._onToolbarToggleRaiseHand.bind(this);
@@ -235,7 +235,7 @@ class ReactionsMenu extends Component<Props> {
  * @param {Object} state - Redux state.
  * @returns {Object}
  */
-function mapStateToProps(state: IState) {
+function mapStateToProps(state: IReduxState) {
     const localParticipant = getLocalParticipant(state);
 
     return {
diff --git a/react/features/reactions/components/web/ReactionsMenuButton.tsx b/react/features/reactions/components/web/ReactionsMenuButton.tsx
index 0ba2de5d2..509f593fd 100644
--- a/react/features/reactions/components/web/ReactionsMenuButton.tsx
+++ b/react/features/reactions/components/web/ReactionsMenuButton.tsx
@@ -3,7 +3,7 @@ import React, { useCallback } from 'react';
 import { WithTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { isMobileBrowser } from '../../../base/environment/utils';
 import { translate } from '../../../base/i18n/functions';
 import { IconArrowUp } from '../../../base/icons/svg';
@@ -11,7 +11,7 @@ import { connect } from '../../../base/redux/functions';
 // @ts-ignore
 import ToolboxButtonWithIconPopup from '../../../base/toolbox/components/web/ToolboxButtonWithIconPopup';
 import { toggleReactionsMenuVisibility } from '../../actions.web';
-import { ReactionEmojiProps } from '../../constants';
+import { IReactionEmojiProps } from '../../constants';
 import { getReactionsQueue, isReactionsEnabled } from '../../functions.any';
 import { getReactionsMenuVisibility } from '../../functions.web';
 
@@ -20,7 +20,7 @@ import RaiseHandButton from './RaiseHandButton';
 import ReactionEmoji from './ReactionEmoji';
 import ReactionsMenu from './ReactionsMenu';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Whether or not reactions are enabled.
@@ -61,7 +61,7 @@ interface Props extends WithTranslation {
     /**
      * The array of reactions to be displayed.
      */
-    reactionsQueue: Array<ReactionEmojiProps>;
+    reactionsQueue: Array<IReactionEmojiProps>;
 }
 
 /**
@@ -79,7 +79,7 @@ function ReactionsMenuButton({
     notifyMode,
     reactionsQueue,
     t
-}: Props) {
+}: IProps) {
     const visible = useSelector(getReactionsMenuVisibility);
     const toggleReactionsMenu = useCallback(() => {
         dispatch(toggleReactionsMenuVisibility());
@@ -134,7 +134,7 @@ function ReactionsMenuButton({
  * @param {Object} state - Redux state.
  * @returns {Object}
  */
-function mapStateToProps(state: IState) {
+function mapStateToProps(state: IReduxState) {
     return {
         _reactionsEnabled: isReactionsEnabled(state),
         isOpen: getReactionsMenuVisibility(state),
diff --git a/react/features/reactions/constants.ts b/react/features/reactions/constants.ts
index 8b6c9d145..23e70cb49 100644
--- a/react/features/reactions/constants.ts
+++ b/react/features/reactions/constants.ts
@@ -85,7 +85,7 @@ export const SILENCE_SOUND_ID = `${REACTION_SOUND}_SILENCE_`;
  */
 export const RAISE_HAND_SOUND_ID = 'RAISE_HAND_SOUND';
 
-export interface ReactionEmojiProps {
+export interface IReactionEmojiProps {
 
     /**
      * Reaction to be displayed.
@@ -160,6 +160,6 @@ export type ReactionThreshold = {
     threshold: number;
 };
 
-export interface MuteCommandAttributes {
+export interface IMuteCommandAttributes {
     startReactionsMuted?: string;
 }
diff --git a/react/features/reactions/functions.any.ts b/react/features/reactions/functions.any.ts
index 7c9f6e2bf..52f453bf3 100644
--- a/react/features/reactions/functions.any.ts
+++ b/react/features/reactions/functions.any.ts
@@ -1,12 +1,12 @@
 import { v4 as uuidv4 } from 'uuid';
 
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { REACTIONS_ENABLED } from '../base/flags/constants';
 import { getFeatureFlag } from '../base/flags/functions';
 import { getLocalParticipant } from '../base/participants/functions';
 import { extractFqnFromPath } from '../dynamic-branding/functions.any';
 
-import { REACTIONS, ReactionEmojiProps, ReactionThreshold, SOUNDS_THRESHOLDS } from './constants';
+import { IReactionEmojiProps, REACTIONS, ReactionThreshold, SOUNDS_THRESHOLDS } from './constants';
 import logger from './logger';
 
 /**
@@ -15,7 +15,7 @@ import logger from './logger';
  * @param {Object} state - The state of the application.
  * @returns {Array}
  */
-export function getReactionsQueue(state: IState): Array<ReactionEmojiProps> {
+export function getReactionsQueue(state: IReduxState): Array<IReactionEmojiProps> {
     return state['features/reactions'].queue;
 }
 
@@ -35,8 +35,8 @@ export function getReactionMessageFromBuffer(buffer: Array<string>): string {
  * @param {Array} buffer - The reactions buffer.
  * @returns {Array}
  */
-export function getReactionsWithId(buffer: Array<string>): Array<ReactionEmojiProps> {
-    return buffer.map<ReactionEmojiProps>(reaction => {
+export function getReactionsWithId(buffer: Array<string>): Array<IReactionEmojiProps> {
+    return buffer.map<IReactionEmojiProps>(reaction => {
         return {
             reaction,
             uid: uuidv4()
@@ -51,7 +51,7 @@ export function getReactionsWithId(buffer: Array<string>): Array<ReactionEmojiPr
  * @param {Array} reactions - Reactions array to be sent.
  * @returns {void}
  */
-export async function sendReactionsWebhook(state: IState, reactions: Array<string>) {
+export async function sendReactionsWebhook(state: IReduxState, reactions: Array<string>) {
     const { webhookProxyUrl: url } = state['features/base/config'];
     const { conference } = state['features/base/conference'];
     const { jwt } = state['features/base/jwt'];
@@ -152,7 +152,7 @@ export function getReactionsSoundsThresholds(reactions: Array<string>): Array<Re
  * @param {Object} state - The Redux state object.
  * @returns {boolean}
  */
-export function isReactionsEnabled(state: IState): boolean {
+export function isReactionsEnabled(state: IReduxState): boolean {
     const { disableReactions } = state['features/base/config'];
 
     if (navigator.product === 'ReactNative') {
diff --git a/react/features/reactions/functions.web.ts b/react/features/reactions/functions.web.ts
index bc539332d..8e8be33a3 100644
--- a/react/features/reactions/functions.web.ts
+++ b/react/features/reactions/functions.web.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 
 /**
  * Returns the visibility state of the reactions menu.
@@ -6,6 +6,6 @@ import { IState } from '../app/types';
  * @param {Object} state - The state of the application.
  * @returns {boolean}
  */
-export function getReactionsMenuVisibility(state: IState): boolean {
+export function getReactionsMenuVisibility(state: IReduxState): boolean {
     return state['features/reactions'].visible;
 }
diff --git a/react/features/reactions/middleware.ts b/react/features/reactions/middleware.ts
index 6a6a1873c..e6b4d89e2 100644
--- a/react/features/reactions/middleware.ts
+++ b/react/features/reactions/middleware.ts
@@ -36,8 +36,8 @@ import {
 import { displayReactionSoundsNotification } from './actions.web';
 import {
     ENDPOINT_REACTION_NAME,
+    IMuteCommandAttributes,
     MUTE_REACTIONS_COMMAND,
-    MuteCommandAttributes,
     RAISE_HAND_SOUND_ID,
     REACTIONS,
     REACTION_SOUND,
@@ -107,7 +107,7 @@ MiddlewareRegistry.register((store: IStore) => (next: Function) => (action: any)
         const { conference } = action;
 
         conference.addCommandListener(
-            MUTE_REACTIONS_COMMAND, ({ attributes }: { attributes: MuteCommandAttributes; }, id: any) => {
+            MUTE_REACTIONS_COMMAND, ({ attributes }: { attributes: IMuteCommandAttributes; }, id: any) => {
                 _onMuteReactionsCommand(attributes, id, store);
             });
         break;
@@ -233,7 +233,7 @@ MiddlewareRegistry.register((store: IStore) => (next: Function) => (action: any)
  * @private
  * @returns {void}
  */
-function _onMuteReactionsCommand(attributes: MuteCommandAttributes = {}, id: string, store: IStore) {
+function _onMuteReactionsCommand(attributes: IMuteCommandAttributes = {}, id: string, store: IStore) {
     const state = store.getState();
 
     // We require to know who issued the command because (1) only a
diff --git a/react/features/reactions/reducer.ts b/react/features/reactions/reducer.ts
index 891ffc81d..e2a269e1b 100644
--- a/react/features/reactions/reducer.ts
+++ b/react/features/reactions/reducer.ts
@@ -7,7 +7,7 @@ import {
     SHOW_SOUNDS_NOTIFICATION,
     TOGGLE_REACTIONS_VISIBLE
 } from './actionTypes';
-import { ReactionEmojiProps } from './constants';
+import { IReactionEmojiProps } from './constants';
 
 export interface IReactionsState {
 
@@ -24,7 +24,7 @@ export interface IReactionsState {
     /**
     * The array of reactions to animate.
     */
-    queue: Array<ReactionEmojiProps>;
+    queue: Array<IReactionEmojiProps>;
 
     /**
      * A number, non-zero value which identifies the timer created by a call
@@ -38,7 +38,7 @@ export interface IReactionsState {
     visible: boolean;
 }
 
-export interface ReactionsAction extends Partial<IReactionsState> {
+export interface IReactionsAction extends Partial<IReactionsState> {
 
     /**
      * The message to be added to the chat.
@@ -79,7 +79,7 @@ function _getInitialState(): IReactionsState {
 
 ReducerRegistry.register<IReactionsState>(
     'features/reactions',
-    (state = _getInitialState(), action: ReactionsAction): IReactionsState => {
+    (state = _getInitialState(), action: IReactionsAction): IReactionsState => {
         switch (action.type) {
 
         case TOGGLE_REACTIONS_VISIBLE:
diff --git a/react/features/recording/components/LiveStream/web/StreamKeyPicker.tsx b/react/features/recording/components/LiveStream/web/StreamKeyPicker.tsx
index 7d792a92b..b600f0b6d 100644
--- a/react/features/recording/components/LiveStream/web/StreamKeyPicker.tsx
+++ b/react/features/recording/components/LiveStream/web/StreamKeyPicker.tsx
@@ -8,7 +8,7 @@ import { YOUTUBE_LIVE_DASHBOARD_URL } from '../constants';
 /**
  * The type of the React {@code Component} props of {@link StreamKeyPicker}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Broadcasts available for selection. Each broadcast item should be an
@@ -38,7 +38,7 @@ interface Props extends WithTranslation {
  *
  * @augments Component
  */
-class StreamKeyPicker extends PureComponent<Props> {
+class StreamKeyPicker extends PureComponent<IProps> {
     /**
      * Default values for {@code StreamKeyForm} component's properties.
      *
@@ -58,10 +58,10 @@ class StreamKeyPicker extends PureComponent<Props> {
     /**
      * Initializes a new {@code StreamKeyPicker} instance.
      *
-     * @param {Props} props - The React {@code Component} props to initialize
+     * @param {IProps} props - The React {@code Component} props to initialize
      * the new {@code StreamKeyPicker} instance with.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         // Bind event handlers so they are only bound once per instance.
diff --git a/react/features/recording/components/Recording/AbstractStartRecordingDialogContent.tsx b/react/features/recording/components/Recording/AbstractStartRecordingDialogContent.tsx
index 448525625..a08476d12 100644
--- a/react/features/recording/components/Recording/AbstractStartRecordingDialogContent.tsx
+++ b/react/features/recording/components/Recording/AbstractStartRecordingDialogContent.tsx
@@ -4,7 +4,7 @@ import { WithTranslation } from 'react-i18next';
 
 import { createRecordingDialogEvent } from '../../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../../analytics/functions';
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 // @ts-ignore
 import { ColorSchemeRegistry } from '../../../base/color-scheme';
 // @ts-ignore
@@ -25,7 +25,7 @@ import { supportsLocalRecording } from '../../functions';
  * The type of the React {@code Component} props of
  * {@link AbstractStartRecordingDialogContent}.
  */
-export interface Props extends WithTranslation {
+export interface IProps extends WithTranslation {
 
     /**
      * Style of the dialogs feature.
@@ -146,7 +146,7 @@ export interface Props extends WithTranslation {
  *
  * @augments Component
  */
-class AbstractStartRecordingDialogContent<P extends Props> extends Component<P> {
+class AbstractStartRecordingDialogContent<P extends IProps> extends Component<P> {
     /**
      * Initializes a new {@code AbstractStartRecordingDialogContent} instance.
      *
@@ -333,9 +333,9 @@ class AbstractStartRecordingDialogContent<P extends Props> extends Component<P>
  * Maps part of the redux state to the props of this component.
  *
  * @param {Object} state - The Redux state.
- * @returns {Props}
+ * @returns {IProps}
  */
-export function mapStateToProps(state: IState) {
+export function mapStateToProps(state: IReduxState) {
     const { localRecording, recordingService } = state['features/base/config'];
     const _localRecordingAvailable
         = !localRecording?.disable && supportsLocalRecording();
diff --git a/react/features/recording/components/Recording/LocalRecordingManager.web.ts b/react/features/recording/components/Recording/LocalRecordingManager.web.ts
index 94153842f..a9f4185c7 100644
--- a/react/features/recording/components/Recording/LocalRecordingManager.web.ts
+++ b/react/features/recording/components/Recording/LocalRecordingManager.web.ts
@@ -11,7 +11,7 @@ import { inIframe } from '../../../base/util/iframeUtils';
 // @ts-ignore
 import { stopLocalVideoRecording } from '../../actions.any';
 
-interface SelfRecording {
+interface ISelfRecording {
     on: boolean;
     withVideo: boolean;
 }
@@ -29,7 +29,7 @@ interface ILocalRecordingManager {
     recordingData: Blob[];
     roomName: string;
     saveRecording: (recordingData: Blob[], filename: string) => void;
-    selfRecording: SelfRecording;
+    selfRecording: ISelfRecording;
     startLocalRecording: (store: IStore, onlySelf: boolean) => void;
     stopLocalRecording: () => void;
     stream: MediaStream | undefined;
diff --git a/react/features/recording/components/Recording/web/StartRecordingDialogContent.tsx b/react/features/recording/components/Recording/web/StartRecordingDialogContent.tsx
index acfd691b4..2603a736e 100644
--- a/react/features/recording/components/Recording/web/StartRecordingDialogContent.tsx
+++ b/react/features/recording/components/Recording/web/StartRecordingDialogContent.tsx
@@ -17,7 +17,7 @@ import { RECORDING_TYPES } from '../../../constants';
 // @ts-ignore
 import { getRecordingDurationEstimation } from '../../../functions';
 import AbstractStartRecordingDialogContent, {
-    Props,
+    IProps,
     mapStateToProps
 } from '../AbstractStartRecordingDialogContent';
 import {
@@ -34,7 +34,7 @@ import {
 /**
  * The start recording dialog content for the mobile application.
  */
-class StartRecordingDialogContent extends AbstractStartRecordingDialogContent<Props> {
+class StartRecordingDialogContent extends AbstractStartRecordingDialogContent<IProps> {
     /**
      * Renders the component.
      *
diff --git a/react/features/recording/reducer.ts b/react/features/recording/reducer.ts
index 9e43ab12a..174116e43 100644
--- a/react/features/recording/reducer.ts
+++ b/react/features/recording/reducer.ts
@@ -16,7 +16,7 @@ const DEFAULT_STATE = {
     sessionDatas: []
 };
 
-interface SessionData {
+interface ISessionData {
     error?: Error;
     id?: string;
     initiator?: Object;
@@ -33,7 +33,7 @@ export interface IRecordingState {
         [key: string]: number | undefined;
     };
     selectedRecordingService: string;
-    sessionDatas: Array<SessionData>;
+    sessionDatas: Array<ISessionData>;
     streamKey?: string;
 }
 
@@ -107,7 +107,7 @@ ReducerRegistry.register<IRecordingState>(STORE_NAME,
  * @private
  * @returns {Array} The session datas with the updated session data added.
  */
-function _updateSessionDatas(sessionDatas: SessionData[], newSessionData: SessionData) {
+function _updateSessionDatas(sessionDatas: ISessionData[], newSessionData: ISessionData) {
     const hasExistingSessionData = sessionDatas.find(
         sessionData => sessionData.id === newSessionData.id);
     let newSessionDatas;
diff --git a/react/features/screen-share/components/ShareAudioDialog.tsx b/react/features/screen-share/components/ShareAudioDialog.tsx
index ff4ded908..67a3a2b65 100644
--- a/react/features/screen-share/components/ShareAudioDialog.tsx
+++ b/react/features/screen-share/components/ShareAudioDialog.tsx
@@ -1,7 +1,7 @@
 import React, { Component } from 'react';
 import { WithTranslation } from 'react-i18next';
 
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import { translate } from '../../base/i18n/functions';
 import { connect } from '../../base/redux/functions';
 import { updateSettings } from '../../base/settings/actions';
@@ -13,7 +13,7 @@ import Dialog from '../../base/ui/components/web/Dialog';
 /**
  * The type of the React {@code Component} props of {@link ShareAudioDialog}.
  */
-export interface Props extends WithTranslation {
+export interface IProps extends WithTranslation {
 
     /**
      * Boolean stored in local storage that determines whether or not the dialog will be displayed again.
@@ -29,14 +29,14 @@ export interface Props extends WithTranslation {
 /**
  * Component that displays the audio screen share helper dialog.
  */
-class ShareAudioDialog extends Component<Props> {
+class ShareAudioDialog extends Component<IProps> {
 
     /**
      * Instantiates a new component.
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onContinue = this._onContinue.bind(this);
@@ -101,11 +101,11 @@ class ShareAudioDialog extends Component<Props> {
 /**
  * Maps part of the Redux state to the props of this component.
  *
- * @param {IState} state - The Redux state.
+ * @param {IReduxState} state - The Redux state.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function _mapStateToProps(state: IState): Partial<Props> {
+function _mapStateToProps(state: IReduxState): Partial<IProps> {
 
     return {
         _shouldHideShareAudioHelper: shouldHideShareAudioHelper(state)
diff --git a/react/features/screen-share/components/ShareScreenWarningDialog.tsx b/react/features/screen-share/components/ShareScreenWarningDialog.tsx
index 5e5969b72..2d8bc2d43 100644
--- a/react/features/screen-share/components/ShareScreenWarningDialog.tsx
+++ b/react/features/screen-share/components/ShareScreenWarningDialog.tsx
@@ -7,7 +7,7 @@ import { connect } from '../../base/redux/functions';
 import { toggleScreensharing } from '../../base/tracks/actions';
 import Dialog from '../../base/ui/components/web/Dialog';
 
-export interface Props extends WithTranslation {
+export interface IProps extends WithTranslation {
 
     /**
      * Whether or not the dialog was opened for the audio screen sharing flow or the normal one.
@@ -23,14 +23,14 @@ export interface Props extends WithTranslation {
 /**
  *  Component that displays the share audio helper dialog.
  */
-class ShareScreenWarningDialog extends Component<Props> {
+class ShareScreenWarningDialog extends Component<IProps> {
 
     /**
      * Instantiates a new component.
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onStopSharing = this._onStopSharing.bind(this);
diff --git a/react/features/screen-share/functions.ts b/react/features/screen-share/functions.ts
index fa4c029d9..93235bbdf 100644
--- a/react/features/screen-share/functions.ts
+++ b/react/features/screen-share/functions.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { getMultipleVideoSendingSupportFeatureFlag } from '../base/config/functions.any';
 import { isWindows } from '../base/environment/environment';
 import { isMobileBrowser } from '../base/environment/utils';
@@ -9,20 +9,20 @@ import { getLocalDesktopTrack, getLocalVideoTrack } from '../base/tracks/functio
 /**
  * Is the current screen sharing session audio only.
  *
- * @param {IState} state - The state of the application.
+ * @param {IReduxState} state - The state of the application.
  * @returns {boolean}
  */
-export function isAudioOnlySharing(state: IState) {
+export function isAudioOnlySharing(state: IReduxState) {
     return isScreenAudioShared(state) && !isScreenVideoShared(state);
 }
 
 /**
  * State of audio sharing.
  *
- * @param {IState} state - The state of the application.
+ * @param {IReduxState} state - The state of the application.
  * @returns {boolean}
  */
-export function isScreenAudioShared(state: IState) {
+export function isScreenAudioShared(state: IReduxState) {
     return state['features/screen-share'].isSharingAudio;
 }
 
@@ -39,20 +39,20 @@ export function isScreenAudioSupported() {
 /**
  * Is any screen media currently being shared, audio or video.
  *
- * @param {IState} state - The state of the application.
+ * @param {IReduxState} state - The state of the application.
  * @returns {boolean}
  */
-export function isScreenMediaShared(state: IState) {
+export function isScreenMediaShared(state: IReduxState) {
     return isScreenAudioShared(state) || isScreenVideoShared(state);
 }
 
 /**
  * Is screen sharing currently active.
  *
- * @param {IState} state - The state of the application.
+ * @param {IReduxState} state - The state of the application.
  * @returns {boolean}
  */
-export function isScreenVideoShared(state: IState) {
+export function isScreenVideoShared(state: IReduxState) {
     const tracks = state['features/base/tracks'];
     const localScreenshare = getLocalDesktopTrack(tracks);
 
diff --git a/react/features/security/components/security-dialog/web/PasswordForm.tsx b/react/features/security/components/security-dialog/web/PasswordForm.tsx
index 7b965f1c5..c4f37522a 100644
--- a/react/features/security/components/security-dialog/web/PasswordForm.tsx
+++ b/react/features/security/components/security-dialog/web/PasswordForm.tsx
@@ -8,7 +8,7 @@ import { LOCKED_LOCALLY } from '../../../../room-lock/constants';
 /**
  * The type of the React {@code Component} props of {@link PasswordForm}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Whether or not to show the password editing field.
@@ -59,13 +59,13 @@ type State = {
  *
  * @augments Component
  */
-class PasswordForm extends Component<Props, State> {
+class PasswordForm extends Component<IProps, State> {
     /**
      * Implements React's {@link Component#getDerivedStateFromProps()}.
      *
      * @inheritdoc
      */
-    static getDerivedStateFromProps(props: Props, state: State) {
+    static getDerivedStateFromProps(props: IProps, state: State) {
         return {
             enteredPassword: props.editEnabled ? state.enteredPassword : ''
         };
@@ -78,10 +78,10 @@ class PasswordForm extends Component<Props, State> {
     /**
      * Initializes a new {@code PasswordForm} instance.
      *
-     * @param {Props} props - The React {@code Component} props to initialize
+     * @param {IProps} props - The React {@code Component} props to initialize
      * the new {@code PasswordForm} instance with.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         // Bind event handlers so they are only bound once per instance.
diff --git a/react/features/security/components/security-dialog/web/PasswordSection.tsx b/react/features/security/components/security-dialog/web/PasswordSection.tsx
index 5a8e51475..6dc2c3627 100644
--- a/react/features/security/components/security-dialog/web/PasswordSection.tsx
+++ b/react/features/security/components/security-dialog/web/PasswordSection.tsx
@@ -8,17 +8,17 @@ import { LOCKED_LOCALLY } from '../../../../room-lock/constants';
 import { NOTIFY_CLICK_MODE } from '../../../../toolbox/constants';
 
 import PasswordForm from './PasswordForm';
-import { NotifyClick } from './SecurityDialog';
+import { INotifyClick } from './SecurityDialog';
 
 const DIGITS_ONLY = /^\d+$/;
 const KEY = 'add-passcode';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Toolbar buttons which have their click exposed through the API.
      */
-    buttonsWithNotifyClick: Array<string | NotifyClick>;
+    buttonsWithNotifyClick: Array<string | INotifyClick>;
 
     /**
      * Whether or not the current user can modify the current password.
@@ -80,7 +80,7 @@ function PasswordSection({
     passwordNumberOfDigits,
     setPassword,
     setPasswordEditEnabled,
-    t }: Props) {
+    t }: IProps) {
 
     const formRef = useRef<HTMLDivElement>(null);
     const [ passwordVisible, setPasswordVisible ] = useState(false);
@@ -117,7 +117,7 @@ function PasswordSection({
 
         let notifyMode;
         const notify = buttonsWithNotifyClick.find(
-            (btn: string | NotifyClick) =>
+            (btn: string | INotifyClick) =>
                 (typeof btn === 'string' && btn === KEY)
                 || (typeof btn === 'object' && btn.key === KEY)
         );
diff --git a/react/features/security/components/security-dialog/web/SecurityDialog.tsx b/react/features/security/components/security-dialog/web/SecurityDialog.tsx
index 4ce92a81b..430d64a11 100644
--- a/react/features/security/components/security-dialog/web/SecurityDialog.tsx
+++ b/react/features/security/components/security-dialog/web/SecurityDialog.tsx
@@ -1,7 +1,7 @@
 /* eslint-disable lines-around-comment */
 import React, { useEffect, useState } from 'react';
 
-import { IState } from '../../../../app/types';
+import { IReduxState } from '../../../../app/types';
 import { setPassword as setPass } from '../../../../base/conference/actions';
 import { isLocalParticipantModerator } from '../../../../base/participants/functions';
 import { connect } from '../../../../base/redux/functions';
@@ -13,7 +13,7 @@ import { LobbySection } from '../../../../lobby';
 
 import PasswordSection from './PasswordSection';
 
-export interface NotifyClick {
+export interface INotifyClick {
     key: string;
     preventExecution: boolean;
 }
@@ -23,7 +23,7 @@ type Props = {
     /**
      * Toolbar buttons which have their click exposed through the API.
      */
-    _buttonsWithNotifyClick: Array<string | NotifyClick>;
+    _buttonsWithNotifyClick: Array<string | INotifyClick>;
 
     /**
      * Whether or not the current user can modify the current password.
@@ -123,7 +123,7 @@ function SecurityDialog({
  * @private
  * @returns {Props}
  */
-function mapStateToProps(state: IState) {
+function mapStateToProps(state: IReduxState) {
     const {
         conference,
         e2eeSupported,
diff --git a/react/features/settings/components/native/HelpView.tsx b/react/features/settings/components/native/HelpView.tsx
index e0bd3570a..abc192cb7 100644
--- a/react/features/settings/components/native/HelpView.tsx
+++ b/react/features/settings/components/native/HelpView.tsx
@@ -2,7 +2,7 @@
 
 import React, { PureComponent } from 'react';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 // @ts-ignore
 import JitsiScreenWebView from '../../../base/modal/components/JitsiScreenWebView';
 // @ts-ignore
@@ -81,7 +81,7 @@ class HelpView extends PureComponent<Props> {
  * @param {Object} state - The Redux state.
  * @returns {Props}
  */
-function _mapStateToProps(state: IState) {
+function _mapStateToProps(state: IReduxState) {
     return {
         _url: state['features/base/config'].helpCentreURL || DEFAULT_HELP_CENTRE_URL
     };
diff --git a/react/features/settings/components/native/SettingsView.tsx b/react/features/settings/components/native/SettingsView.tsx
index 46c2e0494..692420c7c 100644
--- a/react/features/settings/components/native/SettingsView.tsx
+++ b/react/features/settings/components/native/SettingsView.tsx
@@ -19,7 +19,7 @@ import {
 
 // @ts-ignore
 import { getDefaultURL } from '../../../app/functions';
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 // @ts-ignore
 import { Avatar } from '../../../base/avatar';
 import { translate } from '../../../base/i18n/functions';
@@ -50,7 +50,7 @@ import styles, { PLACEHOLDER_COLOR, PLACEHOLDER_TEXT_COLOR } from './styles';
 const { AppInfo } = NativeModules;
 
 
-interface State {
+interface IState {
 
     /**
      * State variable for the disable call integration switch.
@@ -107,7 +107,7 @@ interface State {
  * The type of the React {@code Component} props of
  * {@link SettingsView}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The ID of the local participant.
@@ -175,7 +175,7 @@ interface Props extends WithTranslation {
 /**
  * The native container rendering the app settings page.
  */
-class SettingsView extends Component<Props, State> {
+class SettingsView extends Component<IProps, IState> {
     _urlField: Object;
 
     /**
@@ -184,7 +184,7 @@ class SettingsView extends Component<Props, State> {
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         const {
@@ -239,7 +239,7 @@ class SettingsView extends Component<Props, State> {
      * @inheritdoc
      * @returns {void}
      */
-    componentDidUpdate(prevProps: Props) {
+    componentDidUpdate(prevProps: IProps) {
         const { _settings } = this.props;
 
         if (!_.isEqual(prevProps._settings, _settings)) {
@@ -753,9 +753,9 @@ class SettingsView extends Component<Props, State> {
  * Maps part of the Redux state to the props of this component.
  *
  * @param {Object} state - The Redux state.
- * @returns {Props}
+ * @returns {IProps}
  */
-function _mapStateToProps(state: IState) {
+function _mapStateToProps(state: IReduxState) {
     const localParticipant = getLocalParticipant(state);
 
     return {
diff --git a/react/features/settings/components/web/LogoutDialog.tsx b/react/features/settings/components/web/LogoutDialog.tsx
index f223a6d32..5bc5978aa 100644
--- a/react/features/settings/components/web/LogoutDialog.tsx
+++ b/react/features/settings/components/web/LogoutDialog.tsx
@@ -8,7 +8,7 @@ import Dialog from '../../../base/ui/components/web/Dialog';
 /**
  * The type of {@link LogoutDialog}'s React {@code Component} props.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Logout handler.
@@ -22,7 +22,7 @@ interface Props extends WithTranslation {
  * @param {Object} props - The props of the component.
  * @returns {React$Element}.
  */
-function LogoutDialog({ onLogout, t }: Props) {
+function LogoutDialog({ onLogout, t }: IProps) {
     return (
         <Dialog
             ok = {{ translationKey: 'dialog.Yes' }}
diff --git a/react/features/settings/components/web/SettingsDialog.tsx b/react/features/settings/components/web/SettingsDialog.tsx
index da73dd43f..c7c0f24d6 100644
--- a/react/features/settings/components/web/SettingsDialog.tsx
+++ b/react/features/settings/components/web/SettingsDialog.tsx
@@ -3,7 +3,7 @@ import { Theme } from '@mui/material';
 import { withStyles } from '@mui/styles';
 import React, { Component } from 'react';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { getAvailableDevices } from '../../../base/devices/actions';
 // @ts-ignore
 import { DialogWithTabs } from '../../../base/dialog';
@@ -295,7 +295,7 @@ class SettingsDialog extends Component<Props> {
  *     tabs: Array<Object>
  * }}
  */
-function _mapStateToProps(state: IState, ownProps: any) {
+function _mapStateToProps(state: IReduxState, ownProps: any) {
     const { classes, isDisplayedOnWelcomePage } = ownProps;
     const configuredTabs = interfaceConfig.SETTINGS_SECTIONS || [];
 
diff --git a/react/features/shared-video/components/AbstractSharedVideoDialog.tsx b/react/features/shared-video/components/AbstractSharedVideoDialog.tsx
index cda2953d3..1c5802a26 100644
--- a/react/features/shared-video/components/AbstractSharedVideoDialog.tsx
+++ b/react/features/shared-video/components/AbstractSharedVideoDialog.tsx
@@ -10,7 +10,7 @@ import { extractYoutubeIdOrURL } from '../functions';
  * The type of the React {@code Component} props of
  * {@link AbstractSharedVideoDialog}.
  */
-export interface Props extends WithTranslation {
+export interface IProps extends WithTranslation {
 
     /**
      * Invoked to update the shared video link.
@@ -26,14 +26,14 @@ export interface Props extends WithTranslation {
 /**
  * Implements an abstract class for {@code SharedVideoDialog}.
  */
-export default class AbstractSharedVideoDialog<S> extends Component < Props, S > {
+export default class AbstractSharedVideoDialog<S> extends Component < IProps, S > {
 
     /**
      * Instantiates a new component.
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onSetVideoLink = this._onSetVideoLink.bind(this);
diff --git a/react/features/speaker-stats/components/web/SpeakerStats.tsx b/react/features/speaker-stats/components/web/SpeakerStats.tsx
index a8f02ea63..3c00526b9 100644
--- a/react/features/speaker-stats/components/web/SpeakerStats.tsx
+++ b/react/features/speaker-stats/components/web/SpeakerStats.tsx
@@ -3,7 +3,7 @@ import React, { useCallback, useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+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
@@ -87,9 +87,9 @@ const useStyles = makeStyles()((theme: Theme) => {
 });
 
 const SpeakerStats = () => {
-    const { faceLandmarks } = useSelector((state: IState) => state['features/base/config']);
-    const { showFaceExpressions } = useSelector((state: IState) => state['features/speaker-stats']);
-    const { clientWidth } = useSelector((state: IState) => state['features/base/responsive-ui']);
+    const { faceLandmarks } = useSelector((state: IReduxState) => state['features/base/config']);
+    const { showFaceExpressions } = useSelector((state: IReduxState) => state['features/speaker-stats']);
+    const { clientWidth } = useSelector((state: IReduxState) => state['features/base/responsive-ui']);
     const displaySwitch = faceLandmarks?.enableDisplayFaceExpressions && clientWidth > DISPLAY_SWITCH_BREAKPOINT;
     const displayLabels = clientWidth > MOBILE_BREAKPOINT;
     const dispatch = useDispatch();
diff --git a/react/features/stream-effects/rnnoise/RnnoiseProcessor.ts b/react/features/stream-effects/rnnoise/RnnoiseProcessor.ts
index 1920d3dae..5763898d5 100644
--- a/react/features/stream-effects/rnnoise/RnnoiseProcessor.ts
+++ b/react/features/stream-effects/rnnoise/RnnoiseProcessor.ts
@@ -1,6 +1,6 @@
 /* eslint-disable no-bitwise */
 
-interface RnnoiseModule extends EmscriptenModule {
+interface IRnnoiseModule extends EmscriptenModule {
     _rnnoise_create: () => number;
     _rnnoise_destroy: (context: number) => void;
     _rnnoise_process_frame: (context: number, input: number, output: number) => number;
@@ -45,7 +45,7 @@ export default class RnnoiseProcessor {
     /**
      * WASM interface through which calls to rnnoise are made.
      */
-    private _wasmInterface: RnnoiseModule;
+    private _wasmInterface: IRnnoiseModule;
 
     /**
      * WASM dynamic memory buffer used as input for rnnoise processing method.
@@ -63,7 +63,7 @@ export default class RnnoiseProcessor {
      * @class
      * @param {Object} wasmInterface - WebAssembly module interface that exposes rnnoise functionality.
      */
-    constructor(wasmInterface: RnnoiseModule) {
+    constructor(wasmInterface: IRnnoiseModule) {
         // Considering that we deal with dynamic allocated memory employ exception safety strong guarantee
         // i.e. in case of exception there are no side effects.
         try {
diff --git a/react/features/subtitles/components/LanguageList.tsx b/react/features/subtitles/components/LanguageList.tsx
index c4174e67c..f32c9f07d 100644
--- a/react/features/subtitles/components/LanguageList.tsx
+++ b/react/features/subtitles/components/LanguageList.tsx
@@ -5,7 +5,7 @@ import { makeStyles } from 'tss-react/mui';
 import LanguageListItem from './LanguageListItem';
 
 interface ILanguageListProps {
-    items: Array<LanguageItem>;
+    items: Array<ILanguageItem>;
     onLanguageSelected: (lang: string) => void;
     selectedLanguage: string;
 }
@@ -20,7 +20,7 @@ const useStyles = makeStyles()(() => {
 });
 
 
-interface LanguageItem {
+interface ILanguageItem {
     id: string;
     lang: string;
     selected: boolean;
diff --git a/react/features/subtitles/components/LanguageSelectorDialog.web.tsx b/react/features/subtitles/components/LanguageSelectorDialog.web.tsx
index 86728b8ee..c69b3f4c3 100644
--- a/react/features/subtitles/components/LanguageSelectorDialog.web.tsx
+++ b/react/features/subtitles/components/LanguageSelectorDialog.web.tsx
@@ -6,7 +6,7 @@ import { WithTranslation } from 'react-i18next';
 import { useDispatch } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 // @ts-ignore
 import { TRANSLATION_LANGUAGES, TRANSLATION_LANGUAGES_HEAD } from '../../base/i18n';
 import { translate, translateToHTML } from '../../base/i18n/functions';
@@ -127,7 +127,7 @@ const LanguageSelectorDialog = ({
  * @private
  * @returns {Props}
  */
-function mapStateToProps(state: IState) {
+function mapStateToProps(state: IReduxState) {
     const { conference } = state['features/base/conference'];
     const { _language } = state['features/subtitles'];
     const { transcription } = state['features/base/config'];
diff --git a/react/features/toolbox/components/native/HangupMenu.tsx b/react/features/toolbox/components/native/HangupMenu.tsx
index 73199e005..18ddc7f07 100644
--- a/react/features/toolbox/components/native/HangupMenu.tsx
+++ b/react/features/toolbox/components/native/HangupMenu.tsx
@@ -7,7 +7,7 @@ import { createBreakoutRoomsEvent, createToolbarEvent } from '../../../analytics
 import { sendAnalytics } from '../../../analytics/functions';
 // @ts-ignore
 import { appNavigate } from '../../../app/actions';
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 // @ts-ignore
 import { ColorSchemeRegistry } from '../../../base/color-scheme';
 // @ts-ignore
@@ -31,7 +31,8 @@ function HangupMenu() {
     const dispatch = useDispatch();
     const _styles = useSelector(state => ColorSchemeRegistry.get(state, 'Toolbox'));
     const inBreakoutRoom = useSelector(isInBreakoutRoom);
-    const isModerator = useSelector((state: IState) => getLocalParticipant(state)?.role === PARTICIPANT_ROLE.MODERATOR);
+    const isModerator = useSelector((state: IReduxState) =>
+        getLocalParticipant(state)?.role === PARTICIPANT_ROLE.MODERATOR);
     const { DESTRUCTIVE, SECONDARY } = BUTTON_TYPES;
 
     const handleEndConference = useCallback(() => {
diff --git a/react/features/toolbox/components/native/OpenCarmodeButton.tsx b/react/features/toolbox/components/native/OpenCarmodeButton.tsx
index 0aa2a00cb..a935cb2a8 100644
--- a/react/features/toolbox/components/native/OpenCarmodeButton.tsx
+++ b/react/features/toolbox/components/native/OpenCarmodeButton.tsx
@@ -1,5 +1,5 @@
 /* eslint-disable lines-around-comment */
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { CAR_MODE_ENABLED } from '../../../base/flags/constants';
 import { getFeatureFlag } from '../../../base/flags/functions';
 import { translate } from '../../../base/i18n/functions';
@@ -35,12 +35,12 @@ class OpenCarmodeButton extends AbstractButton<AbstractButtonProps, any, any> {
 /**
  * Maps part of the Redux state to the props of this component.
  *
- * @param {IState} state - The Redux state.
+ * @param {IReduxState} state - The Redux state.
  * @param {AbstractButtonProps} ownProps - The properties explicitly passed to the component instance.
  * @private
  * @returns {Object}
  */
-function _mapStateToProps(state: IState, ownProps: AbstractButtonProps): Object {
+function _mapStateToProps(state: IReduxState, ownProps: AbstractButtonProps): Object {
     const enabled = getFeatureFlag(state, CAR_MODE_ENABLED, true);
     const { visible = enabled } = ownProps;
 
diff --git a/react/features/toolbox/components/web/HangupMenuButton.tsx b/react/features/toolbox/components/web/HangupMenuButton.tsx
index f868770b1..982ecd0cf 100644
--- a/react/features/toolbox/components/web/HangupMenuButton.tsx
+++ b/react/features/toolbox/components/web/HangupMenuButton.tsx
@@ -11,7 +11,7 @@ import HangupToggleButton from './HangupToggleButton';
 /**
  * The type of the React {@code Component} props of {@link HangupMenuButton}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * ID of the menu that is controlled by this button.
@@ -39,14 +39,14 @@ interface Props extends WithTranslation {
  *
  * @augments Component
  */
-class HangupMenuButton extends Component<Props> {
+class HangupMenuButton extends Component<IProps> {
     /**
      * Initializes a new {@code HangupMenuButton} instance.
      *
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         // Bind event handlers so they are only bound once per instance.
diff --git a/react/features/toolbox/components/web/OverflowMenuButton.tsx b/react/features/toolbox/components/web/OverflowMenuButton.tsx
index 13c5056d7..3639dad4d 100644
--- a/react/features/toolbox/components/web/OverflowMenuButton.tsx
+++ b/react/features/toolbox/components/web/OverflowMenuButton.tsx
@@ -6,7 +6,7 @@ import { makeStyles } from 'tss-react/mui';
 
 import { createToolbarEvent } from '../../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../../analytics/functions';
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 // @ts-ignore
 import { ReactionEmoji, ReactionsMenu } from '../../../reactions/components';
 import { REACTIONS_MENU_HEIGHT } from '../../../reactions/constants';
@@ -23,7 +23,7 @@ import OverflowToggleButton from './OverflowToggleButton';
 /**
  * The type of the React {@code Component} props of {@link OverflowMenuButton}.
  */
-interface Props {
+interface IProps {
 
     /**
      * ID of the menu that is controlled by this button.
@@ -65,9 +65,9 @@ const OverflowMenuButton = ({
     isOpen,
     onVisibilityChange,
     showMobileReactions
-}: Props) => {
+}: IProps) => {
     const { classes } = useStyles();
-    const overflowDrawer = useSelector((state: IState) => state['features/toolbox'].overflowDrawer);
+    const overflowDrawer = useSelector((state: IReduxState) => state['features/toolbox'].overflowDrawer);
     const reactionsQueue = useSelector(getReactionsQueue);
 
     const onCloseDialog = useCallback(() => {
diff --git a/react/features/toolbox/components/web/Toolbox.tsx b/react/features/toolbox/components/web/Toolbox.tsx
index e5241ce96..4d80781ea 100644
--- a/react/features/toolbox/components/web/Toolbox.tsx
+++ b/react/features/toolbox/components/web/Toolbox.tsx
@@ -10,7 +10,7 @@ import keyboardShortcut from '../../../../../modules/keyboardshortcut/keyboardsh
 import { isSpeakerStatsDisabled } from '../../../../features/speaker-stats/functions';
 import { ACTION_SHORTCUT_TRIGGERED, createShortcutEvent, createToolbarEvent } from '../../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../../analytics/functions';
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import {
     getMultipleVideoSendingSupportFeatureFlag,
     getToolbarButtons,
@@ -146,7 +146,7 @@ import VideoSettingsButton from './VideoSettingsButton';
 /**
  * The type of the React {@code Component} props of {@link Toolbox}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * String showing if the virtual background type is desktop-share.
@@ -376,14 +376,14 @@ const styles = () => {
  *
  * @augments Component
  */
-class Toolbox extends Component<Props> {
+class Toolbox extends Component<IProps> {
     /**
      * Initializes a new {@code Toolbox} instance.
      *
-     * @param {Props} props - The read-only React {@code Component} props with
+     * @param {IProps} props - The read-only React {@code Component} props with
      * which the new instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         // Bind event handlers so they are only bound once per instance.
@@ -521,7 +521,7 @@ class Toolbox extends Component<Props> {
      *
      * @inheritdoc
      */
-    componentDidUpdate(prevProps: Props) {
+    componentDidUpdate(prevProps: IProps) {
         const { _dialog, _visible, dispatch } = this.props;
 
 
@@ -1521,7 +1521,7 @@ class Toolbox extends Component<Props> {
  * @private
  * @returns {{}}
  */
-function _mapStateToProps(state: IState, ownProps: Partial<Props>) {
+function _mapStateToProps(state: IReduxState, ownProps: Partial<IProps>) {
     const { conference } = state['features/base/conference'];
     const endConferenceSupported = conference?.isEndConferenceSupported();
 
diff --git a/react/features/toolbox/functions.any.ts b/react/features/toolbox/functions.any.ts
index 949adc73e..512c0c0fd 100644
--- a/react/features/toolbox/functions.any.ts
+++ b/react/features/toolbox/functions.any.ts
@@ -1,14 +1,14 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { FEATURES_TO_BUTTONS_MAPPING } from '../base/jwt/constants';
 import { isJwtFeatureEnabled } from '../base/jwt/functions';
 
 /**
  * Indicates if the audio mute button is disabled or not.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export function isAudioMuteButtonDisabled(state: IState) {
+export function isAudioMuteButtonDisabled(state: IReduxState) {
     const { available, muted, unmuteBlocked } = state['features/base/media'].audio;
     const { startSilent } = state['features/base/config'];
 
@@ -18,10 +18,10 @@ export function isAudioMuteButtonDisabled(state: IState) {
 /**
  * Returns the buttons corresponding to features disabled through jwt.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {string[]} - The disabled by jwt buttons array.
  */
-export function getJwtDisabledButtons(state: IState) {
+export function getJwtDisabledButtons(state: IReduxState) {
     return Object.keys(FEATURES_TO_BUTTONS_MAPPING).reduce((acc: string[], current: string) => {
         if (!isJwtFeatureEnabled(state, current, true)) {
             acc.push(FEATURES_TO_BUTTONS_MAPPING[current as keyof typeof FEATURES_TO_BUTTONS_MAPPING]);
diff --git a/react/features/toolbox/functions.native.ts b/react/features/toolbox/functions.native.ts
index 8def2789a..10f9feae0 100644
--- a/react/features/toolbox/functions.native.ts
+++ b/react/features/toolbox/functions.native.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { IStateful } from '../base/app/types';
 import { hasAvailableDevices } from '../base/devices';
 import { TOOLBOX_ALWAYS_VISIBLE, TOOLBOX_ENABLED, getFeatureFlag } from '../base/flags';
@@ -56,10 +56,10 @@ export function getMovableButtons(width: number): Set<string> {
 /**
  * Indicates if the desktop share button is disabled or not.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export function isDesktopShareButtonDisabled(state: IState) {
+export function isDesktopShareButtonDisabled(state: IReduxState) {
     const { muted, unmuteBlocked } = state['features/base/media'].video;
     const videoOrShareInProgress = !muted || isLocalVideoTrackDesktop(state);
 
@@ -89,10 +89,10 @@ export function isToolboxVisible(stateful: IStateful) {
 /**
  * Indicates if the video mute button is disabled or not.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export function isVideoMuteButtonDisabled(state: IState) {
+export function isVideoMuteButtonDisabled(state: IReduxState) {
     const { muted, unmuteBlocked } = state['features/base/media'].video;
 
     return !hasAvailableDevices(state, 'videoInput')
diff --git a/react/features/toolbox/functions.web.ts b/react/features/toolbox/functions.web.ts
index 6151e15f1..6054fa3c9 100644
--- a/react/features/toolbox/functions.web.ts
+++ b/react/features/toolbox/functions.web.ts
@@ -1,4 +1,4 @@
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { getToolbarButtons } from '../base/config/functions.web';
 import { hasAvailableDevices } from '../base/devices/functions';
 import { MEET_FEATURES } from '../base/jwt/constants';
@@ -26,11 +26,11 @@ export function getToolboxHeight() {
  *
  * @param {string} name - The name of the setting section as defined in
  * interface_config.js.
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @returns {boolean|undefined} - True to indicate that the given toolbar button
  * is enabled, false - otherwise.
  */
-export function isButtonEnabled(name: string, state: IState) {
+export function isButtonEnabled(name: string, state: IReduxState) {
     const toolbarButtons = getToolbarButtons(state);
 
     return toolbarButtons.indexOf(name) !== -1;
@@ -39,11 +39,11 @@ export function isButtonEnabled(name: string, state: IState) {
 /**
  * Indicates if the toolbox is visible or not.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean} - True to indicate that the toolbox is visible, false -
  * otherwise.
  */
-export function isToolboxVisible(state: IState) {
+export function isToolboxVisible(state: IReduxState) {
     const { iAmRecorder, iAmSipGateway, toolbarConfig } = state['features/base/config'];
     const { alwaysVisible } = toolbarConfig || {};
     const {
@@ -67,10 +67,10 @@ export function isToolboxVisible(state: IState) {
 /**
  * Indicates if the audio settings button is disabled or not.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export function isAudioSettingsButtonDisabled(state: IState) {
+export function isAudioSettingsButtonDisabled(state: IReduxState) {
 
     return !(hasAvailableDevices(state, 'audioInput')
         || hasAvailableDevices(state, 'audioOutput'))
@@ -80,10 +80,10 @@ export function isAudioSettingsButtonDisabled(state: IState) {
 /**
  * Indicates if the desktop share button is disabled or not.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export function isDesktopShareButtonDisabled(state: IState) {
+export function isDesktopShareButtonDisabled(state: IReduxState) {
     const { muted, unmuteBlocked } = state['features/base/media'].video;
     const videoOrShareInProgress = !muted || isScreenMediaShared(state);
     const enabledInJwt = isJwtFeatureEnabled(state, MEET_FEATURES.SCREEN_SHARING, true, true);
@@ -94,20 +94,20 @@ export function isDesktopShareButtonDisabled(state: IState) {
 /**
  * Indicates if the video settings button is disabled or not.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export function isVideoSettingsButtonDisabled(state: IState) {
+export function isVideoSettingsButtonDisabled(state: IReduxState) {
     return !hasAvailableDevices(state, 'videoInput');
 }
 
 /**
  * Indicates if the video mute button is disabled or not.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export function isVideoMuteButtonDisabled(state: IState) {
+export function isVideoMuteButtonDisabled(state: IReduxState) {
     const { muted, unmuteBlocked } = state['features/base/media'].video;
 
     return !hasAvailableDevices(state, 'videoInput') || (unmuteBlocked && Boolean(muted));
@@ -117,30 +117,30 @@ export function isVideoMuteButtonDisabled(state: IState) {
  * If an overflow drawer should be displayed or not.
  * This is usually done for mobile devices or on narrow screens.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export function showOverflowDrawer(state: IState) {
+export function showOverflowDrawer(state: IReduxState) {
     return state['features/toolbox'].overflowDrawer;
 }
 
 /**
  * Indicates whether the toolbox is enabled or not.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export function isToolboxEnabled(state: IState) {
+export function isToolboxEnabled(state: IReduxState) {
     return state['features/toolbox'].enabled;
 }
 
 /**
  * Returns the toolbar timeout from config or the default value.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {number} - Toolbar timeout in milliseconds.
  */
-export function getToolbarTimeout(state: IState) {
+export function getToolbarTimeout(state: IReduxState) {
     const { toolbarConfig } = state['features/base/config'];
 
     return toolbarConfig?.timeout || TOOLBAR_TIMEOUT;
diff --git a/react/features/toolbox/subscriber.ts b/react/features/toolbox/subscriber.ts
index 87f2ccc19..a44a7ae69 100644
--- a/react/features/toolbox/subscriber.ts
+++ b/react/features/toolbox/subscriber.ts
@@ -1,4 +1,4 @@
-import { IState, IStore } from '../app/types';
+import { IReduxState, IStore } from '../app/types';
 import StateListenerRegistry from '../base/redux/StateListenerRegistry';
 
 import { isAudioMuteButtonDisabled } from './functions.any';
@@ -9,7 +9,7 @@ declare let APP: any;
  * Notifies when audio availability changes.
  */
 StateListenerRegistry.register(
-    /* selector */ (state: IState) => isAudioMuteButtonDisabled(state),
+    /* selector */ (state: IReduxState) => isAudioMuteButtonDisabled(state),
     /* listener */ (disabled: boolean, store: IStore, previousDisabled: boolean) => {
         if (typeof APP !== 'object') {
             return;
diff --git a/react/features/video-menu/components/AbstractGrantModeratorDialog.ts b/react/features/video-menu/components/AbstractGrantModeratorDialog.ts
index 4df114523..1b2ae5b8d 100644
--- a/react/features/video-menu/components/AbstractGrantModeratorDialog.ts
+++ b/react/features/video-menu/components/AbstractGrantModeratorDialog.ts
@@ -3,11 +3,11 @@ import { WithTranslation } from 'react-i18next';
 
 import { createRemoteVideoMenuButtonEvent } from '../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../analytics/functions';
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import { grantModerator } from '../../base/participants/actions';
 import { getParticipantById } from '../../base/participants/functions';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The Redux dispatch function.
@@ -29,13 +29,13 @@ interface Props extends WithTranslation {
  * Abstract dialog to confirm granting moderator to a participant.
  */
 export default class AbstractGrantModeratorDialog
-    extends Component<Props> {
+    extends Component<IProps> {
     /**
      * Initializes a new {@code AbstractGrantModeratorDialog} instance.
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onSubmit = this._onSubmit.bind(this);
@@ -65,11 +65,11 @@ export default class AbstractGrantModeratorDialog
 /**
  * Maps (parts of) the Redux state to the associated {@code AbstractMuteEveryoneDialog}'s props.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @param {Object} ownProps - The properties explicitly passed to the component.
- * @returns {Props}
+ * @returns {IProps}
  */
-export function abstractMapStateToProps(state: IState, ownProps: Props) {
+export function abstractMapStateToProps(state: IReduxState, ownProps: IProps) {
 
     return {
         participantName: getParticipantById(state, ownProps.participantID)?.name
diff --git a/react/features/video-menu/components/AbstractKickRemoteParticipantDialog.ts b/react/features/video-menu/components/AbstractKickRemoteParticipantDialog.ts
index 7b0c5a0f8..1eedce403 100644
--- a/react/features/video-menu/components/AbstractKickRemoteParticipantDialog.ts
+++ b/react/features/video-menu/components/AbstractKickRemoteParticipantDialog.ts
@@ -6,7 +6,7 @@ import { sendAnalytics } from '../../analytics/functions';
 import { IStore } from '../../app/types';
 import { kickParticipant } from '../../base/participants/actions';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The Redux dispatch function.
@@ -23,13 +23,13 @@ interface Props extends WithTranslation {
  * Abstract dialog to confirm a remote participant kick action.
  */
 export default class AbstractKickRemoteParticipantDialog
-    extends Component<Props> {
+    extends Component<IProps> {
     /**
      * Initializes a new {@code AbstractKickRemoteParticipantDialog} instance.
      *
      * @inheritdoc
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onSubmit = this._onSubmit.bind(this);
diff --git a/react/features/video-menu/components/AbstractMuteEveryoneDialog.ts b/react/features/video-menu/components/AbstractMuteEveryoneDialog.ts
index b6d9cca32..5bb9e5dd7 100644
--- a/react/features/video-menu/components/AbstractMuteEveryoneDialog.ts
+++ b/react/features/video-menu/components/AbstractMuteEveryoneDialog.ts
@@ -1,6 +1,6 @@
 import { WithTranslation } from 'react-i18next';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { requestDisableAudioModeration, requestEnableAudioModeration } from '../../av-moderation/actions';
 import { isEnabledFromState, isSupported } from '../../av-moderation/functions';
 import { MEDIA_TYPE } from '../../base/media/constants';
@@ -106,11 +106,11 @@ export default class AbstractMuteEveryoneDialog<P extends Props> extends Abstrac
 /**
  * Maps (parts of) the Redux state to the associated {@code AbstractMuteEveryoneDialog}'s props.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @param {Object} ownProps - The properties explicitly passed to the component.
  * @returns {Props}
  */
-export function abstractMapStateToProps(state: IState, ownProps: Props) {
+export function abstractMapStateToProps(state: IReduxState, ownProps: Props) {
     const { exclude = [], t } = ownProps;
 
     const whom = exclude
diff --git a/react/features/video-menu/components/AbstractMuteEveryonesVideoDialog.ts b/react/features/video-menu/components/AbstractMuteEveryonesVideoDialog.ts
index 1019617b0..7357c56ad 100644
--- a/react/features/video-menu/components/AbstractMuteEveryonesVideoDialog.ts
+++ b/react/features/video-menu/components/AbstractMuteEveryonesVideoDialog.ts
@@ -1,6 +1,6 @@
 import { WithTranslation } from 'react-i18next';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { requestDisableVideoModeration, requestEnableVideoModeration } from '../../av-moderation/actions';
 import { isEnabledFromState, isSupported } from '../../av-moderation/functions';
 import { MEDIA_TYPE } from '../../base/media/constants';
@@ -107,11 +107,11 @@ export default class AbstractMuteEveryonesVideoDialog<P extends Props>
 /**
  * Maps (parts of) the Redux state to the associated {@code AbstractMuteEveryonesVideoDialog}'s props.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @param {Object} ownProps - The properties explicitly passed to the component.
  * @returns {Props}
  */
-export function abstractMapStateToProps(state: IState, ownProps: Props) {
+export function abstractMapStateToProps(state: IReduxState, ownProps: Props) {
     const { exclude = [], t } = ownProps;
     const isVideoModerationEnabled = isEnabledFromState(MEDIA_TYPE.VIDEO, state);
 
diff --git a/react/features/video-menu/components/AbstractMuteRemoteParticipantsVideoDialog.ts b/react/features/video-menu/components/AbstractMuteRemoteParticipantsVideoDialog.ts
index 49d1fbcfb..c46a25238 100644
--- a/react/features/video-menu/components/AbstractMuteRemoteParticipantsVideoDialog.ts
+++ b/react/features/video-menu/components/AbstractMuteRemoteParticipantsVideoDialog.ts
@@ -1,6 +1,6 @@
 import { Component } from 'react';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { rejectParticipantVideo } from '../../av-moderation/actions';
 import { isEnabledFromState } from '../../av-moderation/functions';
 import { MEDIA_TYPE } from '../../base/media/constants';
@@ -75,11 +75,11 @@ export default class AbstractMuteRemoteParticipantsVideoDialog<P extends Props =
  * Maps (parts of) the redux state to the associated
  * {@code AbstractDialogContainer}'s props.
  *
- * @param {IState} state - The redux state.
+ * @param {IReduxState} state - The redux state.
  * @private
  * @returns {Object}
  */
-export function abstractMapStateToProps(state: IState) {
+export function abstractMapStateToProps(state: IReduxState) {
     return {
         isVideoModerationOn: isEnabledFromState(MEDIA_TYPE.VIDEO, state)
     };
diff --git a/react/features/video-menu/components/web/FakeParticipantContextMenu.tsx b/react/features/video-menu/components/web/FakeParticipantContextMenu.tsx
index 0503482f3..9550418e2 100644
--- a/react/features/video-menu/components/web/FakeParticipantContextMenu.tsx
+++ b/react/features/video-menu/components/web/FakeParticipantContextMenu.tsx
@@ -10,7 +10,7 @@ import TogglePinToStageButton from '../../../../features/video-menu/components/w
 import { Avatar } from '../../../base/avatar';
 import { IconShareVideo } from '../../../base/icons/svg';
 import { isWhiteboardParticipant } from '../../../base/participants/functions';
-import { Participant } from '../../../base/participants/types';
+import { IParticipant } from '../../../base/participants/types';
 import ContextMenu from '../../../base/ui/components/web/ContextMenu';
 import ContextMenuItemGroup from '../../../base/ui/components/web/ContextMenuItemGroup';
 // @ts-ignore
@@ -68,7 +68,7 @@ type Props = {
     /**
      * Participant reference.
      */
-    participant: Participant;
+    participant: IParticipant;
 
     /**
      * Whether or not the menu is displayed in the thumbnail remote video menu.
diff --git a/react/features/video-menu/components/web/LocalVideoMenuTriggerButton.tsx b/react/features/video-menu/components/web/LocalVideoMenuTriggerButton.tsx
index ace98bca2..2c7d62bad 100644
--- a/react/features/video-menu/components/web/LocalVideoMenuTriggerButton.tsx
+++ b/react/features/video-menu/components/web/LocalVideoMenuTriggerButton.tsx
@@ -4,7 +4,7 @@ import React, { Component } from 'react';
 import { WithTranslation } from 'react-i18next';
 import { batch, connect } from 'react-redux';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { isMobileBrowser } from '../../../base/environment/utils';
 import { translate } from '../../../base/i18n/functions';
 import { IconHorizontalPoints } from '../../../base/icons/svg';
@@ -38,7 +38,7 @@ import TogglePinToStageButton from './TogglePinToStageButton';
  * The type of the React {@code Component} props of
  * {@link LocalVideoMenuTriggerButton}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The id of the local participant.
@@ -140,7 +140,7 @@ const styles = () => {
  *
  * @augments {Component}
  */
-class LocalVideoMenuTriggerButton extends Component<Props> {
+class LocalVideoMenuTriggerButton extends Component<IProps> {
 
     /**
      * Initializes a new LocalVideoMenuTriggerButton instance.
@@ -148,7 +148,7 @@ class LocalVideoMenuTriggerButton extends Component<Props> {
      * @param {Object} props - The read-only React Component props with which
      * the new instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onPopoverClose = this._onPopoverClose.bind(this);
@@ -266,9 +266,9 @@ class LocalVideoMenuTriggerButton extends Component<Props> {
  * @param {Object} state - The Redux state.
  * @param {Object} ownProps - The own props of the component.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function _mapStateToProps(state: IState, ownProps: Partial<Props>) {
+function _mapStateToProps(state: IReduxState, ownProps: Partial<IProps>) {
     const { thumbnailType } = ownProps;
     const localParticipant = getLocalParticipant(state);
     const { disableLocalVideoFlip, disableSelfViewSettings } = state['features/base/config'];
diff --git a/react/features/video-menu/components/web/ParticipantContextMenu.tsx b/react/features/video-menu/components/web/ParticipantContextMenu.tsx
index e2805b2bb..6cae6eb18 100644
--- a/react/features/video-menu/components/web/ParticipantContextMenu.tsx
+++ b/react/features/video-menu/components/web/ParticipantContextMenu.tsx
@@ -6,7 +6,7 @@ import { useTranslation } from 'react-i18next';
 import { useDispatch, useSelector } from 'react-redux';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { isSupported as isAvModerationSupported } from '../../../av-moderation/functions';
 // @ts-ignore
 import { Avatar } from '../../../base/avatar';
@@ -14,7 +14,7 @@ import { isIosMobileBrowser, isMobileBrowser } from '../../../base/environment/u
 import { MEDIA_TYPE } from '../../../base/media/constants';
 import { PARTICIPANT_ROLE } from '../../../base/participants/constants';
 import { getLocalParticipant } from '../../../base/participants/functions';
-import { Participant } from '../../../base/participants/types';
+import { IParticipant } from '../../../base/participants/types';
 import { isParticipantAudioMuted } from '../../../base/tracks/functions';
 import ContextMenu from '../../../base/ui/components/web/ContextMenu';
 import ContextMenuItemGroup from '../../../base/ui/components/web/ContextMenuItemGroup';
@@ -93,7 +93,7 @@ type Props = {
     /**
      * Participant reference.
      */
-    participant: Participant;
+    participant: IParticipant;
 
     /**
      * The current state of the participant's remote control session.
@@ -138,20 +138,20 @@ const ParticipantContextMenu = ({
 
     const localParticipant = useSelector(getLocalParticipant);
     const _isModerator = Boolean(localParticipant?.role === PARTICIPANT_ROLE.MODERATOR);
-    const _isAudioForceMuted = useSelector<IState>(state =>
+    const _isAudioForceMuted = useSelector<IReduxState>(state =>
         isForceMuted(participant, MEDIA_TYPE.AUDIO, state));
-    const _isVideoForceMuted = useSelector<IState>(state =>
+    const _isVideoForceMuted = useSelector<IReduxState>(state =>
         isForceMuted(participant, MEDIA_TYPE.VIDEO, state));
-    const _isAudioMuted = useSelector((state: IState) => isParticipantAudioMuted(participant, state));
+    const _isAudioMuted = useSelector((state: IReduxState) => isParticipantAudioMuted(participant, state));
     const _overflowDrawer: boolean = useSelector(showOverflowDrawer);
     const { remoteVideoMenu = {}, disableRemoteMute, startSilent }
-        = useSelector((state: IState) => state['features/base/config']);
+        = useSelector((state: IReduxState) => state['features/base/config']);
     const { disableKick, disableGrantModerator, disablePrivateChat } = remoteVideoMenu;
-    const { participantsVolume } = useSelector((state: IState) => state['features/filmstrip']);
+    const { participantsVolume } = useSelector((state: IReduxState) => state['features/filmstrip']);
     const _volume = (participant?.local ?? true ? undefined
         : participant?.id ? participantsVolume[participant?.id] : undefined) ?? 1;
     const isBreakoutRoom = useSelector(isInBreakoutRoom);
-    const isModerationSupported = useSelector((state: IState) => isAvModerationSupported()(state));
+    const isModerationSupported = useSelector((state: IReduxState) => isAvModerationSupported()(state));
     const stageFilmstrip = useSelector(isStageFilmstripAvailable);
 
     const _currentRoomId = useSelector(getCurrentRoomId);
diff --git a/react/features/video-menu/components/web/RemoteVideoMenuTriggerButton.tsx b/react/features/video-menu/components/web/RemoteVideoMenuTriggerButton.tsx
index 88c6e71bc..39d54bc0b 100644
--- a/react/features/video-menu/components/web/RemoteVideoMenuTriggerButton.tsx
+++ b/react/features/video-menu/components/web/RemoteVideoMenuTriggerButton.tsx
@@ -4,12 +4,12 @@ import React, { Component } from 'react';
 import { WithTranslation } from 'react-i18next';
 import { batch, connect } from 'react-redux';
 
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { isMobileBrowser } from '../../../base/environment/utils';
 import { translate } from '../../../base/i18n/functions';
 import { IconHorizontalPoints } from '../../../base/icons/svg';
 import { getLocalParticipant, getParticipantById } from '../../../base/participants/functions';
-import { Participant } from '../../../base/participants/types';
+import { IParticipant } from '../../../base/participants/types';
 // @ts-ignore
 import { Popover } from '../../../base/popover';
 import { setParticipantContextMenuOpen } from '../../../base/responsive-ui/actions';
@@ -30,7 +30,7 @@ import { REMOTE_CONTROL_MENU_STATES } from './RemoteControlButton';
  * The type of the React {@code Component} props of
  * {@link RemoteVideoMenuTriggerButton}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Whether the remote video context menu is disabled.
@@ -57,7 +57,7 @@ interface Props extends WithTranslation {
     /**
      * Participant reference.
      */
-    _participant: Participant;
+    _participant: IParticipant;
 
     /**
      * The ID for the participant on which the remote video menu will act.
@@ -138,7 +138,7 @@ const styles = () => {
  *
  * @augments {Component}
  */
-class RemoteVideoMenuTriggerButton extends Component<Props> {
+class RemoteVideoMenuTriggerButton extends Component<IProps> {
 
     /**
      * Initializes a new RemoteVideoMenuTriggerButton instance.
@@ -146,7 +146,7 @@ class RemoteVideoMenuTriggerButton extends Component<Props> {
      * @param {Object} props - The read-only React Component props with which
      * the new instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this._onPopoverClose = this._onPopoverClose.bind(this);
@@ -269,9 +269,9 @@ class RemoteVideoMenuTriggerButton extends Component<Props> {
  * @param {Object} state - The Redux state.
  * @param {Object} ownProps - The own props of the component.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function _mapStateToProps(state: IState, ownProps: Partial<Props>) {
+function _mapStateToProps(state: IReduxState, ownProps: Partial<IProps>) {
     const { participantID, thumbnailType } = ownProps;
     let _remoteControlState = null;
     const localParticipantId = getLocalParticipant(state)?.id;
diff --git a/react/features/video-menu/components/web/VolumeSlider.tsx b/react/features/video-menu/components/web/VolumeSlider.tsx
index ef9935eed..744f2191c 100644
--- a/react/features/video-menu/components/web/VolumeSlider.tsx
+++ b/react/features/video-menu/components/web/VolumeSlider.tsx
@@ -12,7 +12,7 @@ import { VOLUME_SLIDER_SCALE } from '../../constants';
 /**
  * The type of the React {@code Component} props of {@link VolumeSlider}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * An object containing the CSS classes.
@@ -88,14 +88,14 @@ const styles = (theme: Theme) => {
  *
  * @augments Component
  */
-class VolumeSlider extends Component<Props, State> {
+class VolumeSlider extends Component<IProps, State> {
     /**
      * Initializes a new {@code VolumeSlider} instance.
      *
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         this.state = {
diff --git a/react/features/video-quality/components/VideoQualitySlider.web.tsx b/react/features/video-quality/components/VideoQualitySlider.web.tsx
index 5ceb2aee3..705e68010 100644
--- a/react/features/video-quality/components/VideoQualitySlider.web.tsx
+++ b/react/features/video-quality/components/VideoQualitySlider.web.tsx
@@ -6,7 +6,7 @@ import { WithTranslation } from 'react-i18next';
 
 import { createToolbarEvent } from '../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../analytics/functions';
-import { IState, IStore } from '../../app/types';
+import { IReduxState, IStore } from '../../app/types';
 import { setAudioOnly } from '../../base/audio-only/actions';
 import { translate } from '../../base/i18n/functions';
 import { setLastN } from '../../base/lastn/actions';
@@ -47,7 +47,7 @@ const createEvent = function(quality: string) {
 /**
  * The type of the React {@code Component} props of {@link VideoQualitySlider}.
  */
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Whether or not the conference is in audio only mode.
@@ -118,7 +118,7 @@ const styles = (theme: Theme) => {
  *
  * @augments Component
  */
-class VideoQualitySlider extends Component<Props> {
+class VideoQualitySlider extends Component<IProps> {
     _sliderOptions: Array<Object>;
 
     /**
@@ -127,7 +127,7 @@ class VideoQualitySlider extends Component<Props> {
      * @param {Object} props - The read-only React Component props with which
      * the new instance is to be initialized.
      */
-    constructor(props: Props) {
+    constructor(props: IProps) {
         super(props);
 
         // Bind event handlers so they are only bound once for every instance.
@@ -358,9 +358,9 @@ class VideoQualitySlider extends Component<Props> {
  *
  * @param {Object} state - The Redux state.
  * @private
- * @returns {Props}
+ * @returns {IProps}
  */
-function _mapStateToProps(state: IState) {
+function _mapStateToProps(state: IReduxState) {
     const { enabled: audioOnly } = state['features/base/audio-only'];
     const { p2p } = state['features/base/conference'];
     const { preferredVideoQuality } = state['features/video-quality'];
diff --git a/react/features/videosipgw/middleware.ts b/react/features/videosipgw/middleware.ts
index 9479ea46d..d16ea0ba0 100644
--- a/react/features/videosipgw/middleware.ts
+++ b/react/features/videosipgw/middleware.ts
@@ -18,7 +18,7 @@ import {
     SIP_GW_INVITE_ROOMS
 } from './actionTypes';
 import logger from './logger';
-import { SipRoom, SipSessionChangedEvent } from './types';
+import { ISipRoom, ISipSessionChangedEvent } from './types';
 
 /**
  * Middleware that captures conference video sip gw events and stores
@@ -44,7 +44,7 @@ MiddlewareRegistry.register(({ dispatch }) => next => action => {
             (...args) => dispatch(_availabilityChanged(...args)));
         conference.on(
             JitsiConferenceEvents.VIDEO_SIP_GW_SESSION_STATE_CHANGED,
-            (event: SipSessionChangedEvent) => {
+            (event: ISipSessionChangedEvent) => {
                 const toDispatch = _sessionStateChanged(event);
 
                 // sessionStateChanged can decide there is nothing to dispatch
@@ -91,7 +91,7 @@ function _availabilityChanged(status: string) {
  * @private
  * @returns {void}
  */
-function _inviteRooms(rooms: SipRoom[], conference: IJitsiConference, dispatch: IStore['dispatch']) {
+function _inviteRooms(rooms: ISipRoom[], conference: IJitsiConference, dispatch: IStore['dispatch']) {
     for (const room of rooms) {
         const { id: sipAddress, name: displayName } = room;
 
@@ -144,7 +144,7 @@ function _inviteRooms(rooms: SipRoom[], conference: IJitsiConference, dispatch:
  * @private
  */
 function _sessionStateChanged(
-        event: SipSessionChangedEvent) {
+        event: ISipSessionChangedEvent) {
     switch (event.newState) {
     case JitsiSIPVideoGWStatus.STATE_PENDING: {
         return showNotification({
diff --git a/react/features/videosipgw/types.ts b/react/features/videosipgw/types.ts
index c55d45d77..d64a3680f 100644
--- a/react/features/videosipgw/types.ts
+++ b/react/features/videosipgw/types.ts
@@ -1,9 +1,9 @@
-export interface SipRoom {
+export interface ISipRoom {
     id: string;
     name: string;
 }
 
-export interface SipSessionChangedEvent {
+export interface ISipSessionChangedEvent {
     displayName: string;
     failureReason: string;
     newState: string;
diff --git a/react/features/virtual-background/actions.ts b/react/features/virtual-background/actions.ts
index af4ed4fc9..dc9dbb4ee 100644
--- a/react/features/virtual-background/actions.ts
+++ b/react/features/virtual-background/actions.ts
@@ -5,7 +5,7 @@ import { createVirtualBackgroundEffect } from '../stream-effects/virtual-backgro
 
 import { BACKGROUND_ENABLED, SET_VIRTUAL_BACKGROUND } from './actionTypes';
 import logger from './logger';
-import { VirtualBackgroundOptions } from './types';
+import { IVirtualBackgroundOptions } from './types';
 
 /**
  * Signals the local participant activate the virtual background video or not.
@@ -14,7 +14,7 @@ import { VirtualBackgroundOptions } from './types';
  * @param {Object} jitsiTrack - Represents the jitsi track that will have backgraund effect applied.
  * @returns {Promise}
  */
-export function toggleBackgroundEffect(options: VirtualBackgroundOptions, jitsiTrack: any) {
+export function toggleBackgroundEffect(options: IVirtualBackgroundOptions, jitsiTrack: any) {
     return async function(dispatch: IStore['dispatch'], getState: IStore['getState']) {
         await dispatch(backgroundEnabled(options.enabled));
         await dispatch(setVirtualBackground(options));
@@ -48,7 +48,7 @@ export function toggleBackgroundEffect(options: VirtualBackgroundOptions, jitsiT
  *     type: string,
  * }}
  */
-export function setVirtualBackground(options?: VirtualBackgroundOptions) {
+export function setVirtualBackground(options?: IVirtualBackgroundOptions) {
     return {
         type: SET_VIRTUAL_BACKGROUND,
         virtualSource: options?.url,
diff --git a/react/features/virtual-background/components/UploadImageButton.tsx b/react/features/virtual-background/components/UploadImageButton.tsx
index e4d0e5532..3fd8e16c2 100644
--- a/react/features/virtual-background/components/UploadImageButton.tsx
+++ b/react/features/virtual-background/components/UploadImageButton.tsx
@@ -11,7 +11,7 @@ import { type Image, VIRTUAL_BACKGROUND_TYPE } from '../constants';
 import { resizeImage } from '../functions';
 import logger from '../logger';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * Callback used to set the 'loading' state of the parent component.
@@ -74,7 +74,7 @@ function UploadImageButton({
     showLabel,
     storedImages,
     t
-}: Props) {
+}: IProps) {
     const { classes } = useStyles();
     const uploadImageButton = useRef<HTMLInputElement>(null);
     const uploadImageKeyPress = useCallback(e => {
diff --git a/react/features/virtual-background/components/VirtualBackgroundDialog.tsx b/react/features/virtual-background/components/VirtualBackgroundDialog.tsx
index 499679cdc..9b5544e21 100644
--- a/react/features/virtual-background/components/VirtualBackgroundDialog.tsx
+++ b/react/features/virtual-background/components/VirtualBackgroundDialog.tsx
@@ -9,7 +9,7 @@ import React, { useCallback, useEffect, useState } from 'react';
 import { WithTranslation } from 'react-i18next';
 import { makeStyles } from 'tss-react/mui';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { getMultipleVideoSendingSupportFeatureFlag } from '../../base/config/functions.any';
 import { hideDialog } from '../../base/dialog/actions';
 import { translate } from '../../base/i18n/functions';
@@ -30,7 +30,7 @@ import UploadImageButton from './UploadImageButton';
 // @ts-ignore
 import VirtualBackgroundPreview from './VirtualBackgroundPreview';
 
-interface Props extends WithTranslation {
+interface IProps extends WithTranslation {
 
     /**
      * The list of Images to choose from.
@@ -94,7 +94,7 @@ const onError = (event: any) => {
  * @private
  * @returns {{Props}}
  */
-function _mapStateToProps(state: IState): Object {
+function _mapStateToProps(state: IReduxState): Object {
     const { localFlipX } = state['features/base/settings'];
     const dynamicBrandingImages = state['features/dynamic-branding'].virtualBackgrounds;
     const hasBrandingImages = Boolean(dynamicBrandingImages.length);
@@ -281,7 +281,7 @@ function VirtualBackground({
     dispatch,
     initialOptions,
     t
-}: Props) {
+}: IProps) {
     const { classes, cx } = useStyles();
     const [ previewIsLoaded, setPreviewIsLoaded ] = useState(false);
     const [ options, setOptions ] = useState<any>({ ...initialOptions });
diff --git a/react/features/virtual-background/components/VirtualBackgroundPreview.tsx b/react/features/virtual-background/components/VirtualBackgroundPreview.tsx
index 15d38e6f8..acd615a75 100644
--- a/react/features/virtual-background/components/VirtualBackgroundPreview.tsx
+++ b/react/features/virtual-background/components/VirtualBackgroundPreview.tsx
@@ -5,7 +5,7 @@ import React, { PureComponent } from 'react';
 import { WithTranslation } from 'react-i18next';
 import { connect } from 'react-redux';
 
-import { IState } from '../../app/types';
+import { IReduxState } from '../../app/types';
 import { hideDialog } from '../../base/dialog/actions';
 import { translate } from '../../base/i18n/functions';
 // eslint-disable-next-line lines-around-comment
@@ -324,7 +324,7 @@ class VirtualBackgroundPreview extends PureComponent<Props, State> {
  * @private
  * @returns {{Props}}
  */
-function _mapStateToProps(state: IState) {
+function _mapStateToProps(state: IReduxState) {
     return {
         _currentCameraDeviceId: getCurrentCameraDeviceId(state)
     };
diff --git a/react/features/virtual-background/types.ts b/react/features/virtual-background/types.ts
index dac3c2dbc..6f2c5b013 100644
--- a/react/features/virtual-background/types.ts
+++ b/react/features/virtual-background/types.ts
@@ -1,6 +1,6 @@
 import { IVirtualBackground } from './reducer';
 
-export interface VirtualBackgroundOptions extends IVirtualBackground {
+export interface IVirtualBackgroundOptions extends IVirtualBackground {
     enabled: boolean;
     url?: string;
 }
diff --git a/react/features/whiteboard/actions.ts b/react/features/whiteboard/actions.ts
index beb46cd65..21bd7ca0b 100644
--- a/react/features/whiteboard/actions.ts
+++ b/react/features/whiteboard/actions.ts
@@ -3,7 +3,7 @@ import {
     SETUP_WHITEBOARD,
     SET_WHITEBOARD_OPEN
 } from './actionTypes';
-import { WhiteboardAction } from './reducer';
+import { IWhiteboardAction } from './reducer';
 
 /**
  * Configures the whiteboard collaboration details.
@@ -16,7 +16,7 @@ import { WhiteboardAction } from './reducer';
  */
 export const setupWhiteboard = ({ collabDetails }: {
     collabDetails: { roomId: string; roomKey: string; };
-}): WhiteboardAction => {
+}): IWhiteboardAction => {
     return {
         type: SETUP_WHITEBOARD,
         collabDetails
@@ -31,7 +31,7 @@ export const setupWhiteboard = ({ collabDetails }: {
  *     type: RESET_WHITEBOARD
  * }}
  */
-export const resetWhiteboard = (): WhiteboardAction => {
+export const resetWhiteboard = (): IWhiteboardAction => {
     return { type: RESET_WHITEBOARD };
 };
 
@@ -44,7 +44,7 @@ export const resetWhiteboard = (): WhiteboardAction => {
  *      isOpen
  * }}
  */
-export const setWhiteboardOpen = (isOpen: boolean): WhiteboardAction => {
+export const setWhiteboardOpen = (isOpen: boolean): IWhiteboardAction => {
     return {
         type: SET_WHITEBOARD_OPEN,
         isOpen
diff --git a/react/features/whiteboard/components/web/Whiteboard.tsx b/react/features/whiteboard/components/web/Whiteboard.tsx
index 2bf1f34c3..e243c3fa8 100644
--- a/react/features/whiteboard/components/web/Whiteboard.tsx
+++ b/react/features/whiteboard/components/web/Whiteboard.tsx
@@ -6,7 +6,7 @@ import { useSelector } from 'react-redux';
 
 // @ts-expect-error
 import Filmstrip from '../../../../../modules/UI/videolayout/Filmstrip';
-import { IState } from '../../../app/types';
+import { IReduxState } from '../../../app/types';
 import { getLocalParticipant } from '../../../base/participants/functions';
 // @ts-ignore
 import { getVerticalViewMaxWidth } from '../../../filmstrip/functions.web';
@@ -49,12 +49,12 @@ const Whiteboard: () => JSX.Element = () => {
     const isOpen = useSelector(isWhiteboardOpen);
     const isVisible = useSelector(isWhiteboardVisible);
     const isInTileView = useSelector(shouldDisplayTileView);
-    const { clientHeight, clientWidth } = useSelector((state: IState) => state['features/base/responsive-ui']);
-    const { visible: filmstripVisible, isResizing } = useSelector((state: IState) => state['features/filmstrip']);
+    const { clientHeight, clientWidth } = useSelector((state: IReduxState) => state['features/base/responsive-ui']);
+    const { visible: filmstripVisible, isResizing } = useSelector((state: IReduxState) => state['features/filmstrip']);
     const filmstripWidth: number = useSelector(getVerticalViewMaxWidth);
     const collabDetails = useSelector(getCollabDetails);
     const collabServerUrl = useSelector(getCollabServerUrl);
-    const { defaultRemoteDisplayName } = useSelector((state: IState) => state['features/base/config']);
+    const { defaultRemoteDisplayName } = useSelector((state: IReduxState) => state['features/base/config']);
     const localParticipantName = useSelector(getLocalParticipant)?.name || defaultRemoteDisplayName || 'Fellow Jitster';
 
     useEffect(() => {
diff --git a/react/features/whiteboard/components/web/WhiteboardButton.tsx b/react/features/whiteboard/components/web/WhiteboardButton.tsx
index 7f04f0a67..7265a11da 100644
--- a/react/features/whiteboard/components/web/WhiteboardButton.tsx
+++ b/react/features/whiteboard/components/web/WhiteboardButton.tsx
@@ -1,5 +1,5 @@
 /* eslint-disable lines-around-comment */
-import { IState, IStore } from '../../../app/types';
+import { IReduxState, IStore } from '../../../app/types';
 import { translate } from '../../../base/i18n/functions';
 import { IconHideWhiteboard, IconShowWhiteboard } from '../../../base/icons/svg';
 import { connect } from '../../../base/redux/functions';
@@ -71,7 +71,7 @@ class WhiteboardButton extends AbstractButton<Props, any, any> {
  * @private
  * @returns {Props}
  */
-function _mapStateToProps(state: IState) {
+function _mapStateToProps(state: IReduxState) {
     return {
         _toggled: isWhiteboardVisible(state)
     };
diff --git a/react/features/whiteboard/functions.ts b/react/features/whiteboard/functions.ts
index 07de0484a..6d883b5a5 100644
--- a/react/features/whiteboard/functions.ts
+++ b/react/features/whiteboard/functions.ts
@@ -1,7 +1,7 @@
 import md5 from 'js-md5';
 
 import { getPinnedParticipant } from '../../features/base/participants/functions';
-import { IState } from '../app/types';
+import { IReduxState } from '../app/types';
 import { getCurrentConference } from '../base/conference/functions';
 import { getRemoteParticipants, isLocalParticipantModerator } from '../base/participants/functions';
 import { appendURLParam } from '../base/util/uri';
@@ -10,15 +10,15 @@ import { getCurrentRoomId, isInBreakoutRoom } from '../breakout-rooms/functions'
 import { WHITEBOARD_ID } from './constants';
 import { IWhiteboardState } from './reducer';
 
-const getWhiteboardState = (state: IState): IWhiteboardState => state['features/whiteboard'];
+const getWhiteboardState = (state: IReduxState): IWhiteboardState => state['features/whiteboard'];
 
 /**
  * Indicates whether the whiteboard is enabled in the config.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export const isWhiteboardEnabled = (state: IState): boolean =>
+export const isWhiteboardEnabled = (state: IReduxState): boolean =>
     state['features/base/config'].whiteboard?.enabled
     && state['features/base/config'].whiteboard?.collabServerBaseUrl
     && getCurrentConference(state)?.getMetadataHandler()
@@ -27,45 +27,45 @@ export const isWhiteboardEnabled = (state: IState): boolean =>
 /**
  * Indicates whether the whiteboard is open.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export const isWhiteboardOpen = (state: IState): boolean => getWhiteboardState(state).isOpen;
+export const isWhiteboardOpen = (state: IReduxState): boolean => getWhiteboardState(state).isOpen;
 
 /**
  * Indicates whether the whiteboard button is visible.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export const isWhiteboardButtonVisible = (state: IState): boolean =>
+export const isWhiteboardButtonVisible = (state: IReduxState): boolean =>
     isWhiteboardEnabled(state) && (isLocalParticipantModerator(state) || isWhiteboardOpen(state));
 
 /**
  * Indicates whether the whiteboard is present as a meeting participant.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export const isWhiteboardPresent = (state: IState): boolean => getRemoteParticipants(state).has(WHITEBOARD_ID);
+export const isWhiteboardPresent = (state: IReduxState): boolean => getRemoteParticipants(state).has(WHITEBOARD_ID);
 
 /**
  * Returns the whiteboard collaboration details.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {{ roomId: string, roomKey: string}|undefined}
  */
-export const getCollabDetails = (state: IState): {
+export const getCollabDetails = (state: IReduxState): {
     roomId: string; roomKey: string;
 } | undefined => getWhiteboardState(state).collabDetails;
 
 /**
  * Returns the whiteboard collaboration server url.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {string}
  */
-export const getCollabServerUrl = (state: IState): string | undefined => {
+export const getCollabServerUrl = (state: IReduxState): string | undefined => {
     const collabServerBaseUrl = state['features/base/config'].whiteboard?.collabServerBaseUrl;
 
     if (!collabServerBaseUrl) {
@@ -83,9 +83,9 @@ export const getCollabServerUrl = (state: IState): string | undefined => {
 /**
  * Whether the whiteboard is visible on stage.
  *
- * @param {IState} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @returns {boolean}
  */
-export const isWhiteboardVisible = (state: IState): boolean =>
+export const isWhiteboardVisible = (state: IReduxState): boolean =>
     getPinnedParticipant(state)?.id === WHITEBOARD_ID
     || state['features/large-video'].participantId === WHITEBOARD_ID;
diff --git a/react/features/whiteboard/reducer.ts b/react/features/whiteboard/reducer.ts
index 65a79fb83..880e08245 100644
--- a/react/features/whiteboard/reducer.ts
+++ b/react/features/whiteboard/reducer.ts
@@ -21,7 +21,7 @@ const DEFAULT_STATE: IWhiteboardState = {
     isOpen: false
 };
 
-export interface WhiteboardAction extends Partial<IWhiteboardState> {
+export interface IWhiteboardAction extends Partial<IWhiteboardState> {
 
     /**
      * The whiteboard collaboration details.
@@ -36,7 +36,7 @@ export interface WhiteboardAction extends Partial<IWhiteboardState> {
 
 ReducerRegistry.register(
     'features/whiteboard',
-    (state: IWhiteboardState = DEFAULT_STATE, action: WhiteboardAction) => {
+    (state: IWhiteboardState = DEFAULT_STATE, action: IWhiteboardAction) => {
         switch (action.type) {
         case SETUP_WHITEBOARD: {
             return {