Alerting: Add file and rule_group query params in request for filtering the res… (#70379)

* Add file and rule_group query params in request for filtering the response when loading rule in view mode

* Fix test

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

@@ -327,6 +327,7 @@ describe('PanelAlertTabContent', () => {
       },
       undefined,
       undefined,
+      undefined,
       undefined
     );
   });

public/app/features/alerting/unified/api/prometheus.ts

@@ -2,10 +2,11 @@ import { lastValueFrom } from 'rxjs';
 
 import { getBackendSrv } from '@grafana/runtime';
 import { Matcher } from 'app/plugins/datasource/alertmanager/types';
-import { RuleNamespace } from 'app/types/unified-alerting';
+import { RuleIdentifier, RuleNamespace } from 'app/types/unified-alerting';
 import { PromRulesResponse } from 'app/types/unified-alerting-dto';
 
 import { getDatasourceAPIUid, GRAFANA_RULES_SOURCE_NAME } from '../utils/datasource';
+import { isCloudRuleIdentifier, isPrometheusRuleIdentifier } from '../utils/rules';
 
 export interface FetchPromRulesFilter {
   dashboardUID: string;
@@ -15,10 +16,11 @@ export interface FetchPromRulesFilter {
 export interface PrometheusDataSourceConfig {
   dataSourceName: string;
   limitAlerts?: number;
+  identifier?: RuleIdentifier;
 }
 
 export function prometheusUrlBuilder(dataSourceConfig: PrometheusDataSourceConfig) {
-  const { dataSourceName, limitAlerts } = dataSourceConfig;
+  const { dataSourceName, limitAlerts, identifier } = dataSourceConfig;
 
   return {
     rules: (filter?: FetchPromRulesFilter, state?: string[], matcher?: Matcher[]) => {
@@ -30,6 +32,11 @@ export function prometheusUrlBuilder(dataSourceConfig: PrometheusDataSourceConfi
         searchParams.set('limit_alerts', String(limitAlerts));
       }
 
+      if (identifier && (isPrometheusRuleIdentifier(identifier) || isCloudRuleIdentifier(identifier))) {
+        searchParams.set('file', identifier.namespace);
+        searchParams.set('rule_group', identifier.groupName);
+      }
+
       const params = prepareRulesFilterQueryParams(searchParams, filter);
 
       return {
@@ -81,13 +88,18 @@ export async function fetchRules(
   filter?: FetchPromRulesFilter,
   limitAlerts?: number,
   matcher?: Matcher[],
-  state?: string[]
+  state?: string[],
+  identifier?: RuleIdentifier
 ): Promise<RuleNamespace[]> {
   if (filter?.dashboardUID && dataSourceName !== GRAFANA_RULES_SOURCE_NAME) {
     throw new Error('Filtering by dashboard UID is only supported for Grafana Managed rules.');
   }
 
-  const { url, params } = prometheusUrlBuilder({ dataSourceName, limitAlerts }).rules(filter, state, matcher);
+  const { url, params } = prometheusUrlBuilder({ dataSourceName, limitAlerts, identifier }).rules(
+    filter,
+    state,
+    matcher
+  );
 
   // adding state param here instead of adding it in prometheusUrlBuilder, for being a possible multiple query param
   const response = await lastValueFrom(

public/app/features/alerting/unified/hooks/useCombinedRule.ts

@@ -17,7 +17,7 @@ export function useCombinedRule(
   identifier: RuleIdentifier | undefined,
   ruleSourceName: string | undefined
 ): AsyncRequestState<CombinedRule> {
-  const requestState = useCombinedRulesLoader(ruleSourceName);
+  const requestState = useCombinedRulesLoader(ruleSourceName, identifier);
   const combinedRules = useCombinedRuleNamespaces(ruleSourceName);
 
   const rule = useMemo(() => {
@@ -79,7 +79,10 @@ export function useCombinedRulesMatching(
   };
 }
 
-function useCombinedRulesLoader(rulesSourceName: string | undefined): AsyncRequestState<void> {
+function useCombinedRulesLoader(
+  rulesSourceName: string | undefined,
+  identifier?: RuleIdentifier
+): AsyncRequestState<void> {
   const dispatch = useDispatch();
   const promRuleRequests = useUnifiedAlertingSelector((state) => state.promRules);
   const promRuleRequest = getRequestState(rulesSourceName, promRuleRequests);
@@ -91,7 +94,7 @@ function useCombinedRulesLoader(rulesSourceName: string | undefined): AsyncReque
       return;
     }
 
-    await dispatch(fetchPromAndRulerRulesAction({ rulesSourceName }));
+    await dispatch(fetchPromAndRulerRulesAction({ rulesSourceName, identifier }));
   }, [dispatch, rulesSourceName]);
 
   return {

public/app/features/alerting/unified/state/actions.ts

@@ -107,12 +107,14 @@ export const fetchPromRulesAction = createAsyncThunk(
       limitAlerts,
       matcher,
       state,
+      identifier,
     }: {
       rulesSourceName: string;
       filter?: FetchPromRulesFilter;
       limitAlerts?: number;
       matcher?: Matcher[];
       state?: string[];
+      identifier?: RuleIdentifier;
     },
     thunkAPI
   ): Promise<RuleNamespace[]> => {
@@ -123,7 +125,9 @@ export const fetchPromRulesAction = createAsyncThunk(
       thunk: 'unifiedalerting/fetchPromRules',
     });
 
-    return await withSerializedError(fetchRulesWithLogging(rulesSourceName, filter, limitAlerts, matcher, state));
+    return await withSerializedError(
+      fetchRulesWithLogging(rulesSourceName, filter, limitAlerts, matcher, state, identifier)
+    );
   }
 );
 
@@ -239,12 +243,18 @@ export const fetchRulerRulesAction = createAsyncThunk(
   }
 );
 
-export function fetchPromAndRulerRulesAction({ rulesSourceName }: { rulesSourceName: string }): ThunkResult<void> {
+export function fetchPromAndRulerRulesAction({
+  rulesSourceName,
+  identifier,
+}: {
+  rulesSourceName: string;
+  identifier?: RuleIdentifier;
+}): ThunkResult<void> {
   return async (dispatch, getState) => {
     await dispatch(fetchRulesSourceBuildInfoAction({ rulesSourceName }));
     const dsConfig = getDataSourceConfig(getState, rulesSourceName);
 
-    await dispatch(fetchPromRulesAction({ rulesSourceName }));
+    await dispatch(fetchPromRulesAction({ rulesSourceName, identifier }));
     if (dsConfig.rulerConfig) {
       await dispatch(fetchRulerRulesAction({ rulesSourceName }));
     }