Alerting: Add support for Alert State History Loki primary (#69065)

add support for multiple ash targets with loki as primary

packages/grafana-data/src/types/config.ts

@@ -64,6 +64,8 @@ export interface UnifiedAlertingConfig {
   minInterval: string;
   // will be undefined if alerStateHistory is not enabled
   alertStateHistoryBackend?: string;
+  // will be undefined if implementation is not "multiple"
+  alertStateHistoryPrimary?: string;
 }
 
 /** Supported OAuth services

packages/grafana-runtime/src/config.ts

@@ -130,7 +130,11 @@ export class GrafanaBootConfig implements GrafanaConfig {
   geomapDefaultBaseLayerConfig?: MapLayerOptions;
   geomapDisableCustomBaseLayer?: boolean;
   unifiedAlertingEnabled = false;
-  unifiedAlerting = { minInterval: '', alertStateHistoryBackend: undefined };
+  unifiedAlerting = {
+    minInterval: '',
+    alertStateHistoryBackend: undefined,
+    alertStateHistoryPrimary: undefined,
+  };
   applicationInsightsConnectionString?: string;
   applicationInsightsEndpointUrl?: string;
   recordedQueries = {

pkg/api/dtos/frontend_settings.go

@@ -64,6 +64,7 @@ type FrontendSettingsReportingDTO struct {
 type FrontendSettingsUnifiedAlertingDTO struct {
 	MinInterval              string `json:"minInterval"`
 	AlertStateHistoryBackend string `json:"alertStateHistoryBackend,omitempty"`
+	AlertStateHistoryPrimary string `json:"alertStateHistoryPrimary,omitempty"`
 }
 
 // Enterprise-only

pkg/api/frontendsettings.go

@@ -236,6 +236,7 @@ func (hs *HTTPServer) getFrontendSettings(c *contextmodel.ReqContext) (*dtos.Fro
 
 	if hs.Cfg.UnifiedAlerting.StateHistory.Enabled {
 		frontendSettings.UnifiedAlerting.AlertStateHistoryBackend = hs.Cfg.UnifiedAlerting.StateHistory.Backend
+		frontendSettings.UnifiedAlerting.AlertStateHistoryPrimary = hs.Cfg.UnifiedAlerting.StateHistory.MultiPrimary
 	}
 
 	if hs.Cfg.UnifiedAlerting.Enabled != nil {

public/app/features/alerting/unified/hooks/useStateHistoryModal.tsx

@@ -20,10 +20,18 @@ function useStateHistoryModal() {
 
   const styles = useStyles2(getStyles);
 
-  const implementation =
-    config.unifiedAlerting.alertStateHistoryBackend === StateHistoryImplementation.Loki
-      ? StateHistoryImplementation.Loki
-      : StateHistoryImplementation.Annotations;
+  // can be "loki", "multiple" or "annotations"
+  const stateHistoryBackend = config.unifiedAlerting.alertStateHistoryBackend;
+  // can be "loki" or "annotations"
+  const stateHistoryPrimary = config.unifiedAlerting.alertStateHistoryPrimary;
+
+  // if "loki" is either the backend or the primary, show the new state history implementation
+  const usingNewAlertStateHistory = [stateHistoryBackend, stateHistoryPrimary].some(
+    (implementation) => implementation === StateHistoryImplementation.Loki
+  );
+  const implementation = usingNewAlertStateHistory
+    ? StateHistoryImplementation.Loki
+    : StateHistoryImplementation.Annotations;
 
   const dismissModal = useCallback(() => {
     setRule(undefined);