Merge pull request #19545 from Nikhil-Vats/issue/18658_fix_deleted_he…

…ading_style_in_offline_mode fix: offline deleted heading styles and link padding
Expensify · Jun 8, 2023 · 092819f · 092819f
2 parents fb48246 + 8df3eea
commit 092819f
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 12 deletions.
diff --git a/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js b/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js
@@ -11,6 +11,7 @@ import * as ContextMenuActions from '../../pages/home/report/ContextMenu/Context
 import Tooltip from '../Tooltip';
 import * as DeviceCapabilities from '../../libs/DeviceCapabilities';
 import styles from '../../styles/styles';
+import * as StyleUtils from '../../styles/StyleUtils';
 import withWindowDimensions, {windowDimensionsPropTypes} from '../withWindowDimensions';
 import {propTypes as anchorForCommentsOnlyPropTypes, defaultProps as anchorForCommentsOnlyDefaultProps} from './anchorForCommentsOnlyPropTypes';
 
@@ -53,6 +54,7 @@ const BaseAnchorForCommentsOnly = (props) => {
     return (
         <PressableWithSecondaryInteraction
             inline
+            style={[styles.cursorDefault, StyleUtils.getFontSizeStyle(props.style.fontSize)]}
             onSecondaryInteraction={(event) => {
                 ReportActionContextMenu.showContextMenu(
                     isEmail ? ContextMenuActions.CONTEXT_MENU_TYPES.EMAIL : ContextMenuActions.CONTEXT_MENU_TYPES.LINK,

diff --git a/src/components/AnchorForCommentsOnly/index.js b/src/components/AnchorForCommentsOnly/index.js
@@ -1,20 +1,16 @@
 import React from 'react';
-import {View} from 'react-native';
 import * as anchorForCommentsOnlyPropTypes from './anchorForCommentsOnlyPropTypes';
 import BaseAnchorForCommentsOnly from './BaseAnchorForCommentsOnly';
 import * as DeviceCapabilities from '../../libs/DeviceCapabilities';
 import ControlSelection from '../../libs/ControlSelection';
-import styles from '../../styles/styles';
 
 const AnchorForCommentsOnly = (props) => (
-    <View style={styles.dInline}>
-        <BaseAnchorForCommentsOnly
-            // eslint-disable-next-line react/jsx-props-no-spreading
-            {...props}
-            onPressIn={() => DeviceCapabilities.canUseTouchScreen() && ControlSelection.block()}
-            onPressOut={() => ControlSelection.unblock()}
-        />
-    </View>
+    <BaseAnchorForCommentsOnly
+        // eslint-disable-next-line react/jsx-props-no-spreading
+        {...props}
+        onPressIn={() => DeviceCapabilities.canUseTouchScreen() && ControlSelection.block()}
+        onPressOut={() => ControlSelection.unblock()}
+    />
 );
 
 AnchorForCommentsOnly.propTypes = anchorForCommentsOnlyPropTypes.propTypes;

diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js
@@ -60,7 +60,7 @@ const ImageRenderer = (props) => {
                 >
                     {({show}) => (
                         <PressableWithoutFocus
-                            style={styles.noOutline}
+                            styles={styles.noOutline}
                             onPress={show}
                             onLongPress={(event) => showContextMenuForReport(event, anchor, report.reportID, action, checkIfContextMenuActive, ReportUtils.isArchivedRoom(report))}
                         >

diff --git a/src/components/PressableWithSecondaryInteraction/index.js b/src/components/PressableWithSecondaryInteraction/index.js
@@ -77,7 +77,6 @@ class PressableWithSecondaryInteraction extends Component {
         // On Web, Text does not support LongPress events thus manage inline mode with styling instead of using Text.
         return (
             <Pressable
-                style={StyleUtils.combineStyles(this.props.inline ? styles.dInline : this.props.style)}
                 onPressIn={this.props.onPressIn}
                 onLongPress={this.props.onSecondaryInteraction ? this.executeSecondaryInteraction : undefined}
                 activeOpacity={this.props.activeOpacity}
@@ -86,6 +85,7 @@ class PressableWithSecondaryInteraction extends Component {
                 ref={(el) => (this.pressableRef = el)}
                 // eslint-disable-next-line react/jsx-props-no-spreading
                 {...defaultPressableProps}
+                style={(state) => [StyleUtils.parseStyleFromFunction(this.props.style, state), ...[this.props.inline && styles.dInline]]}
             >
                 {this.props.children}
             </Pressable>