public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move conversion logic to hook, remove unneeded memo

Browse Source
This commit is contained in:
Kristina Durivage
2025-11-30 12:51:28 -06:00
parent f935a6579f
commit 7e2a6a7222
3 changed files with 23 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/app/features/correlations/CorrelationsPage.tsx
+8 -10
View File
@@ -107,9 +107,7 @@ export default function CorrelationsPage(props: CorrelationsPageProps) {
!provisioned && (
<DeleteButton
aria-label={t('correlations.list.delete', 'delete correlation')}
onConfirm={() =>
handleDelete({ sourceUID, uid }, page.current > 1 && index === 0 && data?.correlations.length === 1)
}
onConfirm={() => handleDelete({ sourceUID, uid }, page.current > 1 && index === 0 && corrData.length === 1)}
closeOnConfirm
/>
)
@@ -150,9 +148,9 @@ export default function CorrelationsPage(props: CorrelationsPageProps) {
[RowActions, canWriteCorrelations]
);
const data = useMemo(() => correlations, [correlations]);
const showEmptyListCTA = data?.correlations.length === 0 && !isAdding && !error;
const addButton = canWriteCorrelations && data?.correlations?.length !== 0 && data !== undefined && !isAdding && (
const corrData = correlations?.correlations ?? [];
const showEmptyListCTA = corrData.length === 0 && !isAdding && !error;
const addButton = canWriteCorrelations && corrData.length !== 0 && !isAdding && (
<Button icon="plus" onClick={() => setIsAdding(true)}>
<Trans i18nKey="correlations.add-new">Add new</Trans>
</Button>
@@ -175,7 +173,7 @@ export default function CorrelationsPage(props: CorrelationsPageProps) {
>
<Page.Contents>
<div>
{!data && isLoading && (
{isLoading && (
<div className={loaderWrapper}>
<LoadingPlaceholder text={t('correlations.list.loading', 'loading...')} />
</div>
@@ -204,7 +202,7 @@ export default function CorrelationsPage(props: CorrelationsPageProps) {
{isAdding && <AddCorrelationForm onClose={() => setIsAdding(false)} onCreated={handleAdded} />}
{data && data.correlations.length >= 1 && (
{correlations && corrData.length >= 1 && (
<>
<InteractiveTable
renderExpandedRow={(correlation) => (
@@ -215,12 +213,12 @@ export default function CorrelationsPage(props: CorrelationsPageProps) {
/>
)}
columns={columns}
data={data.correlations}
data={corrData}
getRowId={(correlation) => `${correlation.source.uid}-${correlation.uid}`}
/>
<Pagination
currentPage={page.current}
numberOfPages={Math.ceil(data.totalCount / data.limit)}
numberOfPages={Math.ceil(correlations?.totalCount / correlations?.limit)}
onNavigate={(toPage: number) => {
fetchCorrelations({ page: (page.current = toPage) });
}}
public/app/features/correlations/CorrelationsPageWrapper.tsx
+8 -7
View File
@@ -1,10 +1,9 @@
import { CorrelationList, useListCorrelationQuery } from '@grafana/api-clients/rtkq/correlations/v0alpha1';
import { config, CorrelationsData } from '@grafana/runtime';
import CorrelationsPage from './CorrelationsPage';
import { GetCorrelationsParams } from './types';
import { useCorrelations } from './useCorrelations';
import { toEnrichedCorrelationDataK8s } from './useCorrelationsK8s';
import { useCorrelationsK8s } from './useCorrelationsK8s';
function CorrelationsPageLegacy() {
const { remove, get } = useCorrelations();
@@ -21,26 +20,28 @@ function CorrelationsPageLegacy() {
function CorrelationsPageAppPlatform() {
// todo remove fake limit
const { currentData, isLoading, error } = useListCorrelationQuery({ limit: 10 });
/* const { currentData, isLoading, error } = useListCorrelationQuery({ limit: 10 });
const enrichedCorrelations = (correlations?: CorrelationList) => {
return correlations !== undefined
? correlations.items.map((item) => toEnrichedCorrelationDataK8s(item)).filter((i) => i !== undefined)
: [];
};
}; */
const { currentData, isLoading, error } = useCorrelationsK8s({ limit: 10 });
// we cant do a straight refetch, we have to pass in new pages if necessary
const enhRefetch = (params: GetCorrelationsParams): Promise<CorrelationsData> => {
return new Promise(() => enrichedCorrelations(currentData));
return new Promise(() => currentData);
};
return (
<CorrelationsPage
fetchCorrelations={enhRefetch}
correlations={{
correlations: enrichedCorrelations(currentData),
correlations: currentData,
page: 0,
limit: 1000,
totalCount: enrichedCorrelations.length,
totalCount: currentData.length,
}}
isLoading={isLoading}
error={error as Error}
public/app/features/correlations/useCorrelationsK8s.ts
+7 -33
View File
@@ -60,42 +60,16 @@ export const toEnrichedCorrelationDataK8s = (item: CorrelationK8s): CorrelationD
}
};
export const useCorrelationsK8s = () => {
//const { data, isLoading, error } = correlationAPIv0alpha1.endpoints.listCorrelation.useQuery({ limit: 10 });
const { data, isLoading, error } = useListCorrelationQuery({ limit: 10 });
export const useCorrelationsK8s = (props: { limit: number }) => {
const { currentData, isLoading, error } = useListCorrelationQuery({ limit: props.limit });
const enrichedCorrelations =
data !== undefined
? data.items.map((item) => toEnrichedCorrelationDataK8s(item)).filter((i) => i !== undefined)
currentData !== undefined
? currentData.items.map((item) => toEnrichedCorrelationDataK8s(item)).filter((i) => i !== undefined)
: [];
// todo returning bad response data, how to fix?
return {
get: {
execute: () => {},
value: { correlations: enrichedCorrelations, page: 0, limit: 1000, totalCount: enrichedCorrelations.length },
loading: isLoading,
error,
},
currentData: enrichedCorrelations,
isLoading,
error,
};
};
/*
if (config.featureToggles.kubernetesCorrelations) {
const result = await dispatch(
correlationAPIv0alpha1.endpoints.createCorrelation.initiate({
correlation: {
apiVersion: 'correlations.grafana.app/v0alpha1',
kind: 'Correlations',
metadata: {},
spec: {
...correlation,
label: correlation.label ?? '',
source: { name: sourceUID, group: '' },
config: { ...correlation.config, transformations: [] },
},
},
})
);
return result;
} else {
*/