From 5a8be4b2e79b1def1831301e73dab5b0ba3b95b9 Mon Sep 17 00:00:00 2001
From: Ashish Gupta <ashish@getcollate.io>
Date: Sat, 22 Mar 2025 14:00:43 +0530
Subject: [PATCH] MINOR: fix the display not render in lineage drawer (#20381)

* fix the display not render in lineage drawer

* minor optimization
---
 .../EntityHeaderTitle.component.tsx           | 19 +++++++++++++++++--
 .../EntityHeaderTitle.interface.ts            |  1 +
 .../EntityInfoDrawer.component.tsx            |  1 +
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityHeaderTitle/EntityHeaderTitle.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityHeaderTitle/EntityHeaderTitle.component.tsx
index 9038a6bbcfe..260333945d2 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityHeaderTitle/EntityHeaderTitle.component.tsx
+++ b/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"
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityHeaderTitle/EntityHeaderTitle.interface.ts b/openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityHeaderTitle/EntityHeaderTitle.interface.ts
index 0a17fc87cb1..1aeb94a840e 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityHeaderTitle/EntityHeaderTitle.interface.ts
+++ b/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;
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityInfoDrawer/EntityInfoDrawer.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityInfoDrawer/EntityInfoDrawer.component.tsx
index bf99e3e77ba..f66dd2251df 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Entity/EntityInfoDrawer/EntityInfoDrawer.component.tsx
+++ b/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}