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

frontend/src/component/insights/InsightsCharts.tsx

@@ -22,6 +22,7 @@ import type {
 import type { GroupedDataByProject } from './hooks/useGroupedProjectTrends';
 import { allOption } from 'component/common/ProjectSelect/ProjectSelect';
 import { chartInfo } from './chart-info';
+import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
 
 interface IChartsProps {
     flags: InstanceInsightsSchema['flags'];
@@ -83,6 +84,7 @@ export const InsightsCharts: VFC<IChartsProps> = ({
     allMetricsDatapoints,
     loading,
 }) => {
+    const { isEnterprise } = useUiConfig();
     const showAllProjects = projects[0] === allOption.id;
     const isOneProjectSelected = projects.length === 1;
 
@@ -143,11 +145,21 @@ export const InsightsCharts: VFC<IChartsProps> = ({
                         </ChartWidget>
                     }
                 />
+                <ConditionallyRender
+                    condition={isEnterprise()}
+                    show={
+                        <>
                             <Widget {...chartInfo.totalFlags}>
                                 <FlagStats
-                        count={showAllProjects ? flags.total : summary.total}
+                                    count={
+                                        showAllProjects
+                                            ? flags.total
+                                            : summary.total
+                                    }
                                     flagsPerUser={
-                            showAllProjects ? getFlagsPerUser(flags, users) : ''
+                                        showAllProjects
+                                            ? getFlagsPerUser(flags, users)
+                                            : ''
                                     }
                                     isLoading={loading}
                                 />
@@ -165,7 +177,9 @@ export const InsightsCharts: VFC<IChartsProps> = ({
                                 elseShow={
                                     <ChartWidget {...chartInfo.flagsPerProject}>
                                         <FlagsProjectChart
-                                projectFlagTrends={groupedProjectsData}
+                                            projectFlagTrends={
+                                                groupedProjectsData
+                                            }
                                             isLoading={loading}
                                         />
                                     </ChartWidget>
@@ -192,7 +206,9 @@ export const InsightsCharts: VFC<IChartsProps> = ({
                             </ChartWidget>
                             <Widget {...chartInfo.medianTimeToProduction}>
                                 <TimeToProduction
-                        daysToProduction={summary.medianTimeToProduction}
+                                    daysToProduction={
+                                        summary.medianTimeToProduction
+                                    }
                                 />
                             </Widget>
                             <ChartWidget
@@ -206,7 +222,14 @@ export const InsightsCharts: VFC<IChartsProps> = ({
                                     isLoading={loading}
                                 />
                             </ChartWidget>
+                        </>
+                    }
+                />
             </StyledGrid>
+            <ConditionallyRender
+                condition={isEnterprise()}
+                show={
+                    <>
                         <Widget
                             {...(showAllProjects
                                 ? chartInfo.metrics
@@ -229,5 +252,8 @@ export const InsightsCharts: VFC<IChartsProps> = ({
                             />
                         </Widget>
                     </>
+                }
+            />
+        </>
     );
 };

frontend/src/component/insights/components/InsightsHeader/InsightsHeader.tsx

@@ -10,7 +10,6 @@ import {
     useTheme,
 } from '@mui/material';
 import { PageHeader } from 'component/common/PageHeader/PageHeader';
-import { Badge } from 'component/common/Badge/Badge';
 import { ShareLink } from './ShareLink/ShareLink';
 import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
 
@@ -82,7 +81,6 @@ export const InsightsHeader: VFC<DashboardHeaderProps> = ({ actions }) => {
                         })}
                     >
                         <span>Insights</span>{' '}
-                        <Badge color='success'>Beta</Badge>
                     </Typography>
                 }
                 actions={

frontend/src/component/menu/Header/OldHeader.tsx

@@ -242,12 +242,9 @@ const OldHeader: VFC = () => {
                         <StyledLink to={'/search'}>Search</StyledLink>
                         <StyledLink to='/playground'>Playground</StyledLink>
                         <ConditionallyRender
-                            condition={!killInsightsDashboard}
+                            condition={!killInsightsDashboard && !isOss()}
                             show={
-                                <StyledLinkWithBetaBadge
-                                    to={'/insights'}
-                                    title={'Insights'}
-                                />
+                                <StyledLink to='/insights'>Insights</StyledLink>
                             }
                         />
                         <StyledAdvancedNavButton

frontend/src/component/menu/__tests__/__snapshots__/routes.test.tsx.snap

@@ -126,7 +126,7 @@ exports[`returns all baseRoutes 1`] = `
   },
   {
     "component": [Function],
-    "enterprise": false,
+    "enterprise": true,
     "menu": {
       "mobile": true,
     },

frontend/src/component/menu/routes.ts

@@ -153,7 +153,7 @@ export const routes: IRoute[] = [
         type: 'protected',
         menu: { mobile: true },
         notFlag: 'killInsightsUI',
-        enterprise: false,
+        enterprise: true,
     },
 
     // Applications

src/test/e2e/api/admin/playground.e2e.test.ts

@@ -257,7 +257,7 @@ describe('Playground API E2E', () => {
 
                         if (features.length !== body.features.length) {
                             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;
                         }