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

feat: always show features table (#9446)

Browse Source
This commit is contained in:
Mateusz Kwasniewski 2025-03-10 10:19:36 +01:00 committed by GitHub
parent 6d02e33680
commit 3059d23446
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 104 additions and 124 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

228
frontend/src/component/project/Project/PaginatedProjectFeatureToggles/ProjectFeatureToggles.tsx
View File

@ -148,14 +148,9 @@ export const ProjectFeatureToggles = ({
'hide-setup' | 'show-setup' 'hide-setup' | 'show-setup'
>(`onboarding-state:v1-${projectId}`, 'hide-setup'); >(`onboarding-state:v1-${projectId}`, 'hide-setup');
const notOnboarding =
project.onboardingStatus.status === 'onboarded' ||
onboardingFlow === 'closed';
const isOnboarding = const isOnboarding =
project.onboardingStatus.status !== 'onboarded' && project.onboardingStatus.status !== 'onboarded' &&
onboardingFlow === 'visible'; onboardingFlow === 'visible';
const noFeaturesExistInProject = project.featureTypeCounts?.length === 0;
const showFeaturesTable = !noFeaturesExistInProject || notOnboarding;
const trackOnboardingFinish = (sdkName: string) => { const trackOnboardingFinish = (sdkName: string) => {
if (!isOnboarding) { if (!isOnboarding) {
@ -495,128 +490,113 @@ export const ProjectFeatureToggles = ({
/> />
} }
/> />
<ConditionallyRender <PageContent
condition={showFeaturesTable} disableLoading
show={ disablePadding
<PageContent header={
disableLoading <ProjectFeatureTogglesHeader
disablePadding isLoading={initialLoad}
header={ totalItems={total}
<ProjectFeatureTogglesHeader searchQuery={tableState.query || ''}
isLoading={initialLoad} onChangeSearchQuery={(query) => {
totalItems={total} setTableState({ query });
searchQuery={tableState.query || ''} }}
onChangeSearchQuery={(query) => { dataToExport={data}
setTableState({ query }); environmentsToExport={environments}
}} actions={
dataToExport={data} <ColumnsMenu
environmentsToExport={environments} columns={[
actions={ {
<ColumnsMenu header: 'Name',
columns={[ id: 'name',
{ isVisible: columnVisibility.name,
header: 'Name', isStatic: true,
id: 'name', },
isVisible: {
columnVisibility.name, header: 'Created',
isStatic: true, id: 'createdAt',
}, isVisible: columnVisibility.createdAt,
{ },
header: 'Created', {
id: 'createdAt', header: 'By',
isVisible: id: 'createdBy',
columnVisibility.createdAt, isVisible: columnVisibility.createdBy,
}, },
{ {
header: 'By', header: 'Last seen',
id: 'createdBy', id: 'lastSeenAt',
isVisible: isVisible: columnVisibility.lastSeenAt,
columnVisibility.createdBy, },
}, {
{ header: 'Lifecycle',
header: 'Last seen', id: 'lifecycle',
id: 'lastSeenAt', isVisible: columnVisibility.lifecycle,
isVisible: },
columnVisibility.lastSeenAt, {
}, id: 'divider',
{ },
header: 'Lifecycle', ...environments.map((environment) => ({
id: 'lifecycle', header: environment,
isVisible: id: formatEnvironmentColumnId(
columnVisibility.lifecycle, environment,
}, ),
{ isVisible:
id: 'divider', columnVisibility[
}, formatEnvironmentColumnId(
...environments.map( environment,
(environment) => ({ )
header: environment, ],
id: formatEnvironmentColumnId( })),
environment, ]}
), onToggle={onToggleColumnVisibility}
isVisible:
columnVisibility[
formatEnvironmentColumnId(
environment,
)
],
}),
),
]}
onToggle={onToggleColumnVisibility}
/>
}
/> />
} }
bodyClass='noop' />
style={{ cursor: 'inherit' }}
>
<div
ref={bodyLoadingRef}
aria-busy={isPlaceholder}
aria-live='polite'
>
<FilterRow>
<ProjectOverviewFilters
project={projectId}
onChange={setTableState}
state={filterState}
/>
<ButtonGroup>
<PermissionIconButton
permission={UPDATE_FEATURE}
projectId={projectId}
onClick={() => setModalOpen(true)}
tooltipProps={{ title: 'Import' }}
data-testid={IMPORT_BUTTON}
data-loading-project
>
<ImportSvg />
</PermissionIconButton>
</ButtonGroup>
</FilterRow>
<SearchHighlightProvider
value={tableState.query || ''}
>
<PaginatedTable
tableInstance={table}
totalItems={total}
/>
</SearchHighlightProvider>
<ConditionallyRender
condition={!data.length && !isPlaceholder}
show={
<TableEmptyState
query={tableState.query || ''}
/>
}
/>
{rowActionsDialogs}
{featureToggleModals}
</div>
</PageContent>
} }
/> bodyClass='noop'
style={{ cursor: 'inherit' }}
>
<div
ref={bodyLoadingRef}
aria-busy={isPlaceholder}
aria-live='polite'
>
<FilterRow>
<ProjectOverviewFilters
project={projectId}
onChange={setTableState}
state={filterState}
/>
<ButtonGroup>
<PermissionIconButton
permission={UPDATE_FEATURE}
projectId={projectId}
onClick={() => setModalOpen(true)}
tooltipProps={{ title: 'Import' }}
data-testid={IMPORT_BUTTON}
data-loading-project
>
<ImportSvg />
</PermissionIconButton>
</ButtonGroup>
</FilterRow>
<SearchHighlightProvider value={tableState.query || ''}>
<PaginatedTable
tableInstance={table}
totalItems={total}
/>
</SearchHighlightProvider>
<ConditionallyRender
condition={!data.length && !isPlaceholder}
show={
<TableEmptyState query={tableState.query || ''} />
}
/>
{rowActionsDialogs}
{featureToggleModals}
</div>
</PageContent>
<ConnectSdkDialog <ConnectSdkDialog
open={connectSdkOpen} open={connectSdkOpen}
onClose={() => { onClose={() => {