From 8e79a893551a85ab65c217da90ad7e43deac1ad0 Mon Sep 17 00:00:00 2001
From: Ankit keshari <86347578+Ankit-Keshari-Vituity@users.noreply.github.com>
Date: Wed, 29 Jun 2022 23:17:30 +0530
Subject: [PATCH] refactor(ui): Show message when related glossary terms are
 empty. (#5285)

---
 .../glossaryTerm/profile/GlossaryRelatedTermsResult.tsx   | 4 ++++
 datahub-web-react/src/app/entity/shared/constants.ts      | 8 ++++++++
 .../header/PlatformContent/PlatformContentView.tsx        | 3 ++-
 3 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/datahub-web-react/src/app/entity/glossaryTerm/profile/GlossaryRelatedTermsResult.tsx b/datahub-web-react/src/app/entity/glossaryTerm/profile/GlossaryRelatedTermsResult.tsx
index b5c18d5d58..fce14b3dc8 100644
--- a/datahub-web-react/src/app/entity/glossaryTerm/profile/GlossaryRelatedTermsResult.tsx
+++ b/datahub-web-react/src/app/entity/glossaryTerm/profile/GlossaryRelatedTermsResult.tsx
@@ -4,6 +4,7 @@ import React, { useState } from 'react';
 import styled from 'styled-components/macro';
 import { TermRelationshipType } from '../../../../types.generated';
 import { Message } from '../../../shared/Message';
+import { EmptyTab } from '../../shared/components/styled/EmptyTab';
 import { ANTD_GRAY } from '../../shared/constants';
 import AddRelatedTermsModal from './AddRelatedTermsModal';
 import RelatedTerm from './RelatedTerm';
@@ -62,6 +63,9 @@ export default function GlossaryRelatedTermsResult({ glossaryRelatedTermType, gl
                     {glossaryRelatedTermUrns.map((urn) => (
                         <RelatedTerm key={urn} urn={urn} relationshipType={relationshipType} />
                     ))}
+                    {glossaryRelatedTermUrns.length === 0 && (
+                        <EmptyTab tab={glossaryRelatedTermType.toLocaleLowerCase()} />
+                    )}
                 </ListContainer>
             )}
             {isShowingAddModal && (
diff --git a/datahub-web-react/src/app/entity/shared/constants.ts b/datahub-web-react/src/app/entity/shared/constants.ts
index 51d785c12f..a1412e4133 100644
--- a/datahub-web-react/src/app/entity/shared/constants.ts
+++ b/datahub-web-react/src/app/entity/shared/constants.ts
@@ -47,4 +47,12 @@ export const EMPTY_MESSAGES = {
         title: 'No domain set',
         description: 'Group related entities based on your organizational structure using by adding them to a Domain.',
     },
+    contains: {
+        title: 'Contains no Terms',
+        description: 'Terms can contain other terms to represent an "Has A" style relationship.',
+    },
+    inherits: {
+        title: 'Does not inherit from any terms',
+        description: 'Terms can inherit from other terms to represent an "Is A" style relationship.',
+    },
 };
diff --git a/datahub-web-react/src/app/entity/shared/containers/profile/header/PlatformContent/PlatformContentView.tsx b/datahub-web-react/src/app/entity/shared/containers/profile/header/PlatformContent/PlatformContentView.tsx
index aaba7d5818..6d044ae810 100644
--- a/datahub-web-react/src/app/entity/shared/containers/profile/header/PlatformContent/PlatformContentView.tsx
+++ b/datahub-web-react/src/app/entity/shared/containers/profile/header/PlatformContent/PlatformContentView.tsx
@@ -6,6 +6,7 @@ import { Maybe } from 'graphql/jsutils/Maybe';
 import { Container } from '../../../../../../../types.generated';
 import { ANTD_GRAY } from '../../../../constants';
 import ContainerLink from './ContainerLink';
+import { capitalizeFirstLetter } from '../../../../../../shared/textUtil';
 
 const LogoIcon = styled.span`
     display: flex;
@@ -119,7 +120,7 @@ function PlatformContentView(props: Props) {
     return (
         <PlatformContentWrapper>
             {typeIcon && <LogoIcon>{typeIcon}</LogoIcon>}
-            <PlatformText>{entityType}</PlatformText>
+            <PlatformText>{capitalizeFirstLetter(entityType)}</PlatformText>
             {(!!platformName || !!instanceId || !!parentContainers?.length) && <PlatformDivider />}
             {platformName && (
                 <LogoIcon>