From acae6b4facde18d53ea103b4d46458a6dfdd4058 Mon Sep 17 00:00:00 2001
From: Shailesh Parmar <shailesh.parmar.webdev@gmail.com>
Date: Wed, 4 May 2022 05:32:02 +0530
Subject: [PATCH] Fix issue 4556 UI: Explore page improvements (#4661)

---
 .../src/components/common/table-data-card/TableDataCard.tsx | 6 +++---
 .../components/common/table-data-card/TableDataCardBody.tsx | 2 +-
 .../src/main/resources/ui/src/interface/types.d.ts          | 1 +
 .../src/main/resources/ui/src/utils/EntityUtils.tsx         | 6 +++++-
 4 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card/TableDataCard.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card/TableDataCard.tsx
index 51c89e02abf..5b8721e40b0 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card/TableDataCard.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card/TableDataCard.tsx
@@ -80,7 +80,7 @@ const TableDataCard: FunctionComponent<Props> = ({
   };
 
   const OtherDetails: Array<ExtraInfo> = [
-    { key: 'Owner', value: owner },
+    { key: 'Owner', value: owner, avatarWidth: '16' },
     { key: 'Tier', value: getTier() },
   ];
   if (indexType !== SearchIndex.DASHBOARD && usage !== undefined) {
@@ -142,9 +142,9 @@ const TableDataCard: FunctionComponent<Props> = ({
             className="tw-inline tw-h-5 tw-w-5"
             src={serviceTypeLogo(serviceType || '')}
           />
-          <h6 className="tw-flex tw-items-center tw-m-0 tw-heading tw-pl-2">
+          <h6 className="tw-flex tw-items-center tw-m-0 tw-text-base tw-pl-2">
             <button
-              className="tw-text-grey-body tw-font-medium"
+              className="tw-text-grey-body tw-font-semibold"
               data-testid="table-link"
               id={`${id}Title`}
               onClick={handleLinkClick}>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card/TableDataCardBody.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card/TableDataCardBody.tsx
index d26e1661b4e..b141cee4d8b 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card/TableDataCardBody.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/table-data-card/TableDataCardBody.tsx
@@ -49,7 +49,7 @@ const TableDataCardBody: FunctionComponent<Props> = ({
 
   return (
     <div data-testid="table-body">
-      <div className="tw-mb-4 tw-flex tw-items-center tw-flex-wrap">
+      <div className="tw-mb-4 tw-flex tw-items-center tw-flex-wrap tw-text-xs">
         {extraInfo.map((info, i) =>
           !isNil(info.value) ? (
             <span
diff --git a/openmetadata-ui/src/main/resources/ui/src/interface/types.d.ts b/openmetadata-ui/src/main/resources/ui/src/interface/types.d.ts
index 89b6c9ed79c..2e33aa357c2 100644
--- a/openmetadata-ui/src/main/resources/ui/src/interface/types.d.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/interface/types.d.ts
@@ -493,6 +493,7 @@ declare module 'Models' {
     placeholderText?: string;
     openInNewTab?: boolean;
     showLabel?: boolean;
+    avatarWidth?: string;
   };
 
   export type TourSteps = {
diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/EntityUtils.tsx b/openmetadata-ui/src/main/resources/ui/src/utils/EntityUtils.tsx
index 0ba6ad0f492..20dc3bfd4dc 100644
--- a/openmetadata-ui/src/main/resources/ui/src/utils/EntityUtils.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/utils/EntityUtils.tsx
@@ -389,7 +389,11 @@ export const getInfoElements = (data: ExtraInfo) => {
           displayVal && displayVal !== '--' ? (
             isString(displayVal) ? (
               <div className="tw-inline-block tw-mr-2">
-                <Avatar name={displayVal} textClass="tw-text-xs" width="20" />
+                <Avatar
+                  name={displayVal}
+                  textClass="tw-text-xs"
+                  width={data.avatarWidth || '20'}
+                />
               </div>
             ) : (
               <></>