Correlations: Hide Correlations Page behind a feature toggle (#55224)

* Hide Correlations Page behind a toggle

* Remove redundant defaults

* Ensure top nav is rendered when correlations are disabled

This is for the case when:

[feature_toggles]
topnav = true

packages/grafana-data/src/types/featureToggles.gen.ts

@@ -46,6 +46,7 @@ export interface FeatureToggles {
   exploreMixedDatasource?: boolean;
   tracing?: boolean;
   commandPalette?: boolean;
+  correlations?: boolean;
   cloudWatchDynamicLabels?: boolean;
   datasourceQueryMultiStatus?: boolean;
   traceToMetrics?: boolean;

pkg/api/index.go

@@ -356,7 +356,7 @@ func (hs *HTTPServer) setupConfigNodes(c *models.ReqContext) ([]*dtos.NavLink, e
 		})
 	}
 
-	if hasAccess(ac.ReqOrgAdmin, correlations.ConfigurationPageAccess) {
+	if hs.Features.IsEnabled(featuremgmt.FlagCorrelations) && hasAccess(ac.ReqOrgAdmin, correlations.ConfigurationPageAccess) {
 		configNodes = append(configNodes, &dtos.NavLink{
 			Text:        "Correlations",
 			Icon:        "gf-glue",

pkg/services/featuremgmt/registry.go

@@ -172,6 +172,11 @@ var (
 			Description: "Enable command palette",
 			State:       FeatureStateAlpha,
 		},
+		{
+			Name:        "correlations",
+			Description: "Correlations page",
+			State:       FeatureStateAlpha,
+		},
 		{
 			Name:        "cloudWatchDynamicLabels",
 			Description: "Use dynamic labels instead of alias patterns in CloudWatch datasource",

pkg/services/featuremgmt/toggles_gen.go

@@ -127,6 +127,10 @@ const (
 	// Enable command palette
 	FlagCommandPalette = "commandPalette"
 
+	// FlagCorrelations
+	// Correlations page
+	FlagCorrelations = "correlations"
+
 	// FlagCloudWatchDynamicLabels
 	// Use dynamic labels instead of alias patterns in CloudWatch datasource
 	FlagCloudWatchDynamicLabels = "cloudWatchDynamicLabels"

public/app/features/correlations/CorrelationsFeatureToggle.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+
+import { Page } from 'app/core/components/Page/Page';
+
+export default function FeatureTogglePage() {
+  return (
+    <Page navId="correlations">
+      <Page.Contents>
+        <h1>Correlations are disabled</h1>
+        To enable Correlations, add it in the Grafana config:
+        <div>
+          <pre>
+            {`[feature_toggles]
+correlations = true
+`}
+          </pre>
+        </div>
+      </Page.Contents>
+    </Page>
+  );
+}

public/app/routes/routes.tsx

@@ -147,8 +147,12 @@ export function getAppRoutes(): RouteDescriptor[] {
     },
     {
       path: '/datasources/correlations',
-      component: SafeDynamicImport(
+      component: SafeDynamicImport(() =>
-        () => import(/* webpackChunkName: "CorrelationsPage" */ 'app/features/correlations/CorrelationsPage')
+        config.featureToggles.correlations
+          ? import(/* webpackChunkName: "CorrelationsPage" */ 'app/features/correlations/CorrelationsPage')
+          : import(
+              /* webpackChunkName: "CorrelationsFeatureToggle" */ 'app/features/correlations/CorrelationsFeatureToggle'
+            )
       ),
     },
     {