add hidden prop to row listing component

This commit is contained in:
Nate Kelley 2025-01-23 10:20:01 -07:00
parent 237bf529e2
commit ac0caac99b
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
20 changed files with 369 additions and 409 deletions

View File

@ -50,7 +50,7 @@ export const useCreateReactQuery = <T>({
queryFn,
enabled: baseEnabled && !!enabled,
initialData,
retry: 1,
retry: 0,
refetchOnWindowFocus,
refetchOnMount,
staleTime,
@ -133,7 +133,7 @@ export const useCreateReactQueryPaginated = <T>({
queryFn,
enabled: baseEnabled && !!enabled,
initialData,
retry: 1,
retry: 0,
refetchOnWindowFocus,
refetchOnMount,
placeholderData: keepPreviousData,

View File

@ -81,29 +81,28 @@ export const PermissionListDatasetGroupContainer: React.FC<{
}, [filteredDatasetGroups]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionGroups.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionGroups.length.toString()
}
},
...canQueryPermissionGroups,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionGroups.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionGroups.length.toString()
}
},
...cannotQueryPermissionGroups
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionGroups.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionGroups.length.toString()
}
},
...canQueryPermissionGroups,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionGroups.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionGroups.length.toString()
}
},
...cannotQueryPermissionGroups
],
[canQueryPermissionGroups, cannotQueryPermissionGroups, numberOfDatasetGroups]
);

View File

@ -1,7 +1,11 @@
import React, { useMemo, useState } from 'react';
import { DatasetPermissionOverviewUser } from '@/api/buster_rest/datasets';
import { BusterUserAvatar, Text } from '@/components';
import { BusterListColumn, BusterListRowItem, InfiniteListContainer } from '@/components/list';
import {
BusterListColumn,
BusterListRowItem,
EmptyStateList,
InfiniteListContainer
} from '@/components/list';
import { BusterInfiniteList } from '@/components/list';
import { BusterRoutes, createBusterRoute } from '@/routes';
import { PermissionLineageBreadcrumb } from '../../../../../_components/PermissionComponents';
@ -73,29 +77,28 @@ export const PermissionListUserContainer: React.FC<{
}, [filteredUsers]);
const rows: BusterListRowItem[] = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: numberOfUsers.toString()
}
},
...canQueryUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryUsers.length.toString()
}
},
...cannotQueryUsers
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: numberOfUsers.toString()
}
},
...canQueryUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryUsers.length.toString()
}
},
...cannotQueryUsers
],
[canQueryUsers, cannotQueryUsers, numberOfUsers]
);
@ -107,7 +110,7 @@ export const PermissionListUserContainer: React.FC<{
rows={rows}
showHeader={false}
showSelectAll={false}
emptyState={<EmptyState />}
emptyState={<EmptyStateList text="No users found" />}
/>
</InfiniteListContainer>
</>
@ -128,12 +131,3 @@ const UserLineageCell = React.memo(({ user }: { user: DatasetPermissionOverviewU
);
});
UserLineageCell.displayName = 'UserLineageCell';
const EmptyState = React.memo(() => {
return (
<div className="py-12">
<Text type="tertiary">No users found</Text>
</div>
);
});
EmptyState.displayName = 'EmptyState';

View File

@ -2,7 +2,7 @@ import {
ListPermissionGroupsResponse,
useDatasetUpdatePermissionGroups
} from '@/api/buster_rest/datasets';
import { BusterListColumn, BusterListRowItem } from '@/components/list';
import { BusterListColumn, BusterListRowItem, EmptyStateList } from '@/components/list';
import { useMemoizedFn } from 'ahooks';
import React, { useMemo, useState } from 'react';
import { Text } from '@/components/text';
@ -82,29 +82,28 @@ export const PermissionListPermissionGroupContainer: React.FC<{
}, [filteredPermissionGroups]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionGroups.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionGroups.length.toString()
}
},
...canQueryPermissionGroups,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionGroups.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionGroups.length.toString()
}
},
...cannotQueryPermissionGroups
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionGroups.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionGroups.length.toString()
}
},
...canQueryPermissionGroups,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionGroups.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionGroups.length.toString()
}
},
...cannotQueryPermissionGroups
],
[canQueryPermissionGroups, cannotQueryPermissionGroups, numberOfPermissionGroups]
);
@ -124,7 +123,7 @@ export const PermissionListPermissionGroupContainer: React.FC<{
showSelectAll={false}
selectedRowKeys={selectedRowKeys}
onSelectChange={setSelectedRowKeys}
emptyState={<EmptyState />}
emptyState={<EmptyStateList text="No permission groups found" />}
useRowClickSelectChange={true}
/>
</InfiniteListContainer>
@ -132,13 +131,3 @@ export const PermissionListPermissionGroupContainer: React.FC<{
});
PermissionListPermissionGroupContainer.displayName = 'PermissionListTeamContainer';
const EmptyState = React.memo(() => {
return (
<div className="py-12">
<Text type="tertiary">No permission groups found</Text>
</div>
);
});
EmptyState.displayName = 'EmptyState';

