Profile: Allow pointer actions in bio (#1085)

src/components/right/ChatExtra.tsx

@@ -76,13 +76,11 @@ const ChatExtra: FC<OwnProps & StateProps & DispatchProps> = ({
     return undefined;
   }
 
-  const bio = fullInfo && fullInfo.bio;
   const formattedNumber = phoneNumber && formatPhoneNumberWithCode(phoneNumber);
-  const description = getChatDescription(chat);
   const link = getChatLink(chat);
   const url = link.indexOf('http') === 0 ? link : `http://${link}`;
   const printedUsername = username || chatUsername;
-  const printedDescription = bio || description;
+  const description = (fullInfo && fullInfo.bio) || getChatDescription(chat);
 
   return (
     <div className="ChatExtra">
@@ -104,15 +102,14 @@ const ChatExtra: FC<OwnProps & StateProps & DispatchProps> = ({
           <span className="subtitle">{lang('Username')}</span>
         </ListItem>
       )}
-      {printedDescription && !!printedDescription.length && (
+      {description && !!description.length && (
         <ListItem
           icon="info"
           multiline
           narrow
-          ripple
-          onClick={() => handleClick(printedDescription, lang(userId ? 'UserBio' : 'Info'))}
+          isStatic
         >
-          <span className="title">{renderText(printedDescription, ['br', 'links', 'emoji'])}</span>
+          <span className="title">{renderText(description, ['br', 'links', 'emoji'])}</span>
           <span className="subtitle">{lang(userId ? 'UserBio' : 'Info')}</span>
         </ListItem>
       )}

src/components/ui/ListItem.scss

@@ -39,7 +39,7 @@
     }
   }
 
-  &:not(.disabled) {
+  &:not(.disabled):not(.is-static) {
     .ListItem-button {
       cursor: pointer;
 
@@ -50,7 +50,7 @@
   }
 
   @media (min-width: 600px) {
-    &:not(.has-ripple),
+    &:not(.has-ripple):not(.is-static),
     body.animation-level-0 & {
       .ListItem-button:active {
         --background-color: var(--color-item-active) !important;

src/components/ui/ListItem.tsx

@@ -34,6 +34,7 @@ type OwnProps = {
   focus?: boolean;
   destructive?: boolean;
   multiline?: boolean;
+  isStatic?: boolean;
   contextActions?: MenuItemContextAction[];
   onClick?: OnClickHandler;
 };
@@ -52,6 +53,7 @@ const ListItem: FC<OwnProps> = (props) => {
     focus,
     destructive,
     multiline,
+    isStatic,
     contextActions,
     onClick,
   } = props;
@@ -111,8 +113,9 @@ const ListItem: FC<OwnProps> = (props) => {
   }, [inactive, contextActions, onClick, handleBeforeContextMenu, handleContextMenu, handleClick]);
 
   const fullClassName = buildClassName(
-    'ListItem no-selection',
+    'ListItem',
     className,
+    !isStatic && 'no-selection',
     ripple && 'has-ripple',
     narrow && 'narrow',
     disabled && 'disabled',
@@ -121,6 +124,7 @@ const ListItem: FC<OwnProps> = (props) => {
     focus && 'focus',
     destructive && 'destructive',
     multiline && 'multiline',
+    isStatic && 'is-static',
   );
 
   return (