fix(glossary terms): some cosmetic fixes for glossary terms (#3235)

datahub-project · Sep 15, 2021 · 9be6d2b · 9be6d2b
1 parent 32779bb
commit 9be6d2b
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 6 deletions.
diff --git a/datahub-web-react/src/app/browse/BrowseResultCard.tsx b/datahub-web-react/src/app/browse/BrowseResultCard.tsx
@@ -3,6 +3,7 @@ import { Card, Row, Space, Typography } from 'antd';
 import { Link } from 'react-router-dom';
 import { ArrowRightOutlined, FolderOutlined } from '@ant-design/icons';
 import styled from 'styled-components';
+import { singularizeCollectionName } from '../entity/shared/utils';
 
 const styles = {
     row: { padding: 8 },
@@ -28,6 +29,10 @@ export interface BrowseResultProps {
 }
 
 export default function BrowseResultCard({ url, count, name, type, onClick }: BrowseResultProps) {
+    let displayType = type;
+    if (count === 1) {
+        displayType = singularizeCollectionName(type);
+    }
     return (
         <Link to={url} onClick={onClick}>
             <ResultCard hoverable>
@@ -41,7 +46,7 @@ export default function BrowseResultCard({ url, count, name, type, onClick }: Br
                     <Space>
                         {count && (
                             <Typography.Text strong>
-                                {count} {type}
+                                {count} {displayType}
                             </Typography.Text>
                         )}
                         <ArrowRightOutlined />

diff --git a/datahub-web-react/src/app/entity/glossaryTerm/GlossaryTermEntity.tsx b/datahub-web-react/src/app/entity/glossaryTerm/GlossaryTermEntity.tsx
@@ -40,7 +40,7 @@ export class GlossaryTermEntity implements Entity<GlossaryTerm> {
 
     getPathName = () => 'glossary';
 
-    getCollectionName = () => 'Business Glossary';
+    getCollectionName = () => 'Glossary Terms';
 
     getEntityName = () => 'Glossary Term';
 

diff --git a/datahub-web-react/src/app/entity/shared/utils.ts b/datahub-web-react/src/app/entity/shared/utils.ts
@@ -13,3 +13,16 @@ export const truncate = (length: number, input?: string | null) => {
     }
     return input;
 };
+
+export const singularizeCollectionName = (collectionName: string): string => {
+    if (!collectionName) {
+        return collectionName;
+    }
+
+    const lastChar = collectionName[collectionName.length - 1];
+    if (lastChar === 's') {
+        return collectionName.slice(0, -1);
+    }
+
+    return collectionName;
+};
diff --git a/datahub-web-react/src/app/shared/tags/TagTermGroup.tsx b/datahub-web-react/src/app/shared/tags/TagTermGroup.tsx
@@ -38,6 +38,12 @@ const TagLink = styled(Link)`
     margin-bottom: 8px;
 `;
 
+const NoElementButton = styled(Button)`
+    :not(:last-child) {
+        margin-right: 8px;
+    }
+`;
+
 export default function TagTermGroup({
     uneditableTags,
     editableTags,
@@ -203,7 +209,7 @@ export default function TagTermGroup({
                 </Typography.Paragraph>
             )}
             {canAddTag && (uneditableTags?.tags?.length || 0) + (editableTags?.tags?.length || 0) < 10 && (
-                <Button
+                <NoElementButton
                     type={showEmptyMessage && tagsEmpty ? 'default' : 'text'}
                     onClick={() => {
                         setAddModalType(EntityType.Tag);
@@ -213,11 +219,11 @@ export default function TagTermGroup({
                 >
                     <PlusOutlined />
                     Add Tag
-                </Button>
+                </NoElementButton>
             )}
             {canAddTerm &&
                 (uneditableGlossaryTerms?.terms?.length || 0) + (editableGlossaryTerms?.terms?.length || 0) < 10 && (
-                    <Button
+                    <NoElementButton
                         type={showEmptyMessage && tagsEmpty ? 'default' : 'text'}
                         onClick={() => {
                             setAddModalType(EntityType.GlossaryTerm);
@@ -227,7 +233,7 @@ export default function TagTermGroup({
                     >
                         <PlusOutlined />
                         Add Term
-                    </Button>
+                    </NoElementButton>
                 )}
             {showAddModal && !!entityUrn && !!entityType && (
                 <AddTagTermModal