View File

@ -3,13 +3,16 @@ import {
ListPermissionUsersResponse,
useDatasetUpdatePermissionUsers
} from '@/api/buster_rest/datasets';
import { BusterUserAvatar } from '@/components';
import { BusterListColumn, BusterListRowItem, InfiniteListContainer } from '@/components/list';
import {
BusterListColumn,
BusterListRowItem,
EmptyStateList,
InfiniteListContainer
} from '@/components/list';
import { BusterInfiniteList } from '@/components/list/BusterInfiniteList';
import { useMemoizedFn } from 'ahooks';
import { Select } from 'antd';
import React, { useMemo, useState } from 'react';
import { Text } from '@/components/text';
import { PermissionUsersSelectedPopup } from './PermissionUsersSelectedPopup';
import { PERMISSION_USERS_OPTIONS } from './config';
import { BusterRoutes, createBusterRoute } from '@/routes';
@ -90,29 +93,28 @@ export const PermissionListUsersContainer: React.FC<{
}, [filteredPermissionUsers]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
],
[canQueryPermissionUsers, cannotQueryPermissionUsers, numberOfPermissionUsers]
);
@ -133,7 +135,7 @@ export const PermissionListUsersContainer: React.FC<{
selectedRowKeys={selectedRowKeys}
onSelectChange={setSelectedRowKeys}
useRowClickSelectChange={false}
emptyState={<EmptyState />}
emptyState={<EmptyStateList text="No users found" />}
/>
</InfiniteListContainer>
);
@ -161,13 +163,3 @@ const PermissionGroupAssignedCell: React.FC<{
/>
);
};
const EmptyState = React.memo(() => {
return (
<div className="py-12">
<Text type="tertiary">No users found</Text>
</div>
);
});
EmptyState.displayName = 'EmptyState';

View File

@ -92,29 +92,28 @@ export const DatasetGroupDatasetsListContainer: React.FC<{
}, [filteredDatasets]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
],
[canQueryPermissionUsers, cannotQueryPermissionUsers]
);

View File

@ -88,29 +88,28 @@ export const DatasetGroupDatasetGroupsListContainer: React.FC<{
}, [filteredDatasetGroups]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionDatasetGroups.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionDatasetGroups.length.toString()
}
},
...canQueryPermissionDatasetGroups,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionDatasetGroups.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionDatasetGroups.length.toString()
}
},
...cannotQueryPermissionDatasetGroups
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionDatasetGroups.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionDatasetGroups.length.toString()
}
},
...canQueryPermissionDatasetGroups,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionDatasetGroups.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionDatasetGroups.length.toString()
}
},
...cannotQueryPermissionDatasetGroups
],
[canQueryPermissionDatasetGroups, cannotQueryPermissionDatasetGroups]
);

View File

@ -92,29 +92,28 @@ export const DatasetGroupUsersListContainer: React.FC<{
}, [filteredUsers]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
],
[canQueryPermissionUsers, cannotQueryPermissionUsers]
);

View File

