ref: Remove index files (#13154)

Fix imports
Convert some files to TS

react/features/authentication/components/index.native.ts

@@ -1,2 +1,5 @@
 // @ts-ignore
 export { default as LoginDialog } from './native/LoginDialog';
+// eslint-disable-next-line lines-around-comment
+// @ts-ignore
+export { default as WaitForOwnerDialog } from './native/WaitForOwnerDialog';

react/features/authentication/components/index.web.ts

@@ -1 +1,2 @@
 export { default as LoginDialog } from './web/LoginDialog';
+export { default as WaitForOwnerDialog } from './web/WaitForOwnerDialog';

react/features/base/dialog/components/native/BottomSheet.js

@@ -2,7 +2,7 @@ import React, { type Node, PureComponent } from 'react';
 import { SafeAreaView, ScrollView, View } from 'react-native';
 import { connect } from 'react-redux';
 
-import { SlidingView } from '../../../react';
+import SlidingView from '../../../react/components/native/SlidingView';
 import { hideSheet } from '../../actions';
 
 import { bottomSheetStyles as styles } from './styles';

react/features/base/icons/components/Icon.tsx

@@ -1,7 +1,6 @@
 import React, { useCallback } from 'react';
 
-// @ts-ignore
-import { Container } from '../../react/base';
+import { Container } from '../../react/components/index';
 import { styleTypeToObject } from '../../styles/functions';
 
 interface IProps {

react/features/base/media/components/native/Video.js

@@ -3,7 +3,7 @@
 import React, { Component } from 'react';
 import { RTCView } from 'react-native-webrtc';
 
-import { Pressable } from '../../../react';
+import Pressable from '../../../react/components/native/Pressable';
 
 import VideoTransform from './VideoTransform';
 import styles from './styles';

react/features/base/participants/components/ParticipantView.native.js

@@ -11,7 +11,7 @@ import Avatar from '../../avatar/components/Avatar';
 import { translate } from '../../i18n/functions';
 import VideoTrack from '../../media/components/native/VideoTrack';
 import { shouldRenderVideoTrack } from '../../media/functions';
-import { Container } from '../../react';
+import Container from '../../react/components/native/Container';
 import { toState } from '../../redux/functions';
 import TestHint from '../../testing/components/TestHint';
 import { getVideoTrackByParticipant } from '../../tracks/functions';

react/features/base/react/Types.js

@@ -1,90 +0,0 @@
-// @flow
-
-import type { ComponentType } from 'react';
-
-/**
- * Item data for <tt>NavigateSectionList</tt>.
- */
-export type Item = {
-
-    /**
-     * The avatar URL or icon name.
-     */
-    avatar: ?string,
-
-    /**
-     * The color base of the avatar.
-     */
-    colorBase: string,
-
-    /**
-     * An optional react element to append to the end of the Item.
-     */
-    elementAfter?: ?React$Node,
-
-    /**
-     * Unique ID of the item.
-     */
-    id: Object | string,
-
-    /**
-     * Item title.
-     */
-    title: string,
-
-    /**
-     * Item url.
-     */
-    url: string,
-
-    /**
-     * Lines[0] - date
-     * lines[1] - duration
-     * lines[2] - server name.
-     */
-    lines: Array<string>
-}
-
-/**
- * Web implementation of section data for NavigateSectionList.
- */
-export type Section = {
-
-    /**
-     * Section title.
-     */
-    title: string,
-
-    /**
-     * Unique key for the section.
-     */
-    key?: string,
-
-    /**
-     * Array of items in the section.
-     */
-    data: $ReadOnlyArray<Item>,
-
-    /**
-     * Optional properties added only to fix some flow errors thrown by React
-     * SectionList.
-     */
-    ItemSeparatorComponent?: ?ComponentType<any>,
-
-    keyExtractor?: (item: Object) => string,
-
-    renderItem?: ?(info: Object) => null | React$Element<any>
-
-}
-
-/**
- * Native implementation of section data for NavigateSectionList.
- *
- * When react-native's SectionList component parses through an array of sections
- * it passes the section nested within the section property of another object
- * to the renderSection method (on web for our own implementation of SectionList
- * this nesting is not implemented as there is no need for nesting).
- */
-export type SetionListSection = {
-    section: Section
-}

react/features/base/react/base.js

@@ -1,8 +0,0 @@
-// @flow
-
-/**
- * A list of base components to be exported without all the components being exported from
- * this feature to reduce package size of libraries.
- */
-
-export * from './components/base';

react/features/base/react/components/AbstractContainer.ts

@@ -20,7 +20,7 @@ export interface IProps {
     /**
      * React Elements to display within the component.
      */
-    children: ReactNode;
+    children?: ReactNode;
 
     /**
      * Class names of the component (for web).

react/features/base/react/components/_.native.js

@@ -1,3 +0,0 @@
-// @flow
-
-export * from './native';

react/features/base/react/components/_.web.js

@@ -1 +0,0 @@
-export * from './web';

react/features/base/react/components/base.native.js

@@ -1,3 +0,0 @@
-// @flow
-
-export { default as Container } from './native/Container';

react/features/base/react/components/base.web.js

@@ -1,3 +0,0 @@
-// @flow
-
-export { default as Container } from './web/Container';

react/features/base/react/components/index.js

@@ -1,5 +0,0 @@
-// @flow
-
-export * from './_';
-export { default as AbstractPage } from './AbstractPage';
-export { default as NavigateSectionList } from './NavigateSectionList';

react/features/base/react/components/index.native.ts

@@ -0,0 +1,5 @@
+/* eslint-disable lines-around-comment */
+// @ts-ignore
+export { default as Container } from './native/Container';
+// @ts-ignore
+export { default as Text } from './native/Text';

react/features/base/react/components/index.web.ts

@@ -0,0 +1,5 @@
+/* eslint-disable lines-around-comment */
+// @ts-ignore
+export { default as Container } from './web/Container';
+// @ts-ignore
+export { default as Text } from './web/Text';

react/features/base/react/components/native/AvatarListItem.js

@@ -5,7 +5,7 @@ import { Text } from 'react-native';
 
 import Avatar from '../../../avatar/components/Avatar';
 import { StyleType } from '../../../styles';
-import { type Item } from '../../Types';
+import { Item } from '../../types';
 
 import Container from './Container';
 import styles, { AVATAR_SIZE, UNDERLAY_COLOR } from './styles';

react/features/base/react/components/native/NavigateSectionList.js

@@ -4,14 +4,12 @@ import React, { Component } from 'react';
 
 // TODO: Maybe try to make all NavigateSectionList components to work for both
 // mobile and web, and move them to NavigateSectionList component.
-import type { Section } from '../Types';
+import { Section } from '../../types';
 
-import {
-    NavigateSectionListEmptyComponent,
-    NavigateSectionListItem,
-    NavigateSectionListSectionHeader,
-    SectionList
-} from './_';
+import NavigateSectionListEmptyComponent from './NavigateSectionListEmptyComponent';
+import NavigateSectionListItem from './NavigateSectionListItem';
+import NavigateSectionListSectionHeader from './NavigateSectionListSectionHeader';
+import SectionList from './SectionList';
 
 type Props = {
 

react/features/base/react/components/native/NavigateSectionListItem.js

@@ -5,7 +5,7 @@ import React, { Component } from 'react';
 import { IconPlus } from '../../../icons/svg';
 import IconButton from '../../../ui/components/native/IconButton';
 import { BUTTON_TYPES } from '../../../ui/constants.any';
-import type { Item } from '../../Types';
+import { Item } from '../../types';
 
 import AvatarListItem from './AvatarListItem';
 import Text from './Text';

react/features/base/react/components/native/NavigateSectionListSectionHeader.js

@@ -2,7 +2,7 @@
 
 import React, { Component } from 'react';
 
-import type { SetionListSection } from '../../Types';
+import { SectionListSection } from '../../types';
 
 import Container from './Container';
 import Text from './Text';
@@ -13,7 +13,7 @@ type Props = {
     /**
      * A section containing the data to be rendered.
      */
-    section: SetionListSection
+    section: SectionListSection
 }
 
 /**

react/features/base/react/components/native/SectionList.js

@@ -6,7 +6,7 @@ import {
     SafeAreaView
 } from 'react-native';
 
-import type { Section } from '../../Types';
+import { Section } from '../../types';
 
 import styles from './styles';
 

react/features/base/react/components/native/index.js

@@ -1,21 +0,0 @@
-// @flow
-
-export { default as AvatarListItem } from './AvatarListItem';
-export { default as BaseIndicator } from './BaseIndicator';
-export { default as Container } from './Container';
-export { default as Image } from './Image';
-export { default as Link } from './Link';
-export { default as Linkify } from './Linkify';
-export { default as LoadingIndicator } from './LoadingIndicator';
-export { default as Modal } from './Modal';
-export { default as NavigateSectionListEmptyComponent } from
-    './NavigateSectionListEmptyComponent';
-export { default as NavigateSectionListItem }
-    from './NavigateSectionListItem';
-export { default as NavigateSectionListSectionHeader }
-    from './NavigateSectionListSectionHeader';
-export { default as Pressable } from './Pressable';
-export { default as SectionList } from './SectionList';
-export { default as SlidingView } from './SlidingView';
-export { default as Text } from './Text';
-export { default as TintedView } from './TintedView';

react/features/base/react/components/web/BaseIndicator.tsx

@@ -39,7 +39,7 @@ interface IProps extends WithTranslation {
     /**
      * The font size for the icon.
      */
-    iconSize: string;
+    iconSize: string | number;
 
     /**
      * The ID attribute to set on the root element of the component.

react/features/base/react/components/web/Image.ts

@@ -6,7 +6,7 @@ import React, { Component } from 'react';
  *
  * @augments Component
  */
-export default class Image extends Component {
+export default class Image extends Component<React.HTMLProps<HTMLImageElement>> {
     /**
      * Implements React's {@link Component#render()}.
      *

react/features/base/react/components/web/LoadingIndicator.ts

@@ -1,3 +1 @@
-/* @flow */
-
 export { default } from '../../../ui/components/web/Spinner';

react/features/base/react/components/web/NavigateSectionListItem.js

@@ -2,7 +2,7 @@
 
 import React, { Component } from 'react';
 
-import type { Item } from '../../Types';
+import { Item } from '../../types';
 
 import Container from './Container';
 import Text from './Text';

react/features/base/react/components/web/NavigateSectionListSectionHeader.js

@@ -2,7 +2,7 @@
 
 import React, { Component } from 'react';
 
-import type { Section } from '../../Types';
+import { Section } from '../../types';
 
 import Text from './Text';
 

react/features/base/react/components/web/SectionList.js

@@ -2,7 +2,7 @@
 
 import React, { Component } from 'react';
 
-import type { Section } from '../../Types';
+import { Section } from '../../types';
 
 import Container from './Container';
 

react/features/base/react/components/web/Text.ts

@@ -8,7 +8,7 @@ import { getFixedPlatformStyle } from '../../../styles/functions.web';
  *
  * @augments Component
  */
-export default class Text extends Component {
+export default class Text extends Component<React.HTMLProps<HTMLSpanElement>> {
     /**
      * Implements React's {@link Component#render()}.
      *
@@ -16,7 +16,7 @@ export default class Text extends Component {
      * @returns {ReactElement}
      */
     render() {
-        // eslint-disable-next-line react/prop-types
+        // @ts-ignore
         const _style = getFixedPlatformStyle(this.props.style);
 
         return React.createElement('span', {

react/features/base/react/components/web/index.js

@@ -1,18 +0,0 @@
-// @flow
-
-export { default as BaseIndicator } from './BaseIndicator';
-export { default as Container } from './Container';
-export { default as Image } from './Image';
-export { default as Linkify } from './Linkify';
-export { default as LoadingIndicator } from './LoadingIndicator';
-export { default as MeetingsList } from './MeetingsList';
-export { default as MultiSelectAutocomplete } from './MultiSelectAutocomplete';
-export { default as NavigateSectionListEmptyComponent } from
-    './NavigateSectionListEmptyComponent';
-export { default as NavigateSectionListItem } from
-    './NavigateSectionListItem';
-export { default as NavigateSectionListSectionHeader }
-    from './NavigateSectionListSectionHeader';
-export { default as SectionList } from './SectionList';
-export { default as Text } from './Text';
-export { default as Watermarks } from './Watermarks';

react/features/base/react/index.js

@@ -1,5 +0,0 @@
-export * from './components';
-export * from './functions';
-
-export { default as Platform } from './Platform';
-export * from './Types';

react/features/base/react/types.ts

@@ -1,3 +1,5 @@
+import React from 'react';
+
 export interface IIconButtonProps {
     accessibilityLabel?: string;
     color?: string;
@@ -9,3 +11,90 @@ export interface IIconButtonProps {
     tapColor?: string;
     type?: string;
 }
+
+/**
+ * Item data for <tt>NavigateSectionList</tt>.
+ */
+export type Item = {
+
+    /**
+     * The avatar URL or icon name.
+     */
+    avatar?: string;
+
+    /**
+     * The color base of the avatar.
+     */
+    colorBase: string;
+
+    /**
+     * An optional react element to append to the end of the Item.
+     */
+    elementAfter?: React.ReactNode;
+
+    /**
+     * Unique ID of the item.
+     */
+    id: Object | string;
+
+    /**
+     * Lines[0] - date
+     * lines[1] - duration
+     * lines[2] - server name.
+     */
+    lines: Array<string>;
+
+    /**
+     * Item title.
+     */
+    title: string;
+
+    /**
+     * Item url.
+     */
+    url: string;
+};
+
+/**
+ * Web implementation of section data for NavigateSectionList.
+ */
+export type Section = {
+
+    /**
+     * Optional properties added only to fix some flow errors thrown by React
+     * SectionList.
+     */
+    ItemSeparatorComponent?: React.ComponentType<any>;
+
+    /**
+     * Array of items in the section.
+     */
+    data: ReadonlyArray<Item>;
+
+    /**
+     * Unique key for the section.
+     */
+    key?: string;
+
+    keyExtractor?: (item: Object) => string;
+
+    renderItem?: (info: Object) => null | React.ReactElement<any>;
+
+    /**
+     * Section title.
+     */
+    title: string;
+
+};
+
+/**
+ * Native implementation of section data for NavigateSectionList.
+ *
+ * When react-native's SectionList component parses through an array of sections
+ * it passes the section nested within the section property of another object
+ * to the renderSection method (on web for our own implementation of SectionList
+ * this nesting is not implemented as there is no need for nesting).
+ */
+export type SectionListSection = {
+    section: Section;
+};

react/features/base/styles/functions.web.ts

@@ -9,7 +9,7 @@ export * from './functions.any';
  * @param {StyleType} style - The passed style prop to the component.
  * @returns {StyleType}
  */
-export function getFixedPlatformStyle(style: StyleType): StyleType {
+export function getFixedPlatformStyle(style?: StyleType) {
     if (Array.isArray(style)) {
         const _style = {};
 

react/features/calendar-sync/components/CalendarList.native.js

@@ -9,7 +9,7 @@ import {
 import { connect } from 'react-redux';
 
 import { translate } from '../../base/i18n/functions';
-import { AbstractPage } from '../../base/react';
+import AbstractPage from '../../base/react/components/AbstractPage';
 import { openSettings } from '../../mobile/permissions/functions';
 import { refreshCalendar } from '../actions';
 

react/features/calendar-sync/components/CalendarList.web.js

@@ -8,7 +8,7 @@ import { sendAnalytics } from '../../analytics/functions';
 import { translate } from '../../base/i18n/functions';
 import Icon from '../../base/icons/components/Icon';
 import { IconCalendar } from '../../base/icons/svg';
-import { AbstractPage } from '../../base/react';
+import AbstractPage from '../../base/react/components/AbstractPage';
 import Spinner from '../../base/ui/components/web/Spinner';
 import { openSettingsDialog } from '../../settings/actions';
 import { SETTINGS_TABS } from '../../settings/constants';

react/features/calendar-sync/components/CalendarListContent.native.js

@@ -7,7 +7,7 @@ import { createCalendarClickedEvent, createCalendarSelectedEvent } from '../../a
 import { sendAnalytics } from '../../analytics/functions';
 import { appNavigate } from '../../app/actions';
 import { getLocalizedDateFormatter, translate } from '../../base/i18n/functions';
-import { NavigateSectionList } from '../../base/react';
+import NavigateSectionList from '../../base/react/components/native/NavigateSectionList';
 import { openUpdateCalendarEventDialog, refreshCalendar } from '../actions';
 
 

react/features/calendar-sync/components/CalendarListContent.web.js

@@ -6,7 +6,7 @@ import { connect } from 'react-redux';
 import { createCalendarClickedEvent, createCalendarSelectedEvent } from '../../analytics/AnalyticsEvents';
 import { sendAnalytics } from '../../analytics/functions';
 import { appNavigate } from '../../app/actions';
-import { MeetingsList } from '../../base/react';
+import MeetingsList from '../../base/react/components/web/MeetingsList';
 
 import AddMeetingUrlButton from './AddMeetingUrlButton';
 import JoinButton from './JoinButton';

react/features/chat/components/native/ChatMessage.js

@@ -4,7 +4,7 @@ import { connect } from 'react-redux';
 
 import Avatar from '../../../base/avatar/components/Avatar';
 import { translate } from '../../../base/i18n/functions';
-import { Linkify } from '../../../base/react';
+import Linkify from '../../../base/react/components/native/Linkify';
 import { isGifMessage } from '../../../gifs/functions';
 import { MESSAGE_TYPE_ERROR, MESSAGE_TYPE_LOCAL } from '../../constants';
 import { replaceNonUnicodeEmojis } from '../../functions';

react/features/conference/components/native/Conference.js

@@ -17,7 +17,9 @@ import { appNavigate } from '../../../app/actions';
 import { FULLSCREEN_ENABLED, PIP_ENABLED } from '../../../base/flags/constants';
 import { getFeatureFlag } from '../../../base/flags/functions';
 import { getParticipantCount } from '../../../base/participants/functions';
-import { Container, LoadingIndicator, TintedView } from '../../../base/react';
+import Container from '../../../base/react/components/native/Container';
+import LoadingIndicator from '../../../base/react/components/native/LoadingIndicator';
+import TintedView from '../../../base/react/components/native/TintedView';
 import { ASPECT_RATIO_NARROW } from '../../../base/responsive-ui/constants';
 import TestConnectionInfo from '../../../base/testing/components/TestConnectionInfo';
 import { isCalendarEnabled } from '../../../calendar-sync/functions.native';

react/features/conference/components/native/carmode/CarMode.tsx

@@ -8,7 +8,9 @@ import { useDispatch, useSelector } from 'react-redux';
 // @ts-ignore
 import JitsiScreen from '../../../../base/modal/components/JitsiScreen';
 // @ts-ignore
-import { LoadingIndicator, TintedView } from '../../../../base/react';
+import LoadingIndicator from '../../../../base/react/components/native/LoadingIndicator';
+// @ts-ignore
+import TintedView from '../../../../base/react/components/native/TintedView';
 import { isLocalVideoTrackDesktop } from '../../../../base/tracks/functions.native';
 // @ts-ignore
 import { setPictureInPictureEnabled } from '../../../../mobile/picture-in-picture/functions';

react/features/deep-linking/functions.js

@@ -1,7 +1,7 @@
 /* global interfaceConfig */
 
 import { isMobileBrowser } from '../base/environment/utils';
-import { Platform } from '../base/react';
+import Platform from '../base/react/Platform';
 import { URI_PROTOCOL_PATTERN } from '../base/util/uri';
 import { isVpaasMeeting } from '../jaas/functions';
 

react/features/desktop-picker/components/DesktopPickerPane.js

@@ -3,7 +3,7 @@
 import React, { Component } from 'react';
 
 import { translate } from '../../base/i18n/functions';
-import { Platform } from '../../base/react';
+import Platform from '../../base/react/Platform.web';
 import Checkbox from '../../base/ui/components/web/Checkbox';
 import Spinner from '../../base/ui/components/web/Spinner';
 

react/features/etherpad/components/native/SharedDocument.js

@@ -5,7 +5,7 @@ import { connect } from 'react-redux';
 
 import { translate } from '../../../base/i18n/functions';
 import JitsiScreen from '../../../base/modal/components/JitsiScreen';
-import { LoadingIndicator } from '../../../base/react';
+import LoadingIndicator from '../../../base/react/components/native/LoadingIndicator';
 import { getSharedDocumentUrl } from '../../functions';
 
 import styles, { INDICATOR_COLOR } from './styles';

react/features/filmstrip/components/native/AudioMutedIndicator.js

@@ -3,7 +3,7 @@
 import React, { Component } from 'react';
 
 import { IconMicSlash } from '../../../base/icons/svg';
-import { BaseIndicator } from '../../../base/react';
+import BaseIndicator from '../../../base/react/components/native/BaseIndicator';
 
 /**
  * Thumbnail badge for displaying the audio mute status of a participant.

react/features/filmstrip/components/native/Filmstrip.js

@@ -6,7 +6,7 @@ import { SafeAreaView, withSafeAreaInsets } from 'react-native-safe-area-context
 import { connect } from 'react-redux';
 
 import { getLocalParticipant } from '../../../base/participants/functions';
-import { Platform } from '../../../base/react';
+import Platform from '../../../base/react/Platform.native';
 import { ASPECT_RATIO_NARROW } from '../../../base/responsive-ui/constants';
 import { getHideSelfView } from '../../../base/settings/functions.any';
 import { isToolboxVisible } from '../../../toolbox/functions';

react/features/filmstrip/components/native/ModeratorIndicator.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import { IconModerator } from '../../../base/icons/svg';
 // eslint-disable-next-line lines-around-comment
 // @ts-ignore
-import { BaseIndicator } from '../../../base/react';
+import BaseIndicator from '../../../base/react/components/native/BaseIndicator';
 
 /**
  * Thumbnail badge showing that the participant is a conference moderator.

react/features/filmstrip/components/native/PinnedIndicator.js

@@ -3,7 +3,7 @@
 import React from 'react';
 
 import { IconPin } from '../../../base/icons/svg';
-import { BaseIndicator } from '../../../base/react';
+import BaseIndicator from '../../../base/react/components/native/BaseIndicator';
 
 /**
  * Thumbnail badge for displaying if a participant is pinned.

react/features/filmstrip/components/native/RaisedHandIndicator.js

@@ -5,7 +5,7 @@ import { View } from 'react-native';
 import { connect } from 'react-redux';
 
 import { IconRaiseHand } from '../../../base/icons/svg';
-import { BaseIndicator } from '../../../base/react';
+import BaseIndicator from '../../../base/react/components/native/BaseIndicator';
 import AbstractRaisedHandIndicator, {
     _mapStateToProps
 } from '../AbstractRaisedHandIndicator';

react/features/filmstrip/components/native/ScreenShareIndicator.js

@@ -3,7 +3,7 @@
 import React from 'react';
 
 import { IconScreenshare } from '../../../base/icons/svg';
-import { BaseIndicator } from '../../../base/react';
+import BaseIndicator from '../../../base/react/components/native/BaseIndicator';
 
 /**
  * Thumbnail badge for displaying if a participant is sharing their screen.

react/features/filmstrip/components/native/Thumbnail.js

@@ -17,7 +17,7 @@ import {
     isScreenShareParticipant
 } from '../../../base/participants/functions';
 import { FakeParticipant } from '../../../base/participants/types';
-import { Container } from '../../../base/react';
+import Container from '../../../base/react/components/native/Container';
 import { trackStreamingStatusChanged } from '../../../base/tracks/actions.native';
 import {
     getTrackByMediaTypeAndParticipant,

react/features/filmstrip/components/web/AudioMutedIndicator.js

@@ -3,7 +3,7 @@
 import React from 'react';
 
 import { IconMicSlash } from '../../../base/icons/svg';
-import { BaseIndicator } from '../../../base/react';
+import BaseIndicator from '../../../base/react/components/web/BaseIndicator';
 
 /**
  * The type of the React {@code Component} props of {@link AudioMutedIndicator}.

react/features/filmstrip/components/web/ModeratorIndicator.tsx

@@ -1,9 +1,7 @@
 import React from 'react';
 
 import { IconModerator } from '../../../base/icons/svg';
-// eslint-disable-next-line lines-around-comment
-// @ts-ignore
-import { BaseIndicator } from '../../../base/react';
+import BaseIndicator from '../../../base/react/components/web/BaseIndicator';
 
 /**
  * The type of the React {@code Component} props of {@link ModeratorIndicator}.
@@ -13,7 +11,7 @@ interface IProps {
     /**
      * From which side of the indicator the tooltip should appear from.
      */
-    tooltipPosition: string;
+    tooltipPosition: 'top' | 'bottom' | 'left' | 'right';
 }
 
 /**

react/features/filmstrip/components/web/ScreenShareIndicator.js

@@ -3,7 +3,7 @@
 import React from 'react';
 
 import { IconScreenshare } from '../../../base/icons/svg';
-import { BaseIndicator } from '../../../base/react';
+import BaseIndicator from '../../../base/react/components/web/BaseIndicator';
 
 
 type Props = {

react/features/invite/components/add-people-dialog/native/AddPeopleDialog.js

@@ -20,7 +20,8 @@ import {
     IconShare
 } from '../../../../base/icons/svg';
 import JitsiScreen from '../../../../base/modal/components/JitsiScreen';
-import { AvatarListItem, type Item } from '../../../../base/react';
+import AvatarListItem from '../../../../base/react/components/native/AvatarListItem';
+import { Item } from '../../../../base/react/types';
 import BaseTheme from '../../../../base/ui/components/BaseTheme.native';
 import Input from '../../../../base/ui/components/native/Input';
 import HeaderNavigationButton

react/features/invite/components/add-people-dialog/web/InviteContactsForm.js

@@ -9,7 +9,7 @@ import Avatar from '../../../../base/avatar/components/Avatar';
 import { translate } from '../../../../base/i18n/functions';
 import Icon from '../../../../base/icons/components/Icon';
 import { IconPhoneRinging } from '../../../../base/icons/svg';
-import { MultiSelectAutocomplete } from '../../../../base/react';
+import MultiSelectAutocomplete from '../../../../base/react/components/web/MultiSelectAutocomplete';
 import { isVpaasMeeting } from '../../../../jaas/functions';
 import { hideAddPeopleDialog } from '../../../actions';
 import { INVITE_TYPES } from '../../../constants';

react/features/invite/components/callee-info/CalleeInfo.js

@@ -10,7 +10,7 @@ import {
     getParticipantPresenceStatus,
     getRemoteParticipants
 } from '../../../base/participants/functions';
-import { Container, Text } from '../../../base/react';
+import { Container, Text } from '../../../base/react/components/index';
 import { isLocalTrackMuted } from '../../../base/tracks/functions.any';
 import PresenceLabel from '../../../presence-status/components/PresenceLabel';
 import { CALLING } from '../../../presence-status/constants';

react/features/invite/components/dial-in-summary/native/DialInSummary.js

@@ -9,7 +9,7 @@ import { type Dispatch } from 'redux';
 import { openDialog } from '../../../../base/dialog/actions';
 import { translate } from '../../../../base/i18n/functions';
 import JitsiScreen from '../../../../base/modal/components/JitsiScreen';
-import { LoadingIndicator } from '../../../../base/react';
+import LoadingIndicator from '../../../../base/react/components/native/LoadingIndicator';
 import { getDialInfoPageURLForURIString } from '../../../functions';
 
 import DialInSummaryErrorDialog from './DialInSummaryErrorDialog';

react/features/large-video/components/LargeVideo.web.js

@@ -6,7 +6,7 @@ import { connect } from 'react-redux';
 import VideoLayout from '../../../../modules/UI/videolayout/VideoLayout';
 import { VIDEO_TYPE } from '../../base/media/constants';
 import { getLocalParticipant } from '../../base/participants/functions';
-import { Watermarks } from '../../base/react';
+import Watermarks from '../../base/react/components/web/Watermarks';
 import { getHideSelfView } from '../../base/settings/functions.any';
 import { getVideoTrackByParticipant } from '../../base/tracks/functions.web';
 import { setColorAlpha } from '../../base/util/helpers';

react/features/lobby/components/native/LobbyScreen.js

@@ -5,7 +5,7 @@ import { connect } from 'react-redux';
 import { getConferenceName } from '../../../base/conference/functions';
 import { translate } from '../../../base/i18n/functions';
 import JitsiScreen from '../../../base/modal/components/JitsiScreen';
-import { LoadingIndicator } from '../../../base/react';
+import LoadingIndicator from '../../../base/react/components/native/LoadingIndicator';
 import { ASPECT_RATIO_NARROW } from '../../../base/responsive-ui/constants';
 import BaseTheme from '../../../base/ui/components/BaseTheme.native';
 import Button from '../../../base/ui/components/native/Button';

react/features/lobby/components/web/LobbyScreen.js

@@ -7,7 +7,7 @@ import { translate } from '../../../base/i18n/functions';
 import Icon from '../../../base/icons/components/Icon';
 import { IconCloseLarge } from '../../../base/icons/svg';
 import PreMeetingScreen from '../../../base/premeeting/components/web/PreMeetingScreen';
-import { LoadingIndicator } from '../../../base/react';
+import LoadingIndicator from '../../../base/react/components/web/LoadingIndicator';
 import Button from '../../../base/ui/components/web/Button';
 import Input from '../../../base/ui/components/web/Input';
 import ChatInput from '../../../chat/components/web/ChatInput';

react/features/mobile/full-screen/middleware.js

@@ -7,7 +7,7 @@ import { getCurrentConference } from '../../base/conference/functions';
 import { isAnyDialogOpen } from '../../base/dialog/functions';
 import { FULLSCREEN_ENABLED } from '../../base/flags/constants';
 import { getFeatureFlag } from '../../base/flags/functions';
-import { Platform } from '../../base/react';
+import Platform from '../../base/react/Platform.native';
 import MiddlewareRegistry from '../../base/redux/MiddlewareRegistry';
 import StateListenerRegistry from '../../base/redux/StateListenerRegistry';
 

react/features/mobile/permissions/functions.js

@@ -2,7 +2,7 @@
 
 import { Alert, Linking, NativeModules } from 'react-native';
 
-import { Platform } from '../../base/react';
+import Platform from '../../base/react/Platform.native';
 
 /**
  * Opens the settings panel for the current platform.

react/features/mobile/picture-in-picture/actions.js

@@ -5,7 +5,7 @@ import type { Dispatch } from 'redux';
 
 import { PIP_ENABLED } from '../../base/flags/constants';
 import { getFeatureFlag } from '../../base/flags/functions';
-import { Platform } from '../../base/react';
+import Platform from '../../base/react/Platform.native';
 
 import { ENTER_PICTURE_IN_PICTURE } from './actionTypes';
 import logger from './logger';

react/features/presence-status/components/PresenceLabel.js

@@ -5,7 +5,7 @@ import { connect } from 'react-redux';
 
 import { translate } from '../../base/i18n/functions';
 import { getParticipantById } from '../../base/participants/functions';
-import { Text } from '../../base/react';
+import { Text } from '../../base/react/components/index';
 import { STATUS_TO_I18N_KEY } from '../constants';
 import { presenceStatusDisabled } from '../functions';
 

react/features/recent-list/components/AbstractRecentList.tsx

@@ -4,13 +4,8 @@ import { createRecentClickedEvent, createRecentSelectedEvent } from '../../analy
 import { sendAnalytics } from '../../analytics/functions';
 import { appNavigate } from '../../app/actions';
 import { IStore } from '../../app/types';
-import {
-    Container,
-    Text
-
-    // @ts-ignore
-} from '../../base/react';
 import AbstractPage from '../../base/react/components/AbstractPage';
+import { Container, Text } from '../../base/react/components/index';
 
 // @ts-ignore
 import styles from './styles';

react/features/recent-list/components/RecentList.native.js

@@ -6,7 +6,8 @@ import type { Dispatch } from 'redux';
 import { getDefaultURL } from '../../app/functions';
 import { openSheet } from '../../base/dialog/actions';
 import { translate } from '../../base/i18n/functions';
-import { NavigateSectionList, type Section } from '../../base/react';
+import NavigateSectionList from '../../base/react/components/native/NavigateSectionList';
+import { Section } from '../../base/react/types';
 import styles from '../../welcome/components/styles';
 import { isRecentListEnabled, toDisplayableList } from '../functions';
 

react/features/recent-list/components/RecentList.web.js

@@ -5,7 +5,7 @@ import { connect } from 'react-redux';
 import type { Dispatch } from 'redux';
 
 import { translate } from '../../base/i18n/functions';
-import { MeetingsList } from '../../base/react';
+import MeetingsList from '../../base/react/components/web/MeetingsList';
 import { deleteRecentListEntry } from '../actions';
 import { isRecentListEnabled, toDisplayableList } from '../functions';
 

react/features/recent-list/components/RecentListItemMenu.native.js

@@ -5,7 +5,7 @@ import { connect } from 'react-redux';
 import { hideSheet } from '../../base/dialog/actions';
 import BottomSheet from '../../base/dialog/components/native/BottomSheet';
 import { bottomSheetStyles } from '../../base/dialog/components/native/styles';
-import { type Item } from '../../base/react/Types';
+import { Item } from '../../base/react/types';
 
 import DeleteItemButton from './DeleteItemButton.native';
 import ShowDialInInfoButton from './ShowDialInInfoButton.native';

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

@@ -4,7 +4,7 @@ import {
 } from '../base/i18n/dateUtil';
 // eslint-disable-next-line lines-around-comment
 // @ts-ignore
-import { NavigateSectionList } from '../base/react';
+import NavigateSectionList from '../base/react/components/native/NavigateSectionList';
 import { parseURIString, safeDecodeURIComponent } from '../base/util/uri';
 
 import { IRecentItem } from './types';

react/features/recording/components/Recording/native/StartRecordingDialogContent.tsx

@@ -6,7 +6,7 @@ import { connect } from 'react-redux';
 
 import { translate } from '../../../../base/i18n/functions';
 // @ts-ignore
-import { LoadingIndicator } from '../../../../base/react';
+import LoadingIndicator from '../../../../base/react/components/native/LoadingIndicator';
 import Button from '../../../../base/ui/components/native/Button';
 import Switch from '../../../../base/ui/components/native/Switch';
 import { BUTTON_TYPES } from '../../../../base/ui/constants.native';

react/features/recording/components/Recording/web/StartRecordingDialogContent.tsx

@@ -3,13 +3,10 @@ import React from 'react';
 import { connect } from 'react-redux';
 
 import { translate } from '../../../../base/i18n/functions';
-import {
-    Container,
-    Image,
-    LoadingIndicator,
-    Text
-    // @ts-ignore
-} from '../../../../base/react';
+import Container from '../../../../base/react/components/web/Container';
+import Image from '../../../../base/react/components/web/Image';
+import LoadingIndicator from '../../../../base/react/components/web/LoadingIndicator';
+import Text from '../../../../base/react/components/web/Text';
 import Button from '../../../../base/ui/components/web/Button';
 import Switch from '../../../../base/ui/components/web/Switch';
 import { BUTTON_TYPES } from '../../../../base/ui/constants.web';

react/features/salesforce/components/native/SalesforceLinkDialog.js

@@ -5,7 +5,7 @@ import { useSelector } from 'react-redux';
 
 import { IconSearch } from '../../../base/icons/svg';
 import JitsiScreen from '../../../base/modal/components/JitsiScreen';
-import { LoadingIndicator } from '../../../base/react';
+import LoadingIndicator from '../../../base/react/components/native/LoadingIndicator';
 import Button from '../../../base/ui/components/native/Button';
 import Input from '../../../base/ui/components/native/Input';
 import { BUTTON_TYPES } from '../../../base/ui/constants.native';

react/features/subtitles/components/Captions.native.js

@@ -3,7 +3,8 @@
 import React from 'react';
 import { connect } from 'react-redux';
 
-import { Container, Text } from '../../base/react';
+import Container from '../../base/react/components/native/Container';
+import Text from '../../base/react/components/native/Text';
 
 import {
     AbstractCaptions,

react/features/toolbox/components/native/OverflowMenu.js

@@ -15,7 +15,7 @@ import LiveStreamButton from '../../../recording/components/LiveStream/native/Li
 import RecordButton from '../../../recording/components/Recording/native/RecordButton';
 import SecurityDialogButton
     from '../../../security/components/security-dialog/native/SecurityDialogButton';
-import { SharedVideoButton } from '../../../shared-video/components';
+import SharedVideoButton from '../../../shared-video/components/native/SharedVideoButton';
 import SpeakerStatsButton from '../../../speaker-stats/components/native/SpeakerStatsButton';
 import { isSpeakerStatsDisabled } from '../../../speaker-stats/functions';
 import ClosedCaptionButton from '../../../subtitles/components/ClosedCaptionButton.native';

react/features/toolbox/components/native/Toolbox.js

@@ -6,7 +6,7 @@ import { SafeAreaView } from 'react-native-safe-area-context';
 import { connect } from 'react-redux';
 
 import ColorSchemeRegistry from '../../../base/color-scheme/ColorSchemeRegistry';
-import { Platform } from '../../../base/react';
+import Platform from '../../../base/react/Platform.native';
 import { StyleType } from '../../../base/styles/functions.native';
 import ChatButton from '../../../chat/components/native/ChatButton';
 import ReactionsMenuButton from '../../../reactions/components/native/ReactionsMenuButton';

react/features/video-menu/components/native/SharedVideoMenu.js

@@ -13,7 +13,7 @@ import {
     getParticipantById,
     getParticipantDisplayName
 } from '../../../base/participants/functions';
-import { SharedVideoButton } from '../../../shared-video/components';
+import SharedVideoButton from '../../../shared-video/components/native/SharedVideoButton';
 
 import styles from './styles';
 

react/features/welcome/components/WelcomePage.native.js

@@ -6,7 +6,8 @@ import { getName } from '../../app/functions';
 import { translate } from '../../base/i18n/functions';
 import Icon from '../../base/icons/components/Icon';
 import { IconWarning } from '../../base/icons/svg';
-import { LoadingIndicator, Text } from '../../base/react';
+import LoadingIndicator from '../../base/react/components/native/LoadingIndicator';
+import Text from '../../base/react/components/native/Text';
 import BaseTheme from '../../base/ui/components/BaseTheme.native';
 import Button from '../../base/ui/components/native/Button';
 import Input from '../../base/ui/components/native/Input';

react/features/welcome/components/WelcomePage.web.js

@@ -7,7 +7,7 @@ import { isMobileBrowser } from '../../base/environment/utils';
 import { translate, translateToHTML } from '../../base/i18n/functions';
 import Icon from '../../base/icons/components/Icon';
 import { IconWarning } from '../../base/icons/svg';
-import { Watermarks } from '../../base/react';
+import Watermarks from '../../base/react/components/web/Watermarks';
 import CalendarList from '../../calendar-sync/components/CalendarList.web';
 import RecentList from '../../recent-list/components/RecentList.web';
 import SettingsButton from '../../settings/components/web/SettingsButton';

react/index.web.js

@@ -5,7 +5,7 @@ import ReactDOM from 'react-dom';
 
 import { App } from './features/app/components/App.web';
 import { getLogger } from './features/base/logging/functions';
-import { Platform } from './features/base/react';
+import Platform from './features/base/react/Platform.web';
 import { getJitsiMeetGlobalNS } from './features/base/util/helpers';
 import DialInSummaryApp from './features/invite/components/dial-in-summary/web/DialInSummaryApp';
 import PrejoinApp from './features/prejoin/components/web/PrejoinApp';