Use queryFn instead of query to be able to catch errors in onCall req… (#60685)

Use queryFn instead of query to be able to catch errors in onCall request

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

@@ -1,3 +1,7 @@
+import { lastValueFrom } from 'rxjs';
+
+import { getBackendSrv } from '@grafana/runtime';
+
 import { alertingApi } from './alertingApi';
 export interface OnCallIntegration {
   integration_url: string;
@@ -8,13 +12,26 @@ export type OnCallIntegrationsUrls = string[];
 export const onCallApi = alertingApi.injectEndpoints({
   endpoints: (build) => ({
     getOnCallIntegrations: build.query<OnCallIntegrationsUrls, void>({
-      query: () => ({
+      queryFn: async () => {
-        headers: {},
+        const integrations = await fetchOnCallIntegrations();
-        url: '/api/plugin-proxy/grafana-oncall-app/api/internal/v1/alert_receive_channels/',
+        return { data: integrations };
-      }),
+      },
       providesTags: ['AlertmanagerChoice'],
-      transformResponse: (response: OnCallIntegrationsResponse) => response.map((result) => result.integration_url),
     }),
   }),
 });
+export async function fetchOnCallIntegrations(): Promise<OnCallIntegrationsUrls> {
+  try {
+    const response = await lastValueFrom(
+      getBackendSrv().fetch<OnCallIntegrationsResponse>({
+        url: '/api/plugin-proxy/grafana-oncall-app/api/internal/v1/alert_receive_channels/',
+        showErrorAlert: false,
+        showSuccessAlert: false,
+      })
+    );
+    return response.data.map((result) => result.integration_url);
+  } catch (error) {
+    return [];
+  }
+}
 export const { useGetOnCallIntegrationsQuery } = onCallApi;