Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-23 00:22:19 +01:00
Code Issues Projects Releases Wiki Activity

fix: now project overview has skeleton instead of placeholders (#5696)

Browse Source 
Removed `ref` dependency from `useLoading` hook, it was being overly
reactive and breaking skeleton.
This commit is contained in:
Jaanus Sellin 2023-12-20 14:59:41 +02:00 committed by GitHub
parent 1a79921a38
commit bb5b322475
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/component/feature/FeatureToggleList/FeatureToggleListTable.tsx
View File

@ -45,6 +45,7 @@ import { FeatureSegmentCell } from 'component/common/Table/cells/FeatureSegmentC
import { useUiFlag } from 'hooks/useUiFlag';
import { FeatureToggleListTable as LegacyFeatureToggleListTable } from './LegacyFeatureToggleListTable';
import { FeatureToggleListActions } from './FeatureToggleListActions/FeatureToggleListActions';
import useLoading from 'hooks/useLoading';
export const featuresPlaceholder = Array(15).fill({
name: 'Name of the feature',
@ -107,6 +108,7 @@ const FeatureToggleListTableComponent: VFC = () => {
value ? `${value}` : undefined,
),
);
const bodyLoadingRef = useLoading(loading);
const { favorite, unfavorite } = useFavoriteFeaturesApi();
const onFavorite = useCallback(
async (feature: FeatureSchema) => {
@ -257,7 +259,6 @@ const FeatureToggleListTableComponent: VFC = () => {
return (
<PageContent
isLoading={loading}
bodyClass='no-padding'
header={
<PageHeader
@ -311,7 +312,9 @@ const FeatureToggleListTableComponent: VFC = () => {
state={filterState}
/>
<SearchHighlightProvider value={query || ''}>
<PaginatedTable tableInstance={table} totalItems={total} />
<div ref={bodyLoadingRef}>
<PaginatedTable tableInstance={table} totalItems={total} />
</div>
</SearchHighlightProvider>
<ConditionallyRender
condition={rows.length === 0}

2
frontend/src/hooks/useLoading.ts
View File

@ -16,7 +16,7 @@ const useLoading = (loading: boolean, selector = '[data-loading=true]') => {
}
});
}
}, [loading, ref]);
}, [loading]);
return ref;
};