mirror of
				https://github.com/Unleash/unleash.git
				synced 2025-10-27 11:02:16 +01:00 
			
		
		
		
	feat: insights out of beta and expose 2 widgets to pro (#7177)
1. Remove beta badge 2. Remove exposure from oss 3. Expose 2 widgets to pro and rest to enterprise
This commit is contained in:
		
							parent
							
								
									8d898c2ac9
								
							
						
					
					
						commit
						ef9f09b58c
					
				@ -22,6 +22,7 @@ import type {
 | 
				
			|||||||
import type { GroupedDataByProject } from './hooks/useGroupedProjectTrends';
 | 
					import type { GroupedDataByProject } from './hooks/useGroupedProjectTrends';
 | 
				
			||||||
import { allOption } from 'component/common/ProjectSelect/ProjectSelect';
 | 
					import { allOption } from 'component/common/ProjectSelect/ProjectSelect';
 | 
				
			||||||
import { chartInfo } from './chart-info';
 | 
					import { chartInfo } from './chart-info';
 | 
				
			||||||
 | 
					import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
interface IChartsProps {
 | 
					interface IChartsProps {
 | 
				
			||||||
    flags: InstanceInsightsSchema['flags'];
 | 
					    flags: InstanceInsightsSchema['flags'];
 | 
				
			||||||
@ -83,6 +84,7 @@ export const InsightsCharts: VFC<IChartsProps> = ({
 | 
				
			|||||||
    allMetricsDatapoints,
 | 
					    allMetricsDatapoints,
 | 
				
			||||||
    loading,
 | 
					    loading,
 | 
				
			||||||
}) => {
 | 
					}) => {
 | 
				
			||||||
 | 
					    const { isEnterprise } = useUiConfig();
 | 
				
			||||||
    const showAllProjects = projects[0] === allOption.id;
 | 
					    const showAllProjects = projects[0] === allOption.id;
 | 
				
			||||||
    const isOneProjectSelected = projects.length === 1;
 | 
					    const isOneProjectSelected = projects.length === 1;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -143,91 +145,115 @@ export const InsightsCharts: VFC<IChartsProps> = ({
 | 
				
			|||||||
                        </ChartWidget>
 | 
					                        </ChartWidget>
 | 
				
			||||||
                    }
 | 
					                    }
 | 
				
			||||||
                />
 | 
					                />
 | 
				
			||||||
                <Widget {...chartInfo.totalFlags}>
 | 
					 | 
				
			||||||
                    <FlagStats
 | 
					 | 
				
			||||||
                        count={showAllProjects ? flags.total : summary.total}
 | 
					 | 
				
			||||||
                        flagsPerUser={
 | 
					 | 
				
			||||||
                            showAllProjects ? getFlagsPerUser(flags, users) : ''
 | 
					 | 
				
			||||||
                        }
 | 
					 | 
				
			||||||
                        isLoading={loading}
 | 
					 | 
				
			||||||
                    />
 | 
					 | 
				
			||||||
                </Widget>
 | 
					 | 
				
			||||||
                <ConditionallyRender
 | 
					                <ConditionallyRender
 | 
				
			||||||
                    condition={showAllProjects}
 | 
					                    condition={isEnterprise()}
 | 
				
			||||||
                    show={
 | 
					                    show={
 | 
				
			||||||
                        <ChartWidget {...chartInfo.flags}>
 | 
					                        <>
 | 
				
			||||||
                            <FlagsChart
 | 
					                            <Widget {...chartInfo.totalFlags}>
 | 
				
			||||||
                                flagTrends={flagTrends}
 | 
					                                <FlagStats
 | 
				
			||||||
                                isLoading={loading}
 | 
					                                    count={
 | 
				
			||||||
 | 
					                                        showAllProjects
 | 
				
			||||||
 | 
					                                            ? flags.total
 | 
				
			||||||
 | 
					                                            : summary.total
 | 
				
			||||||
 | 
					                                    }
 | 
				
			||||||
 | 
					                                    flagsPerUser={
 | 
				
			||||||
 | 
					                                        showAllProjects
 | 
				
			||||||
 | 
					                                            ? getFlagsPerUser(flags, users)
 | 
				
			||||||
 | 
					                                            : ''
 | 
				
			||||||
 | 
					                                    }
 | 
				
			||||||
 | 
					                                    isLoading={loading}
 | 
				
			||||||
 | 
					                                />
 | 
				
			||||||
 | 
					                            </Widget>
 | 
				
			||||||
 | 
					                            <ConditionallyRender
 | 
				
			||||||
 | 
					                                condition={showAllProjects}
 | 
				
			||||||
 | 
					                                show={
 | 
				
			||||||
 | 
					                                    <ChartWidget {...chartInfo.flags}>
 | 
				
			||||||
 | 
					                                        <FlagsChart
 | 
				
			||||||
 | 
					                                            flagTrends={flagTrends}
 | 
				
			||||||
 | 
					                                            isLoading={loading}
 | 
				
			||||||
 | 
					                                        />
 | 
				
			||||||
 | 
					                                    </ChartWidget>
 | 
				
			||||||
 | 
					                                }
 | 
				
			||||||
 | 
					                                elseShow={
 | 
				
			||||||
 | 
					                                    <ChartWidget {...chartInfo.flagsPerProject}>
 | 
				
			||||||
 | 
					                                        <FlagsProjectChart
 | 
				
			||||||
 | 
					                                            projectFlagTrends={
 | 
				
			||||||
 | 
					                                                groupedProjectsData
 | 
				
			||||||
 | 
					                                            }
 | 
				
			||||||
 | 
					                                            isLoading={loading}
 | 
				
			||||||
 | 
					                                        />
 | 
				
			||||||
 | 
					                                    </ChartWidget>
 | 
				
			||||||
 | 
					                                }
 | 
				
			||||||
                            />
 | 
					                            />
 | 
				
			||||||
                        </ChartWidget>
 | 
					                            <Widget {...chartInfo.averageHealth}>
 | 
				
			||||||
                    }
 | 
					                                <HealthStats
 | 
				
			||||||
                    elseShow={
 | 
					                                    value={summary.averageHealth}
 | 
				
			||||||
                        <ChartWidget {...chartInfo.flagsPerProject}>
 | 
					                                    healthy={summary.active}
 | 
				
			||||||
                            <FlagsProjectChart
 | 
					                                    stale={summary.stale}
 | 
				
			||||||
                                projectFlagTrends={groupedProjectsData}
 | 
					                                    potentiallyStale={summary.potentiallyStale}
 | 
				
			||||||
                                isLoading={loading}
 | 
					                                />
 | 
				
			||||||
                            />
 | 
					                            </Widget>
 | 
				
			||||||
                        </ChartWidget>
 | 
					                            <ChartWidget
 | 
				
			||||||
 | 
					                                {...(showAllProjects
 | 
				
			||||||
 | 
					                                    ? chartInfo.overallHealth
 | 
				
			||||||
 | 
					                                    : chartInfo.healthPerProject)}
 | 
				
			||||||
 | 
					                            >
 | 
				
			||||||
 | 
					                                <ProjectHealthChart
 | 
				
			||||||
 | 
					                                    projectFlagTrends={groupedProjectsData}
 | 
				
			||||||
 | 
					                                    isAggregate={showAllProjects}
 | 
				
			||||||
 | 
					                                    isLoading={loading}
 | 
				
			||||||
 | 
					                                />
 | 
				
			||||||
 | 
					                            </ChartWidget>
 | 
				
			||||||
 | 
					                            <Widget {...chartInfo.medianTimeToProduction}>
 | 
				
			||||||
 | 
					                                <TimeToProduction
 | 
				
			||||||
 | 
					                                    daysToProduction={
 | 
				
			||||||
 | 
					                                        summary.medianTimeToProduction
 | 
				
			||||||
 | 
					                                    }
 | 
				
			||||||
 | 
					                                />
 | 
				
			||||||
 | 
					                            </Widget>
 | 
				
			||||||
 | 
					                            <ChartWidget
 | 
				
			||||||
 | 
					                                {...(showAllProjects
 | 
				
			||||||
 | 
					                                    ? chartInfo.timeToProduction
 | 
				
			||||||
 | 
					                                    : chartInfo.timeToProductionPerProject)}
 | 
				
			||||||
 | 
					                            >
 | 
				
			||||||
 | 
					                                <TimeToProductionChart
 | 
				
			||||||
 | 
					                                    projectFlagTrends={groupedProjectsData}
 | 
				
			||||||
 | 
					                                    isAggregate={showAllProjects}
 | 
				
			||||||
 | 
					                                    isLoading={loading}
 | 
				
			||||||
 | 
					                                />
 | 
				
			||||||
 | 
					                            </ChartWidget>
 | 
				
			||||||
 | 
					                        </>
 | 
				
			||||||
                    }
 | 
					                    }
 | 
				
			||||||
                />
 | 
					                />
 | 
				
			||||||
                <Widget {...chartInfo.averageHealth}>
 | 
					 | 
				
			||||||
                    <HealthStats
 | 
					 | 
				
			||||||
                        value={summary.averageHealth}
 | 
					 | 
				
			||||||
                        healthy={summary.active}
 | 
					 | 
				
			||||||
                        stale={summary.stale}
 | 
					 | 
				
			||||||
                        potentiallyStale={summary.potentiallyStale}
 | 
					 | 
				
			||||||
                    />
 | 
					 | 
				
			||||||
                </Widget>
 | 
					 | 
				
			||||||
                <ChartWidget
 | 
					 | 
				
			||||||
                    {...(showAllProjects
 | 
					 | 
				
			||||||
                        ? chartInfo.overallHealth
 | 
					 | 
				
			||||||
                        : chartInfo.healthPerProject)}
 | 
					 | 
				
			||||||
                >
 | 
					 | 
				
			||||||
                    <ProjectHealthChart
 | 
					 | 
				
			||||||
                        projectFlagTrends={groupedProjectsData}
 | 
					 | 
				
			||||||
                        isAggregate={showAllProjects}
 | 
					 | 
				
			||||||
                        isLoading={loading}
 | 
					 | 
				
			||||||
                    />
 | 
					 | 
				
			||||||
                </ChartWidget>
 | 
					 | 
				
			||||||
                <Widget {...chartInfo.medianTimeToProduction}>
 | 
					 | 
				
			||||||
                    <TimeToProduction
 | 
					 | 
				
			||||||
                        daysToProduction={summary.medianTimeToProduction}
 | 
					 | 
				
			||||||
                    />
 | 
					 | 
				
			||||||
                </Widget>
 | 
					 | 
				
			||||||
                <ChartWidget
 | 
					 | 
				
			||||||
                    {...(showAllProjects
 | 
					 | 
				
			||||||
                        ? chartInfo.timeToProduction
 | 
					 | 
				
			||||||
                        : chartInfo.timeToProductionPerProject)}
 | 
					 | 
				
			||||||
                >
 | 
					 | 
				
			||||||
                    <TimeToProductionChart
 | 
					 | 
				
			||||||
                        projectFlagTrends={groupedProjectsData}
 | 
					 | 
				
			||||||
                        isAggregate={showAllProjects}
 | 
					 | 
				
			||||||
                        isLoading={loading}
 | 
					 | 
				
			||||||
                    />
 | 
					 | 
				
			||||||
                </ChartWidget>
 | 
					 | 
				
			||||||
            </StyledGrid>
 | 
					            </StyledGrid>
 | 
				
			||||||
            <Widget
 | 
					            <ConditionallyRender
 | 
				
			||||||
                {...(showAllProjects
 | 
					                condition={isEnterprise()}
 | 
				
			||||||
                    ? chartInfo.metrics
 | 
					                show={
 | 
				
			||||||
                    : chartInfo.metricsPerProject)}
 | 
					                    <>
 | 
				
			||||||
            >
 | 
					                        <Widget
 | 
				
			||||||
                <MetricsSummaryChart
 | 
					                            {...(showAllProjects
 | 
				
			||||||
                    metricsSummaryTrends={groupedMetricsData}
 | 
					                                ? chartInfo.metrics
 | 
				
			||||||
                    allDatapointsSorted={allMetricsDatapoints}
 | 
					                                : chartInfo.metricsPerProject)}
 | 
				
			||||||
                    isAggregate={showAllProjects}
 | 
					                        >
 | 
				
			||||||
                    isLoading={loading}
 | 
					                            <MetricsSummaryChart
 | 
				
			||||||
                />
 | 
					                                metricsSummaryTrends={groupedMetricsData}
 | 
				
			||||||
            </Widget>
 | 
					                                allDatapointsSorted={allMetricsDatapoints}
 | 
				
			||||||
            <Widget
 | 
					                                isAggregate={showAllProjects}
 | 
				
			||||||
                {...chartInfo.updates}
 | 
					                                isLoading={loading}
 | 
				
			||||||
                sx={{ mt: (theme) => theme.spacing(2) }}
 | 
					                            />
 | 
				
			||||||
            >
 | 
					                        </Widget>
 | 
				
			||||||
                <UpdatesPerEnvironmentTypeChart
 | 
					                        <Widget
 | 
				
			||||||
                    environmentTypeTrends={environmentTypeTrends}
 | 
					                            {...chartInfo.updates}
 | 
				
			||||||
                    isLoading={loading}
 | 
					                            sx={{ mt: (theme) => theme.spacing(2) }}
 | 
				
			||||||
                />
 | 
					                        >
 | 
				
			||||||
            </Widget>
 | 
					                            <UpdatesPerEnvironmentTypeChart
 | 
				
			||||||
 | 
					                                environmentTypeTrends={environmentTypeTrends}
 | 
				
			||||||
 | 
					                                isLoading={loading}
 | 
				
			||||||
 | 
					                            />
 | 
				
			||||||
 | 
					                        </Widget>
 | 
				
			||||||
 | 
					                    </>
 | 
				
			||||||
 | 
					                }
 | 
				
			||||||
 | 
					            />
 | 
				
			||||||
        </>
 | 
					        </>
 | 
				
			||||||
    );
 | 
					    );
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
				
			|||||||
@ -10,7 +10,6 @@ import {
 | 
				
			|||||||
    useTheme,
 | 
					    useTheme,
 | 
				
			||||||
} from '@mui/material';
 | 
					} from '@mui/material';
 | 
				
			||||||
import { PageHeader } from 'component/common/PageHeader/PageHeader';
 | 
					import { PageHeader } from 'component/common/PageHeader/PageHeader';
 | 
				
			||||||
import { Badge } from 'component/common/Badge/Badge';
 | 
					 | 
				
			||||||
import { ShareLink } from './ShareLink/ShareLink';
 | 
					import { ShareLink } from './ShareLink/ShareLink';
 | 
				
			||||||
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
 | 
					import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@ -82,7 +81,6 @@ export const InsightsHeader: VFC<DashboardHeaderProps> = ({ actions }) => {
 | 
				
			|||||||
                        })}
 | 
					                        })}
 | 
				
			||||||
                    >
 | 
					                    >
 | 
				
			||||||
                        <span>Insights</span>{' '}
 | 
					                        <span>Insights</span>{' '}
 | 
				
			||||||
                        <Badge color='success'>Beta</Badge>
 | 
					 | 
				
			||||||
                    </Typography>
 | 
					                    </Typography>
 | 
				
			||||||
                }
 | 
					                }
 | 
				
			||||||
                actions={
 | 
					                actions={
 | 
				
			||||||
 | 
				
			|||||||
@ -242,12 +242,9 @@ const OldHeader: VFC = () => {
 | 
				
			|||||||
                        <StyledLink to={'/search'}>Search</StyledLink>
 | 
					                        <StyledLink to={'/search'}>Search</StyledLink>
 | 
				
			||||||
                        <StyledLink to='/playground'>Playground</StyledLink>
 | 
					                        <StyledLink to='/playground'>Playground</StyledLink>
 | 
				
			||||||
                        <ConditionallyRender
 | 
					                        <ConditionallyRender
 | 
				
			||||||
                            condition={!killInsightsDashboard}
 | 
					                            condition={!killInsightsDashboard && !isOss()}
 | 
				
			||||||
                            show={
 | 
					                            show={
 | 
				
			||||||
                                <StyledLinkWithBetaBadge
 | 
					                                <StyledLink to='/insights'>Insights</StyledLink>
 | 
				
			||||||
                                    to={'/insights'}
 | 
					 | 
				
			||||||
                                    title={'Insights'}
 | 
					 | 
				
			||||||
                                />
 | 
					 | 
				
			||||||
                            }
 | 
					                            }
 | 
				
			||||||
                        />
 | 
					                        />
 | 
				
			||||||
                        <StyledAdvancedNavButton
 | 
					                        <StyledAdvancedNavButton
 | 
				
			||||||
 | 
				
			|||||||
@ -126,7 +126,7 @@ exports[`returns all baseRoutes 1`] = `
 | 
				
			|||||||
  },
 | 
					  },
 | 
				
			||||||
  {
 | 
					  {
 | 
				
			||||||
    "component": [Function],
 | 
					    "component": [Function],
 | 
				
			||||||
    "enterprise": false,
 | 
					    "enterprise": true,
 | 
				
			||||||
    "menu": {
 | 
					    "menu": {
 | 
				
			||||||
      "mobile": true,
 | 
					      "mobile": true,
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
 | 
				
			|||||||
@ -153,7 +153,7 @@ export const routes: IRoute[] = [
 | 
				
			|||||||
        type: 'protected',
 | 
					        type: 'protected',
 | 
				
			||||||
        menu: { mobile: true },
 | 
					        menu: { mobile: true },
 | 
				
			||||||
        notFlag: 'killInsightsUI',
 | 
					        notFlag: 'killInsightsUI',
 | 
				
			||||||
        enterprise: false,
 | 
					        enterprise: true,
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    // Applications
 | 
					    // Applications
 | 
				
			||||||
 | 
				
			|||||||
@ -257,7 +257,7 @@ describe('Playground API E2E', () => {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
                        if (features.length !== body.features.length) {
 | 
					                        if (features.length !== body.features.length) {
 | 
				
			||||||
                            ctx.log(
 | 
					                            ctx.log(
 | 
				
			||||||
                                `I expected the number of mapped toggles (${body.features.length}) to be the same as the number of created toggles (${features.length}), but that was not the case.`,
 | 
					                                `I expected the number of mapped flags (${body.features.length}) to be the same as the number of created toggles (${features.length}), but that was not the case.`,
 | 
				
			||||||
                            );
 | 
					                            );
 | 
				
			||||||
                            return false;
 | 
					                            return false;
 | 
				
			||||||
                        }
 | 
					                        }
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
		Reference in New Issue
	
	Block a user