Conflict resolved

android/app/build.gradle

@@ -106,8 +106,8 @@ android {
         minSdkVersion rootProject.ext.minSdkVersion
         targetSdkVersion rootProject.ext.targetSdkVersion
         multiDexEnabled rootProject.ext.multiDexEnabled
-        versionCode 1001030902
-        versionName "1.3.9-2"
+        versionCode 1001030914
+        versionName "1.3.9-14"
     }
 
     splits {

ios/NewExpensify/Info.plist

@@ -30,7 +30,7 @@
 		</dict>
 	</array>
 	<key>CFBundleVersion</key>
-	<string>1.3.9.2</string>
+	<string>1.3.9.14</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
 	<false/>
 	<key>LSApplicationQueriesSchemes</key>

ios/NewExpensifyTests/Info.plist

@@ -19,6 +19,6 @@
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleVersion</key>
-	<string>1.3.9.2</string>
+	<string>1.3.9.14</string>
 </dict>
 </plist>

jest/setup.js

@@ -11,7 +11,7 @@ jest.mock('react-native/Libraries/Animated/NativeAnimatedHelper');
 
 // We have to mock the SQLiteStorage provider because it uses the native module SQLiteStorage, which is not available in jest.
 // Mocking this file in __mocks__ does not work because jest doesn't support mocking files that are not directly used in the testing project
-jest.mock('react-native-onyx/lib/storage/providers/SQLiteStorage', () => require('react-native-onyx/lib/storage/providers/__mocks__/SQLiteStorage'));
+jest.mock('react-native-onyx/lib/storage/providers/SQLiteStorage', () => require('react-native-onyx/lib/storage/__mocks__'));
 
 // Turn off the console logs for timing events. They are not relevant for unit tests and create a lot of noise
 jest.spyOn(console, 'debug').mockImplementation((...params) => {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "new.expensify",
-  "version": "1.3.9-2",
+  "version": "1.3.9-14",
   "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.",
@@ -109,7 +109,7 @@
     "react-native-key-command": "^1.0.0",
     "react-native-localize": "^2.2.6",
     "react-native-modal": "^13.0.0",
-    "react-native-onyx": "1.0.39",
+    "react-native-onyx": "^1.0.41",
     "react-native-pdf": "^6.6.2",
     "react-native-performance": "^4.0.0",
     "react-native-permissions": "^3.0.1",
@@ -173,7 +173,7 @@
     "css-loader": "^6.7.2",
     "diff-so-fancy": "^1.3.0",
     "dotenv": "^16.0.3",
-    "electron": "22.3.6",
+    "electron": "22.3.7",
     "electron-builder": "23.5.0",
     "electron-notarize": "^1.2.1",
     "eslint": "^7.6.0",

src/CONST.js

@@ -967,15 +967,10 @@ const CONST = {
     },
     REGEX: {
         SPECIAL_CHARS_WITHOUT_NEWLINE: /((?!\n)[()-\s\t])/g,
-        US_PHONE: /^\+1\d{10}$/,
-        US_PHONE_WITH_OPTIONAL_COUNTRY_CODE: /^(\+1)?\d{10}$/,
         DIGITS_AND_PLUS: /^\+?[0-9]*$/,
-        PHONE_E164_PLUS: /^\+?[1-9]\d{1,14}$/,
-        PHONE_WITH_SPECIAL_CHARS: /^\s*(?:\+?(\d{1,3}))?[-. (]*(\d{3})[-. )]*(\d{3})[-. ]*(\d{4})(?: *x(\d+))?\s*$/,
         ALPHABETIC_CHARS: /[a-zA-Z]+/,
         ALPHABETIC_CHARS_WITH_NUMBER: /^[a-zA-Z0-9 ]*$/,
         POSITIVE_INTEGER: /^\d+$/,
-        NON_ALPHA_NUMERIC: /[^A-Za-z0-9+]/g,
         PO_BOX: /\b[P|p]?(OST|ost)?\.?\s*[O|o|0]?(ffice|FFICE)?\.?\s*[B|b][O|o|0]?[X|x]?\.?\s+[#]?(\d+)\b/,
         ANY_VALUE: /^.+$/,
         ZIP_CODE: /[0-9]{5}(?:[- ][0-9]{4})?/,
@@ -997,7 +992,6 @@ const CONST = {
         // Extract attachment's source from the data's html string
         ATTACHMENT_DATA: /(data-expensify-source|data-name)="([^"]+)"/g,
 
-        NON_NUMERIC_WITH_PLUS: /[^0-9+]/g,
         EMOJI_NAME: /:[\w+-]+:/g,
         EMOJI_SUGGESTIONS: /:[a-zA-Z0-9_+-]{1,40}$/,
         AFTER_FIRST_LINE_BREAK: /\n.*/g,

src/components/ContextMenuItem.js

@@ -7,6 +7,9 @@ import * as StyleUtils from '../styles/StyleUtils';
 import getButtonState from '../libs/getButtonState';
 import withDelayToggleButtonState, {withDelayToggleButtonStatePropTypes} from './withDelayToggleButtonState';
 import BaseMiniContextMenuItem from './BaseMiniContextMenuItem';
+import withWindowDimensions from './withWindowDimensions';
+import compose from '../libs/compose';
+import getContextMenuItemStyles from '../styles/getContextMenuItemStyles';
 
 const propTypes = {
     /** Icon Component */
@@ -93,6 +96,8 @@ class ContextMenuItem extends Component {
                         wrapperStyle={styles.pr9}
                         success={this.props.isDelayButtonStateComplete}
                         description={this.props.description}
+                        descriptionTextStyle={styles.breakAll}
+                        style={getContextMenuItemStyles(this.props.windowWidth)}
                     />
                 )
         );
@@ -102,4 +107,7 @@ class ContextMenuItem extends Component {
 ContextMenuItem.propTypes = propTypes;
 ContextMenuItem.defaultProps = defaultProps;
 
-export default withDelayToggleButtonState(ContextMenuItem);
+export default compose(
+    withWindowDimensions,
+    withDelayToggleButtonState,
+)(ContextMenuItem);

src/components/DotIndicatorMessage.js

@@ -6,7 +6,6 @@ import styles from '../styles/styles';
 import Icon from './Icon';
 import * as Expensicons from './Icon/Expensicons';
 import colors from '../styles/colors';
-import variables from '../styles/variables';
 import Text from './Text';
 
 const propTypes = {
@@ -54,7 +53,7 @@ const DotIndicatorMessage = (props) => {
     return (
         <View style={[styles.dotIndicatorMessage, ...props.style]}>
             <View style={styles.offlineFeedback.errorDot}>
-                <Icon src={Expensicons.DotIndicator} fill={props.type === 'error' ? colors.red : colors.green} height={variables.iconSizeSmall} width={variables.iconSizeSmall} />
+                <Icon src={Expensicons.DotIndicator} fill={props.type === 'error' ? colors.red : colors.green} />
             </View>
             <View style={styles.offlineFeedback.textContainer}>
                 {_.map(sortedMessages, (message, i) => (

src/components/HTMLEngineProvider/HTMLRenderers/EditedRenderer.js

@@ -6,6 +6,7 @@ import Text from '../../Text';
 import variables from '../../../styles/variables';
 import themeColors from '../../../styles/themes/default';
 import styles from '../../../styles/styles';
+import editedLabelStyles from '../../../styles/editedLabelStyles';
 
 const propTypes = {
     ...htmlRendererPropTypes,
@@ -20,9 +21,10 @@ const EditedRenderer = (props) => {
             {...defaultRendererProps}
             fontSize={variables.fontSizeSmall}
             color={themeColors.textSupporting}
+            style={[styles.alignItemsBaseline, editedLabelStyles]}
         >
             {/* Native devices do not support margin between nested text */}
-            <Text style={styles.w1}>{' '}</Text>
+            <Text style={[styles.w1, styles.userSelectNone]}>{' '}</Text>
             {props.translate('reportActionCompose.edited')}
         </Text>
     );

src/components/LHNOptionsList/OptionRowLHN.js

@@ -19,7 +19,6 @@ import withLocalize, {withLocalizePropTypes} from '../withLocalize';
 import Text from '../Text';
 import SubscriptAvatar from '../SubscriptAvatar';
 import CONST from '../../CONST';
-import variables from '../../styles/variables';
 import themeColors from '../../styles/themes/default';
 import SidebarUtils from '../../libs/SidebarUtils';
 import TextPill from '../TextPill';
@@ -207,8 +206,6 @@ const OptionRowLHN = (props) => {
                                         <Icon
                                             src={Expensicons.DotIndicator}
                                             fill={colors.red}
-                                            height={variables.iconSizeNormal}
-                                            width={variables.iconSizeNormal}
                                         />
                                     </View>
                                 )}
@@ -218,28 +215,21 @@ const OptionRowLHN = (props) => {
                             style={[styles.flexRow, styles.alignItemsCenter]}
                             accessible={false}
                         >
-                            {shouldShowGreenDotIndicator && (
-                                <Icon
-                                    height={variables.iconSizeNormal}
-                                    width={variables.iconSizeNormal}
-                                    src={Expensicons.DotIndicator}
-                                    fill={colors.green}
-                                />
-                            )}
+                            {shouldShowGreenDotIndicator && <Icon src={Expensicons.DotIndicator} fill={themeColors.success} />}
                             {optionItem.hasDraftComment && (
                                 <View
                                     style={styles.ml2}
                                     accessibilityLabel={props.translate('sidebarScreen.draftedMessage')}
                                 >
-                                    <Icon src={Expensicons.Pencil} height={16} width={16} />
+                                    <Icon src={Expensicons.Pencil} />
                                 </View>
                             )}
                             {!shouldShowGreenDotIndicator && optionItem.isPinned && (
                                 <View
                                     style={styles.ml2}
                                     accessibilityLabel={props.translate('sidebarScreen.chatPinned')}
                                 >
-                                    <Icon src={Expensicons.Pin} height={16} width={16} />
+                                    <Icon src={Expensicons.Pin} />
                                 </View>
                             )}
                         </View>

src/components/MenuItem.js

@@ -13,7 +13,6 @@ import CONST from '../CONST';
 import menuItemPropTypes from './menuItemPropTypes';
 import SelectCircle from './SelectCircle';
 import colors from '../styles/colors';
-import variables from '../styles/variables';
 import MultipleAvatars from './MultipleAvatars';
 import * as defaultWorkspaceAvatars from './Icon/WorkspaceDefaultAvatars';
 import PressableWithSecondaryInteraction from './PressableWithSecondaryInteraction';
@@ -35,6 +34,7 @@ const defaultProps = {
     wrapperStyle: [],
     style: styles.popoverMenuItem,
     titleStyle: {},
+    descriptionTextStyle: styles.breakWord,
     success: false,
     icon: undefined,
     iconWidth: undefined,
@@ -73,9 +73,9 @@ const MenuItem = (props) => {
     const descriptionTextStyle = StyleUtils.combineStyles([
         styles.textLabelSupporting,
         (props.icon ? styles.ml3 : undefined),
-        styles.breakWord,
         styles.lineHeightNormal,
         props.title ? descriptionVerticalMargin : undefined,
+        props.descriptionTextStyle,
     ]);
 
     const fallbackAvatarSize = props.viewMode === CONST.OPTION_MODE.COMPACT ? CONST.AVATAR_SIZE.SMALL : CONST.AVATAR_SIZE.DEFAULT;
@@ -208,8 +208,6 @@ const MenuItem = (props) => {
                                 <Icon
                                     src={Expensicons.DotIndicator}
                                     fill={props.brickRoadIndicator === 'error' ? colors.red : colors.green}
-                                    height={variables.iconSizeSmall}
-                                    width={variables.iconSizeSmall}
                                 />
                             </View>
                         )}

src/components/MultipleAvatars.js

@@ -55,7 +55,9 @@ const defaultProps = {
 };
 
 const MultipleAvatars = (props) => {
-    let avatarContainerStyles = props.size === CONST.AVATAR_SIZE.SMALL ? styles.emptyAvatarSmall : styles.emptyAvatar;
+    let avatarContainerStyles = props.size === CONST.AVATAR_SIZE.SMALL
+        ? [styles.emptyAvatarSmall, styles.emptyAvatarMarginSmall]
+        : [styles.emptyAvatar, styles.emptyAvatarMargin];
     const singleAvatarStyles = props.size === CONST.AVATAR_SIZE.SMALL ? styles.singleAvatarSmall : styles.singleAvatar;
     const secondAvatarStyles = [
         props.size === CONST.AVATAR_SIZE.SMALL ? styles.secondAvatarSmall : styles.secondAvatar,

src/components/OptionRow.js

@@ -24,7 +24,6 @@ import SubscriptAvatar from './SubscriptAvatar';
 import OfflineWithFeedback from './OfflineWithFeedback';
 import CONST from '../CONST';
 import * as ReportUtils from '../libs/ReportUtils';
-import variables from '../styles/variables';
 
 const propTypes = {
     /** Style for hovered state */
@@ -207,7 +206,6 @@ class OptionRow extends Component {
                                                     secondaryAvatar={this.props.option.icons[1]}
                                                     mainTooltip={this.props.option.ownerEmail}
                                                     secondaryTooltip={this.props.option.subtitle}
-                                                    size={CONST.AVATAR_SIZE.DEFAULT}
                                                     backgroundColor={
                                                     hovered && !this.props.optionIsFocused
                                                         ? hoveredBackgroundColor
@@ -263,8 +261,6 @@ class OptionRow extends Component {
                                         <Icon
                                             src={Expensicons.DotIndicator}
                                             fill={themeColors.danger}
-                                            height={variables.iconSizeSmall}
-                                            width={variables.iconSizeSmall}
                                         />
                                     </View>
                                     )}
@@ -279,8 +275,6 @@ class OptionRow extends Component {
                                     <View>
                                         <Icon
                                             src={lodashGet(this.props.option, 'customIcon.src', '')}
-                                            height={16}
-                                            width={16}
                                             fill={lodashGet(this.props.option, 'customIcon.color')}
                                         />
                                     </View>