diff --git a/src/CONST.js b/src/CONST.js
index 7ab0e616635..5b1b82da590 100755
--- a/src/CONST.js
+++ b/src/CONST.js
@@ -188,6 +188,7 @@ const CONST = {
USE_EXPENSIFY_URL,
NEW_ZOOM_MEETING_URL: 'https://zoom.us/start/videomeeting',
NEW_GOOGLE_MEET_MEETING_URL: 'https://meet.google.com/new',
+ GOOGLE_MEET_URL_ANDROID: 'https://meet.google.com',
DEEPLINK_BASE_URL: 'new-expensify://',
PDF_VIEWER_URL: '/pdf/web/viewer.html',
EXPENSIFY_ICON_URL: `${CLOUDFRONT_URL}/images/favicon-2019.png`,
diff --git a/src/components/VideoChatButtonAndMenu.js b/src/components/VideoChatButtonAndMenu/BaseVideoChatButtonAndMenu.js
similarity index 78%
rename from src/components/VideoChatButtonAndMenu.js
rename to src/components/VideoChatButtonAndMenu/BaseVideoChatButtonAndMenu.js
index 8fe3bdacfa1..f4fa0c7cad9 100755
--- a/src/components/VideoChatButtonAndMenu.js
+++ b/src/components/VideoChatButtonAndMenu/BaseVideoChatButtonAndMenu.js
@@ -3,34 +3,24 @@ import React, {Component} from 'react';
import {
View, Pressable, Dimensions, Linking,
} from 'react-native';
-import PropTypes from 'prop-types';
-import Icon from './Icon';
-import * as Expensicons from './Icon/Expensicons';
-import Popover from './Popover';
-import MenuItem from './MenuItem';
-import ZoomIcon from '../../assets/images/zoom-icon.svg';
-import GoogleMeetIcon from '../../assets/images/google-meet.svg';
-import CONST from '../CONST';
-import styles from '../styles/styles';
-import themeColors from '../styles/themes/default';
-import withWindowDimensions, {windowDimensionsPropTypes} from './withWindowDimensions';
-import withLocalize, {withLocalizePropTypes} from './withLocalize';
-import compose from '../libs/compose';
-import Navigation from '../libs/Navigation/Navigation';
-import ROUTES from '../ROUTES';
-import Tooltip from './Tooltip';
+import Icon from '../Icon';
+import * as Expensicons from '../Icon/Expensicons';
+import Popover from '../Popover';
+import MenuItem from '../MenuItem';
+import ZoomIcon from '../../../assets/images/zoom-icon.svg';
+import GoogleMeetIcon from '../../../assets/images/google-meet.svg';
+import CONST from '../../CONST';
+import styles from '../../styles/styles';
+import themeColors from '../../styles/themes/default';
+import withWindowDimensions from '../withWindowDimensions';
+import withLocalize from '../withLocalize';
+import compose from '../../libs/compose';
+import Navigation from '../../libs/Navigation/Navigation';
+import ROUTES from '../../ROUTES';
+import Tooltip from '../Tooltip';
+import {propTypes, defaultProps} from './videoChatButtonAndMenuPropTypes';
-const propTypes = {
- ...withLocalizePropTypes,
- ...windowDimensionsPropTypes,
- isConcierge: PropTypes.bool,
-};
-
-const defaultProps = {
- isConcierge: false,
-};
-
-class VideoChatButtonAndMenu extends Component {
+class BaseVideoChatButtonAndMenu extends Component {
constructor(props) {
super(props);
@@ -53,7 +43,7 @@ class VideoChatButtonAndMenu extends Component {
text: props.translate('videoChatButtonAndMenu.googleMeet'),
onPress: () => {
this.toggleVideoChatMenu();
- Linking.openURL(CONST.NEW_GOOGLE_MEET_MEETING_URL);
+ Linking.openURL(this.props.googleMeetURL);
},
},
];
@@ -148,10 +138,10 @@ class VideoChatButtonAndMenu extends Component {
}
}
-VideoChatButtonAndMenu.propTypes = propTypes;
-VideoChatButtonAndMenu.defaultProps = defaultProps;
+BaseVideoChatButtonAndMenu.propTypes = propTypes;
+BaseVideoChatButtonAndMenu.defaultProps = defaultProps;
export default compose(
withWindowDimensions,
withLocalize,
-)(VideoChatButtonAndMenu);
+)(BaseVideoChatButtonAndMenu);
diff --git a/src/components/VideoChatButtonAndMenu/index.android.js b/src/components/VideoChatButtonAndMenu/index.android.js
new file mode 100644
index 00000000000..addd5035aea
--- /dev/null
+++ b/src/components/VideoChatButtonAndMenu/index.android.js
@@ -0,0 +1,20 @@
+import React from 'react';
+import CONST from '../../CONST';
+import {propTypes, defaultProps} from './videoChatButtonAndMenuPropTypes';
+import BaseVideoChatButtonAndMenu from './BaseVideoChatButtonAndMenu';
+
+// On Android creating a new google meet meeting requires the CALL_PHONE permission in some cases
+// so we're just opening the google meet app instead, more details:
+// https://github.com/Expensify/App/issues/8851#issuecomment-1120236904
+const VideoChatButtonAndMenu = props => (
+
+);
+
+VideoChatButtonAndMenu.propTypes = propTypes;
+VideoChatButtonAndMenu.defaultProps = defaultProps;
+VideoChatButtonAndMenu.displayName = 'VideoChatButtonAndMenu';
+export default VideoChatButtonAndMenu;
diff --git a/src/components/VideoChatButtonAndMenu/index.js b/src/components/VideoChatButtonAndMenu/index.js
new file mode 100644
index 00000000000..b693424841a
--- /dev/null
+++ b/src/components/VideoChatButtonAndMenu/index.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import CONST from '../../CONST';
+import {propTypes, defaultProps} from './videoChatButtonAndMenuPropTypes';
+import BaseVideoChatButtonAndMenu from './BaseVideoChatButtonAndMenu';
+
+const VideoChatButtonAndMenu = props => (
+
+);
+
+VideoChatButtonAndMenu.propTypes = propTypes;
+VideoChatButtonAndMenu.defaultProps = defaultProps;
+VideoChatButtonAndMenu.displayName = 'VideoChatButtonAndMenu';
+export default VideoChatButtonAndMenu;
diff --git a/src/components/VideoChatButtonAndMenu/videoChatButtonAndMenuPropTypes.js b/src/components/VideoChatButtonAndMenu/videoChatButtonAndMenuPropTypes.js
new file mode 100644
index 00000000000..de6b5cb5aae
--- /dev/null
+++ b/src/components/VideoChatButtonAndMenu/videoChatButtonAndMenuPropTypes.js
@@ -0,0 +1,20 @@
+import PropTypes from 'prop-types';
+import {windowDimensionsPropTypes} from '../withWindowDimensions';
+import {withLocalizePropTypes} from '../withLocalize';
+
+const propTypes = {
+ /** If this is the Concierge chat, we'll open the modal for requesting a setup call instead of showing popover menu */
+ isConcierge: PropTypes.bool,
+
+ /** Link to open when user wants to create a new google meet meeting */
+ googleMeetURL: PropTypes.string.isRequired,
+
+ ...withLocalizePropTypes,
+ ...windowDimensionsPropTypes,
+};
+
+const defaultProps = {
+ isConcierge: false,
+};
+
+export {propTypes, defaultProps};