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

globals.d.ts

@@ -24,6 +24,7 @@ declare global {
         JITSI_MEET_LITE_SDK?: boolean;
         interfaceConfig?: any;
         JitsiMeetJS?: any;
+        JitsiMeetElectron?: any;
     }
 
     const config: IConfig;

react/features/base/conference/reducer.ts

@@ -46,6 +46,7 @@ export interface IJitsiConference {
     avModerationApprove: Function;
     avModerationReject: Function;
     createVideoSIPGWSession: Function;
+    dial: Function;
     disableAVModeration: Function;
     enableAVModeration: Function;
     end: Function;
@@ -74,6 +75,7 @@ export interface IJitsiConference {
     myUserId: Function;
     off: Function;
     on: Function;
+    options: any;
     removeTrack: Function;
     replaceTrack: Function;
     room: IJitsiConferenceRoom;

react/features/base/config/configType.ts

@@ -127,6 +127,7 @@ export interface IConfig {
         preventExecution: boolean;
     }>;
     callDisplayName?: string;
+    callFlowsEnabled?: boolean;
     callStatsConfigParams?: {
         additionalIDs?: {
             customerID?: string;
@@ -344,6 +345,8 @@ export interface IConfig {
     iAmRecorder?: boolean;
     iAmSipGateway?: boolean;
     inviteAppName?: string | null;
+    inviteServiceCallFlowsUrl?: string;
+    inviteServiceUrl?: string;
     jaasActuatorUrl?: string;
     jaasFeedbackMetadataURL?: string;
     jaasTokenUrl?: string;

react/features/chrome-extension-banner/logger.js → react/features/chrome-extension-banner/logger.ts

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

react/features/desktop-picker/actions.js → react/features/desktop-picker/actions.ts

@@ -1,5 +1,6 @@
-import { openDialog } from '../base/dialog';
+import { openDialog } from '../base/dialog/actions';
 
+// @ts-ignore
 import { DesktopPicker } from './components';
 
 /**
@@ -10,7 +11,7 @@ import { DesktopPicker } from './components';
  * a DesktopCapturerSource has been chosen.
  * @returns {Object}
  */
-export function showDesktopPicker(options = {}, onSourceChoose) {
+export function showDesktopPicker(options: { desktopSharingSources?: any; } = {}, onSourceChoose: Function) {
     const { desktopSharingSources } = options;
 
     return openDialog(DesktopPicker, {

react/features/desktop-picker/functions.js → react/features/desktop-picker/functions.ts

@@ -1,4 +1,3 @@
-
 import logger from './logger';
 
 /**
@@ -11,8 +10,8 @@ import logger from './logger';
  * return native image object used for the preview image of the source.
  * @returns {Function}
  */
-export function obtainDesktopSources(types, options = {}) {
-    const capturerOptions = {
+export function obtainDesktopSources(types: string[], options: { thumbnailSize?: Object; } = {}) {
+    const capturerOptions: any = {
         types
     };
 
@@ -23,10 +22,10 @@ export function obtainDesktopSources(types, options = {}) {
     return new Promise((resolve, reject) => {
         const { JitsiMeetElectron } = window;
 
-        if (JitsiMeetElectron && JitsiMeetElectron.obtainDesktopStreams) {
+        if (JitsiMeetElectron?.obtainDesktopStreams) {
             JitsiMeetElectron.obtainDesktopStreams(
-                sources => resolve(_separateSourcesByType(sources)),
-                error => {
+                (sources: Array<{ id: string; }>) => resolve(_separateSourcesByType(sources)),
+                (error: Error) => {
                     logger.error(
                         `Error while obtaining desktop sources: ${error}`);
                     reject(error);
@@ -54,8 +53,8 @@ export function obtainDesktopSources(types, options = {}) {
  * @returns {Object} An object with the sources split into separate arrays based
  * on source type.
  */
-function _separateSourcesByType(sources = []) {
-    const sourcesByType = {
+function _separateSourcesByType(sources: Array<{ id: string; }> = []) {
+    const sourcesByType: any = {
         screen: [],
         window: []
     };

react/features/desktop-picker/logger.js → react/features/desktop-picker/logger.ts

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

react/features/invite/_utils.js → react/features/invite/_utils.ts

@@ -1,12 +1,10 @@
-// @flow
-
 /**
  * Utility class with no dependencies. Used in components that are stripped in separate bundles
  * and requires as less dependencies as possible.
  */
 
 import { getURLWithoutParams } from '../base/connection/utils';
-import { doGetJSON } from '../base/util';
+import { doGetJSON } from '../base/util/httpUtils';
 
 /**
  * Formats the conference pin in readable way for UI to display it.
@@ -49,7 +47,7 @@ export function getDialInConferenceID(
         roomName: string,
         mucURL: string,
         url: URL
-): Promise<Object> {
+): Promise<any> {
     const separator = baseUrl.includes('?') ? '&' : '?';
     const conferenceIDURL
         = `${baseUrl}${separator}conference=${roomName}@${mucURL}&url=${getURLWithoutParams(url).href}`;
@@ -75,7 +73,7 @@ export function getDialInNumbers(
         url: string,
         roomName: string,
         mucURL: string
-): Promise<*> {
+): Promise<any> {
     const separator = url.includes('?') ? '&' : '?';
 
     // when roomName and mucURL are available

react/features/invite/actions.any.js → react/features/invite/actions.any.ts

@@ -1,10 +1,7 @@
-// @flow
-
-import type { Dispatch } from 'redux';
-
-import { getInviteURL } from '../base/connection';
-import { getLocalParticipant, getParticipantCount } from '../base/participants';
-import { inviteVideoRooms } from '../videosipgw';
+import { IStore } from '../app/types';
+import { getInviteURL } from '../base/connection/functions';
+import { getLocalParticipant, getParticipantCount } from '../base/participants/functions';
+import { inviteVideoRooms } from '../videosipgw/actions';
 
 import { getDialInConferenceID, getDialInNumbers } from './_utils';
 import {
@@ -22,6 +19,7 @@ import {
     inviteSipEndpoints
 } from './functions';
 import logger from './logger';
+import { IInvitee } from './types';
 
 /**
  * Creates a (redux) action to signal that a click/tap has been performed on
@@ -64,11 +62,11 @@ export function hideAddPeopleDialog() {
  * of invitees who were not invited (i.e. Invites were not sent to them).
  */
 export function invite(
-        invitees: Array<Object>,
-        showCalleeInfo: boolean = false) {
+        invitees: IInvitee[],
+        showCalleeInfo = false) {
     return (
-            dispatch: Dispatch<any>,
-            getState: Function): Promise<Array<Object>> => {
+            dispatch: IStore['dispatch'],
+            getState: IStore['getState']): Promise<Array<Object>> => {
         const state = getState();
         const participantsCount = getParticipantCount(state);
         const { calleeInfoVisible } = state['features/invite'];
@@ -89,12 +87,12 @@ export function invite(
             return new Promise(resolve => {
                 dispatch(addPendingInviteRequest({
                     invitees,
-                    callback: failedInvitees => resolve(failedInvitees)
+                    callback: (failedInvitees: any) => resolve(failedInvitees)
                 }));
             });
         }
 
-        let allInvitePromises = [];
+        let allInvitePromises: Promise<any>[] = [];
         let invitesLeftToSend = [ ...invitees ];
 
         const {
@@ -105,8 +103,8 @@ export function invite(
         const inviteUrl = getInviteURL(state);
         const { sipInviteUrl } = state['features/base/config'];
         const { locationURL } = state['features/base/connection'];
-        const { jwt } = state['features/base/jwt'];
-        const { name: displayName } = getLocalParticipant(state);
+        const { jwt = '' } = state['features/base/jwt'];
+        const { name: displayName } = getLocalParticipant(state) ?? {};
 
         // First create all promises for dialing out.
         const phoneNumbers
@@ -123,7 +121,7 @@ export function invite(
                         = invitesLeftToSend.filter(
                             invitee => invitee !== item);
                 })
-                .catch(error =>
+                .catch((error: Error) =>
                     logger.error('Error inviting phone number:', error));
         });
 
@@ -138,8 +136,8 @@ export function invite(
             // filter all rooms and users from {@link invitesLeftToSend}.
             const peopleInvitePromise
                 = invitePeopleAndChatRooms(
-                    callFlowsEnabled
-                        ? inviteServiceCallFlowsUrl : inviteServiceUrl,
+                    (callFlowsEnabled
+                        ? inviteServiceCallFlowsUrl : inviteServiceUrl) ?? '',
                     inviteUrl,
                     jwt,
                     usersAndRooms)
@@ -173,6 +171,8 @@ export function invite(
 
         conference && inviteSipEndpoints(
             sipEndpoints,
+
+            // @ts-ignore
             locationURL,
             sipInviteUrl,
             jwt,
@@ -196,12 +196,12 @@ export function invite(
  * @returns {Function}
  */
 export function updateDialInNumbers() {
-    return (dispatch: Dispatch<any>, getState: Function) => {
+    return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
         const state = getState();
         const { dialInConfCodeUrl, dialInNumbersUrl, hosts }
             = state['features/base/config'];
         const { numbersFetched } = state['features/invite'];
-        const mucURL = hosts && hosts.muc;
+        const mucURL = hosts?.muc;
 
         if (numbersFetched || !dialInConfCodeUrl || !dialInNumbersUrl || !mucURL) {
             // URLs for fetching dial in numbers not defined
@@ -209,10 +209,10 @@ export function updateDialInNumbers() {
         }
 
         const { locationURL = {} } = state['features/base/connection'];
-        const { room } = state['features/base/conference'];
+        const { room = '' } = state['features/base/conference'];
 
         Promise.all([
-            getDialInNumbers(dialInNumbersUrl, room, mucURL),
+            getDialInNumbers(dialInNumbersUrl, room, mucURL), // @ts-ignore
             getDialInConferenceID(dialInConfCodeUrl, room, mucURL, locationURL)
         ])
             .then(([ dialInNumbers, { conference, id, message, sipUri } ]) => {
@@ -251,7 +251,7 @@ export function updateDialInNumbers() {
  */
 export function setCalleeInfoVisible(
         calleeInfoVisible: boolean,
-        initialCalleeInfo: ?Object) {
+        initialCalleeInfo?: Object) {
     return {
         type: SET_CALLEE_INFO_VISIBLE,
         calleeInfoVisible,
@@ -269,7 +269,7 @@ export function setCalleeInfoVisible(
  * }}
  */
 export function addPendingInviteRequest(
-        request: { invitees: Array<Object>, callback: Function }) {
+        request: { callback: Function; invitees: Array<Object>; }) {
     return {
         type: ADD_PENDING_INVITE_REQUEST,
         request

react/features/invite/actions.native.js → react/features/invite/actions.native.ts

@@ -1,11 +1,13 @@
-// @flow
-
-import type { Dispatch } from 'redux';
-
-import { ADD_PEOPLE_ENABLED, getFeatureFlag } from '../base/flags';
+/* eslint-disable lines-around-comment */
+import { IStore } from '../app/types';
+import { ADD_PEOPLE_ENABLED } from '../base/flags/constants';
+import { getFeatureFlag } from '../base/flags/functions';
+// @ts-ignore
 import { navigate } from '../mobile/navigation/components/conference/ConferenceNavigationContainerRef';
+// @ts-ignore
 import { screen } from '../mobile/navigation/routes';
-import { beginShareRoom } from '../share-room';
+import { beginShareRoom } from '../share-room/actions';
+/* eslint-enable lines-around-comment */
 
 import { isAddPeopleEnabled, isDialOutEnabled } from './functions';
 
@@ -18,7 +20,7 @@ export * from './actions.any';
  * @returns {Function}
  */
 export function doInvitePeople() {
-    return (dispatch: Dispatch<any>, getState: Function) => {
+    return (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
         const state = getState();
         const addPeopleEnabled = getFeatureFlag(state, ADD_PEOPLE_ENABLED, true)
             && (isAddPeopleEnabled(state) || isDialOutEnabled(state));

react/features/invite/components/add-people-dialog/web/AddPeopleDialog.tsx

@@ -205,7 +205,7 @@ function mapStateToProps(state: IReduxState, ownProps: Partial<IProps>) {
     const addPeopleEnabled = isAddPeopleEnabled(state);
     const dialOutEnabled = isDialOutEnabled(state);
     const hideInviteContacts = iAmRecorder || (!addPeopleEnabled && !dialOutEnabled);
-    const dialIn = state['features/invite'];
+    const dialIn = state['features/invite']; // @ts-ignore
     const phoneNumber = dialIn?.numbers ? _getDefaultPhoneNumber(dialIn.numbers) : undefined;
 
     return {

react/features/invite/functions.js → react/features/invite/functions.ts

@@ -1,20 +1,17 @@
-// @flow
-
-import { getActiveSession } from '../../features/recording/functions';
-import { getRoomName } from '../base/conference';
-import { getInviteURL } from '../base/connection';
+import { IReduxState } from '../app/types';
+import { IStateful } from '../base/app/types';
+import { getRoomName } from '../base/conference/functions';
+import { getInviteURL } from '../base/connection/functions';
 import { isIosMobileBrowser } from '../base/environment/utils';
-import { i18next } from '../base/i18n';
+import i18next from '../base/i18n/i18next';
 import { isJwtFeatureEnabled } from '../base/jwt/functions';
 import { JitsiRecordingConstants } from '../base/lib-jitsi-meet';
-import { getLocalParticipant, isLocalParticipantModerator } from '../base/participants';
-import { toState } from '../base/redux';
-import {
-    appendURLParam,
-    parseURIString,
-    parseURLParams
-} from '../base/util';
+import { getLocalParticipant, isLocalParticipantModerator } from '../base/participants/functions';
+import { toState } from '../base/redux/functions';
+import { parseURLParams } from '../base/util/parseURLParams';
+import { appendURLParam, parseURIString } from '../base/util/uri';
 import { isVpaasMeeting } from '../jaas/functions';
+import { getActiveSession } from '../recording/functions';
 
 import { getDialInConferenceID, getDialInNumbers } from './_utils';
 import {
@@ -24,8 +21,7 @@ import {
 } from './constants';
 import logger from './logger';
 
-declare var $: Function;
-declare var interfaceConfig: Object;
+declare let $: any;
 
 export const sharingFeatures = {
     email: 'email',
@@ -44,7 +40,7 @@ export const sharingFeatures = {
 export function checkDialNumber(
         dialNumber: string,
         dialOutAuthUrl: string
-): Promise<Object> {
+): Promise<{ allow?: boolean; country?: string; phone?: string; }> {
     const fullUrl = `${dialOutAuthUrl}?phone=${dialNumber}`;
 
     return new Promise((resolve, reject) => {
@@ -61,7 +57,7 @@ export function checkDialNumber(
  * numbers.
  * @returns {string} A string with only numbers.
  */
-export function getDigitsOnly(text: string = ''): string {
+export function getDigitsOnly(text = ''): string {
     return text.replace(/\D/g, '');
 }
 
@@ -71,40 +67,40 @@ export function getDigitsOnly(text: string = ''): string {
 export type GetInviteResultsOptions = {
 
     /**
-     * The endpoint to use for checking phone number validity.
+     * Whether or not to search for people.
      */
-    dialOutAuthUrl: string,
+    addPeopleEnabled: boolean;
 
     /**
-     * Whether or not to search for people.
+     * The endpoint to use for checking phone number validity.
      */
-    addPeopleEnabled: boolean,
+    dialOutAuthUrl: string;
 
     /**
      * Whether or not to check phone numbers.
      */
-    dialOutEnabled: boolean,
+    dialOutEnabled: boolean;
+
+    /**
+     * The jwt token to pass to the search service.
+     */
+    jwt: string;
 
     /**
      * Array with the query types that will be executed -
      * "conferenceRooms" | "user" | "room".
      */
-    peopleSearchQueryTypes: Array<string>,
+    peopleSearchQueryTypes: Array<string>;
 
     /**
      * The url to query for people.
      */
-    peopleSearchUrl: string,
+    peopleSearchUrl: string;
 
     /**
      * Whether or not to check sip invites.
      */
-    sipInviteEnabled: boolean,
-
-    /**
-     * The jwt token to pass to the search service.
-     */
-    jwt: string
+    sipInviteEnabled: boolean;
 };
 
 /**
@@ -118,8 +114,7 @@ export type GetInviteResultsOptions = {
 export function getInviteResultsForQuery(
         query: string,
         options: GetInviteResultsOptions
-): Promise<*> {
-
+): Promise<any> {
     const text = query.trim();
 
     const {
@@ -183,12 +178,12 @@ export function getInviteResultsForQuery(
             phone: text
         });
     } else {
-        phoneNumberPromise = Promise.resolve({});
+        phoneNumberPromise = Promise.resolve<{ allow?: boolean; country?: string; phone?: string; }>({});
     }
 
     return Promise.all([ peopleSearchPromise, phoneNumberPromise ])
         .then(([ peopleResults, phoneResults ]) => {
-            const results = [
+            const results: any[] = [
                 ...peopleResults
             ];
 
@@ -233,7 +228,7 @@ export function getInviteTextiOS({
     state,
     phoneNumber,
     t
-}: Object) {
+}: { phoneNumber?: string | null; state: IReduxState; t?: Function; }) {
     if (!isIosMobileBrowser()) {
         return '';
     }
@@ -246,23 +241,23 @@ export function getInviteTextiOS({
     const inviteURL = _decodeRoomURI(inviteUrl);
 
     let invite = localParticipantName
-        ? t('info.inviteTextiOSPersonal', { name: localParticipantName })
-        : t('info.inviteURLFirstPartGeneral');
+        ? t?.('info.inviteTextiOSPersonal', { name: localParticipantName })
+        : t?.('info.inviteURLFirstPartGeneral');
 
     invite += ' ';
 
-    invite += t('info.inviteTextiOSInviteUrl', { inviteUrl });
+    invite += t?.('info.inviteTextiOSInviteUrl', { inviteUrl });
     invite += ' ';
 
     if (shouldDisplayDialIn(dialIn) && isSharingEnabled(sharingFeatures.dialIn)) {
-        invite += t('info.inviteTextiOSPhone', {
+        invite += t?.('info.inviteTextiOSPhone', {
             number: phoneNumber,
             conferenceID: dialIn.conferenceID,
             didUrl: getDialInfoPageURL(state)
         });
     }
     invite += ' ';
-    invite += t('info.inviteTextiOSJoinSilent', { silentUrl: `${inviteURL}#config.startSilent=true` });
+    invite += t?.('info.inviteTextiOSJoinSilent', { silentUrl: `${inviteURL}#config.startSilent=true` });
 
     return invite;
 }
@@ -276,27 +271,25 @@ export function getInviteText({
     state,
     phoneNumber,
     t
-}: Object) {
+}: { phoneNumber?: string | null; state: IReduxState; t?: Function; }) {
     const dialIn = state['features/invite'];
     const inviteUrl = getInviteURL(state);
     const currentLiveStreamingSession = getActiveSession(state, JitsiRecordingConstants.mode.STREAM);
-    const liveStreamViewURL
-        = currentLiveStreamingSession
-            && currentLiveStreamingSession.liveStreamViewURL;
+    const liveStreamViewURL = currentLiveStreamingSession?.liveStreamViewURL;
     const localParticipant = getLocalParticipant(state);
     const localParticipantName = localParticipant?.name;
 
     const inviteURL = _decodeRoomURI(inviteUrl);
     let invite = localParticipantName
-        ? t('info.inviteURLFirstPartPersonal', { name: localParticipantName })
-        : t('info.inviteURLFirstPartGeneral');
+        ? t?.('info.inviteURLFirstPartPersonal', { name: localParticipantName })
+        : t?.('info.inviteURLFirstPartGeneral');
 
-    invite += t('info.inviteURLSecondPart', {
+    invite += t?.('info.inviteURLSecondPart', {
         url: inviteURL
     });
 
     if (liveStreamViewURL) {
-        const liveStream = t('info.inviteLiveStream', {
+        const liveStream = t?.('info.inviteLiveStream', {
             url: liveStreamViewURL
         });
 
@@ -304,11 +297,11 @@ export function getInviteText({
     }
 
     if (shouldDisplayDialIn(dialIn) && isSharingEnabled(sharingFeatures.dialIn)) {
-        const dial = t('info.invitePhone', {
+        const dial = t?.('info.invitePhone', {
             number: phoneNumber,
             conferenceID: dialIn.conferenceID
         });
-        const moreNumbers = t('info.invitePhoneAlternatives', {
+        const moreNumbers = t?.('info.invitePhoneAlternatives', {
             url: getDialInfoPageURL(state),
             silentUrl: `${inviteURL}#config.startSilent=true`
         });
@@ -328,8 +321,8 @@ export function getInviteText({
  * @returns {Object} An object with keys as user types and values as the number
  * of invites for that type.
  */
-export function getInviteTypeCounts(inviteItems: Array<Object> = []) {
-    const inviteTypeCounts = {};
+export function getInviteTypeCounts(inviteItems: Array<{ type: string; }> = []) {
+    const inviteTypeCounts: any = {};
 
     inviteItems.forEach(({ type }) => {
         if (!inviteTypeCounts[type]) {
@@ -352,51 +345,51 @@ export function getInviteTypeCounts(inviteItems: Array<Object> = []) {
  * items to invite.
  * @returns {Promise} - The promise created by the request.
  */
-export function invitePeopleAndChatRooms( // eslint-disable-line max-params
+export function invitePeopleAndChatRooms(
         inviteServiceUrl: string,
         inviteUrl: string,
         jwt: string,
         inviteItems: Array<Object>
-): Promise<void> {
+): Promise<any> {
 
     if (!inviteItems || inviteItems.length === 0) {
         return Promise.resolve();
     }
 
     return fetch(
-           `${inviteServiceUrl}?token=${jwt}`,
-           {
-               body: JSON.stringify({
-                   'invited': inviteItems,
-                   'url': inviteUrl
-               }),
-               method: 'POST',
-               headers: {
-                   'Content-Type': 'application/json'
-               }
-           }
+        `${inviteServiceUrl}?token=${jwt}`,
+        {
+            body: JSON.stringify({
+                'invited': inviteItems,
+                'url': inviteUrl
+            }),
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            }
+        }
     );
 }
 
 /**
  * Determines if adding people is currently enabled.
  *
- * @param {boolean} state - Current state.
+ * @param {IReduxState} state - Current state.
  * @returns {boolean} Indication of whether adding people is currently enabled.
  */
-export function isAddPeopleEnabled(state: Object): boolean {
+export function isAddPeopleEnabled(state: IReduxState): boolean {
     const { peopleSearchUrl } = state['features/base/config'];
 
-    return state['features/base/jwt'].jwt && Boolean(peopleSearchUrl) && !isVpaasMeeting(state);
+    return Boolean(state['features/base/jwt'].jwt && Boolean(peopleSearchUrl) && !isVpaasMeeting(state));
 }
 
 /**
  * Determines if dial out is currently enabled or not.
  *
- * @param {boolean} state - Current state.
+ * @param {IReduxState} state - Current state.
  * @returns {boolean} Indication of whether dial out is currently enabled.
  */
-export function isDialOutEnabled(state: Object): boolean {
+export function isDialOutEnabled(state: IReduxState): boolean {
     const { conference } = state['features/base/conference'];
 
     return isLocalParticipantModerator(state)
@@ -406,10 +399,10 @@ export function isDialOutEnabled(state: Object): boolean {
 /**
  * Determines if inviting sip endpoints is enabled or not.
  *
- * @param {Object} state - Current state.
+ * @param {IReduxState} state - Current state.
  * @returns {boolean} Indication of whether dial out is currently enabled.
  */
-export function isSipInviteEnabled(state: Object): boolean {
+export function isSipInviteEnabled(state: IReduxState): boolean {
     const { sipInviteUrl } = state['features/base/config'];
 
     return isJwtFeatureEnabled(state, 'sip-outbound-call') && Boolean(sipInviteUrl);
@@ -473,7 +466,7 @@ export function searchDirectory( // eslint-disable-line max-params
         jwt: string,
         text: string,
         queryTypes: Array<string> = [ 'conferenceRooms', 'user', 'room' ]
-): Promise<Array<Object>> {
+): Promise<Array<{ type: string; }>> {
 
     const query = encodeURIComponent(text);
     const queryTypesString = encodeURIComponent(JSON.stringify(queryTypes));
@@ -502,14 +495,13 @@ export function searchDirectory( // eslint-disable-line max-params
  * Returns descriptive text that can be used to invite participants to a meeting
  * (share via mobile or use it for calendar event description).
  *
- * @param {Object} state - The current state.
+ * @param {IReduxState} state - The current state.
  * @param {string} inviteUrl - The conference/location URL.
  * @param {boolean} useHtml - Whether to return html text.
  * @returns {Promise<string>} A {@code Promise} resolving with a
  * descriptive text that can be used to invite participants to a meeting.
  */
-export function getShareInfoText(
-        state: Object, inviteUrl: string, useHtml: ?boolean): Promise<string> {
+export function getShareInfoText(state: IReduxState, inviteUrl: string, useHtml?: boolean): Promise<string> {
     let roomUrl = _decodeRoomURI(inviteUrl);
     const includeDialInfo = state['features/base/config'] !== undefined;
 
@@ -534,7 +526,7 @@ export function getShareInfoText(
             const { dialInConfCodeUrl, dialInNumbersUrl, hosts }
                 = state['features/base/config'];
             const { locationURL = {} } = state['features/base/connection'];
-            const mucURL = hosts && hosts.muc;
+            const mucURL = hosts?.muc;
 
             if (!dialInConfCodeUrl || !dialInNumbersUrl || !mucURL) {
                 // URLs for fetching dial in numbers not defined
@@ -542,7 +534,7 @@ export function getShareInfoText(
             }
 
             numbersPromise = Promise.all([
-                getDialInNumbers(dialInNumbersUrl, room, mucURL),
+                getDialInNumbers(dialInNumbersUrl, room, mucURL), // @ts-ignore
                 getDialInConferenceID(dialInConfCodeUrl, room, mucURL, locationURL)
             ]).then(([ numbers, {
                 conference, id, message } ]) => {
@@ -592,16 +584,16 @@ export function getShareInfoText(
 /**
  * Generates the URL for the static dial in info page.
  *
- * @param {Object} state - The state from the Redux store.
+ * @param {IReduxState} state - The state from the Redux store.
  * @param {string?} roomName - The conference name. Optional name, if missing will be extracted from state.
  * @returns {string}
  */
-export function getDialInfoPageURL(state: Object, roomName: ?string) {
+export function getDialInfoPageURL(state: IReduxState, roomName?: string) {
     const { didPageUrl } = state['features/dynamic-branding'];
     const conferenceName = roomName ?? getRoomName(state);
     const { locationURL } = state['features/base/connection'];
-    const { href } = locationURL;
-    const room = _decodeRoomURI(conferenceName);
+    const { href = '' } = locationURL ?? {};
+    const room = _decodeRoomURI(conferenceName ?? '');
 
     const url = didPageUrl || `${href.substring(0, href.lastIndexOf('/'))}/${DIAL_IN_INFO_PAGE_PATH_NAME}`;
 
@@ -615,7 +607,7 @@ export function getDialInfoPageURL(state: Object, roomName: ?string) {
  * @returns {string}
  */
 export function getDialInfoPageURLForURIString(
-        uri: ?string) {
+        uri?: string) {
     if (!uri) {
         return undefined;
     }
@@ -637,7 +629,7 @@ export function getDialInfoPageURLForURIString(
  * @param {Object} dialIn - Dial in information.
  * @returns {boolean}
  */
-export function shouldDisplayDialIn(dialIn: Object) {
+export function shouldDisplayDialIn(dialIn: any) {
     const { conferenceID, numbers, numbersEnabled } = dialIn;
     const phoneNumber = _getDefaultPhoneNumber(numbers);
 
@@ -656,7 +648,7 @@ export function shouldDisplayDialIn(dialIn: Object) {
  * @private
  * @returns {boolean}
  */
-export function hasMultipleNumbers(dialInNumbers: ?Object) {
+export function hasMultipleNumbers(dialInNumbers?: { numbers: Object; } | string[]) {
     if (!dialInNumbers) {
         return false;
     }
@@ -682,7 +674,7 @@ export function hasMultipleNumbers(dialInNumbers: ?Object) {
  * @returns {string|null}
  */
 export function _getDefaultPhoneNumber(
-        dialInNumbers: ?Object): ?string {
+        dialInNumbers?: { numbers: any; } | Array<{ default: string; formattedNumber: string; }>): string | null {
 
     if (!dialInNumbers) {
         return null;
@@ -743,22 +735,23 @@ export function _decodeRoomURI(url: string) {
 /**
  * Returns the stored conference id.
  *
- * @param {Object | Function} stateful - The Object or Function that can be
+ * @param {IStateful} stateful - The Object or Function that can be
  * resolved to a Redux state object with the toState function.
  * @returns {string}
  */
-export function getConferenceId(stateful: Object | Function) {
+export function getConferenceId(stateful: IStateful) {
     return toState(stateful)['features/invite'].conferenceID;
 }
 
 /**
  * Returns the default dial in number from the store.
  *
- * @param {Object | Function} stateful - The Object or Function that can be
+ * @param {IStateful} stateful - The Object or Function that can be
  * resolved to a Redux state object with the toState function.
  * @returns {string | null}
  */
-export function getDefaultDialInNumber(stateful: Object | Function) {
+export function getDefaultDialInNumber(stateful: IStateful) {
+    // @ts-ignore
     return _getDefaultPhoneNumber(toState(stateful)['features/invite'].numbers);
 }
 
@@ -831,14 +824,14 @@ export function isSharingEnabled(sharingFeature: string) {
  * @returns {Promise} - The promise created by the request.
  */
 export function inviteSipEndpoints( // eslint-disable-line max-params
-        inviteItems: Array<Object>,
+        inviteItems: Array<{ address: string; }>,
         locationURL: URL,
         sipInviteUrl: string,
         jwt: string,
         roomName: string,
         roomPassword: String,
         displayName: string
-): Promise<void> {
+): Promise<any> {
     if (inviteItems.length === 0) {
         return Promise.resolve();
     }
@@ -851,26 +844,26 @@ export function inviteSipEndpoints( // eslint-disable-line max-params
     });
 
     return fetch(
-       sipInviteUrl,
-       {
-           body: JSON.stringify({
-               callParams: {
-                   callUrlInfo: {
-                       baseUrl,
-                       callName: roomName
-                   },
-                   passcode: roomPassword
-               },
-               sipClientParams: {
-                   displayName,
-                   sipAddress: inviteItems.map(item => item.address)
-               }
-           }),
-           method: 'POST',
-           headers: {
-               'Authorization': `Bearer ${jwt}`,
-               'Content-Type': 'application/json'
-           }
-       }
+        sipInviteUrl,
+        {
+            body: JSON.stringify({
+                callParams: {
+                    callUrlInfo: {
+                        baseUrl,
+                        callName: roomName
+                    },
+                    passcode: roomPassword
+                },
+                sipClientParams: {
+                    displayName,
+                    sipAddress: inviteItems.map(item => item.address)
+                }
+            }),
+            method: 'POST',
+            headers: {
+                'Authorization': `Bearer ${jwt}`,
+                'Content-Type': 'application/json'
+            }
+        }
     );
 }

react/features/invite/middleware.any.js → react/features/invite/middleware.any.ts

@@ -1,27 +1,28 @@
-// @flow
+import { AnyAction } from 'redux';
 
-import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../base/app';
-import {
-    CONFERENCE_JOINED
-} from '../base/conference';
+import { IStore } from '../app/types';
+import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from '../base/app/actionTypes';
+import { CONFERENCE_JOINED } from '../base/conference/actionTypes';
 import {
     PARTICIPANT_JOINED,
-    PARTICIPANT_JOINED_SOUND_ID,
     PARTICIPANT_LEFT,
-    PARTICIPANT_UPDATED,
+    PARTICIPANT_UPDATED
+} from '../base/participants/actionTypes';
+import { pinParticipant } from '../base/participants/actions';
+import { PARTICIPANT_JOINED_SOUND_ID } from '../base/participants/constants';
+import {
     getLocalParticipant,
     getParticipantCount,
     getParticipantPresenceStatus,
-    getRemoteParticipants,
-    pinParticipant
-} from '../base/participants';
-import { MiddlewareRegistry } from '../base/redux';
+    getRemoteParticipants
+} from '../base/participants/functions';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
 import {
     playSound,
     registerSound,
     stopSound,
     unregisterSound
-} from '../base/sounds';
+} from '../base/sounds/actions';
 import {
     CALLING,
     CONNECTED_USER,
@@ -29,7 +30,7 @@ import {
     INVITED,
     REJECTED,
     RINGING
-} from '../presence-status';
+} from '../presence-status/constants';
 
 import {
     SET_CALLEE_INFO_VISIBLE,
@@ -49,8 +50,6 @@ import {
 import logger from './logger';
 import { sounds } from './sounds';
 
-declare var interfaceConfig: Object;
-
 /**
  * Maps the presence status with the ID of the sound that will be played when
  * the status is received.
@@ -84,7 +83,7 @@ MiddlewareRegistry.register(store => next => action => {
 
     if (action.type === SET_CALLEE_INFO_VISIBLE) {
         if (action.calleeInfoVisible) {
-            dispatch(pinParticipant(getLocalParticipant(state).id));
+            dispatch(pinParticipant(getLocalParticipant(state)?.id));
         } else {
             // unpin participant
             dispatch(pinParticipant());
@@ -124,10 +123,10 @@ MiddlewareRegistry.register(store => next => action => {
 
         const oldSoundId
             = oldParticipantPresence
-                && statusToRingtone[oldParticipantPresence];
+            && statusToRingtone[oldParticipantPresence as keyof typeof statusToRingtone];
         const newSoundId
             = newParticipantPresence
-                && statusToRingtone[newParticipantPresence];
+            && statusToRingtone[newParticipantPresence as keyof typeof statusToRingtone];
 
 
         if (oldSoundId === newSoundId) {
@@ -159,10 +158,10 @@ MiddlewareRegistry.register(store => next => action => {
  * (not poltergeist, shared video, etc.) participants in the call.
  *
  * @param {Object} action - The redux action.
- * @param {ReduxStore} store - The redux store.
+ * @param {IStore} store - The redux store.
  * @returns {void}
  */
-function _maybeHideCalleeInfo(action, store) {
+function _maybeHideCalleeInfo(action: AnyAction, store: IStore) {
     const state = store.getState();
 
     if (!state['features/invite'].calleeInfoVisible) {
@@ -188,10 +187,10 @@ function _maybeHideCalleeInfo(action, store) {
 /**
  * Executes the pending invitation requests if any.
  *
- * @param {ReduxStore} store - The redux store.
+ * @param {IStore} store - The redux store.
  * @returns {void}
  */
-function _onConferenceJoined(store) {
+function _onConferenceJoined(store: IStore) {
     const { dispatch, getState } = store;
 
     const pendingInviteRequests

react/features/invite/middleware.web.js → react/features/invite/middleware.web.ts

@@ -1,10 +1,11 @@
-// @flow
+import { AnyAction } from 'redux';
 
-import { hideDialog, openDialog } from '../base/dialog';
-import { MiddlewareRegistry } from '../base/redux';
+import { IStore } from '../app/types';
+import { hideDialog, openDialog } from '../base/dialog/actions';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
 
 import { BEGIN_ADD_PEOPLE, HIDE_ADD_PEOPLE_DIALOG } from './actionTypes';
-import { AddPeopleDialog } from './components';
+import AddPeopleDialog from './components/add-people-dialog/web/AddPeopleDialog';
 import './middleware.any';
 
 /**
@@ -37,7 +38,7 @@ MiddlewareRegistry.register(store => next => action => {
  * @private
  * @returns {*} The value returned by {@code next(action)}.
  */
-function _beginAddPeople({ dispatch }, next, action) {
+function _beginAddPeople({ dispatch }: IStore, next: Function, action: AnyAction) {
     const result = next(action);
 
     dispatch(openDialog(AddPeopleDialog));
@@ -58,7 +59,7 @@ function _beginAddPeople({ dispatch }, next, action) {
  * @private
  * @returns {*} The value returned by {@code next(action)}.
  */
-function _hideAddPeopleDialog({ dispatch }, next, action) {
+function _hideAddPeopleDialog({ dispatch }: IStore, next: Function, action: AnyAction) {
     dispatch(hideDialog(AddPeopleDialog));
 
     return next(action);

react/features/invite/reducer.ts

@@ -8,6 +8,7 @@ import {
     UPDATE_DIAL_IN_NUMBERS_SUCCESS
 } from './actionTypes';
 import logger from './logger';
+import { IInvitee } from './types';
 
 const DEFAULT_STATE = {
     /**
@@ -27,12 +28,12 @@ export interface IInviteState {
     conferenceID?: string | number;
     error?: Error;
     initialCalleeInfo?: Object;
-    numbers?: string;
+    numbers?: string[];
     numbersEnabled: boolean;
     numbersFetched: boolean;
     pendingInviteRequests: Array<{
         callback: Function;
-        invitees: Array<Object>;
+        invitees: IInvitee[];
     }>;
     sipUri?: string;
 }

react/features/invite/types.ts

@@ -0,0 +1,5 @@
+export interface IInvitee {
+    address: string;
+    number: string;
+    type: string;
+}

react/features/prejoin/actions.web.ts

@@ -92,7 +92,7 @@ function pollForStatus(
                 return;
             }
 
-            const res = await executeDialOutStatusRequest(getDialOutStatusUrl(state), reqId);
+            const res = await executeDialOutStatusRequest(getDialOutStatusUrl(state) ?? '', reqId);
 
             switch (res) {
             case DIAL_OUT_STATUS.INITIATED:
@@ -153,7 +153,7 @@ export function dialOut(onSuccess: Function, onFail: Function) {
     return async function(dispatch: IStore['dispatch'], getState: IStore['getState']) {
         const state = getState();
         const reqId = uuidv4();
-        const url = getDialOutUrl(state);
+        const url = getDialOutUrl(state) ?? '';
         const conferenceUrl = getDialOutConferenceUrl(state);
         const phoneNumber = getFullDialOutNumber(state);
         const countryCode = getDialOutCountry(state).code.toUpperCase();

react/features/recent-list/actions.js → react/features/recent-list/actions.ts

@@ -1,5 +1,3 @@
-// @flow
-
 import {
     DELETE_RECENT_LIST_ENTRY,
     _STORE_CURRENT_CONFERENCE,

react/features/recent-list/functions.native.js → react/features/recent-list/functions.native.ts

@@ -1,9 +1,13 @@
 import {
     getLocalizedDateFormatter,
     getLocalizedDurationFormatter
-} from '../base/i18n';
+} from '../base/i18n/dateUtil';
+// eslint-disable-next-line lines-around-comment
+// @ts-ignore
 import { NavigateSectionList } from '../base/react';
-import { parseURIString, safeDecodeURIComponent } from '../base/util';
+import { parseURIString, safeDecodeURIComponent } from '../base/util/uri';
+
+import { IRecentItem } from './types';
 
 /**
  * Creates a displayable list item of a recent list entry.
@@ -14,7 +18,8 @@ import { parseURIString, safeDecodeURIComponent } from '../base/util';
  * @param {Function} t - The translate function.
  * @returns {Object}
  */
-function toDisplayableItem(item, defaultServerURL, t) {
+function toDisplayableItem(item: IRecentItem,
+        defaultServerURL: string, t: Function) {
     const location = parseURIString(item.conference);
     const baseURL = `${location.protocol}//${location.host}`;
     const serverName = baseURL === defaultServerURL ? null : location.host;
@@ -43,7 +48,7 @@ function toDisplayableItem(item, defaultServerURL, t) {
  * @param {number} duration - The item's duration.
  * @returns {string}
  */
-function _toDurationString(duration) {
+function _toDurationString(duration: number) {
     if (duration) {
         return getLocalizedDurationFormatter(duration);
     }
@@ -59,7 +64,7 @@ function _toDurationString(duration) {
  * @param {Function} t - The translate function.
  * @returns {string}
  */
-function _toDateString(itemDate, t) {
+function _toDateString(itemDate: number, t: Function) {
     const m = getLocalizedDateFormatter(itemDate);
     const date = new Date(itemDate);
     const dateInMs = date.getTime();
@@ -90,7 +95,8 @@ function _toDateString(itemDate, t) {
  * @param {string} defaultServerURL - The default server URL.
  * @returns {Array<Object>}
  */
-export function toDisplayableList(recentList, t, defaultServerURL) {
+export function toDisplayableList(recentList: IRecentItem[],
+        t: Function, defaultServerURL: string) {
     const { createSection } = NavigateSectionList;
     const todaySection = createSection(t('dateUtils.today'), 'today');
     const yesterdaySection

react/features/recent-list/functions.web.js → react/features/recent-list/functions.web.ts

@@ -1,6 +1,4 @@
-/* global interfaceConfig */
-
-import { parseURIString, safeDecodeURIComponent } from '../base/util';
+import { parseURIString, safeDecodeURIComponent } from '../base/util/uri';
 
 
 /**
@@ -10,7 +8,7 @@ import { parseURIString, safeDecodeURIComponent } from '../base/util';
  * @param {Array<Object>} recentList - The recent list form the redux store.
  * @returns {Array<Object>}
  */
-export function toDisplayableList(recentList) {
+export function toDisplayableList(recentList: Array<{ conference: string; date: Date; duration: number; }>) {
     return (
         [ ...recentList ].reverse()
             .map(item => {

react/features/recent-list/logger.js → react/features/recent-list/logger.ts

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

react/features/recent-list/middleware.js → react/features/recent-list/middleware.ts

@@ -1,21 +1,17 @@
-// @flow
-
-import { APP_WILL_MOUNT } from '../base/app';
-import {
-    CONFERENCE_WILL_LEAVE,
-    JITSI_CONFERENCE_URL_KEY,
-    SET_ROOM
-} from '../base/conference';
-import { addKnownDomains } from '../base/known-domains';
-import { MiddlewareRegistry } from '../base/redux';
-import { parseURIString } from '../base/util';
+import { AnyAction } from 'redux';
+
+import { IStore } from '../app/types';
+import { APP_WILL_MOUNT } from '../base/app/actionTypes';
+import { CONFERENCE_WILL_LEAVE, SET_ROOM } from '../base/conference/actionTypes';
+import { JITSI_CONFERENCE_URL_KEY } from '../base/conference/constants';
+import { addKnownDomains } from '../base/known-domains/actions';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
 import { inIframe } from '../base/util/iframeUtils';
+import { parseURIString } from '../base/util/uri';
 
 import { _storeCurrentConference, _updateConferenceDuration } from './actions';
 import { isRecentListEnabled } from './functions';
 
-declare var APP: Object;
-
 /**
  * Middleware that captures joined rooms so they can be saved into
  * {@code window.localStorage}.
@@ -53,7 +49,7 @@ MiddlewareRegistry.register(store => next => action => {
  * @private
  * @returns {*} The result returned by {@code next(action)}.
  */
-function _appWillMount({ dispatch, getState }, next, action) {
+function _appWillMount({ dispatch, getState }: IStore, next: Function, action: AnyAction) {
     const result = next(action);
 
     // It's an opportune time to transfer the feature recent-list's knowledge
@@ -86,7 +82,7 @@ function _appWillMount({ dispatch, getState }, next, action) {
  * @private
  * @returns {*} The result returned by {@code next(action)}.
  */
-function _conferenceWillLeave({ dispatch, getState }, next, action) {
+function _conferenceWillLeave({ dispatch, getState }: IStore, next: Function, action: AnyAction) {
     const { doNotStoreRoom } = getState()['features/base/config'];
 
     if (!doNotStoreRoom && !inIframe()) {
@@ -126,7 +122,7 @@ function _conferenceWillLeave({ dispatch, getState }, next, action) {
  * @private
  * @returns {*} The result returned by {@code next(action)}.
  */
-function _setRoom({ dispatch, getState }, next, action) {
+function _setRoom({ dispatch, getState }: IStore, next: Function, action: AnyAction) {
     const { doNotStoreRoom } = getState()['features/base/config'];
 
     if (!doNotStoreRoom && !inIframe() && action.room) {

react/features/recent-list/types.ts

@@ -0,0 +1,5 @@
+export interface IRecentItem {
+    conference: string;
+    date: number;
+    duration: number;
+}

react/features/screenshot-capture/actions.js → react/features/screenshot-capture/actions.ts

@@ -1,13 +1,14 @@
-// @flow
-
-import { getLocalJitsiDesktopTrack, getLocalJitsiVideoTrack } from '../../features/base/tracks';
-import { getMultipleVideoSendingSupportFeatureFlag } from '../base/config';
+import { IStore } from '../app/types';
+import { getMultipleVideoSendingSupportFeatureFlag } from '../base/config/functions';
+import { getLocalJitsiDesktopTrack, getLocalJitsiVideoTrack } from '../base/tracks/functions';
 
 import { SET_SCREENSHOT_CAPTURE } from './actionTypes';
+// eslint-disable-next-line lines-around-comment
+// @ts-ignore
 import { createScreenshotCaptureSummary } from './functions';
 import logger from './logger';
 
-let screenshotSummary;
+let screenshotSummary: any;
 
 /**
  * Marks the on-off state of screenshot captures.
@@ -18,7 +19,7 @@ let screenshotSummary;
     *      payload: enabled
     * }}
 */
-function setScreenshotCapture(enabled) {
+function setScreenshotCapture(enabled: boolean) {
     return {
         type: SET_SCREENSHOT_CAPTURE,
         payload: enabled
@@ -32,7 +33,7 @@ function setScreenshotCapture(enabled) {
 * @returns {Promise}
 */
 export function toggleScreenshotCaptureSummary(enabled: boolean) {
-    return async function(dispatch: (Object) => Object, getState: () => any) {
+    return async function(dispatch: IStore['dispatch'], getState: IStore['getState']) {
         const state = getState();
 
         if (state['features/screenshot-capture'].capturesEnabled !== enabled) {

react/features/screenshot-capture/logger.js → react/features/screenshot-capture/logger.ts

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

react/features/share-room/middleware.js → react/features/share-room/middleware.ts

@@ -1,10 +1,9 @@
-// @flow
-
 import { Share } from 'react-native';
 
-import { getName } from '../app/functions';
-import { MiddlewareRegistry } from '../base/redux';
-import { getShareInfoText } from '../invite';
+import { getName } from '../app/functions.native';
+import { IStore } from '../app/types';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
+import { getShareInfoText } from '../invite/functions';
 
 import { BEGIN_SHARE_ROOM } from './actionTypes';
 import { endShareRoom } from './actions';
@@ -35,7 +34,7 @@ MiddlewareRegistry.register(store => next => action => {
  * @private
  * @returns {void}
  */
-function _shareRoom(roomURL: string, { dispatch, getState }) {
+function _shareRoom(roomURL: string, { dispatch, getState }: IStore) {
     getShareInfoText(getState(), roomURL)
         .then(message => {
             const title = `${getName()} Conference`;

tsconfig.web.json

@@ -16,6 +16,7 @@
     },
     "exclude": [
         "node_modules",
+        "react/features/share-room",
         "**/mobile/*",
         "**/native/*",
         "**/*.native.ts",