@ -87,29 +87,28 @@ export const PermissionGroupDatasetGroupsListContainer: React.FC<{
}, [filteredDatasetGroups]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionDatasetGroups.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionDatasetGroups.length.toString()
}
},
...canQueryPermissionDatasetGroups,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionDatasetGroups.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionDatasetGroups.length.toString()
}
},
...cannotQueryPermissionDatasetGroups
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionDatasetGroups.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionDatasetGroups.length.toString()
}
},
...canQueryPermissionDatasetGroups,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionDatasetGroups.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionDatasetGroups.length.toString()
}
},
...cannotQueryPermissionDatasetGroups
],
[canQueryPermissionDatasetGroups, cannotQueryPermissionDatasetGroups]
);

View File

@ -92,29 +92,28 @@ export const PermissionGroupDatasetsListContainer: React.FC<{
}, [filteredDatasets]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
],
[canQueryPermissionUsers, cannotQueryPermissionUsers]
);

View File

@ -88,29 +88,28 @@ export const PermissionGroupUsersListContainer: React.FC<{
}, [filteredUsers]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
],
[canQueryPermissionUsers, cannotQueryPermissionUsers]
);

View File

@ -68,29 +68,28 @@ export const ListUsersComponent: React.FC<{
}, [users]);
const rows: BusterListRowItem[] = useMemo(
() =>
[
{
id: 'header-active',
data: {},
hidden: users.length === 0,
rowSection: {
title: 'Active',
secondaryTitle: activeUsers.length.toString()
}
},
...activeUsers,
{
id: 'header-inactive',
data: {},
hidden: inactiveUsers.length === 0,
rowSection: {
title: 'Inactive',
secondaryTitle: inactiveUsers.length.toString()
}
},
...inactiveUsers
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-active',
data: {},
hidden: users.length === 0,
rowSection: {
title: 'Active',
secondaryTitle: activeUsers.length.toString()
}
},
...activeUsers,
{
id: 'header-inactive',
data: {},
hidden: inactiveUsers.length === 0,
rowSection: {
title: 'Inactive',
secondaryTitle: inactiveUsers.length.toString()
}
},
...inactiveUsers
],
[activeUsers, inactiveUsers]
);

View File

@ -3,10 +3,10 @@ import {
BusterInfiniteList,
BusterListColumn,
BusterListRowItem,
EmptyStateList,
InfiniteListContainer
} from '@/components/list';
import { OrganizationUserDataset } from '@/api/buster_rest';
import { Text } from '@/components/text';
import { PermissionLineageBreadcrumb } from '@appComponents/PermissionComponents';
export const UserDatasetListContainer = React.memo(
@ -91,7 +91,7 @@ export const UserDatasetListContainer = React.memo(
}
},
...disabled
].filter((row) => !(row as any).hidden);
].filter((row) => !row.hidden);
}, [canQuery, cannotQuery, disabled]);
return (
@ -101,7 +101,7 @@ export const UserDatasetListContainer = React.memo(
rows={rows}
showHeader={false}
showSelectAll={false}
emptyState={<EmptyState />}
emptyState={<EmptyStateList text="No datasets found" />}
/>
</InfiniteListContainer>
);
@ -118,12 +118,3 @@ const DatasetLineageCell = React.memo(({ dataset }: { dataset: OrganizationUserD
);
});
DatasetLineageCell.displayName = 'DatasetLineageCell';
const EmptyState = React.memo(() => {
return (
<div className="py-12">
<Text type="tertiary">No datasets found</Text>
</div>
);
});
EmptyState.displayName = 'EmptyState';

View File

@ -90,29 +90,28 @@ export const UserDatasetGroupListContainer: React.FC<{
}, [filteredDatasetGroups]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
],
[canQueryPermissionUsers, cannotQueryPermissionUsers, numberOfDatasetGroups]
);

View File

@ -90,29 +90,28 @@ export const UserDatasetsListContainer: React.FC<{
}, [filteredDatasets]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
],
[canQueryPermissionUsers, cannotQueryPermissionUsers]
);

View File

