mirror of
				https://github.com/open-metadata/OpenMetadata.git
				synced 2025-10-31 02:29:03 +00:00 
			
		
		
		
	Minor: add base class for entity right panel (#14202)
This commit is contained in:
		
							parent
							
								
									ce77d2486a
								
							
						
					
					
						commit
						d773ae2ef0
					
				| @ -624,6 +624,7 @@ const DashboardDetails = ({ | ||||
|                 domain={dashboardDetails?.domain} | ||||
|                 editTagPermission={editTagsPermission} | ||||
|                 entityFQN={decodedDashboardFQN} | ||||
|                 entityId={dashboardDetails.id} | ||||
|                 entityType={EntityType.DASHBOARD} | ||||
|                 selectedTags={dashboardTags} | ||||
|                 onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -235,6 +235,7 @@ const DataModelDetails = ({ | ||||
|             domain={dataModelData?.domain} | ||||
|             editTagPermission={editTagsPermission} | ||||
|             entityFQN={decodedDataModelFQN} | ||||
|             entityId={dataModelData.id} | ||||
|             entityType={EntityType.DASHBOARD_DATA_MODEL} | ||||
|             selectedTags={tags} | ||||
|             onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -15,6 +15,7 @@ import { EntityTags } from 'Models'; | ||||
| import React from 'react'; | ||||
| import { EntityType } from '../../../enums/entity.enum'; | ||||
| import { EntityReference } from '../../../generated/entity/type'; | ||||
| import entityRightPanelClassBase from '../../../utils/EntityRightPanelClassBase'; | ||||
| import EntityRightPanel from './EntityRightPanel'; | ||||
| 
 | ||||
| jest.mock('../../DataProductsContainer/DataProductsContainer.component', () => { | ||||
| @ -25,6 +26,8 @@ jest.mock('../../Tag/TagsContainerV2/TagsContainerV2', () => { | ||||
|   return jest.fn().mockImplementation(() => <div>TagsContainerV2</div>); | ||||
| }); | ||||
| 
 | ||||
| jest.mock('../../../utils/EntityRightPanelClassBase'); | ||||
| 
 | ||||
| describe('EntityRightPanel component test', () => { | ||||
|   const mockDataProducts: EntityReference[] = []; | ||||
|   const mockSelectedTags: EntityTags[] = []; | ||||
| @ -37,6 +40,7 @@ describe('EntityRightPanel component test', () => { | ||||
|         editTagPermission | ||||
|         dataProducts={mockDataProducts} | ||||
|         entityFQN="testEntityFQN" | ||||
|         entityId="testEntityId" | ||||
|         entityType={EntityType.TABLE} | ||||
|         selectedTags={mockSelectedTags} | ||||
|         onTagSelectionChange={mockOnTagSelectionChange} | ||||
| @ -54,6 +58,7 @@ describe('EntityRightPanel component test', () => { | ||||
|         editTagPermission | ||||
|         dataProducts={mockDataProducts} | ||||
|         entityFQN="testEntityFQN" | ||||
|         entityId="testEntityId" | ||||
|         entityType={EntityType.TABLE} | ||||
|         selectedTags={mockSelectedTags} | ||||
|         showDataProductContainer={false} | ||||
| @ -73,6 +78,7 @@ describe('EntityRightPanel component test', () => { | ||||
|         beforeSlot={<div>beforeSlot</div>} | ||||
|         dataProducts={mockDataProducts} | ||||
|         entityFQN="testEntityFQN" | ||||
|         entityId="testEntityId" | ||||
|         entityType={EntityType.TABLE} | ||||
|         selectedTags={mockSelectedTags} | ||||
|         showDataProductContainer={false} | ||||
| @ -91,6 +97,7 @@ describe('EntityRightPanel component test', () => { | ||||
|         editTagPermission | ||||
|         dataProducts={mockDataProducts} | ||||
|         entityFQN="testEntityFQN" | ||||
|         entityId="testEntityId" | ||||
|         entityType={EntityType.TABLE} | ||||
|         selectedTags={mockSelectedTags} | ||||
|         showDataProductContainer={false} | ||||
| @ -102,4 +109,53 @@ describe('EntityRightPanel component test', () => { | ||||
|     expect(screen.queryByText('beforeSlot')).not.toBeInTheDocument(); | ||||
|     expect(screen.queryByText('afterSlot')).not.toBeInTheDocument(); | ||||
|   }); | ||||
| 
 | ||||
|   it('Component should render KnowledgeArticles when getKnowLedgeArticlesWidget is not null', () => { | ||||
|     const KnowledgeArticles = () => ( | ||||
|       <div data-testid="KnowledgeArticles">KnowledgeArticles</div> | ||||
|     ); | ||||
|     const spy = jest | ||||
|       .spyOn(entityRightPanelClassBase, 'getKnowLedgeArticlesWidget') | ||||
|       .mockImplementation(() => KnowledgeArticles); | ||||
|     render( | ||||
|       <EntityRightPanel | ||||
|         editTagPermission | ||||
|         dataProducts={mockDataProducts} | ||||
|         entityFQN="testEntityFQN" | ||||
|         entityId="testEntityId" | ||||
|         entityType={EntityType.TABLE} | ||||
|         selectedTags={mockSelectedTags} | ||||
|         showDataProductContainer={false} | ||||
|         onTagSelectionChange={mockOnTagSelectionChange} | ||||
|         onThreadLinkSelect={mockOnThreadLinkSelect} | ||||
|       /> | ||||
|     ); | ||||
| 
 | ||||
|     expect(spy).toHaveBeenCalled(); | ||||
| 
 | ||||
|     expect(screen.getByText('KnowledgeArticles')).toBeInTheDocument(); | ||||
|   }); | ||||
| 
 | ||||
|   it('Component should not render KnowledgeArticles when getKnowLedgeArticlesWidget is null', () => { | ||||
|     const spy = jest | ||||
|       .spyOn(entityRightPanelClassBase, 'getKnowLedgeArticlesWidget') | ||||
|       .mockImplementation(() => null); | ||||
|     render( | ||||
|       <EntityRightPanel | ||||
|         editTagPermission | ||||
|         dataProducts={mockDataProducts} | ||||
|         entityFQN="testEntityFQN" | ||||
|         entityId="testEntityId" | ||||
|         entityType={EntityType.TABLE} | ||||
|         selectedTags={mockSelectedTags} | ||||
|         showDataProductContainer={false} | ||||
|         onTagSelectionChange={mockOnTagSelectionChange} | ||||
|         onThreadLinkSelect={mockOnThreadLinkSelect} | ||||
|       /> | ||||
|     ); | ||||
| 
 | ||||
|     expect(spy).toHaveBeenCalled(); | ||||
| 
 | ||||
|     expect(screen.queryByText('KnowledgeArticles')).not.toBeInTheDocument(); | ||||
|   }); | ||||
| }); | ||||
|  | ||||
| @ -17,6 +17,7 @@ import { EntityType } from '../../../enums/entity.enum'; | ||||
| import { ThreadType } from '../../../generated/entity/feed/thread'; | ||||
| import { EntityReference } from '../../../generated/entity/type'; | ||||
| import { TagSource } from '../../../generated/type/tagLabel'; | ||||
| import entityRightPanelClassBase from '../../../utils/EntityRightPanelClassBase'; | ||||
| import DataProductsContainer from '../../DataProductsContainer/DataProductsContainer.component'; | ||||
| import TagsContainerV2 from '../../Tag/TagsContainerV2/TagsContainerV2'; | ||||
| import { DisplayType } from '../../Tag/TagsViewer/TagsViewer.interface'; | ||||
| @ -26,6 +27,7 @@ interface EntityRightPanelProps { | ||||
|   editTagPermission: boolean; | ||||
|   entityType: EntityType; | ||||
|   entityFQN: string; | ||||
|   entityId: string; | ||||
|   selectedTags: EntityTags[]; | ||||
|   beforeSlot?: React.ReactNode; | ||||
|   showTaskHandler?: boolean; | ||||
| @ -47,9 +49,13 @@ const EntityRightPanel: FC<EntityRightPanelProps> = ({ | ||||
|   onThreadLinkSelect, | ||||
|   beforeSlot, | ||||
|   afterSlot, | ||||
|   entityId, | ||||
|   showTaskHandler = true, | ||||
|   showDataProductContainer = true, | ||||
| }) => { | ||||
|   const KnowledgeArticles = | ||||
|     entityRightPanelClassBase.getKnowLedgeArticlesWidget(); | ||||
| 
 | ||||
|   return ( | ||||
|     <> | ||||
|       {beforeSlot} | ||||
| @ -85,6 +91,9 @@ const EntityRightPanel: FC<EntityRightPanelProps> = ({ | ||||
|           onSelectionChange={onTagSelectionChange} | ||||
|           onThreadLinkSelect={onThreadLinkSelect} | ||||
|         /> | ||||
|         {KnowledgeArticles && ( | ||||
|           <KnowledgeArticles entityId={entityId} entityType={entityType} /> | ||||
|         )} | ||||
|       </Space> | ||||
|       {afterSlot} | ||||
|     </> | ||||
|  | ||||
| @ -425,6 +425,7 @@ const MlModelDetail: FC<MlModelDetailProp> = ({ | ||||
|                 domain={mlModelDetail?.domain} | ||||
|                 editTagPermission={editTagsPermission} | ||||
|                 entityFQN={decodedMlModelFqn} | ||||
|                 entityId={mlModelDetail.id} | ||||
|                 entityType={EntityType.MLMODEL} | ||||
|                 selectedTags={mlModelTags} | ||||
|                 onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -605,6 +605,7 @@ const PipelineDetails = ({ | ||||
|                 domain={pipelineDetails?.domain} | ||||
|                 editTagPermission={editTagsPermission} | ||||
|                 entityFQN={pipelineFQN} | ||||
|                 entityId={pipelineDetails.id} | ||||
|                 entityType={EntityType.PIPELINE} | ||||
|                 selectedTags={tags} | ||||
|                 onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -330,6 +330,7 @@ const TopicDetails: React.FC<TopicDetailsProps> = ({ | ||||
|                 domain={topicDetails?.domain} | ||||
|                 editTagPermission={editTagsPermission} | ||||
|                 entityFQN={decodedTopicFQN} | ||||
|                 entityId={topicDetails.id} | ||||
|                 entityType={EntityType.TOPIC} | ||||
|                 selectedTags={topicTags} | ||||
|                 onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -545,6 +545,7 @@ const ContainerPage = () => { | ||||
|                   editTagsPermission && !containerData?.deleted | ||||
|                 } | ||||
|                 entityFQN={decodedContainerName} | ||||
|                 entityId={containerData?.id ?? ''} | ||||
|                 entityType={EntityType.CONTAINER} | ||||
|                 selectedTags={tags} | ||||
|                 onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -540,6 +540,7 @@ const DatabaseDetails: FunctionComponent = () => { | ||||
|                 domain={database?.domain} | ||||
|                 editTagPermission={editTagsPermission} | ||||
|                 entityFQN={decodedDatabaseFQN} | ||||
|                 entityId={database?.id ?? ''} | ||||
|                 entityType={EntityType.DATABASE} | ||||
|                 selectedTags={tags} | ||||
|                 onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -586,6 +586,7 @@ const DatabaseSchemaPage: FunctionComponent = () => { | ||||
|               domain={databaseSchema?.domain} | ||||
|               editTagPermission={editTagsPermission} | ||||
|               entityFQN={decodedDatabaseSchemaFQN} | ||||
|               entityId={databaseSchema?.id ?? ''} | ||||
|               entityType={EntityType.DATABASE_SCHEMA} | ||||
|               selectedTags={tags} | ||||
|               onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -395,6 +395,7 @@ function SearchIndexDetailsPage() { | ||||
|             domain={searchIndexDetails?.domain} | ||||
|             editTagPermission={editTagsPermission} | ||||
|             entityFQN={decodedSearchIndexFQN} | ||||
|             entityId={searchIndexDetails?.id ?? ''} | ||||
|             entityType={EntityType.SEARCH_INDEX} | ||||
|             selectedTags={searchIndexTags} | ||||
|             onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -220,6 +220,7 @@ function ServiceMainTabContent({ | ||||
|           domain={(serviceDetails as DatabaseService)?.domain} | ||||
|           editTagPermission={editTagsPermission} | ||||
|           entityFQN={serviceFQN} | ||||
|           entityId={serviceDetails.id} | ||||
|           entityType={entityType} | ||||
|           selectedTags={tags} | ||||
|           showDataProductContainer={entityType !== EntityType.METADATA_SERVICE} | ||||
|  | ||||
| @ -556,6 +556,7 @@ const StoredProcedurePage = () => { | ||||
|                 domain={storedProcedure?.domain} | ||||
|                 editTagPermission={editTagsPermission} | ||||
|                 entityFQN={decodedStoredProcedureFQN} | ||||
|                 entityId={storedProcedure?.id ?? ''} | ||||
|                 entityType={EntityType.STORED_PROCEDURE} | ||||
|                 selectedTags={tags} | ||||
|                 onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -517,7 +517,10 @@ const TableDetailsPageV1 = () => { | ||||
|           flex="320px"> | ||||
|           <EntityRightPanel | ||||
|             afterSlot={ | ||||
|               <Space className="w-full" direction="vertical" size="large"> | ||||
|               <Space | ||||
|                 className="w-full m-t-lg" | ||||
|                 direction="vertical" | ||||
|                 size="large"> | ||||
|                 <TableConstraints | ||||
|                   constraints={tableDetails?.tableConstraints} | ||||
|                 /> | ||||
| @ -537,6 +540,7 @@ const TableDetailsPageV1 = () => { | ||||
|             domain={tableDetails?.domain} | ||||
|             editTagPermission={editTagsPermission} | ||||
|             entityFQN={decodedTableFQN} | ||||
|             entityId={tableDetails?.id ?? ''} | ||||
|             entityType={EntityType.TABLE} | ||||
|             selectedTags={tableTags} | ||||
|             onTagSelectionChange={handleTagSelection} | ||||
|  | ||||
| @ -0,0 +1,55 @@ | ||||
| /* | ||||
|  *  Copyright 2023 Collate. | ||||
|  *  Licensed under the Apache License, Version 2.0 (the "License"); | ||||
|  *  you may not use this file except in compliance with the License. | ||||
|  *  You may obtain a copy of the License at | ||||
|  *  http://www.apache.org/licenses/LICENSE-2.0
 | ||||
|  *  Unless required by applicable law or agreed to in writing, software | ||||
|  *  distributed under the License is distributed on an "AS IS" BASIS, | ||||
|  *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||||
|  *  See the License for the specific language governing permissions and | ||||
|  *  limitations under the License. | ||||
|  */ | ||||
| import { render, screen } from '@testing-library/react'; | ||||
| import React, { FC } from 'react'; | ||||
| import entityRightPanelClassBase, { | ||||
|   EntityRightPanelClassBase, | ||||
| } from './EntityRightPanelClassBase'; | ||||
| 
 | ||||
| describe('EntityRightPanelClassBase', () => { | ||||
|   let instance: EntityRightPanelClassBase; | ||||
| 
 | ||||
|   beforeEach(() => { | ||||
|     instance = new EntityRightPanelClassBase(); | ||||
|   }); | ||||
| 
 | ||||
|   it('should create an instance of EntityRightPanelClassBase', () => { | ||||
|     expect(instance).toBeInstanceOf(EntityRightPanelClassBase); | ||||
|   }); | ||||
| 
 | ||||
|   it('should return null from getKnowLedgeArticlesWidget method', () => { | ||||
|     const widget: FC<{ entityId: string; entityType: string }> | null = | ||||
|       instance.getKnowLedgeArticlesWidget(); | ||||
| 
 | ||||
|     expect(widget).toBeNull(); | ||||
|   }); | ||||
| 
 | ||||
|   it('should return a valid React component when getKnowLedgeArticlesWidget is not null', () => { | ||||
|     // Mock the getKnowLedgeArticlesWidget method to return a KnowLedgeArticles component
 | ||||
|     instance.getKnowLedgeArticlesWidget = () => () => | ||||
|       <div data-testid="KnowLedgeArticles" />; | ||||
| 
 | ||||
|     const Widget = instance.getKnowLedgeArticlesWidget(); | ||||
|     if (Widget) { | ||||
|       render(<Widget entityId="test" entityType="test" />); | ||||
|     } | ||||
| 
 | ||||
|     expect(screen.queryByTestId('KnowLedgeArticles')).toBeInTheDocument(); | ||||
|   }); | ||||
| }); | ||||
| 
 | ||||
| describe('entityRightPanelClassBase', () => { | ||||
|   it('should be an instance of EntityRightPanelClassBase', () => { | ||||
|     expect(entityRightPanelClassBase).toBeInstanceOf(EntityRightPanelClassBase); | ||||
|   }); | ||||
| }); | ||||
| @ -0,0 +1,28 @@ | ||||
| /* | ||||
|  *  Copyright 2023 Collate. | ||||
|  *  Licensed under the Apache License, Version 2.0 (the "License"); | ||||
|  *  you may not use this file except in compliance with the License. | ||||
|  *  You may obtain a copy of the License at | ||||
|  *  http://www.apache.org/licenses/LICENSE-2.0
 | ||||
|  *  Unless required by applicable law or agreed to in writing, software | ||||
|  *  distributed under the License is distributed on an "AS IS" BASIS, | ||||
|  *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | ||||
|  *  See the License for the specific language governing permissions and | ||||
|  *  limitations under the License. | ||||
|  */ | ||||
| import { FC } from 'react'; | ||||
| 
 | ||||
| class EntityRightPanelClassBase { | ||||
|   public getKnowLedgeArticlesWidget(): FC<{ | ||||
|     entityId: string; | ||||
|     entityType: string; | ||||
|   }> | null { | ||||
|     return null; | ||||
|   } | ||||
| } | ||||
| 
 | ||||
| const entityRightPanelClassBase = new EntityRightPanelClassBase(); | ||||
| 
 | ||||
| export default entityRightPanelClassBase; | ||||
| 
 | ||||
| export { EntityRightPanelClassBase }; | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user
	 Sachin Chaurasiya
						Sachin Chaurasiya