ref(TS) Convert some files to TS (#12289)

react/features/base/conference/reducer.ts

@@ -42,6 +42,7 @@ export interface IJitsiConference {
     addTrack: Function;
     avModerationApprove: Function;
     avModerationReject: Function;
+    createVideoSIPGWSession: Function;
     disableAVModeration: Function;
     enableAVModeration: Function;
     getBreakoutRooms: Function;

react/features/videosipgw/actions.ts

@@ -1,5 +1,3 @@
-/* @flow */
-
 import { SIP_GW_INVITE_ROOMS } from './actionTypes';
 
 /**

react/features/videosipgw/logger.ts

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

react/features/videosipgw/middleware.ts

@@ -1,23 +1,24 @@
-// @flow
-
+import { IStore } from '../app/types';
 import { CONFERENCE_JOIN_IN_PROGRESS } from '../base/conference/actionTypes';
+import { IJitsiConference } from '../base/conference/reducer';
 import {
     JitsiConferenceEvents,
     JitsiSIPVideoGWStatus
 } from '../base/lib-jitsi-meet';
-import { MiddlewareRegistry } from '../base/redux';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
 import {
-    NOTIFICATION_TIMEOUT_TYPE,
     showErrorNotification,
     showNotification,
     showWarningNotification
-} from '../notifications';
+} from '../notifications/actions';
+import { NOTIFICATION_TIMEOUT_TYPE } from '../notifications/constants';
 
 import {
     SIP_GW_AVAILABILITY_CHANGED,
     SIP_GW_INVITE_ROOMS
 } from './actionTypes';
 import logger from './logger';
+import { SipRoom, SipSessionChangedEvent } from './types';
 
 /**
  * Middleware that captures conference video sip gw events and stores
@@ -38,10 +39,12 @@ MiddlewareRegistry.register(({ dispatch }) => next => action => {
 
         conference.on(
             JitsiConferenceEvents.VIDEO_SIP_GW_AVAILABILITY_CHANGED,
+
+            // @ts-ignore
             (...args) => dispatch(_availabilityChanged(...args)));
         conference.on(
             JitsiConferenceEvents.VIDEO_SIP_GW_SESSION_STATE_CHANGED,
-            event => {
+            (event: SipSessionChangedEvent) => {
                 const toDispatch = _sessionStateChanged(event);
 
                 // sessionStateChanged can decide there is nothing to dispatch
@@ -88,7 +91,7 @@ function _availabilityChanged(status: string) {
  * @private
  * @returns {void}
  */
-function _inviteRooms(rooms, conference, dispatch) {
+function _inviteRooms(rooms: SipRoom[], conference: IJitsiConference, dispatch: IStore['dispatch']) {
     for (const room of rooms) {
         const { id: sipAddress, name: displayName } = room;
 
@@ -141,7 +144,7 @@ function _inviteRooms(rooms, conference, dispatch) {
  * @private
  */
 function _sessionStateChanged(
-        event: Object) {
+        event: SipSessionChangedEvent) {
     switch (event.newState) {
     case JitsiSIPVideoGWStatus.STATE_PENDING: {
         return showNotification({

react/features/videosipgw/types.ts

@@ -0,0 +1,10 @@
+export interface SipRoom {
+    id: string;
+    name: string;
+}
+
+export interface SipSessionChangedEvent {
+    displayName: string;
+    failureReason: string;
+    newState: string;
+}

react/features/virtual-background/actions.ts

@@ -1,9 +1,11 @@
-// @flow
-
+import { IStore } from '../app/types';
+// eslint-disable-next-line lines-around-comment
+// @ts-ignore
 import { createVirtualBackgroundEffect } from '../stream-effects/virtual-background';
 
 import { BACKGROUND_ENABLED, SET_VIRTUAL_BACKGROUND, VIRTUAL_BACKGROUND_TRACK_CHANGED } from './actionTypes';
 import logger from './logger';
+import { VirtualBackgroundOptions } from './types';
 
 /**
  * Signals the local participant activate the virtual background video or not.
@@ -12,8 +14,8 @@ import logger from './logger';
  * @param {Object} jitsiTrack - Represents the jitsi track that will have backgraund effect applied.
  * @returns {Promise}
  */
-export function toggleBackgroundEffect(options: Object, jitsiTrack: Object) {
-    return async function(dispatch: Object => Object, getState: () => any) {
+export function toggleBackgroundEffect(options: VirtualBackgroundOptions, jitsiTrack: any) {
+    return async function(dispatch: IStore['dispatch'], getState: IStore['getState']) {
         await dispatch(backgroundEnabled(options.enabled));
         await dispatch(setVirtualBackground(options));
         const state = getState();
@@ -46,7 +48,7 @@ export function toggleBackgroundEffect(options: Object, jitsiTrack: Object) {
  *     type: string,
  * }}
  */
-export function setVirtualBackground(options: Object) {
+export function setVirtualBackground(options?: VirtualBackgroundOptions) {
     return {
         type: SET_VIRTUAL_BACKGROUND,
         virtualSource: options?.url,

react/features/virtual-background/functions.ts

@@ -1,10 +1,8 @@
-// @flow
-
 import { JitsiTrackEvents } from '../base/lib-jitsi-meet';
-import { updateSettings } from '../base/settings';
+import { updateSettings } from '../base/settings/actions';
 
 import { toggleBackgroundEffect } from './actions';
-let filterSupport;
+let filterSupport: boolean | undefined;
 
 /**
  * Checks context filter support.
@@ -16,7 +14,7 @@ export function checkBlurSupport() {
         const canvas = document.createElement('canvas');
         const ctx = canvas.getContext('2d');
 
-        filterSupport = typeof ctx.filter !== 'undefined';
+        filterSupport = typeof ctx?.filter !== 'undefined';
 
         canvas.remove();
     }
@@ -30,7 +28,7 @@ export function checkBlurSupport() {
  * @param {Blob} blob - The link to add info with.
  * @returns {Promise<string>}
  */
-export const blobToData = (blob: Blob): Promise<string> =>
+export const blobToData = (blob: Blob) =>
     new Promise(resolve => {
         const reader = new FileReader();
 
@@ -61,7 +59,7 @@ export const toDataURL = async (url: string) => {
  * @returns {Promise<string>}
  *
  */
-export function resizeImage(base64image: any, width: number = 1920, height: number = 1080): Promise<string> {
+export function resizeImage(base64image: any, width = 1920, height = 1080): Promise<string> {
 
     // In order to work on Firefox browser we need to handle the asynchronous nature of image loading;  We need to use
     // a promise mechanism. The reason why it 'works' without this mechanism in Chrome is actually 'by accident' because
@@ -82,7 +80,7 @@ export function resizeImage(base64image: any, width: number = 1920, height: numb
 
             // Draw source image into the off-screen canvas.
             // TODO: keep aspect ratio and implement object-fit: cover.
-            context.drawImage(img, 0, 0, width, height);
+            context?.drawImage(img as any, 0, 0, width, height);
 
             // Encode image to data-uri with base64 version of compressed image.
             resolve(canvas.toDataURL('image/jpeg', 0.5));
@@ -100,7 +98,7 @@ export function resizeImage(base64image: any, width: number = 1920, height: numb
  * background option if the desktop track was stopped.
  * @returns {Promise}
  */
-export function localTrackStopped(dispatch: Function, desktopTrack: Object, currentLocalTrack: Object) {
+export function localTrackStopped(dispatch: Function, desktopTrack: any, currentLocalTrack: Object | null) {
     const noneOptions = {
         enabled: false,
         backgroundType: 'none',
@@ -108,8 +106,7 @@ export function localTrackStopped(dispatch: Function, desktopTrack: Object, curr
         backgroundEffectEnabled: false
     };
 
-    desktopTrack
-    && desktopTrack.on(JitsiTrackEvents.LOCAL_TRACK_STOPPED, () => {
+    desktopTrack?.on(JitsiTrackEvents.LOCAL_TRACK_STOPPED, () => {
         dispatch(toggleBackgroundEffect(noneOptions, currentLocalTrack));
 
         // Set x scale to default value.
@@ -129,7 +126,7 @@ export function localTrackStopped(dispatch: Function, desktopTrack: Object, curr
  * after the specified timeout is to be implemented.
  * @returns {Promise}
  */
-export function timeout(milliseconds: number, promise: Promise<*>): Promise<Object> {
+export function timeout(milliseconds: number, promise: Promise<any>): Promise<Object> {
     return new Promise((resolve, reject) => {
         setTimeout(() => {
             reject(new Error('408'));

react/features/virtual-background/logger.ts

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

react/features/virtual-background/middleware.ts

@@ -1,8 +1,6 @@
-// @flow
-
-import { VIDEO_TYPE } from '../base/media';
-import { MiddlewareRegistry } from '../base/redux';
-import { getLocalVideoTrack } from '../base/tracks';
+import { VIDEO_TYPE } from '../base/media/constants';
+import MiddlewareRegistry from '../base/redux/MiddlewareRegistry';
+import { getLocalVideoTrack } from '../base/tracks/functions';
 
 import { SET_VIRTUAL_BACKGROUND } from './actionTypes';
 import { localTrackStopped } from './functions';

react/features/virtual-background/reducer.ts

@@ -11,7 +11,7 @@ export interface IVirtualBackground {
     backgroundType?: string;
     blurValue?: number;
     selectedThumbnail?: string;
-    virtualSource?: string;
+    virtualSource?: { videoType: string; };
 }
 
 /**

react/features/virtual-background/types.ts

@@ -0,0 +1,6 @@
+import { IVirtualBackground } from './reducer';
+
+export interface VirtualBackgroundOptions extends IVirtualBackground {
+    enabled: boolean;
+    url?: string;
+}

react/features/welcome/functions.ts

@@ -1,3 +1,4 @@
+import { IStateful } from '../base/app/types';
 import { WELCOME_PAGE_ENABLED } from '../base/flags/constants';
 import { getFeatureFlag } from '../base/flags/functions';
 import { toState } from '../base/redux/functions';
@@ -6,12 +7,12 @@ import { toState } from '../base/redux/functions';
 /**
  * Determines whether the {@code WelcomePage} is enabled.
  *
- * @param {Function|Object} stateful - The redux state or {@link getState}
+ * @param {IStateful} stateful - The redux state or {@link getState}
  * function.
  * @returns {boolean} If the {@code WelcomePage} is enabled by the app, then
  * {@code true}; otherwise, {@code false}.
  */
-export function isWelcomePageEnabled(stateful: Function | Object) {
+export function isWelcomePageEnabled(stateful: IStateful) {
     if (navigator.product === 'ReactNative') {
         return getFeatureFlag(stateful, WELCOME_PAGE_ENABLED, false);
     }