MINOR: fix the display not render in lineage drawer (#20381)

* fix the display not render in lineage drawer

* minor optimization

openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityHeaderTitle/EntityHeaderTitle.component.tsx

@@ -23,6 +23,7 @@ import { ReactComponent as StarFilledIcon } from '../../../assets/svg/ic-star-fi
 import { ROUTES } from '../../../constants/constants';
 import { useClipboard } from '../../../hooks/useClipBoard';
 import useCustomLocation from '../../../hooks/useCustomLocation/useCustomLocation';
+import { getEntityName } from '../../../utils/EntityUtils';
 import { stringToHTML } from '../../../utils/StringsUtils';
 import CertificationTag from '../../common/CertificationTag/CertificationTag';
 import './entity-header-title.less';
@@ -40,6 +41,7 @@ const EntityHeaderTitle = ({
   isDisabled,
   className,
   showName = true,
+  showOnlyDisplayName = false,
   certification,
   excludeEntityService,
   isFollowing,
@@ -66,6 +68,19 @@ const EntityHeaderTitle = ({
     [location.pathname]
   );
 
+  const entityName = useMemo(
+    () =>
+      stringToHTML(
+        showOnlyDisplayName
+          ? getEntityName({
+              displayName,
+              name,
+            })
+          : name
+      ),
+    [showOnlyDisplayName, displayName, name]
+  );
+
   const content = (
     <Row
       align="middle"
@@ -97,7 +112,7 @@ const EntityHeaderTitle = ({
         <div
           className="d-flex gap-3 items-center"
           data-testid="entity-header-title">
-          <Tooltip placement="bottom" title={stringToHTML(name)}>
+          <Tooltip placement="bottom" title={entityName}>
             <Typography.Text
               className={classNames(displayNameClassName, 'm-b-0', {
                 'display-sm entity-header-name font-semibold': !displayName,
@@ -105,7 +120,7 @@ const EntityHeaderTitle = ({
               })}
               data-testid="entity-header-name"
               ellipsis={{ tooltip: true }}>
-              {stringToHTML(name)}
+              {entityName}
               {openEntityInNewPage && (
                 <IconExternalLink
                   className="anticon vertical-baseline m-l-xss"

openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityHeaderTitle/EntityHeaderTitle.interface.ts

@@ -17,6 +17,7 @@ import { AssetCertification } from '../../../generated/entity/data/table';
 export interface EntityHeaderTitleProps {
   className?: string;
   icon: React.ReactNode;
+  showOnlyDisplayName?: boolean;
   name: string;
   displayName?: string;
   link?: string;

openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityInfoDrawer/EntityInfoDrawer.component.tsx

@@ -94,6 +94,7 @@ const EntityInfoDrawer = ({
 
           <Col span={24}>
             <EntityHeaderTitle
+              showOnlyDisplayName
               className="w-max-350"
               deleted={selectedNode.deleted}
               displayName={selectedNode.displayName}