ui: entity summary panel improvements (#9922)

* fixed bug where table constraints were not displaying in entity summary panel

* fixed summary panel not hiding in case of no results

* Changes made to improved the typescript type declaration as per comment

openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/SummaryList/SummaryList.interface.ts

@@ -15,7 +15,11 @@ import { ReactNode } from 'react';
 import { SummaryEntityType } from '../../../../enums/EntitySummary.enum';
 import { ChartType } from '../../../../generated/entity/data/chart';
 import { FeatureType } from '../../../../generated/entity/data/mlmodel';
-import { Constraint, DataType } from '../../../../generated/entity/data/table';
+import {
+  Constraint,
+  DataType,
+  TableConstraint,
+} from '../../../../generated/entity/data/table';
 import { TagLabel } from '../../../../generated/type/tagLabel';
 
 export interface BasicEntityInfo {
@@ -25,7 +29,8 @@ export interface BasicEntityInfo {
   type?: DataType | ChartType | FeatureType | string;
   tags?: TagLabel[];
   description?: string;
-  constraint?: Constraint;
+  columnConstraint?: Constraint;
+  tableConstraints?: TableConstraint[];
   children?: BasicEntityInfo[];
 }
 

openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/SummaryList/SummaryListItems/SummaryListItems.component.tsx

@@ -37,8 +37,8 @@ function SummaryListItem({
           {isColumnsData &&
             prepareConstraintIcon(
               entityDetails.name,
-              entityDetails.constraint,
-              undefined,
+              entityDetails.columnConstraint,
+              entityDetails.tableConstraints,
               'm-r-xss',
               '14px'
             )}

openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/TableSummary/TableSummary.component.tsx

@@ -47,7 +47,7 @@ import { BasicTableInfo, TableSummaryProps } from './TableSummary.interface';
 
 function TableSummary({ entityDetails }: TableSummaryProps) {
   const { t } = useTranslation();
-  const [TableDetails, setTableDetails] = useState<Table>(entityDetails);
+  const [tableDetails, setTableDetails] = useState<Table>(entityDetails);
   const [tableTests, setTableTests] = useState<TableTestsType>({
     tests: [],
     results: INITIAL_TEST_RESULT_SUMMARY,
@@ -116,27 +116,27 @@ function TableSummary({ entityDetails }: TableSummaryProps) {
   };
 
   const overallSummary: OverallTableSummeryType[] | undefined = useMemo(() => {
-    if (isUndefined(TableDetails.profile)) {
+    if (isUndefined(tableDetails.profile)) {
       return undefined;
     }
 
     return [
       {
         title: t('label.row-count'),
-        value: formatNumberWithComma(TableDetails?.profile?.rowCount ?? 0),
+        value: formatNumberWithComma(tableDetails?.profile?.rowCount ?? 0),
       },
       {
         title: t('label.column-entity', {
           entity: t('label.count'),
         }),
         value:
-          TableDetails?.profile?.columnCount ?? entityDetails.columns.length,
+          tableDetails?.profile?.columnCount ?? entityDetails.columns.length,
       },
       {
         title: `${t('label.table-entity-text', {
           entityText: t('label.sample'),
         })} %`,
-        value: `${TableDetails?.profile?.profileSample ?? 100}%`,
+        value: `${tableDetails?.profile?.profileSample ?? 100}%`,
       },
       {
         title: `${t('label.test-plural')} ${t('label.passed')}`,
@@ -154,9 +154,9 @@ function TableSummary({ entityDetails }: TableSummaryProps) {
         className: 'failed',
       },
     ];
-  }, [TableDetails, tableTests]);
+  }, [tableDetails, tableTests]);
 
-  const { tableType, columns, tableQueries } = TableDetails;
+  const { tableType, columns, tableQueries } = tableDetails;
 
   const basicTableInfo: BasicTableInfo = useMemo(
     () => ({
@@ -168,8 +168,13 @@ function TableSummary({ entityDetails }: TableSummaryProps) {
   );
 
   const formattedColumnsData: BasicEntityInfo[] = useMemo(
-    () => getFormattedEntityData(SummaryEntityType.COLUMN, columns),
-    [columns]
+    () =>
+      getFormattedEntityData(
+        SummaryEntityType.COLUMN,
+        columns,
+        tableDetails.tableConstraints
+      ),
+    [columns, tableDetails]
   );
 
   useEffect(() => {
@@ -187,7 +192,7 @@ function TableSummary({ entityDetails }: TableSummaryProps) {
           <TableDataCardTitle
             dataTestId="summary-panel-title"
             searchIndex={SearchIndex.TABLE}
-            source={TableDetails}
+            source={tableDetails}
           />
         </Col>
         <Col span={24}>

openmetadata-ui/src/main/resources/ui/src/components/Explore/Explore.component.tsx

@@ -227,6 +227,9 @@ const Explore: React.FC<ExploreProps> = ({
         searchResults?.hits?.hits[0]._source as EntityDetailsType,
         tab
       );
+    } else {
+      setShowSummaryPanel(false);
+      setEntityDetails(undefined);
     }
   }, [tab, searchResults]);
 

openmetadata-ui/src/main/resources/ui/src/utils/EntitySummaryPanelUtils.tsx

@@ -20,7 +20,7 @@ import { SummaryEntityType } from '../enums/EntitySummary.enum';
 import { Chart } from '../generated/entity/data/chart';
 import { MlFeature } from '../generated/entity/data/mlmodel';
 import { Task } from '../generated/entity/data/pipeline';
-import { Column } from '../generated/entity/data/table';
+import { Column, TableConstraint } from '../generated/entity/data/table';
 import { Field } from '../generated/entity/data/topic';
 import { getEntityName } from './CommonUtils';
 import SVGIcons from './SvgUtils';
@@ -29,7 +29,8 @@ const { Text } = Typography;
 
 export const getFormattedEntityData = (
   entityType: SummaryEntityType,
-  entityInfo?: Column[] | Field[] | Chart[] | Task[] | MlFeature[]
+  entityInfo?: Array<Column | Field | Chart | Task | MlFeature>,
+  tableConstraints?: TableConstraint[]
 ): BasicEntityInfo[] => {
   if (isEmpty(entityInfo)) {
     return [];
@@ -42,7 +43,8 @@ export const getFormattedEntityData = (
         type: column.dataType,
         tags: column.tags,
         description: column.description,
-        constraint: column.constraint,
+        columnConstraint: column.constraint,
+        tableConstraints: tableConstraints,
         children: getFormattedEntityData(
           SummaryEntityType.COLUMN,
           column.children