Merge pull request Expensify#65557 from Expensify/georgia-revert-64709

[CP Staging] Revert Expensify#64709

Author: mountiny

src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.tsx

@@ -1,6 +1,6 @@
 import {useIsFocused} from '@react-navigation/native';
 import {Str} from 'expensify-common';
-import React, {useEffect, useRef, useState} from 'react';
+import React, {useEffect, useRef} from 'react';
 // eslint-disable-next-line no-restricted-imports
 import type {Text as RNText} from 'react-native';
 import {StyleSheet} from 'react-native';
@@ -9,7 +9,6 @@ import Text from '@components/Text';
 import Tooltip from '@components/Tooltip';
 import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useStyleUtils from '@hooks/useStyleUtils';
-import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {canUseTouchScreen} from '@libs/DeviceCapabilities';
 import {hideContextMenu, showContextMenu} from '@pages/home/report/ContextMenu/ReportActionContextMenu';
@@ -32,12 +31,10 @@ function BaseAnchorForCommentsOnly({
     wrapperStyle,
     ...rest
 }: BaseAnchorForCommentsOnlyProps) {
-    const theme = useTheme();
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const linkRef = useRef<RNText>(null);
     const flattenStyle = StyleSheet.flatten(style);
-    const [isHovered, setIsHovered] = useState(false);
 
     useEffect(
         () => () => {
@@ -55,7 +52,6 @@ function BaseAnchorForCommentsOnly({
         linkProps.href = href;
     }
     const defaultTextStyle = canUseTouchScreen() || shouldUseNarrowLayout ? {} : {...styles.userSelectText, ...styles.cursorPointer};
-    const hoverStyle = isHovered ? StyleUtils.getColorStyle(theme.linkHover) : {};
     const isEmail = Str.isValidEmail(href.replace(/mailto:/i, ''));
     const linkHref = !linkHasImage ? href : undefined;
     const isFocused = useIsFocused();
@@ -83,8 +79,6 @@ function BaseAnchorForCommentsOnly({
             }}
             onPressIn={onPressIn}
             onPressOut={onPressOut}
-            onHoverIn={() => setIsHovered(true)}
-            onHoverOut={() => setIsHovered(false)}
             role={CONST.ROLE.LINK}
             accessibilityLabel={href}
             wrapperStyle={wrapperStyle}
@@ -95,7 +89,7 @@ function BaseAnchorForCommentsOnly({
             >
                 <Text
                     ref={linkRef}
-                    style={StyleSheet.flatten([style, defaultTextStyle, hoverStyle])}
+                    style={StyleSheet.flatten([style, defaultTextStyle])}
                     role={CONST.ROLE.LINK}
                     hrefAttrs={{
                         rel,

src/components/HTMLEngineProvider/HTMLRenderers/AnchorRenderer.tsx

@@ -133,7 +133,15 @@ function AnchorRenderer({tnode, style, key}: AnchorRendererProps) {
             // eslint-disable-next-line react/jsx-props-no-multi-spaces
             target={htmlAttribs.target || '_blank'}
             rel={htmlAttribs.rel || 'noopener noreferrer'}
-            style={[style, parentStyle, styles.textDecorationLineNone, isChildOfTaskTitle && styles.taskTitleMenuItem, styles.dInlineFlex]}
+            style={[
+                style,
+                parentStyle,
+                textDecorationLineStyle,
+                styles.textUnderlinePositionUnder,
+                styles.textDecorationSkipInkNone,
+                isChildOfTaskTitle && styles.taskTitleMenuItem,
+                styles.dInlineFlex,
+            ]}
             key={key}
             // Only pass the press handler for internal links. For public links or whitelisted internal links fallback to default link handling
             onPress={onLinkPress}

src/styles/utils/textDecorationLine.ts

@@ -1,9 +1,6 @@
 import type {TextStyle} from 'react-native';
 
 export default {
-    textDecorationLineNone: {
-        textDecorationLine: 'none',
-    },
     lineThrough: {
         textDecorationLine: 'line-through',
         textDecorationStyle: 'solid',