Alerting: Disable create rule menu item from panel when unifiedAlerting is disabled (#100701)

* add config.unifiedAlertingEnabled check to render create alerts menu item from panels

* Disable create rule from panel when unifiedAlerting is disabled

* fix test and lint

* fix test

public/app/features/alerting/unified/PanelAlertTabContent.test.tsx

@@ -3,6 +3,7 @@ import { byTestId, byText } from 'testing-library-selector';
 
 import { PromOptions } from '@grafana/prometheus';
 import { setPluginLinksHook } from '@grafana/runtime';
+import config from 'app/core/config';
 import { setupDataSources } from 'app/features/alerting/unified/testSetup/datasources';
 import { DashboardModel } from 'app/features/dashboard/state/DashboardModel';
 import { PanelModel } from 'app/features/dashboard/state/PanelModel';
@@ -212,6 +213,7 @@ describe('PanelAlertTabContent', () => {
 
     mockAlertRuleApi(server).prometheusRuleNamespaces(GRAFANA_RULES_SOURCE_NAME, promResponse);
     mockAlertRuleApi(server).rulerRules(GRAFANA_RULES_SOURCE_NAME, rulerResponse);
+    config.unifiedAlertingEnabled = true;
   });
 
   it('Will take into account panel maxDataPoints', async () => {
@@ -329,6 +331,7 @@ describe('PanelAlertTabContent', () => {
   });
 
   it('Will render alerts belonging to panel and a button to create alert from panel queries', async () => {
+    config.unifiedAlertingEnabled = true;
     renderAlertTabContent(dashboard, panel);
 
     const rows = await ui.row.findAll();

public/app/features/alerting/unified/PanelAlertTabContent.tsx

@@ -2,6 +2,7 @@ import { css } from '@emotion/css';
 
 import { GrafanaTheme2 } from '@grafana/data';
 import { selectors } from '@grafana/e2e-selectors';
+import { config } from '@grafana/runtime';
 import { Alert, LoadingPlaceholder, ScrollContainer, useStyles2 } from '@grafana/ui';
 import { Trans } from 'app/core/internationalization';
 import { contextSrv } from 'app/core/services/context_srv';
@@ -27,7 +28,7 @@ export const PanelAlertTabContent = ({ dashboard, panel }: Props) => {
     poll: true,
   });
   const permissions = getRulesPermissions('grafana');
-  const canCreateRules = contextSrv.hasPermission(permissions.create);
+  const canCreateRules = config.unifiedAlertingEnabled && contextSrv.hasPermission(permissions.create);
 
   const alert = errors.length ? (
     <Alert title="Errors loading rules" severity="error">

public/app/features/dashboard-scene/panel-edit/PanelDataPane/PanelDataAlertingTab.test.tsx

@@ -4,7 +4,7 @@ import { byTestId } from 'testing-library-selector';
 
 import { DataSourceApi } from '@grafana/data';
 import { PromOptions, PrometheusDatasource } from '@grafana/prometheus';
-import { locationService, setDataSourceSrv, setPluginLinksHook } from '@grafana/runtime';
+import { config, locationService, setDataSourceSrv, setPluginLinksHook } from '@grafana/runtime';
 import { backendSrv } from 'app/core/services/backend_srv';
 import * as ruler from 'app/features/alerting/unified/api/ruler';
 import * as ruleActionButtons from 'app/features/alerting/unified/components/rules/RuleActionsButtons';
@@ -21,7 +21,7 @@ import {
   mockRulerRuleGroup,
 } from 'app/features/alerting/unified/mocks';
 import { RuleFormValues } from 'app/features/alerting/unified/types/rule-form';
-import * as config from 'app/features/alerting/unified/utils/config';
+import * as configDS from 'app/features/alerting/unified/utils/config';
 import { Annotation } from 'app/features/alerting/unified/utils/constants';
 import { DataSourceType, GRAFANA_RULES_SOURCE_NAME } from 'app/features/alerting/unified/utils/datasource';
 import { DashboardModel } from 'app/features/dashboard/state/DashboardModel';
@@ -44,7 +44,7 @@ import { PanelDataAlertingTab, PanelDataAlertingTabRendered } from './PanelDataA
 jest.mock('app/features/alerting/unified/api/prometheus');
 jest.mock('app/features/alerting/unified/api/ruler');
 
-jest.spyOn(config, 'getAllDataSources');
+jest.spyOn(configDS, 'getAllDataSources');
 jest.spyOn(ruleActionButtons, 'matchesWidth').mockReturnValue(false);
 jest.spyOn(ruler, 'rulerUrlBuilder');
 jest.spyOn(alertingAbilities, 'useAlertRuleAbility');
@@ -70,7 +70,7 @@ dataSources.prometheus.meta.alerting = true;
 dataSources.default.meta.alerting = true;
 
 const mocks = {
-  getAllDataSources: jest.mocked(config.getAllDataSources),
+  getAllDataSources: jest.mocked(configDS.getAllDataSources),
   useAlertRuleAbilityMock: jest.mocked(alertingAbilities.useAlertRuleAbility),
   rulerBuilderMock: jest.mocked(ruler.rulerUrlBuilder),
 };
@@ -309,7 +309,7 @@ describe('PanelAlertTabContent', () => {
   // after updating to RTKQ, the response is already returning the alerts belonging to the panel
   it('Will render alerts belonging to panel and a button to create alert from panel queries', async () => {
     dashboard.panels = [panel];
-
+    config.unifiedAlertingEnabled = true;
     renderAlertTab(dashboard, dashboard);
 
     const rows = await ui.row.findAll();

public/app/features/dashboard-scene/panel-edit/PanelDataPane/PanelDataAlertingTab.tsx

@@ -1,6 +1,7 @@
 import { css } from '@emotion/css';
 
 import { GrafanaTheme2 } from '@grafana/data';
+import { config } from '@grafana/runtime';
 import { SceneComponentProps, SceneObjectBase, SceneObjectRef, SceneObjectState, VizPanel } from '@grafana/scenes';
 import { Alert, LoadingPlaceholder, Tab, useStyles2 } from '@grafana/ui';
 import { contextSrv } from 'app/core/core';
@@ -46,7 +47,11 @@ export class PanelDataAlertingTab extends SceneObjectBase<PanelDataAlertingTabSt
 
   public getCanCreateRules() {
     const rulesPermissions = getRulesPermissions('grafana');
-    return this.getDashboard().state.meta.canSave && contextSrv.hasPermission(rulesPermissions.create);
+    return (
+      config.unifiedAlerting &&
+      this.getDashboard().state.meta.canSave &&
+      contextSrv.hasPermission(rulesPermissions.create)
+    );
   }
 }