yujunjun/datahub
2
0
Fork 0
mirror of https://github.com/datahub-project/datahub.git synced 2025-11-11 00:42:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): fix intermediate white screen after loading asset collection module (#14687)

Browse Source
This commit is contained in:
purnimagarg1 2025-09-05 20:08:46 +05:30 committed by GitHub
parent f458021060
commit e69a083881
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 24 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
datahub-web-react/src/app/homeV3/modules/assetCollection/AssetCollectionModule.tsx
View File

@ -1,5 +1,5 @@
import { InfiniteScrollList } from '@components'; import { InfiniteScrollList } from '@components';
import React, { useCallback, useMemo } from 'react'; import React, { useCallback, useMemo, useState } from 'react';
import EmptyContent from '@app/homeV3/module/components/EmptyContent'; import EmptyContent from '@app/homeV3/module/components/EmptyContent';
import EntityItem from '@app/homeV3/module/components/EntityItem'; import EntityItem from '@app/homeV3/module/components/EntityItem';
@ -15,6 +15,7 @@ import { DataHubPageModuleType, Entity } from '@types';
const DEFAULT_PAGE_SIZE = 10; const DEFAULT_PAGE_SIZE = 10;
const AssetCollectionModule = (props: ModuleProps) => { const AssetCollectionModule = (props: ModuleProps) => {
const [isFirstFetch, setIsFirstFetch] = useState(true);
const assetUrns = useMemo( const assetUrns = useMemo(
() => () =>
props.module.properties.params.assetCollectionParams?.assetUrns.filter( props.module.properties.params.assetCollectionParams?.assetUrns.filter(
@ -49,7 +50,7 @@ const AssetCollectionModule = (props: ModuleProps) => {
[shouldFetchByDynamicFilter, assetUrns], [shouldFetchByDynamicFilter, assetUrns],
); );
const { loading, refetch } = useGetSearchResultsForMultipleQuery({ const { data, loading, refetch } = useGetSearchResultsForMultipleQuery({
variables: { variables: {
input: { input: {
start: 0, start: 0,
@ -63,8 +64,19 @@ const AssetCollectionModule = (props: ModuleProps) => {
}, },
}, },
skip: assetUrns.length === 0 && !dynamicOrFilters?.length, skip: assetUrns.length === 0 && !dynamicOrFilters?.length,
onCompleted: () => {
setIsFirstFetch(false);
},
}); });
const initialEntities = useMemo(
() =>
data?.searchAcrossEntities?.searchResults
?.map((res) => res.entity)
.filter((entity): entity is Entity => !!entity) || [],
[data?.searchAcrossEntities?.searchResults],
);
const fetchEntitiesByDynamicFilter = useCallback( const fetchEntitiesByDynamicFilter = useCallback(
async (start: number, count: number): Promise<Entity[]> => { async (start: number, count: number): Promise<Entity[]> => {
if (!dynamicOrFilters?.length) return []; if (!dynamicOrFilters?.length) return [];
@ -115,12 +127,21 @@ const AssetCollectionModule = (props: ModuleProps) => {
const fetchEntities = useCallback( const fetchEntities = useCallback(
async (start: number, count: number): Promise<Entity[]> => { async (start: number, count: number): Promise<Entity[]> => {
if (isFirstFetch) {
return initialEntities;
}
if (shouldFetchByDynamicFilter) { if (shouldFetchByDynamicFilter) {
return fetchEntitiesByDynamicFilter(start, count); return fetchEntitiesByDynamicFilter(start, count);
} }
return fetchEntitiesByAssetUrns(start, count); return fetchEntitiesByAssetUrns(start, count);
}, },
[fetchEntitiesByDynamicFilter, fetchEntitiesByAssetUrns, shouldFetchByDynamicFilter], [
isFirstFetch,
shouldFetchByDynamicFilter,
fetchEntitiesByAssetUrns,
initialEntities,
fetchEntitiesByDynamicFilter,
],
); );
return ( return (