Merge pull request #29288 from Expensify/beaman-activationFlowMoney2020

[Money2020] Adding in activation flow for money20/20

.well-known/apple-app-site-association

@@ -79,6 +79,10 @@
                     {
                         "/": "/search/*",
                         "comment": "Search"
+                    },
+                    {
+                        "/": "/money2020/*",
+                        "comment": "Money 2020"
                     }
                 ]
             }

android/app/src/main/AndroidManifest.xml

@@ -70,6 +70,7 @@
                 <data android:scheme="https" android:host="new.expensify.com" android:pathPrefix="/request"/>
                 <data android:scheme="https" android:host="new.expensify.com" android:pathPrefix="/new"/>
                 <data android:scheme="https" android:host="new.expensify.com" android:pathPrefix="/search"/>
+                <data android:scheme="https" android:host="new.expensify.com" android:pathPrefix="/money2020"/>
 
                 <!-- Staging URLs -->
                 <data android:scheme="https" android:host="staging.new.expensify.com" android:pathPrefix="/r"/>
@@ -87,6 +88,7 @@
                 <data android:scheme="https" android:host="staging.new.expensify.com" android:pathPrefix="/request"/>
                 <data android:scheme="https" android:host="staging.new.expensify.com" android:pathPrefix="/new"/>
                 <data android:scheme="https" android:host="staging.new.expensify.com" android:pathPrefix="/search"/>
+                <data android:scheme="https" android:host="staging.new.expensify.com" android:pathPrefix="/money2020"/>
             </intent-filter>
         </activity>
 

src/CONST.ts

