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

react/features/base/conference/reducer.ts

@@ -68,6 +68,7 @@ export interface IJitsiConference {
     removeTrack: Function;
     replaceTrack: Function;
     sendCommand: Function;
+    sendCommandOnce: Function;
     sendEndpointMessage: Function;
     sendFeedback: Function;
     sendLobbyMessage: Function;

react/features/security/actions.ts

@@ -1,7 +1,7 @@
-// @flow
-
-import { toggleDialog } from '../base/dialog';
+import { IStore } from '../app/types';
+import { toggleDialog } from '../base/dialog/actions';
 
+// @ts-ignore
 import { SecurityDialog } from './components/security-dialog';
 
 /**
@@ -10,7 +10,7 @@ import { SecurityDialog } from './components/security-dialog';
  * @returns {Function}
  */
 export function toggleSecurityDialog() {
-    return function(dispatch: (Object) => Object) {
+    return function(dispatch: IStore['dispatch']) {
         dispatch(toggleDialog(SecurityDialog));
     };
 }

react/features/share-room/actions.ts

@@ -1,6 +1,5 @@
-/* @flow */
-
-import { getInviteURL } from '../base/connection';
+import { IStore } from '../app/types';
+import { getInviteURL } from '../base/connection/functions';
 
 import { BEGIN_SHARE_ROOM, END_SHARE_ROOM } from './actionTypes';
 
@@ -11,8 +10,8 @@ import { BEGIN_SHARE_ROOM, END_SHARE_ROOM } from './actionTypes';
  * @public
  * @returns {Function}
  */
-export function beginShareRoom(roomURL: ?string): Function {
-    return (dispatch, getState) => {
+export function beginShareRoom(roomURL?: string) {
+    return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
         if (!roomURL) {
             // eslint-disable-next-line no-param-reassign
             roomURL = getInviteURL(getState);
@@ -37,7 +36,7 @@ export function beginShareRoom(roomURL: ?string): Function {
  *     shared: boolean
  * }}
  */
-export function endShareRoom(roomURL: string, shared: boolean): Object {
+export function endShareRoom(roomURL: string, shared: boolean) {
     return {
         type: END_SHARE_ROOM,
         roomURL,

react/features/share-room/logger.ts

@@ -1,5 +1,3 @@
-// @flow
-
 import { getLogger } from '../base/logging/functions';
 
 export default getLogger('features/share-room');

react/features/shared-video/actions.any.ts

@@ -1,9 +1,12 @@
-import { getCurrentConference } from '../base/conference';
+import { IStore } from '../app/types';
+import { getCurrentConference } from '../base/conference/functions';
 import { openDialog } from '../base/dialog/actions';
-import { getLocalParticipant } from '../base/participants';
-import { SharedVideoDialog } from '../shared-video/components';
+import { getLocalParticipant } from '../base/participants/functions';
 
 import { RESET_SHARED_VIDEO_STATUS, SET_SHARED_VIDEO_STATUS } from './actionTypes';
+// eslint-disable-next-line lines-around-comment
+// @ts-ignore
+import { SharedVideoDialog } from './components';
 
 /**
  * Resets the status of the shared video.
@@ -37,7 +40,9 @@ export function resetSharedVideoStatus() {
  *     videoUrl: string,
  * }}
  */
-export function setSharedVideoStatus({ videoUrl, status, time, ownerId, muted }) {
+export function setSharedVideoStatus({ videoUrl, status, time, ownerId, muted }: {
+    muted?: boolean; ownerId?: string; status: string; time: number; videoUrl: string;
+}) {
     return {
         type: SET_SHARED_VIDEO_STATUS,
         ownerId,
@@ -54,7 +59,7 @@ export function setSharedVideoStatus({ videoUrl, status, time, ownerId, muted })
  * @param {Function} onPostSubmit - The function to be invoked when a valid link is entered.
  * @returns {Function}
  */
-export function showSharedVideoDialog(onPostSubmit) {
+export function showSharedVideoDialog(onPostSubmit: Function) {
     return openDialog(SharedVideoDialog, { onPostSubmit });
 }
 
@@ -65,12 +70,12 @@ export function showSharedVideoDialog(onPostSubmit) {
  * @returns {Function}
  */
 export function stopSharedVideo() {
-    return (dispatch, getState) => {
+    return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
         const state = getState();
         const { ownerId } = state['features/shared-video'];
         const localParticipant = getLocalParticipant(state);
 
-        if (ownerId === localParticipant.id) {
+        if (ownerId === localParticipant?.id) {
             dispatch(resetSharedVideoStatus());
         }
     };
@@ -84,8 +89,8 @@ export function stopSharedVideo() {
  *
  * @returns {Function}
  */
-export function playSharedVideo(videoUrl) {
-    return (dispatch, getState) => {
+export function playSharedVideo(videoUrl: string) {
+    return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
         const conference = getCurrentConference(getState());
 
         if (conference) {
@@ -95,7 +100,7 @@ export function playSharedVideo(videoUrl) {
                 videoUrl,
                 status: 'start',
                 time: 0,
-                ownerId: localParticipant.id
+                ownerId: localParticipant?.id
             }));
         }
     };
@@ -108,14 +113,14 @@ export function playSharedVideo(videoUrl) {
  * @returns {Function}
  */
 export function toggleSharedVideo() {
-    return (dispatch, getState) => {
+    return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
         const state = getState();
-        const { status } = state['features/shared-video'];
+        const { status = '' } = state['features/shared-video'];
 
         if ([ 'playing', 'start', 'pause' ].includes(status)) {
             dispatch(stopSharedVideo());
         } else {
-            dispatch(showSharedVideoDialog(id => dispatch(playSharedVideo(id))));
+            dispatch(showSharedVideoDialog((id: string) => dispatch(playSharedVideo(id))));
         }
     };
 }

react/features/shared-video/actions.web.ts

@@ -1,5 +1,3 @@
-// @flow
-
 import { SET_DISABLE_BUTTON } from './actionTypes';
 
 export * from './actions.any';

react/features/shared-video/middleware.any.ts

@@ -1,20 +1,15 @@
-// @flow
-
 import { batch } from 'react-redux';
 
+import { IStore } from '../app/types';
 import { CONFERENCE_JOIN_IN_PROGRESS, CONFERENCE_LEFT } from '../base/conference/actionTypes';
 import { getCurrentConference } from '../base/conference/functions';
-import { MEDIA_TYPE } from '../base/media';
-import {
-    PARTICIPANT_LEFT,
-    getLocalParticipant,
-    getParticipantById,
-    participantJoined,
-    participantLeft,
-    pinParticipant
-} from '../base/participants';
+import { IJitsiConference } from '../base/conference/reducer';
+import { MEDIA_TYPE } from '../base/media/constants';
+import { PARTICIPANT_LEFT } from '../base/participants/actionTypes';
+import { participantJoined, participantLeft, pinParticipant } from '../base/participants/actions';
+import { getLocalParticipant, getParticipantById } from '../base/participants/functions';
 import { FakeParticipant } from '../base/participants/types';
-import { MiddlewareRegistry } from '../base/redux';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
 
 import { RESET_SHARED_VIDEO_STATUS, SET_SHARED_VIDEO_STATUS } from './actionTypes';
 import {
@@ -26,8 +21,6 @@ import { isSharingStatus } from './functions';
 import logger from './logger';
 
 
-declare var APP: Object;
-
 /**
  * Middleware that captures actions related to video sharing and updates
  * components not hooked into redux.
@@ -45,7 +38,8 @@ MiddlewareRegistry.register(store => next => action => {
         const localParticipantId = getLocalParticipant(state)?.id;
 
         conference.addCommandListener(SHARED_VIDEO,
-            ({ value, attributes }) => {
+            ({ value, attributes }: { attributes: {
+                from: string; muted: string; state: string; time: string; }; value: string; }) => {
 
                 const { from } = attributes;
                 const sharedVideoStatus = attributes.state;
@@ -77,7 +71,7 @@ MiddlewareRegistry.register(store => next => action => {
         if (action.participant.id === stateOwnerId) {
             batch(() => {
                 dispatch(resetSharedVideoStatus());
-                dispatch(participantLeft(statevideoUrl, conference));
+                dispatch(participantLeft(statevideoUrl ?? '', conference));
             });
         }
         break;
@@ -126,7 +120,7 @@ MiddlewareRegistry.register(store => next => action => {
 
             sendShareVideoCommand({
                 conference,
-                id: statevideoUrl,
+                id: statevideoUrl ?? '',
                 localParticipantId,
                 muted: true,
                 status: 'stop',
@@ -152,10 +146,12 @@ MiddlewareRegistry.register(store => next => action => {
  * @param {JitsiConference} conference - The current conference.
  * @returns {void}
  */
-function handleSharingVideoStatus(store, videoUrl, { state, time, from, muted }, conference) {
+function handleSharingVideoStatus(store: IStore, videoUrl: string,
+        { state, time, from, muted }: { from: string; muted: string; state: string; time: string; },
+        conference: IJitsiConference) {
     const { dispatch, getState } = store;
-    const localParticipantId = getLocalParticipant(getState()).id;
-    const oldStatus = getState()['features/shared-video']?.status;
+    const localParticipantId = getLocalParticipant(getState())?.id;
+    const oldStatus = getState()['features/shared-video']?.status ?? '';
 
     if (state === 'start' || ![ 'playing', 'pause', 'start' ].includes(oldStatus)) {
         const youtubeId = videoUrl.match(/http/) ? false : videoUrl;
@@ -195,7 +191,10 @@ function handleSharingVideoStatus(store, videoUrl, { state, time, from, muted },
  * @param {string} time - The seek position of the video.
  * @returns {void}
  */
-function sendShareVideoCommand({ id, status, conference, localParticipantId, time, muted, volume }) {
+function sendShareVideoCommand({ id, status, conference, localParticipantId = '', time, muted, volume }: {
+    conference: IJitsiConference; id: string; localParticipantId?: string; muted: boolean;
+    status: string; time: number; volume: number;
+}) {
     conference.sendCommandOnce(SHARED_VIDEO, {
         value: id,
         attributes: {

react/features/shared-video/middleware.web.ts

@@ -1,8 +1,6 @@
-// @flow
-
 import { CONFERENCE_JOIN_IN_PROGRESS } from '../base/conference/actionTypes';
-import { getLocalParticipant } from '../base/participants';
-import { MiddlewareRegistry } from '../base/redux';
+import { getLocalParticipant } from '../base/participants/functions';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
 
 import { setDisableButton } from './actions.web';
 import { SHARED_VIDEO } from './constants';
@@ -17,7 +15,8 @@ MiddlewareRegistry.register(({ dispatch, getState }) => next => action => {
     case CONFERENCE_JOIN_IN_PROGRESS: {
         const { conference } = action;
 
-        conference.addCommandListener(SHARED_VIDEO, ({ attributes }) => {
+        conference.addCommandListener(SHARED_VIDEO, ({ attributes }: { attributes:
+            { from: string; state: string; }; }) => {
             const { from } = attributes;
             const status = attributes.state;
 

react/features/talk-while-muted/actions.ts

@@ -1,5 +1,3 @@
-// @flow
-
 import { SET_CURRENT_NOTIFICATION_UID } from './actionTypes';
 
 /**
@@ -13,7 +11,7 @@ import { SET_CURRENT_NOTIFICATION_UID } from './actionTypes';
  *     uid: number
  * }}
  */
-export function setCurrentNotificationUid(uid: ?number) {
+export function setCurrentNotificationUid(uid?: string) {
     return {
         type: SET_CURRENT_NOTIFICATION_UID,
         uid

react/features/talk-while-muted/middleware.ts

@@ -1,17 +1,14 @@
-// @flow
-
-import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../base/app';
-import { CONFERENCE_JOINED } from '../base/conference';
+import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../base/app/actionTypes';
+import { CONFERENCE_JOINED } from '../base/conference/actionTypes';
 import { JitsiConferenceEvents } from '../base/lib-jitsi-meet';
-import { MEDIA_TYPE, setAudioMuted } from '../base/media';
-import { getLocalParticipant, raiseHand } from '../base/participants';
-import { MiddlewareRegistry } from '../base/redux';
-import { playSound, registerSound, unregisterSound } from '../base/sounds';
-import {
-    NOTIFICATION_TIMEOUT_TYPE,
-    hideNotification,
-    showNotification
-} from '../notifications';
+import { setAudioMuted } from '../base/media/actions';
+import { MEDIA_TYPE } from '../base/media/constants';
+import { raiseHand } from '../base/participants/actions';
+import { getLocalParticipant } from '../base/participants/functions';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
+import { playSound, registerSound, unregisterSound } from '../base/sounds/actions';
+import { hideNotification, showNotification } from '../notifications/actions';
+import { NOTIFICATION_TIMEOUT_TYPE } from '../notifications/constants';
 import { isForceMuted } from '../participants-pane/functions';
 import { isAudioMuteButtonDisabled } from '../toolbox/functions.any';
 
@@ -35,7 +32,7 @@ MiddlewareRegistry.register(store => next => action => {
     case CONFERENCE_JOINED: {
         conference.on(
             JitsiConferenceEvents.TRACK_MUTE_CHANGED,
-            track => {
+            (track: any) => {
                 const { currentNotificationUid } = getState()['features/talk-while-muted'];
 
                 if (currentNotificationUid && track.isAudioTrack() && track.isLocal() && !track.isMuted()) {

react/features/talk-while-muted/reducer.ts

@@ -4,7 +4,7 @@ import { set } from '../base/redux/functions';
 import { SET_CURRENT_NOTIFICATION_UID } from './actionTypes';
 
 export interface ITalkWhileMutedState {
-    currentNotificationUid?: number;
+    currentNotificationUid?: string;
 }
 
 /**