Merge branch 'main' to fix storybook

.storybook/webpack.config.js

@@ -3,7 +3,9 @@
 const path = require('path');
 const dotenv = require('dotenv');
 const _ = require('underscore');
-const custom = require('../config/webpack/webpack.common');
+const custom = require('../config/webpack/webpack.common')({
+    envFile: '../.env.production',
+});
 
 const env = dotenv.config({path: path.resolve(__dirname, '../.env.staging')}).parsed;
 

android/app/build.gradle

@@ -152,8 +152,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001014002
-        versionName "1.1.40-2"
+        versionCode 1001014101
+        versionName "1.1.41-1"
     }
     splits {
         abi {

ios/NewExpensify/Info.plist

@@ -17,7 +17,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.1.40</string>
+	<string>1.1.41</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>
@@ -31,7 +31,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.1.40.2</string>
+	<string>1.1.41.1</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>

ios/NewExpensifyTests/Info.plist

@@ -15,10 +15,10 @@
 	<key>CFBundlePackageType</key>
 	<string>BNDL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>1.1.40</string>
+	<string>1.1.41</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.1.40.2</string>
+	<string>1.1.41.1</string>
 </dict>
 </plist>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.1.40-2",
+  "version": "1.1.41-1",
   "author": "Expensify, Inc.",
   "homepage": "https://new.expensify.com",
   "description": "New Expensify is the next generation of Expensify: a reimagination of payments based atop a foundation of chat.",

src/components/OptionsSelector.js

@@ -67,6 +67,9 @@ const propTypes = {
     /** Whether to focus the textinput after an option is selected */
     shouldFocusOnSelectRow: PropTypes.bool,
 
+    /** Whether to autofocus the search input on mount */
+    autoFocus: PropTypes.bool,
+
     ...withLocalizePropTypes,
 };
 
@@ -83,6 +86,7 @@ const defaultProps = {
     forceTextUnreadStyle: false,
     showTitleTooltip: false,
     shouldFocusOnSelectRow: false,
+    autoFocus: true,
 };
 
 class OptionsSelector extends Component {
@@ -99,6 +103,10 @@ class OptionsSelector extends Component {
     }
 
     componentDidMount() {
+        if (!this.props.autoFocus) {
+            return;
+        }
+
         if (this.props.shouldDelayFocus) {
             setTimeout(() => this.textInput.focus(), CONST.ANIMATED_TRANSITION);
         } else {

src/languages/en.js

@@ -68,7 +68,6 @@ export default {
         notifications: 'Notifications',
         na: 'N/A',
         noResultsFound: 'No results found',
-        deletedCommentMessage: 'Comment deleted',
         timePrefix: 'It\'s',
         conjunctionFor: 'for',
         todayAt: 'Today at',

src/languages/es.js

@@ -68,7 +68,6 @@ export default {
         notifications: 'Notificaciones',
         na: 'N/A',
         noResultsFound: 'No se han encontrado resultados',
-        deletedCommentMessage: 'Comentario borrado',
         timePrefix: 'Son las',
         conjunctionFor: 'para',
         todayAt: 'Hoy a las',

src/libs/actions/Report.js

@@ -182,7 +182,7 @@ function getSimplifiedReportObject(report) {
         // We convert the line-breaks in html to space ' ' before striping the tags
         lastMessageText = lastActionMessage
             .replace(/((<br[^>]*>)+)/gi, ' ')
-            .replace(/(<([^>]+)>)/gi, '') || `[${Localize.translateLocal('common.deletedCommentMessage')}]`;
+            .replace(/(<([^>]+)>)/gi, '');
         lastMessageText = ReportUtils.formatReportLastMessageText(lastMessageText);
     }
 
@@ -547,21 +547,15 @@ function updateReportActionMessage(reportID, sequenceNumber, message) {
     const actionToMerge = {};
     actionToMerge[sequenceNumber] = {message: [message]};
     Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`, actionToMerge).then(() => {
-        // Don't do anything for messages that aren't deleted.
-        if (message.html) {
-            return;
+        // If the message is deleted, update the last read message and the unread counter
+        if (!message.html) {
+            setLocalLastRead(reportID, lastReadSequenceNumbers[reportID]);
         }
 
-        // If the message is deleted, update the last read in case the deleted message is being counted in the unreadActionCount
-        setLocalLastRead(reportID, lastReadSequenceNumbers[reportID]);
-    });
-
-    // If this is the most recent message, update the lastMessageText in the report object as well
-    if (sequenceNumber === reportMaxSequenceNumbers[reportID]) {
         Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT}${reportID}`, {
-            lastMessageText: ReportUtils.formatReportLastMessageText(message.text) || `[${Localize.translateLocal('common.deletedCommentMessage')}]`,
+            lastMessageText: ReportActions.getLastVisibleMessageText(reportID),
         });
-    }
+    });
 }
 
 /**

src/libs/actions/ReportActions.js

@@ -4,6 +4,7 @@ import lodashGet from 'lodash/get';
 import ONYXKEYS from '../../ONYXKEYS';
 import * as CollectionUtils from '../CollectionUtils';
 import CONST from '../../CONST';
+import * as ReportUtils from '../reportUtils';
 
 /**
  * Map of the most recent non-loading sequenceNumber for a reportActions_* key in Onyx by reportID.
@@ -95,8 +96,24 @@ function getDeletedCommentsCount(reportID, sequenceNumber) {
     }, 0);
 }
 
+/**
+ * Get the message text for the last action that was not deleted
+ * @param {Number} reportID
+ * @return {String}
+ */
+function getLastVisibleMessageText(reportID) {
+    const lastMessageIndex = _.findLastIndex(reportActions[reportID], action => (
+        !ReportUtils.isDeletedAction(action)
+    ));
+
+    return ReportUtils.formatReportLastMessageText(
+        lodashGet(reportActions, [reportID, lastMessageIndex, 'message', 0, 'text'], ''),
+    );
+}
+
 export {
     isReportMissingActions,
     dangerouslyGetReportActionsMaxSequenceNumber,
     getDeletedCommentsCount,
+    getLastVisibleMessageText,
 };

src/libs/reportUtils.js

@@ -2,7 +2,6 @@ import _ from 'underscore';
 import Str from 'expensify-common/lib/str';
 import lodashGet from 'lodash/get';
 import Onyx from 'react-native-onyx';
-import moment from 'moment';
 import ONYXKEYS from '../ONYXKEYS';
 import CONST from '../CONST';
 
@@ -211,23 +210,19 @@ function hasExpensifyEmails(emails) {
 /**
  * Whether the time row should be shown for a report.
  * @param {Array<Object>} personalDetails
- * @param {Object} myPersonalDetails
  * @param {Object} report
  * @return {Boolean}
  */
-function canShowReportRecipientLocalTime(personalDetails, myPersonalDetails, report) {
+function canShowReportRecipientLocalTime(personalDetails, report) {
     const reportParticipants = lodashGet(report, 'participants', []);
     const hasMultipleParticipants = reportParticipants.length > 1;
     const reportRecipient = personalDetails[reportParticipants[0]];
-    const currentUserTimezone = lodashGet(myPersonalDetails, 'timezone', CONST.DEFAULT_TIME_ZONE);
     const reportRecipientTimezone = lodashGet(reportRecipient, 'timezone', CONST.DEFAULT_TIME_ZONE);
     return !hasExpensifyEmails(reportParticipants)
         && !hasMultipleParticipants
         && reportRecipient
         && reportRecipientTimezone
-        && currentUserTimezone.selected
-        && reportRecipientTimezone.selected
-        && moment().tz(currentUserTimezone.selected).utcOffset() !== moment().tz(reportRecipientTimezone.selected).utcOffset();
+        && reportRecipientTimezone.selected;
 }
 
 /**

src/pages/home/report/ReportActionCompose.js

@@ -36,7 +36,6 @@ import * as ReportUtils from '../../../libs/reportUtils';
 import ReportActionComposeFocusManager from '../../../libs/ReportActionComposeFocusManager';
 import Text from '../../../components/Text';
 import {participantPropTypes} from '../sidebar/optionPropTypes';
-import currentUserPersonalDetailsPropsTypes from '../../settings/Profile/currentUserPersonalDetailsPropsTypes';
 import ParticipantLocalTime from './ParticipantLocalTime';
 import {withNetwork, withPersonalDetails} from '../../../components/OnyxProvider';
 import DateUtils from '../../../libs/DateUtils';
@@ -65,9 +64,6 @@ const propTypes = {
         isVisible: PropTypes.bool,
     }),
 
-    /** The personal details of the person who is logged in */
-    myPersonalDetails: PropTypes.shape(currentUserPersonalDetailsPropsTypes),
-
     /** Personal details of all the users */
     personalDetails: PropTypes.objectOf(participantPropTypes),
 
@@ -113,7 +109,6 @@ const defaultProps = {
     network: {isOffline: false},
     blockedFromConcierge: {},
     personalDetails: {},
-    myPersonalDetails: {},
 };
 
 class ReportActionCompose extends React.Component {
@@ -392,15 +387,15 @@ class ReportActionCompose extends React.Component {
 
     render() {
         // Waiting until ONYX variables are loaded before displaying the component
-        if (_.isEmpty(this.props.personalDetails) || _.isEmpty(this.props.myPersonalDetails)) {
+        if (_.isEmpty(this.props.personalDetails)) {
             return null;
         }
 
         const reportParticipants = lodashGet(this.props.report, 'participants', []);
         const hasMultipleParticipants = reportParticipants.length > 1;
         const hasExcludedIOUEmails = lodashIntersection(reportParticipants, CONST.EXPENSIFY_EMAILS).length > 0;
         const reportRecipient = this.props.personalDetails[reportParticipants[0]];
-        const shouldShowReportRecipientLocalTime = ReportUtils.canShowReportRecipientLocalTime(this.props.personalDetails, this.props.myPersonalDetails, this.props.report);
+        const shouldShowReportRecipientLocalTime = ReportUtils.canShowReportRecipientLocalTime(this.props.personalDetails, this.props.report);
 
         // Prevents focusing and showing the keyboard while the drawer is covering the chat.
         const isComposeDisabled = this.props.isDrawerOpen && this.props.isSmallScreenWidth;
@@ -635,9 +630,6 @@ export default compose(
         modal: {
             key: ONYXKEYS.MODAL,
         },
-        myPersonalDetails: {
-            key: ONYXKEYS.MY_PERSONAL_DETAILS,
-        },
         blockedFromConcierge: {
             key: ONYXKEYS.NVP_BLOCKED_FROM_CONCIERGE,
         },

src/pages/home/report/ReportActionItem.js

@@ -24,7 +24,6 @@ import MiniReportActionContextMenu from './ContextMenu/MiniReportActionContextMe
 import * as ReportActionContextMenu from './ContextMenu/ReportActionContextMenu';
 import * as ContextMenuActions from './ContextMenu/ContextMenuActions';
 import {withReportActionsDrafts} from '../../../components/OnyxProvider';
-import * as ReportUtils from '../../../libs/reportUtils';
 import RenameAction from '../../../components/ReportActionItem/RenameAction';
 
 const propTypes = {
@@ -97,8 +96,8 @@ class ReportActionItem extends Component {
      * @param {string} [selection] - A copy text.
      */
     showPopover(event, selection) {
-        // Block menu on the message being Edited or is already deleted
-        if (this.props.draftMessage || ReportUtils.isDeletedAction(this.props.action)) {
+        // Block menu on the message being Edited
+        if (this.props.draftMessage) {
             return;
         }
         ReportActionContextMenu.showContextMenu(
@@ -190,7 +189,6 @@ class ReportActionItem extends Component {
                                     hovered
                                     && !this.state.isContextMenuActive
                                     && !this.props.draftMessage
-                                    && !ReportUtils.isDeletedAction(this.props.action)
                                 }
                                 draftMessage={this.props.draftMessage}
                             />

src/pages/home/report/ReportActionItemMessage.js

@@ -6,9 +6,6 @@ import styles from '../../../styles/styles';
 import ReportActionItemFragment from './ReportActionItemFragment';
 import reportActionPropTypes from './reportActionPropTypes';
 import {withNetwork} from '../../../components/OnyxProvider';
-import Text from '../../../components/Text';
-import themeColors from '../../../styles/themes/default';
-import * as ReportUtils from '../../../libs/reportUtils';
 import withLocalize, {withLocalizePropTypes} from '../../../components/withLocalize';
 import compose from '../../../libs/compose';
 
@@ -32,21 +29,18 @@ const defaultProps = {
 
 const ReportActionItemMessage = (props) => {
     const isUnsent = props.network.isOffline && props.action.loading;
-    const isDeleted = ReportUtils.isDeletedAction(props.action);
 
     return (
         <View style={[styles.chatItemMessage, isUnsent && styles.chatItemUnsentMessage]}>
-            {isDeleted
-                ? <Text color={themeColors.textSupporting}>{`[${props.translate('common.deletedCommentMessage')}]`}</Text>
-                : _.map(_.compact(props.action.message), (fragment, index) => (
-                    <ReportActionItemFragment
-                            key={`actionFragment-${props.action.sequenceNumber}-${index}`}
-                            fragment={fragment}
-                            isAttachment={props.action.isAttachment}
-                            attachmentInfo={props.action.attachmentInfo}
-                            loading={props.action.loading}
-                    />
-                ))}
+            {_.map(_.compact(props.action.message), (fragment, index) => (
+                <ReportActionItemFragment
+                    key={`actionFragment-${props.action.sequenceNumber}-${index}`}
+                    fragment={fragment}
+                    isAttachment={props.action.isAttachment}
+                    attachmentInfo={props.action.attachmentInfo}
+                    loading={props.action.loading}
+                />
+            ))}
         </View>
     );
 };

src/pages/home/report/ReportActionsView.js

@@ -36,7 +36,6 @@ import Performance from '../../../libs/Performance';
 import * as ReportUtils from '../../../libs/reportUtils';
 import ONYXKEYS from '../../../ONYXKEYS';
 import {withPersonalDetails} from '../../../components/OnyxProvider';
-import currentUserPersonalDetailsPropsTypes from '../../settings/Profile/currentUserPersonalDetailsPropsTypes';
 import {participantPropTypes} from '../sidebar/optionPropTypes';
 import EmojiPicker from '../../../components/EmojiPicker';
 import * as EmojiPickerAction from '../../../libs/actions/EmojiPickerAction';
@@ -74,9 +73,6 @@ const propTypes = {
     /** Are we loading more report actions? */
     isLoadingReportActions: PropTypes.bool,
 
-    /** The personal details of the person who is logged in */
-    myPersonalDetails: PropTypes.shape(currentUserPersonalDetailsPropsTypes),
-
     /** Personal details of all the users */
     personalDetails: PropTypes.objectOf(participantPropTypes),
 
@@ -95,7 +91,6 @@ const defaultProps = {
     session: {},
     isLoadingReportActions: false,
     personalDetails: {},
-    myPersonalDetails: {},
 };
 
 class ReportActionsView extends React.Component {
@@ -335,7 +330,7 @@ class ReportActionsView extends React.Component {
         this.sortedReportActions = _.chain(reportActions)
             .sortBy('sequenceNumber')
             .filter(action => action.actionName === CONST.REPORT.ACTIONS.TYPE.IOU
-                || action.actionName === CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT
+                || (action.actionName === CONST.REPORT.ACTIONS.TYPE.ADDCOMMENT && !ReportUtils.isDeletedAction(action))
                 || action.actionName === CONST.REPORT.ACTIONS.TYPE.RENAMED
                 || action.actionName === CONST.REPORT.ACTIONS.TYPE.CREATED)
             .map((item, index) => ({action: item, index}))
@@ -547,7 +542,7 @@ class ReportActionsView extends React.Component {
         // Native mobile does not render updates flatlist the changes even though component did update called.
         // To notify there something changes we can use extraData prop to flatlist
         const extraData = (!this.props.isDrawerOpen && this.props.isSmallScreenWidth) ? this.props.report.newMarkerSequenceNumber : undefined;
-        const shouldShowReportRecipientLocalTime = ReportUtils.canShowReportRecipientLocalTime(this.props.personalDetails, this.props.myPersonalDetails, this.props.report);
+        const shouldShowReportRecipientLocalTime = ReportUtils.canShowReportRecipientLocalTime(this.props.personalDetails, this.props.report);
 
         return (
             <>
@@ -600,8 +595,5 @@ export default compose(
             key: ONYXKEYS.IS_LOADING_REPORT_ACTIONS,
             initWithStoredValues: false,
         },
-        myPersonalDetails: {
-            key: ONYXKEYS.MY_PERSONAL_DETAILS,
-        },
     }),
 )(ReportActionsView);

src/pages/workspace/WorkspaceInvitePage.js

@@ -257,6 +257,7 @@ class WorkspaceInvitePage extends React.Component {
                             <FullScreenLoadingIndicator visible={!didScreenTransitionEnd} />
                             {didScreenTransitionEnd && (
                                 <OptionsSelector
+                                    autoFocus={false}
                                     canSelectMultipleOptions
                                     sections={sections}
                                     selectedOptions={this.state.selectedOptions}