@@ -2718,6 +2718,7 @@ const CONST = {
     DEMO_PAGES: {
         SAASTR: 'SaaStrDemoSetup',
         SBE: 'SbeDemoSetup',
+        MONEY2020: 'Money2020DemoSetup',
     },
 
     MAPBOX: {

src/Expensify.js

@@ -29,6 +29,7 @@ import SplashScreenHider from './components/SplashScreenHider';
 import AppleAuthWrapper from './components/SignInButtons/AppleAuthWrapper';
 import EmojiPicker from './components/EmojiPicker/EmojiPicker';
 import * as EmojiPickerAction from './libs/actions/EmojiPickerAction';
+import * as DemoActions from './libs/actions/DemoActions';
 import DeeplinkWrapper from './components/DeeplinkWrapper';
 
 // This lib needs to be imported, but it has nothing to export since all it contains is an Onyx connection
@@ -167,11 +168,13 @@ function Expensify(props) {
 
         // If the app is opened from a deep link, get the reportID (if exists) from the deep link and navigate to the chat report
         Linking.getInitialURL().then((url) => {
+            DemoActions.runDemoByURL(url);
             Report.openReportFromDeepLink(url, isAuthenticated);
         });
 
         // Open chat report from a deep link (only mobile native)
         Linking.addEventListener('url', (state) => {
+            DemoActions.runDemoByURL(state.url);
             Report.openReportFromDeepLink(state.url, isAuthenticated);
         });
 

src/ROUTES.ts

@@ -337,9 +337,10 @@ export default {
         getRoute: (policyID: string) => `workspace/${policyID}/members`,
     },
 
-    // These are some on-off routes that will be removed once they're no longer needed (see GH issues for details)
+    // These are some one-off routes that will be removed once they're no longer needed (see GH issues for details)
     SAASTR: 'saastr',
     SBE: 'sbe',
+    MONEY2020: 'money2020',
 
     // Iframe screens from olddot
     HOME_OLDDOT: 'home',

src/libs/Navigation/AppNavigator/AuthScreens.js

@@ -117,6 +117,13 @@ const propTypes = {
     /** The last Onyx update ID was applied to the client */
     lastUpdateIDAppliedToClient: PropTypes.number,
 
+    /** Information about any currently running demos */
+    demoInfo: PropTypes.shape({
+        money2020: PropTypes.shape({
+            isBeginningDemo: PropTypes.bool,
+        }),
+    }),
+
     ...windowDimensionsPropTypes,
 };
 
@@ -127,6 +134,7 @@ const defaultProps = {
     },
     lastOpenedPublicRoomID: null,
     lastUpdateIDAppliedToClient: null,
+    demoInfo: {},
 };
 
 class AuthScreens extends React.Component {
@@ -169,6 +177,10 @@ class AuthScreens extends React.Component {
         App.setUpPoliciesAndNavigate(this.props.session, !this.props.isSmallScreenWidth);
         App.redirectThirdPartyDesktopSignIn();
 
+        // Check if we should be running any demos immediately after signing in.
+        if (lodashGet(this.props.demoInfo, 'money2020.isBeginningDemo', false)) {
+            Navigation.navigate(ROUTES.MONEY2020, CONST.NAVIGATION.TYPE.FORCED_UP);
+        }
         if (this.props.lastOpenedPublicRoomID) {
             // Re-open the last opened public room if the user logged in from a public room link
             Report.openLastOpenedPublicRoom(this.props.lastOpenedPublicRoomID);
@@ -299,6 +311,11 @@ class AuthScreens extends React.Component {
                         options={defaultScreenOptions}
                         component={DemoSetupPage}
                     />
+                    <RootStack.Screen
+                        name={CONST.DEMO_PAGES.MONEY2020}
+                        options={defaultScreenOptions}
+                        component={DemoSetupPage}
+                    />
                     <RootStack.Screen
                         name={SCREENS.REPORT_ATTACHMENTS}
                         options={{
@@ -350,5 +367,8 @@ export default compose(
         lastUpdateIDAppliedToClient: {
             key: ONYXKEYS.ONYX_UPDATES_LAST_UPDATE_ID_APPLIED_TO_CLIENT,
         },
+        demoInfo: {
+            key: ONYXKEYS.DEMO_INFO,
+        },
     }),
 )(AuthScreens);

src/libs/Navigation/linkingConfig.js

@@ -18,6 +18,9 @@ export default {
             [SCREENS.DESKTOP_SIGN_IN_REDIRECT]: ROUTES.DESKTOP_SIGN_IN_REDIRECT,
             [SCREENS.REPORT_ATTACHMENTS]: ROUTES.REPORT_ATTACHMENTS.route,
 
+            // Demo routes
+            [CONST.DEMO_PAGES.MONEY2020]: ROUTES.MONEY2020,
+
             // Sidebar
             [SCREENS.HOME]: {
                 path: ROUTES.HOME,

src/libs/actions/DemoActions.js

@@ -0,0 +1,70 @@
+import Config from 'react-native-config';
+import Onyx from 'react-native-onyx';
+import lodashGet from 'lodash/get';
+import * as API from '../API';
+import * as ReportUtils from '../ReportUtils';
+import Navigation from '../Navigation/Navigation';
+import ROUTES from '../../ROUTES';
+import ONYXKEYS from '../../ONYXKEYS';
+
+let currentUserEmail;
+Onyx.connect({
+    key: ONYXKEYS.SESSION,
+    callback: (val) => {
+        currentUserEmail = lodashGet(val, 'email', '');
+    },
+});
+
+function runMoney2020Demo() {
+    // Try to navigate to existing demo chat if it exists in Onyx
+    const money2020AccountID = Number(Config ? Config.EXPENSIFY_ACCOUNT_ID_MONEY2020 : 15864555);
+    const existingChatReport = ReportUtils.getChatByParticipants([money2020AccountID]);
+    if (existingChatReport) {
+        // We must call goBack() to remove the demo route from nav history
+        Navigation.goBack();
+        Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(existingChatReport.reportID));
+        return;
+    }
+
+    // We use makeRequestWithSideEffects here because we need to get the chat report ID to navigate to it after it's created
+    // eslint-disable-next-line rulesdir/no-api-side-effects-method
+    API.makeRequestWithSideEffects('CreateChatReport', {
+        emailList: `${currentUserEmail},[email protected]`,
+        activationConference: 'money2020',
+    }).then((response) => {
+        // If there's no response or no reportID in the response, navigate the user home so user doesn't get stuck.
+        if (!response || !response.reportID) {
+            Navigation.goBack();
+            Navigation.navigate(ROUTES.HOME);
+            return;
+        }
+
+        // Get reportID & navigate to it
+        // Note: We must call goBack() to remove the demo route from history
+        const chatReportID = response.reportID;
+        Navigation.goBack();
+        Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(chatReportID));
+    });
+}
+
+/**
+ * Runs code for specific demos, based on the provided URL
+ *
+ * @param {String} url - URL user is navigating to via deep link (or regular link in web)
+ */
+function runDemoByURL(url = '') {
+    const cleanUrl = (url || '').toLowerCase();
+
+    if (cleanUrl.endsWith(ROUTES.MONEY2020)) {
+        Onyx.set(ONYXKEYS.DEMO_INFO, {
+            money2020: {
+                isBeginningDemo: true,
+            },
+        });
+    } else {
+        // No demo is being run, so clear out demo info
+        Onyx.set(ONYXKEYS.DEMO_INFO, null);
+    }
+}
+
+export {runMoney2020Demo, runDemoByURL};

src/pages/DemoSetupPage.js

@@ -1,9 +1,11 @@
-import React from 'react';
+import React, {useCallback} from 'react';
 import PropTypes from 'prop-types';
 import {useFocusEffect} from '@react-navigation/native';
 import FullScreenLoadingIndicator from '../components/FullscreenLoadingIndicator';
 import Navigation from '../libs/Navigation/Navigation';
 import ROUTES from '../ROUTES';
+import CONST from '../CONST';
+import * as DemoActions from '../libs/actions/DemoActions';
 
 const propTypes = {
     /** Navigation route context info provided by react navigation */
@@ -18,12 +20,16 @@ const propTypes = {
  * route that led the user here. Now, it's just used to route the user home so we
  * don't show them a "Hmm... It's not here" message (which looks broken).
  */
-function DemoSetupPage() {
-    useFocusEffect(() => {
-        Navigation.isNavigationReady().then(() => {
-            Navigation.goBack(ROUTES.HOME);
-        });
-    });
+function DemoSetupPage(props) {
+    useFocusEffect(
+        useCallback(() => {
+            if (props.route.name === CONST.DEMO_PAGES.MONEY2020) {
+                DemoActions.runMoney2020Demo();
+            } else {
+                Navigation.goBack(ROUTES.HOME);
+            }
+        }, [props.route.name]),
+    );
 
     return <FullScreenLoadingIndicator />;
 }

src/pages/home/sidebar/SidebarScreen/FloatingActionButtonAndPopover.js

@@ -62,6 +62,13 @@ const propTypes = {
 
     /** Forwarded ref to FloatingActionButtonAndPopover */
     innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+
+    /** Information about any currently running demos */
+    demoInfo: PropTypes.shape({
+        money2020: PropTypes.shape({
+            isBeginningDemo: PropTypes.bool,
+        }),
+    }),
 };
 const defaultProps = {
     onHideCreateMenu: () => {},
@@ -70,6 +77,7 @@ const defaultProps = {
     betas: [],
     isLoading: false,
     innerRef: null,
+    demoInfo: {},
 };
 
 /**
@@ -152,6 +160,9 @@ function FloatingActionButtonAndPopover(props) {
         if (currentRoute && ![NAVIGATORS.CENTRAL_PANE_NAVIGATOR, SCREENS.HOME].includes(currentRoute.name)) {
             return;
         }
+        if (lodashGet(props.demoInfo, 'money2020.isBeginningDemo', false)) {
+            return;
+        }
         Welcome.show({routes, showCreateMenu});
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [props.isLoading]);
@@ -262,6 +273,9 @@ export default compose(
         isLoading: {
             key: ONYXKEYS.IS_LOADING_REPORT_DATA,
         },
+        demoInfo: {
+            key: ONYXKEYS.DEMO_INFO,
+        },
     }),
 )(
     forwardRef((props, ref) => (