add conditional pagination for tabname task

gaurav2733 · Apr 16, 2024 · 28fe1e4 · 28fe1e4
1 parent 6da8607
commit 28fe1e4
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 6 deletions.
diff --git a/datahub-web-react/src/app/entity/shared/containers/profile/EntityProfile.tsx b/datahub-web-react/src/app/entity/shared/containers/profile/EntityProfile.tsx
@@ -165,7 +165,7 @@ export const EntityProfile = <T, U>({
     const entityRegistry = useEntityRegistry();
     const history = useHistory();
     const appConfig = useAppConfig();
-    const { count, start } = useTaskPagination();
+    const { count, start, tabNamePagination } = useTaskPagination();
     const isCompact = React.useContext(CompactContext);
     const tabsWithDefaults = tabs.map((tab) => ({ ...tab, display: { ...defaultTabDisplayConfig, ...tab.display } }));
 
@@ -216,7 +216,13 @@ export const EntityProfile = <T, U>({
     );
 
     const { entityData, dataPossiblyCombinedWithSiblings, dataNotCombinedWithSiblings, loading, error, refetch } =
-        useGetDataForProfile({ urn, entityType, count ,start , useEntityQuery, getOverrideProperties });
+        useGetDataForProfile({
+            urn,
+            entityType,
+            ...(tabNamePagination === 'Task' && { count, start }),
+            useEntityQuery,
+            getOverrideProperties,
+        });
 
     useUpdateGlossaryEntityDataOnChange(entityData, entityType);
     useUpdateDomainEntityDataOnChange(entityData, entityType);

diff --git a/datahub-web-react/src/app/entity/shared/tabs/Entity/DataFlowJobsTab.tsx b/datahub-web-react/src/app/entity/shared/tabs/Entity/DataFlowJobsTab.tsx
@@ -1,11 +1,13 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { useBaseEntity } from '../../EntityContext';
 import { EntityType } from '../../../../../types.generated';
 import { EntityList } from './components/EntityList';
 import { useEntityRegistry } from '../../../../useEntityRegistry';
+import { useTaskPagination } from './components/TaskPaginationContext';
 
 export const DataFlowJobsTab = () => {
     const entity = useBaseEntity() as any;
+    const { setTab } = useTaskPagination();
     const dataFlow = entity && entity.dataFlow;
     const dataJobs = dataFlow?.childJobs?.relationships.map((relationship) => relationship.entity);
     const entityRegistry = useEntityRegistry();
@@ -19,6 +21,14 @@ export const DataFlowJobsTab = () => {
             ? entityRegistry.getEntityName(EntityType.DataJob)
             : entityRegistry.getCollectionName(EntityType.DataJob)
     }`;
+
+    useEffect(() => {
+        setTab('Task');
+        return () => {
+            setTab('');
+        };
+    }, [setTab]);
+
     return (
         <EntityList
             showTaskPagination

diff --git a/datahub-web-react/src/app/entity/shared/tabs/Entity/components/TaskPaginationContext.tsx b/datahub-web-react/src/app/entity/shared/tabs/Entity/components/TaskPaginationContext.tsx
@@ -2,28 +2,46 @@ import React, { createContext, useContext, useState } from 'react';
 import { SearchCfg } from '../../../../../../conf';
 
 type PaginationUpdateFunction = (newCount: number, newStart: number) => void;
+type TabNameUpdateFunction = (newTabName: string) => void;
 
-const TaskPaginationContext = createContext({
+interface TaskPaginationContextType {
+    count: number;
+    start: number;
+    tabNamePagination: string | undefined;
+    updateData: PaginationUpdateFunction;
+    setTab: TabNameUpdateFunction;
+}
+
+const TaskPaginationContext = createContext<TaskPaginationContextType>({
     count: SearchCfg.RESULTS_PER_PAGE,
     start: 1,
-    updateData: (() => {}) as PaginationUpdateFunction,
+    tabNamePagination: '',
+    updateData: () => {},
+    setTab: () => {},
 });
 
 export const useTaskPagination = () => useContext(TaskPaginationContext);
 
 export const TaskPaginationProvider = ({ children }: { children: React.ReactNode }) => {
     const [count, setCount] = useState(SearchCfg.RESULTS_PER_PAGE);
     const [start, setStart] = useState(1);
+    const [tabNamePagination, setTabName] = useState<string | undefined>('');
 
     const updateData: PaginationUpdateFunction = (newCount, newStart) => {
         setCount(newCount);
         setStart(newStart);
     };
 
-    const contextValue = {
+    const setTab: TabNameUpdateFunction = (newTabName) => {
+        setTabName(newTabName);
+    };
+
+    const contextValue: TaskPaginationContextType = {
         count,
         start,
+        tabNamePagination,
         updateData,
+        setTab,
     };
 
     return <TaskPaginationContext.Provider value={contextValue}>{children}</TaskPaginationContext.Provider>;