FIx Bug 60425: Add highlighting for user's email

packages/client/src/pages/AccountsHome/Section/Body/TableView/TableRow.js

@@ -389,6 +389,7 @@ const PeopleTableRow = (props) => {
             color={sideInfoColor}
             onClick={onEmailClick}
             isTextOverflow
+            enableUserSelect
           >
             {email}
           </Link>

packages/components/link/index.js

@@ -3,7 +3,13 @@ import PropTypes from "prop-types";
 import StyledText from "./styled-link";
 
 // eslint-disable-next-line react/display-name
-const Link = ({ isTextOverflow, children, noHover, ...rest }) => {
+const Link = ({
+  isTextOverflow,
+  children,
+  noHover,
+  enableUserSelect,
+  ...rest
+}) => {
   // console.log("Link render", rest);
 
   return (
@@ -12,6 +18,7 @@ const Link = ({ isTextOverflow, children, noHover, ...rest }) => {
       isTextOverflow={isTextOverflow}
       noHover={noHover}
       truncate={isTextOverflow}
+      enableUserSelect={enableUserSelect}
       {...rest}
     >
       {children}
@@ -57,6 +64,8 @@ Link.propTypes = {
   title: PropTypes.string,
   /** Type of link */
   type: PropTypes.oneOf(["action", "page"]),
+
+  enableUserSelect: PropTypes.bool,
 };
 
 Link.defaultProps = {
@@ -71,6 +80,7 @@ Link.defaultProps = {
   rel: "noopener noreferrer",
   tabIndex: -1,
   type: "page",
+  enableUserSelect: false,
 };
 
 export default Link;

packages/components/link/styled-link.js

@@ -22,7 +22,7 @@ const PureText = ({ type, color, ...props }) => <Text {...props} />;
 const StyledText = styled(PureText)`
   text-decoration: ${(props) => props.theme.link.textDecoration};
 
-  ${NoUserSelect}
+  ${(props) => !props.enableUserSelect && NoUserSelect}
 
   cursor: ${(props) => props.theme.link.cursor};
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);