@ -95,29 +95,28 @@ export const UserPermissionGroupsListContainer: React.FC<{
}, [filteredPermissionGroups]);
const rows = useMemo(
() =>
[
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-assigned',
data: {},
hidden: canQueryPermissionUsers.length === 0,
rowSection: {
title: 'Assigned',
secondaryTitle: canQueryPermissionUsers.length.toString()
}
},
...canQueryPermissionUsers,
{
id: 'header-not-assigned',
data: {},
hidden: cannotQueryPermissionUsers.length === 0,
rowSection: {
title: 'Not Assigned',
secondaryTitle: cannotQueryPermissionUsers.length.toString()
}
},
...cannotQueryPermissionUsers
],
[canQueryPermissionUsers, cannotQueryPermissionUsers, numberOfPermissionGroups]
);

View File

@ -95,39 +95,38 @@ export const UserTeamsListContainer: React.FC<{
}, [filteredTeams]);
const rows = useMemo(
() =>
[
{
id: 'header-manager',
data: {},
hidden: managerTeams.length === 0,
rowSection: {
title: 'Manager',
secondaryTitle: managerTeams.length.toString()
}
},
...managerTeams,
{
id: 'header-member',
data: {},
hidden: memberTeams.length === 0,
rowSection: {
title: 'Member',
secondaryTitle: memberTeams.length.toString()
}
},
...memberTeams,
{
id: 'header-not-assigned',
data: {},
hidden: notAMemberTeams.length === 0,
rowSection: {
title: 'Not a member',
secondaryTitle: notAMemberTeams.length.toString()
}
},
...notAMemberTeams
].filter((row) => !(row as any).hidden),
() => [
{
id: 'header-manager',
data: {},
hidden: managerTeams.length === 0,
rowSection: {
title: 'Manager',
secondaryTitle: managerTeams.length.toString()
}
},
...managerTeams,
{
id: 'header-member',
data: {},
hidden: memberTeams.length === 0,
rowSection: {
title: 'Member',
secondaryTitle: memberTeams.length.toString()
}
},
...memberTeams,
{
id: 'header-not-assigned',
data: {},
hidden: notAMemberTeams.length === 0,
rowSection: {
title: 'Not a member',
secondaryTitle: notAMemberTeams.length.toString()
}
},
...notAMemberTeams
],
[managerTeams, memberTeams, notAMemberTeams]
);

View File

@ -5,6 +5,7 @@ import { getAllIdsInSection } from '../BusterList/helpers';
import { useEffect, useMemo } from 'react';
import { BusterListHeader } from '../BusterList/BusterListHeader';
import { BusterListRowComponentSelector } from '../BusterList/BusterListRowComponentSelector';
import { EmptyStateList } from '../EmptyStateList';
export interface BusterInfiniteListProps extends BusterListProps {
onScrollEnd?: () => void;
@ -152,7 +153,9 @@ export const BusterInfiniteList: React.FC<BusterInfiniteListProps> = ({
))}
{showEmptyState && (
<div className="flex h-full items-center justify-center">{emptyState}</div>
<div className="flex h-full items-center justify-center">
{typeof emptyState === 'string' ? <EmptyStateList text={emptyState} /> : emptyState}
</div>
)}
{loadingNewContent && (

View File

@ -38,6 +38,8 @@ export const BusterListRowComponentSelector = React.forwardRef<
},
ref
) => {
if (row.hidden) return null;
if (row.rowSection) {
return (
<BusterListSectionComponent

View File

@ -11,7 +11,7 @@ export interface BusterListProps {
columnRowVariant?: 'default' | 'containerized';
rows: BusterListRow[];
onSelectChange?: (selectedRowKeys: string[]) => void;
emptyState?: undefined | React.ReactNode;
emptyState?: undefined | React.ReactNode | string;
showHeader?: boolean;
selectedRowKeys?: string[];
contextMenu?: BusterListContextMenu;
@ -39,6 +39,7 @@ export interface BusterListRowItem {
link?: string;
onSelect?: () => void;
rowSection?: BusterListSectionRow;
hidden?: boolean;
}
export interface BusterListSectionRow {