WIP

public/app/features/correlations/CorrelationsPageWrapper.tsx

@@ -1,7 +1,4 @@
-import {
-  generatedAPI as correlationAPIv0alpha1,
-  CorrelationList,
-} from '@grafana/api-clients/rtkq/correlations/v0alpha1';
+import { CorrelationList, useListCorrelationQuery } from '@grafana/api-clients/rtkq/correlations/v0alpha1';
 import { config, CorrelationsData } from '@grafana/runtime';
 
 import CorrelationsPage from './CorrelationsPage';
@@ -10,11 +7,10 @@ import { useCorrelations } from './useCorrelations';
 import { toEnrichedCorrelationDataK8s } from './useCorrelationsK8s';
 
 export default function CorrelationsPageWrapper() {
-  //const { remove, get } = useCorrelations();
-  try {
-    const { data, isLoading, error } = correlationAPIv0alpha1.endpoints.listCorrelation.useQuery({});
-
-    //if (config.featureToggles.kubernetesCorrelations) {
+  // I cannot use these conditionally, is this okay?
+  const { remove, get } = useCorrelations();
+  const { currentData, isLoading, error } = useListCorrelationQuery({ limit: 10 });
+  if (config.featureToggles.kubernetesCorrelations) {
     const enrichedCorrelations = (correlations?: CorrelationList) => {
       return correlations !== undefined
         ? correlations.items.map((item) => toEnrichedCorrelationDataK8s(item)).filter((i) => i !== undefined)
@@ -23,15 +19,14 @@ export default function CorrelationsPageWrapper() {
 
     // we cant do a straight refetch, we have to pass in new pages if necessary
     const enhRefetch = (params: GetCorrelationsParams): Promise<CorrelationsData> => {
-      const { data } = correlationAPIv0alpha1.endpoints.listCorrelation.useQuery({});
-      return new Promise(() => enrichedCorrelations(data));
+      return new Promise(() => enrichedCorrelations(currentData));
     };
 
     return (
       <CorrelationsPage
         fetchCorrelations={enhRefetch}
         correlations={{
-          correlations: enrichedCorrelations(data),
+          correlations: enrichedCorrelations(currentData),
           page: 0,
           limit: 1000,
           totalCount: enrichedCorrelations.length,
@@ -40,11 +35,7 @@ export default function CorrelationsPageWrapper() {
         error={error as Error}
       />
     );
-  } catch (e) {
-    console.log(e);
-  }
-
-  /*} else {
+  } else {
     return (
       <CorrelationsPage
         fetchCorrelations={get.execute}
@@ -54,5 +45,5 @@ export default function CorrelationsPageWrapper() {
         removeFn={remove.execute}
       />
     );
-  }*/
+  }
 }

public/app/features/correlations/useCorrelations.ts

@@ -95,7 +95,7 @@ export const useCorrelations = () => {
       return lastValueFrom(
         backend.fetch<CorrelationsResponse>({
           url: '/api/datasources/correlations',
-          params: { page: params.page },
+          params: { page: params.page, limit: 10 }, // todo this is to force pagination for testing, remove
           method: 'GET',
           showErrorAlert: false,
         })

public/app/features/correlations/useCorrelationsK8s.ts

@@ -1,6 +1,6 @@
 import {
-  generatedAPI as correlationAPIv0alpha1,
   Correlation as CorrelationK8s,
+  useListCorrelationQuery,
 } from '@grafana/api-clients/rtkq/correlations/v0alpha1';
 import { CorrelationData, CorrelationExternal, CorrelationQuery } from '@grafana/runtime';
 
@@ -61,7 +61,8 @@ export const toEnrichedCorrelationDataK8s = (item: CorrelationK8s): CorrelationD
 };
 
 export const useCorrelationsK8s = () => {
-  const { data, isLoading, error } = correlationAPIv0alpha1.endpoints.listCorrelation.useQuery({});
+  //const { data, isLoading, error } = correlationAPIv0alpha1.endpoints.listCorrelation.useQuery({ limit: 10 });
+  const { data, isLoading, error } = useListCorrelationQuery({ limit: 10 });
   const enrichedCorrelations =
     data !== undefined
       ? data.items.map((item) => toEnrichedCorrelationDataK8s(item)).filter((i) => i !== undefined)