diff --git a/react/features/base/conference/reducer.ts b/react/features/base/conference/reducer.ts index 4bb81b455..7443628cf 100644 --- a/react/features/base/conference/reducer.ts +++ b/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; diff --git a/react/features/videosipgw/actions.js b/react/features/videosipgw/actions.ts similarity index 97% rename from react/features/videosipgw/actions.js rename to react/features/videosipgw/actions.ts index 3123b6c80..19e08ef89 100644 --- a/react/features/videosipgw/actions.js +++ b/react/features/videosipgw/actions.ts @@ -1,5 +1,3 @@ -/* @flow */ - import { SIP_GW_INVITE_ROOMS } from './actionTypes'; /** diff --git a/react/features/videosipgw/logger.js b/react/features/videosipgw/logger.ts similarity index 91% rename from react/features/videosipgw/logger.js rename to react/features/videosipgw/logger.ts index 2eb6d516b..7be213894 100644 --- a/react/features/videosipgw/logger.js +++ b/react/features/videosipgw/logger.ts @@ -1,5 +1,3 @@ -// @flow - import { getLogger } from '../base/logging/functions'; export default getLogger('features/videosipgw'); diff --git a/react/features/videosipgw/middleware.js b/react/features/videosipgw/middleware.ts similarity index 90% rename from react/features/videosipgw/middleware.js rename to react/features/videosipgw/middleware.ts index 8afaead7f..9479ea46d 100644 --- a/react/features/videosipgw/middleware.js +++ b/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({ diff --git a/react/features/videosipgw/types.ts b/react/features/videosipgw/types.ts new file mode 100644 index 000000000..c55d45d77 --- /dev/null +++ b/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; +} diff --git a/react/features/virtual-background/actions.js b/react/features/virtual-background/actions.ts similarity index 86% rename from react/features/virtual-background/actions.js rename to react/features/virtual-background/actions.ts index ec2a701f8..d1ef6699f 100644 --- a/react/features/virtual-background/actions.js +++ b/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, diff --git a/react/features/virtual-background/functions.js b/react/features/virtual-background/functions.ts similarity index 87% rename from react/features/virtual-background/functions.js rename to react/features/virtual-background/functions.ts index e5f0c6cd2..dff92e1c4 100644 --- a/react/features/virtual-background/functions.js +++ b/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} */ -export const blobToData = (blob: Blob): Promise => +export const blobToData = (blob: Blob) => new Promise(resolve => { const reader = new FileReader(); @@ -61,7 +59,7 @@ export const toDataURL = async (url: string) => { * @returns {Promise} * */ -export function resizeImage(base64image: any, width: number = 1920, height: number = 1080): Promise { +export function resizeImage(base64image: any, width = 1920, height = 1080): Promise { // 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 { +export function timeout(milliseconds: number, promise: Promise): Promise { return new Promise((resolve, reject) => { setTimeout(() => { reject(new Error('408')); diff --git a/react/features/virtual-background/logger.js b/react/features/virtual-background/logger.ts similarity index 91% rename from react/features/virtual-background/logger.js rename to react/features/virtual-background/logger.ts index a4322f905..75081f0f9 100644 --- a/react/features/virtual-background/logger.js +++ b/react/features/virtual-background/logger.ts @@ -1,5 +1,3 @@ -// @flow - import { getLogger } from '../base/logging/functions'; export default getLogger('features/virtual-background'); diff --git a/react/features/virtual-background/middleware.js b/react/features/virtual-background/middleware.ts similarity index 82% rename from react/features/virtual-background/middleware.js rename to react/features/virtual-background/middleware.ts index 42b7779cc..0717180fd 100644 --- a/react/features/virtual-background/middleware.js +++ b/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'; diff --git a/react/features/virtual-background/reducer.ts b/react/features/virtual-background/reducer.ts index 75609d0c2..4e5bd9002 100644 --- a/react/features/virtual-background/reducer.ts +++ b/react/features/virtual-background/reducer.ts @@ -11,7 +11,7 @@ export interface IVirtualBackground { backgroundType?: string; blurValue?: number; selectedThumbnail?: string; - virtualSource?: string; + virtualSource?: { videoType: string; }; } /** diff --git a/react/features/virtual-background/types.ts b/react/features/virtual-background/types.ts new file mode 100644 index 000000000..dac3c2dbc --- /dev/null +++ b/react/features/virtual-background/types.ts @@ -0,0 +1,6 @@ +import { IVirtualBackground } from './reducer'; + +export interface VirtualBackgroundOptions extends IVirtualBackground { + enabled: boolean; + url?: string; +} diff --git a/react/features/welcome/functions.js b/react/features/welcome/functions.ts similarity index 76% rename from react/features/welcome/functions.js rename to react/features/welcome/functions.ts index a68328d4e..c96e663a7 100644 --- a/react/features/welcome/functions.js +++ b/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); }