diff --git a/react/features/authentication/components/index.native.ts b/react/features/authentication/components/index.native.ts
index 59b1bbed5e..b5a75f2da1 100644
--- a/react/features/authentication/components/index.native.ts
+++ b/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';
diff --git a/react/features/authentication/components/index.web.ts b/react/features/authentication/components/index.web.ts
index 584e9bc626..3f648f2342 100644
--- a/react/features/authentication/components/index.web.ts
+++ b/react/features/authentication/components/index.web.ts
@@ -1 +1,2 @@
export { default as LoginDialog } from './web/LoginDialog';
+export { default as WaitForOwnerDialog } from './web/WaitForOwnerDialog';
diff --git a/react/features/base/dialog/components/native/BottomSheet.js b/react/features/base/dialog/components/native/BottomSheet.js
index 891cd2fb6d..c4af2adb5a 100644
--- a/react/features/base/dialog/components/native/BottomSheet.js
+++ b/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';
diff --git a/react/features/base/icons/components/Icon.tsx b/react/features/base/icons/components/Icon.tsx
index 0831c21b82..1d0d0f237f 100644
--- a/react/features/base/icons/components/Icon.tsx
+++ b/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 {
diff --git a/react/features/base/media/components/native/Video.js b/react/features/base/media/components/native/Video.js
index 6f84378dd6..a1ce4fd7d3 100644
--- a/react/features/base/media/components/native/Video.js
+++ b/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';
diff --git a/react/features/base/participants/components/ParticipantView.native.js b/react/features/base/participants/components/ParticipantView.native.js
index 49e2aa3c40..b9d5e472b9 100644
--- a/react/features/base/participants/components/ParticipantView.native.js
+++ b/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';
diff --git a/react/features/base/react/Types.js b/react/features/base/react/Types.js
deleted file mode 100644
index 417bfe1031..0000000000
--- a/react/features/base/react/Types.js
+++ /dev/null
@@ -1,90 +0,0 @@
-// @flow
-
-import type { ComponentType } from 'react';
-
-/**
- * Item data for NavigateSectionList.
- */
-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
-}
-
-/**
- * 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- ,
-
- /**
- * Optional properties added only to fix some flow errors thrown by React
- * SectionList.
- */
- ItemSeparatorComponent?: ?ComponentType,
-
- keyExtractor?: (item: Object) => string,
-
- renderItem?: ?(info: Object) => null | React$Element
-
-}
-
-/**
- * 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
-}
diff --git a/react/features/base/react/base.js b/react/features/base/react/base.js
deleted file mode 100644
index ee42a7e846..0000000000
--- a/react/features/base/react/base.js
+++ /dev/null
@@ -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';
diff --git a/react/features/base/react/components/AbstractContainer.ts b/react/features/base/react/components/AbstractContainer.ts
index 9911b25c7f..11b109c0cb 100644
--- a/react/features/base/react/components/AbstractContainer.ts
+++ b/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).
diff --git a/react/features/base/react/components/_.native.js b/react/features/base/react/components/_.native.js
deleted file mode 100644
index a32ec60612..0000000000
--- a/react/features/base/react/components/_.native.js
+++ /dev/null
@@ -1,3 +0,0 @@
-// @flow
-
-export * from './native';
diff --git a/react/features/base/react/components/_.web.js b/react/features/base/react/components/_.web.js
deleted file mode 100644
index b80c83af34..0000000000
--- a/react/features/base/react/components/_.web.js
+++ /dev/null
@@ -1 +0,0 @@
-export * from './web';
diff --git a/react/features/base/react/components/base.native.js b/react/features/base/react/components/base.native.js
deleted file mode 100644
index 5eaaba670c..0000000000
--- a/react/features/base/react/components/base.native.js
+++ /dev/null
@@ -1,3 +0,0 @@
-// @flow
-
-export { default as Container } from './native/Container';
diff --git a/react/features/base/react/components/base.web.js b/react/features/base/react/components/base.web.js
deleted file mode 100644
index 8504922d1d..0000000000
--- a/react/features/base/react/components/base.web.js
+++ /dev/null
@@ -1,3 +0,0 @@
-// @flow
-
-export { default as Container } from './web/Container';
diff --git a/react/features/base/react/components/index.js b/react/features/base/react/components/index.js
deleted file mode 100644
index b8ef0a4c8a..0000000000
--- a/react/features/base/react/components/index.js
+++ /dev/null
@@ -1,5 +0,0 @@
-// @flow
-
-export * from './_';
-export { default as AbstractPage } from './AbstractPage';
-export { default as NavigateSectionList } from './NavigateSectionList';
diff --git a/react/features/base/react/components/index.native.ts b/react/features/base/react/components/index.native.ts
new file mode 100644
index 0000000000..f38dab133a
--- /dev/null
+++ b/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';
diff --git a/react/features/base/react/components/index.web.ts b/react/features/base/react/components/index.web.ts
new file mode 100644
index 0000000000..150eee51ff
--- /dev/null
+++ b/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';
diff --git a/react/features/base/react/components/native/AvatarListItem.js b/react/features/base/react/components/native/AvatarListItem.js
index dcafe51dc1..c451c32323 100644
--- a/react/features/base/react/components/native/AvatarListItem.js
+++ b/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';
diff --git a/react/features/base/react/components/NavigateSectionList.js b/react/features/base/react/components/native/NavigateSectionList.js
similarity index 95%
rename from react/features/base/react/components/NavigateSectionList.js
rename to react/features/base/react/components/native/NavigateSectionList.js
index eb8bb1511a..1ff24f4ef0 100644
--- a/react/features/base/react/components/NavigateSectionList.js
+++ b/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 {
- NavigateSectionListEmptyComponent,
- NavigateSectionListItem,
- NavigateSectionListSectionHeader,
- SectionList
-} from './_';
+import { Section } from '../../types';
+
+import NavigateSectionListEmptyComponent from './NavigateSectionListEmptyComponent';
+import NavigateSectionListItem from './NavigateSectionListItem';
+import NavigateSectionListSectionHeader from './NavigateSectionListSectionHeader';
+import SectionList from './SectionList';
type Props = {
diff --git a/react/features/base/react/components/native/NavigateSectionListItem.js b/react/features/base/react/components/native/NavigateSectionListItem.js
index 6bc3a52503..930120c6fa 100644
--- a/react/features/base/react/components/native/NavigateSectionListItem.js
+++ b/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';
diff --git a/react/features/base/react/components/native/NavigateSectionListSectionHeader.js b/react/features/base/react/components/native/NavigateSectionListSectionHeader.js
index 5874ef0108..7fdd955aac 100644
--- a/react/features/base/react/components/native/NavigateSectionListSectionHeader.js
+++ b/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
}
/**
diff --git a/react/features/base/react/components/native/SectionList.js b/react/features/base/react/components/native/SectionList.js
index d3ad2c054d..d046471e0a 100644
--- a/react/features/base/react/components/native/SectionList.js
+++ b/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';
diff --git a/react/features/base/react/components/native/index.js b/react/features/base/react/components/native/index.js
deleted file mode 100644
index 888b3d8c37..0000000000
--- a/react/features/base/react/components/native/index.js
+++ /dev/null
@@ -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';
diff --git a/react/features/base/react/components/web/BaseIndicator.tsx b/react/features/base/react/components/web/BaseIndicator.tsx
index 9504288e47..744d7f80d7 100644
--- a/react/features/base/react/components/web/BaseIndicator.tsx
+++ b/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.
diff --git a/react/features/base/react/components/web/Image.js b/react/features/base/react/components/web/Image.ts
similarity index 83%
rename from react/features/base/react/components/web/Image.js
rename to react/features/base/react/components/web/Image.ts
index c2468599f8..27e5557ff3 100644
--- a/react/features/base/react/components/web/Image.js
+++ b/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> {
/**
* Implements React's {@link Component#render()}.
*
diff --git a/react/features/base/react/components/web/LoadingIndicator.js b/react/features/base/react/components/web/LoadingIndicator.ts
similarity index 82%
rename from react/features/base/react/components/web/LoadingIndicator.js
rename to react/features/base/react/components/web/LoadingIndicator.ts
index 7541a60961..11074690e7 100644
--- a/react/features/base/react/components/web/LoadingIndicator.js
+++ b/react/features/base/react/components/web/LoadingIndicator.ts
@@ -1,3 +1 @@
-/* @flow */
-
export { default } from '../../../ui/components/web/Spinner';
diff --git a/react/features/base/react/components/web/NavigateSectionListItem.js b/react/features/base/react/components/web/NavigateSectionListItem.js
index ba99e28d1b..2857440ac2 100644
--- a/react/features/base/react/components/web/NavigateSectionListItem.js
+++ b/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';
diff --git a/react/features/base/react/components/web/NavigateSectionListSectionHeader.js b/react/features/base/react/components/web/NavigateSectionListSectionHeader.js
index 372fe47c23..0ea11c7097 100644
--- a/react/features/base/react/components/web/NavigateSectionListSectionHeader.js
+++ b/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';
diff --git a/react/features/base/react/components/web/SectionList.js b/react/features/base/react/components/web/SectionList.js
index 337b74051d..188a35dbce 100644
--- a/react/features/base/react/components/web/SectionList.js
+++ b/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';
diff --git a/react/features/base/react/components/web/Text.js b/react/features/base/react/components/web/Text.ts
similarity index 86%
rename from react/features/base/react/components/web/Text.js
rename to react/features/base/react/components/web/Text.ts
index e1ec80a8e1..d7c9315971 100644
--- a/react/features/base/react/components/web/Text.js
+++ b/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> {
/**
* 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', {
diff --git a/react/features/base/react/components/web/index.js b/react/features/base/react/components/web/index.js
deleted file mode 100644
index acbfc5244c..0000000000
--- a/react/features/base/react/components/web/index.js
+++ /dev/null
@@ -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';
diff --git a/react/features/base/react/index.js b/react/features/base/react/index.js
deleted file mode 100644
index 08e8cd7b82..0000000000
--- a/react/features/base/react/index.js
+++ /dev/null
@@ -1,5 +0,0 @@
-export * from './components';
-export * from './functions';
-
-export { default as Platform } from './Platform';
-export * from './Types';
diff --git a/react/features/base/react/types.ts b/react/features/base/react/types.ts
index de576f1a4e..c09b6d7f5b 100644
--- a/react/features/base/react/types.ts
+++ b/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 NavigateSectionList.
+ */
+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;
+
+ /**
+ * 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;
+
+ /**
+ * Array of items in the section.
+ */
+ data: ReadonlyArray
- ;
+
+ /**
+ * Unique key for the section.
+ */
+ key?: string;
+
+ keyExtractor?: (item: Object) => string;
+
+ renderItem?: (info: Object) => null | React.ReactElement;
+
+ /**
+ * 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;
+};
diff --git a/react/features/base/styles/functions.web.ts b/react/features/base/styles/functions.web.ts
index 83cd17a173..c2c2d129ff 100644
--- a/react/features/base/styles/functions.web.ts
+++ b/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 = {};
diff --git a/react/features/calendar-sync/components/CalendarList.native.js b/react/features/calendar-sync/components/CalendarList.native.js
index adff5d3910..0c3097c57f 100644
--- a/react/features/calendar-sync/components/CalendarList.native.js
+++ b/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';
diff --git a/react/features/calendar-sync/components/CalendarList.web.js b/react/features/calendar-sync/components/CalendarList.web.js
index 7a0fa5c5e0..6a57b61e6f 100644
--- a/react/features/calendar-sync/components/CalendarList.web.js
+++ b/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';
diff --git a/react/features/calendar-sync/components/CalendarListContent.native.js b/react/features/calendar-sync/components/CalendarListContent.native.js
index 6a62eaa252..595a6034c1 100644
--- a/react/features/calendar-sync/components/CalendarListContent.native.js
+++ b/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';
diff --git a/react/features/calendar-sync/components/CalendarListContent.web.js b/react/features/calendar-sync/components/CalendarListContent.web.js
index 347cfb8c65..7f2e14b383 100644
--- a/react/features/calendar-sync/components/CalendarListContent.web.js
+++ b/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';
diff --git a/react/features/chat/components/native/ChatMessage.js b/react/features/chat/components/native/ChatMessage.js
index 356d1750cb..00606e9c49 100644
--- a/react/features/chat/components/native/ChatMessage.js
+++ b/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';
diff --git a/react/features/conference/components/native/Conference.js b/react/features/conference/components/native/Conference.js
index bbb68b8082..f922b24c35 100644
--- a/react/features/conference/components/native/Conference.js
+++ b/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';
diff --git a/react/features/conference/components/native/carmode/CarMode.tsx b/react/features/conference/components/native/carmode/CarMode.tsx
index dcfbedfeb8..27c683dbe1 100644
--- a/react/features/conference/components/native/carmode/CarMode.tsx
+++ b/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';
diff --git a/react/features/deep-linking/functions.js b/react/features/deep-linking/functions.js
index 5c62e54a5a..9a3c02bf7c 100644
--- a/react/features/deep-linking/functions.js
+++ b/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';
diff --git a/react/features/desktop-picker/components/DesktopPickerPane.js b/react/features/desktop-picker/components/DesktopPickerPane.js
index ac874d630c..62ddb1f6dd 100644
--- a/react/features/desktop-picker/components/DesktopPickerPane.js
+++ b/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';
diff --git a/react/features/etherpad/components/native/SharedDocument.js b/react/features/etherpad/components/native/SharedDocument.js
index c496b698db..601a2cc08d 100644
--- a/react/features/etherpad/components/native/SharedDocument.js
+++ b/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';
diff --git a/react/features/filmstrip/components/native/AudioMutedIndicator.js b/react/features/filmstrip/components/native/AudioMutedIndicator.js
index 427ea7f09e..0640d505a1 100644
--- a/react/features/filmstrip/components/native/AudioMutedIndicator.js
+++ b/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.
diff --git a/react/features/filmstrip/components/native/Filmstrip.js b/react/features/filmstrip/components/native/Filmstrip.js
index 57b63c57ba..f9faea1204 100644
--- a/react/features/filmstrip/components/native/Filmstrip.js
+++ b/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';
diff --git a/react/features/filmstrip/components/native/ModeratorIndicator.tsx b/react/features/filmstrip/components/native/ModeratorIndicator.tsx
index 2042549f93..f90a60b9c7 100644
--- a/react/features/filmstrip/components/native/ModeratorIndicator.tsx
+++ b/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.
diff --git a/react/features/filmstrip/components/native/PinnedIndicator.js b/react/features/filmstrip/components/native/PinnedIndicator.js
index aa169d5d06..b5f1b876a7 100644
--- a/react/features/filmstrip/components/native/PinnedIndicator.js
+++ b/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.
diff --git a/react/features/filmstrip/components/native/RaisedHandIndicator.js b/react/features/filmstrip/components/native/RaisedHandIndicator.js
index c2d5216536..9cde13c136 100644
--- a/react/features/filmstrip/components/native/RaisedHandIndicator.js
+++ b/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';
diff --git a/react/features/filmstrip/components/native/ScreenShareIndicator.js b/react/features/filmstrip/components/native/ScreenShareIndicator.js
index ce23152cec..f003cb3f62 100644
--- a/react/features/filmstrip/components/native/ScreenShareIndicator.js
+++ b/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.
diff --git a/react/features/filmstrip/components/native/Thumbnail.js b/react/features/filmstrip/components/native/Thumbnail.js
index 5c76897584..78ad3e9461 100644
--- a/react/features/filmstrip/components/native/Thumbnail.js
+++ b/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,
diff --git a/react/features/filmstrip/components/web/AudioMutedIndicator.js b/react/features/filmstrip/components/web/AudioMutedIndicator.js
index 0df4f61eb4..fa58d2e633 100644
--- a/react/features/filmstrip/components/web/AudioMutedIndicator.js
+++ b/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}.
diff --git a/react/features/filmstrip/components/web/ModeratorIndicator.tsx b/react/features/filmstrip/components/web/ModeratorIndicator.tsx
index eeb89d4443..56de4f9cb1 100644
--- a/react/features/filmstrip/components/web/ModeratorIndicator.tsx
+++ b/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';
}
/**
diff --git a/react/features/filmstrip/components/web/ScreenShareIndicator.js b/react/features/filmstrip/components/web/ScreenShareIndicator.js
index 3a07572e18..321be7f1cd 100644
--- a/react/features/filmstrip/components/web/ScreenShareIndicator.js
+++ b/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 = {
diff --git a/react/features/invite/components/add-people-dialog/native/AddPeopleDialog.js b/react/features/invite/components/add-people-dialog/native/AddPeopleDialog.js
index c37ffad445..594dd6859d 100644
--- a/react/features/invite/components/add-people-dialog/native/AddPeopleDialog.js
+++ b/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
diff --git a/react/features/invite/components/add-people-dialog/web/InviteContactsForm.js b/react/features/invite/components/add-people-dialog/web/InviteContactsForm.js
index cefff58946..c9e145cfb0 100644
--- a/react/features/invite/components/add-people-dialog/web/InviteContactsForm.js
+++ b/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';
diff --git a/react/features/invite/components/callee-info/CalleeInfo.js b/react/features/invite/components/callee-info/CalleeInfo.js
index c57de17596..192ceeaf78 100644
--- a/react/features/invite/components/callee-info/CalleeInfo.js
+++ b/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';
diff --git a/react/features/invite/components/dial-in-summary/native/DialInSummary.js b/react/features/invite/components/dial-in-summary/native/DialInSummary.js
index 39b7ee3748..e83adbcced 100644
--- a/react/features/invite/components/dial-in-summary/native/DialInSummary.js
+++ b/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';
diff --git a/react/features/large-video/components/LargeVideo.web.js b/react/features/large-video/components/LargeVideo.web.js
index 2adc7d2da5..7bb97787e4 100644
--- a/react/features/large-video/components/LargeVideo.web.js
+++ b/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';
diff --git a/react/features/lobby/components/native/LobbyScreen.js b/react/features/lobby/components/native/LobbyScreen.js
index 91e0adf7de..451a7a4779 100644
--- a/react/features/lobby/components/native/LobbyScreen.js
+++ b/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';
diff --git a/react/features/lobby/components/web/LobbyScreen.js b/react/features/lobby/components/web/LobbyScreen.js
index 5db7b4a9aa..aa74782055 100644
--- a/react/features/lobby/components/web/LobbyScreen.js
+++ b/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';
diff --git a/react/features/mobile/full-screen/middleware.js b/react/features/mobile/full-screen/middleware.js
index 55d06c73f4..a1901762c7 100644
--- a/react/features/mobile/full-screen/middleware.js
+++ b/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';
diff --git a/react/features/mobile/permissions/functions.js b/react/features/mobile/permissions/functions.js
index 3b2ea1ae05..802d6ea8aa 100644
--- a/react/features/mobile/permissions/functions.js
+++ b/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.
diff --git a/react/features/mobile/picture-in-picture/actions.js b/react/features/mobile/picture-in-picture/actions.js
index b75b975d53..1a5f16296e 100644
--- a/react/features/mobile/picture-in-picture/actions.js
+++ b/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';
diff --git a/react/features/presence-status/components/PresenceLabel.js b/react/features/presence-status/components/PresenceLabel.js
index 709bc9fe5c..63ac20b7de 100644
--- a/react/features/presence-status/components/PresenceLabel.js
+++ b/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';
diff --git a/react/features/recent-list/components/AbstractRecentList.tsx b/react/features/recent-list/components/AbstractRecentList.tsx
index cc4244a32a..9086cbe6e0 100644
--- a/react/features/recent-list/components/AbstractRecentList.tsx
+++ b/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';
diff --git a/react/features/recent-list/components/RecentList.native.js b/react/features/recent-list/components/RecentList.native.js
index 2658cfbcca..5dd68d7fa0 100644
--- a/react/features/recent-list/components/RecentList.native.js
+++ b/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';
diff --git a/react/features/recent-list/components/RecentList.web.js b/react/features/recent-list/components/RecentList.web.js
index c4bf207675..379bad8d6c 100644
--- a/react/features/recent-list/components/RecentList.web.js
+++ b/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';
diff --git a/react/features/recent-list/components/RecentListItemMenu.native.js b/react/features/recent-list/components/RecentListItemMenu.native.js
index a0bede4971..7f0767c23e 100644
--- a/react/features/recent-list/components/RecentListItemMenu.native.js
+++ b/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';
diff --git a/react/features/recent-list/functions.native.ts b/react/features/recent-list/functions.native.ts
index 7afb616186..8e099a512d 100644
--- a/react/features/recent-list/functions.native.ts
+++ b/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';
diff --git a/react/features/recording/components/Recording/native/StartRecordingDialogContent.tsx b/react/features/recording/components/Recording/native/StartRecordingDialogContent.tsx
index a37a5ca710..f0b63d06bc 100644
--- a/react/features/recording/components/Recording/native/StartRecordingDialogContent.tsx
+++ b/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';
diff --git a/react/features/recording/components/Recording/web/StartRecordingDialogContent.tsx b/react/features/recording/components/Recording/web/StartRecordingDialogContent.tsx
index 2629b0a332..6381ef25f1 100644
--- a/react/features/recording/components/Recording/web/StartRecordingDialogContent.tsx
+++ b/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';
diff --git a/react/features/salesforce/components/native/SalesforceLinkDialog.js b/react/features/salesforce/components/native/SalesforceLinkDialog.js
index 0f17a6fb8b..07873eece4 100644
--- a/react/features/salesforce/components/native/SalesforceLinkDialog.js
+++ b/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';
diff --git a/react/features/subtitles/components/Captions.native.js b/react/features/subtitles/components/Captions.native.js
index 1bcd5db7d8..caefc5d854 100644
--- a/react/features/subtitles/components/Captions.native.js
+++ b/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,
diff --git a/react/features/toolbox/components/native/OverflowMenu.js b/react/features/toolbox/components/native/OverflowMenu.js
index 729a552d4c..73159fe3a1 100644
--- a/react/features/toolbox/components/native/OverflowMenu.js
+++ b/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';
diff --git a/react/features/toolbox/components/native/Toolbox.js b/react/features/toolbox/components/native/Toolbox.js
index 9ad5ecb7ea..e47ceb1e26 100644
--- a/react/features/toolbox/components/native/Toolbox.js
+++ b/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';
diff --git a/react/features/video-menu/components/native/SharedVideoMenu.js b/react/features/video-menu/components/native/SharedVideoMenu.js
index dd4f5ff852..d68354c5e3 100644
--- a/react/features/video-menu/components/native/SharedVideoMenu.js
+++ b/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';
diff --git a/react/features/welcome/components/WelcomePage.native.js b/react/features/welcome/components/WelcomePage.native.js
index e51a5ae884..1176a3eca6 100644
--- a/react/features/welcome/components/WelcomePage.native.js
+++ b/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';
diff --git a/react/features/welcome/components/WelcomePage.web.js b/react/features/welcome/components/WelcomePage.web.js
index 7dec3a9c06..8d850c41c0 100644
--- a/react/features/welcome/components/WelcomePage.web.js
+++ b/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';
diff --git a/react/index.web.js b/react/index.web.js
index 7121c2e21a..283bc57b30 100644
--- a/react/index.web.js
+++ b/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';