From e20cc4696e91690a0008d98d5ccc9817f91d784e Mon Sep 17 00:00:00 2001
From: Nikhil Vats <nikvats5499@gmail.com>
Date: Sun, 18 Jun 2023 23:06:35 +0530
Subject: [PATCH 1/2] fix offline deleted heading link style

---
 .../BaseAnchorForCommentsOnly.js                 |  4 +++-
 src/components/AnchorForCommentsOnly/index.js    | 16 ++++++----------
 .../PressableWithSecondaryInteraction/index.js   |  2 +-
 3 files changed, 10 insertions(+), 12 deletions(-)

diff --git a/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js b/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js
index 191af3613e1f..c16507fdb007 100644
--- 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 @@ function 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,
@@ -68,7 +70,7 @@ function BaseAnchorForCommentsOnly(props) {
             <Tooltip text={props.href}>
                 <Text
                     ref={(el) => (linkRef = el)}
-                    style={StyleSheet.flatten([props.style, defaultTextStyle])}
+                    style={StyleSheet.flatten([props.style, defaultTextStyle, styles.cursorPointer])}
                     accessibilityRole="link"
                     hrefAttrs={{
                         rel: props.rel,
diff --git a/src/components/AnchorForCommentsOnly/index.js b/src/components/AnchorForCommentsOnly/index.js
index 9ded866b7cdf..6c72621deeea 100644
--- a/src/components/AnchorForCommentsOnly/index.js
+++ b/src/components/AnchorForCommentsOnly/index.js
@@ -1,21 +1,17 @@
 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';
 
 function AnchorForCommentsOnly(props) {
     return (
-        <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()}
+        />
     );
 }
 
diff --git a/src/components/PressableWithSecondaryInteraction/index.js b/src/components/PressableWithSecondaryInteraction/index.js
index 7f43451cbadd..9ea6b5f28739 100644
--- 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>

From b243707b42e120aa8e55d6c24c09bfe452cfe151 Mon Sep 17 00:00:00 2001
From: Nikhil Vats <nikvats5499@gmail.com>
Date: Wed, 21 Jun 2023 23:01:29 +0530
Subject: [PATCH 2/2] fix warning in native devices

---
 .../AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js        | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js b/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js
index c16507fdb007..fd0cc34ab7d3 100644
--- a/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js
+++ b/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js
@@ -48,7 +48,7 @@ function BaseAnchorForCommentsOnly(props) {
     } else {
         linkProps.href = props.href;
     }
-    const defaultTextStyle = DeviceCapabilities.canUseTouchScreen() || props.isSmallScreenWidth ? {} : styles.userSelectText;
+    const defaultTextStyle = DeviceCapabilities.canUseTouchScreen() || props.isSmallScreenWidth ? {} : {...styles.userSelectText, ...styles.cursorPointer};
     const isEmail = Str.isValidEmailMarkdown(props.href.replace(/mailto:/i, ''));
 
     return (
@@ -70,7 +70,7 @@ function BaseAnchorForCommentsOnly(props) {
             <Tooltip text={props.href}>
                 <Text
                     ref={(el) => (linkRef = el)}
-                    style={StyleSheet.flatten([props.style, defaultTextStyle, styles.cursorPointer])}
+                    style={StyleSheet.flatten([props.style, defaultTextStyle])}
                     accessibilityRole="link"
                     hrefAttrs={{
                         rel: props.rel,