diff --git a/frontend/src/container/InfraMonitoringK8s/Clusters/ClusterDetails/ClusterDetails.tsx b/frontend/src/container/InfraMonitoringK8s/Clusters/ClusterDetails/ClusterDetails.tsx index 1559f8e11b..b897b55441 100644 --- a/frontend/src/container/InfraMonitoringK8s/Clusters/ClusterDetails/ClusterDetails.tsx +++ b/frontend/src/container/InfraMonitoringK8s/Clusters/ClusterDetails/ClusterDetails.tsx @@ -141,13 +141,9 @@ function ClusterDetails({ [cluster?.meta.k8s_cluster_name], ); - const [logFilters, setLogFilters] = useState( - initialFilters, - ); - - const [tracesFilters, setTracesFilters] = useState( - initialFilters, - ); + const [logsAndTracesFilters, setLogsAndTracesFilters] = useState< + IBuilderQuery['filters'] + >(initialFilters); const [eventsFilters, setEventsFilters] = useState( initialEventsFilters, @@ -161,8 +157,7 @@ function ClusterDetails({ }, []); useEffect(() => { - setLogFilters(initialFilters); - setTracesFilters(initialFilters); + setLogsAndTracesFilters(initialFilters); setEventsFilters(initialEventsFilters); }, [initialFilters, initialEventsFilters]); @@ -217,7 +212,7 @@ function ClusterDetails({ const handleChangeLogFilters = useCallback( (value: IBuilderQuery['filters']) => { - setLogFilters((prevFilters) => { + setLogsAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_CLUSTER_NAME].includes(item.key?.key ?? ''), ); @@ -249,7 +244,7 @@ function ClusterDetails({ const handleChangeTracesFilters = useCallback( (value: IBuilderQuery['filters']) => { - setTracesFilters((prevFilters) => { + setLogsAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_CLUSTER_NAME].includes(item.key?.key ?? ''), ); @@ -325,8 +320,8 @@ function ClusterDetails({ if (selectedView === VIEW_TYPES.LOGS) { const filtersWithoutPagination = { - ...logFilters, - items: logFilters.items.filter((item) => item.key?.key !== 'id'), + ...logsAndTracesFilters, + items: logsAndTracesFilters.items.filter((item) => item.key?.key !== 'id'), }; const compositeQuery = { @@ -360,7 +355,7 @@ function ClusterDetails({ { ...initialQueryBuilderFormValuesMap.traces, aggregateOperator: TracesAggregatorOperator.NOOP, - filters: tracesFilters, + filters: logsAndTracesFilters, }, ], }, @@ -524,7 +519,7 @@ function ClusterDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeLogFilters={handleChangeLogFilters} - logFilters={logFilters} + logFilters={logsAndTracesFilters} selectedInterval={selectedInterval} queryKey="clusterLogs" category={K8sCategory.CLUSTERS} @@ -537,9 +532,10 @@ function ClusterDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeTracesFilters={handleChangeTracesFilters} - tracesFilters={tracesFilters} + tracesFilters={logsAndTracesFilters} selectedInterval={selectedInterval} queryKey="clusterTraces" + queryKeyFilters={[QUERY_KEYS.K8S_CLUSTER_NAME]} /> )} {selectedView === VIEW_TYPES.EVENTS && ( diff --git a/frontend/src/container/InfraMonitoringK8s/DaemonSets/DaemonSetDetails/DaemonSetDetails.tsx b/frontend/src/container/InfraMonitoringK8s/DaemonSets/DaemonSetDetails/DaemonSetDetails.tsx index 8f482fbf29..391090e384 100644 --- a/frontend/src/container/InfraMonitoringK8s/DaemonSets/DaemonSetDetails/DaemonSetDetails.tsx +++ b/frontend/src/container/InfraMonitoringK8s/DaemonSets/DaemonSetDetails/DaemonSetDetails.tsx @@ -155,13 +155,9 @@ function DaemonSetDetails({ [daemonSet?.meta.k8s_daemonset_name], ); - const [logFilters, setLogFilters] = useState( - initialFilters, - ); - - const [tracesFilters, setTracesFilters] = useState( - initialFilters, - ); + const [logAndTracesFilters, setLogAndTracesFilters] = useState< + IBuilderQuery['filters'] + >(initialFilters); const [eventsFilters, setEventsFilters] = useState( initialEventsFilters, @@ -175,8 +171,7 @@ function DaemonSetDetails({ }, []); useEffect(() => { - setLogFilters(initialFilters); - setTracesFilters(initialFilters); + setLogAndTracesFilters(initialFilters); setEventsFilters(initialEventsFilters); }, [initialFilters, initialEventsFilters]); @@ -231,7 +226,7 @@ function DaemonSetDetails({ const handleChangeLogFilters = useCallback( (value: IBuilderQuery['filters']) => { - setLogFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_DAEMON_SET_NAME, QUERY_KEYS.K8S_NAMESPACE_NAME].includes( item.key?.key ?? '', @@ -264,7 +259,7 @@ function DaemonSetDetails({ const handleChangeTracesFilters = useCallback( (value: IBuilderQuery['filters']) => { - setTracesFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_DAEMON_SET_NAME, QUERY_KEYS.K8S_NAMESPACE_NAME].includes( item.key?.key ?? '', @@ -344,8 +339,8 @@ function DaemonSetDetails({ if (selectedView === VIEW_TYPES.LOGS) { const filtersWithoutPagination = { - ...logFilters, - items: logFilters.items.filter((item) => item.key?.key !== 'id'), + ...logAndTracesFilters, + items: logAndTracesFilters.items.filter((item) => item.key?.key !== 'id'), }; const compositeQuery = { @@ -379,7 +374,7 @@ function DaemonSetDetails({ { ...initialQueryBuilderFormValuesMap.traces, aggregateOperator: TracesAggregatorOperator.NOOP, - filters: tracesFilters, + filters: logAndTracesFilters, }, ], }, @@ -556,7 +551,7 @@ function DaemonSetDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeLogFilters={handleChangeLogFilters} - logFilters={logFilters} + logFilters={logAndTracesFilters} selectedInterval={selectedInterval} category={K8sCategory.DAEMONSETS} queryKey="daemonsetLogs" @@ -572,9 +567,13 @@ function DaemonSetDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeTracesFilters={handleChangeTracesFilters} - tracesFilters={tracesFilters} + tracesFilters={logAndTracesFilters} selectedInterval={selectedInterval} queryKey="daemonsetTraces" + queryKeyFilters={[ + QUERY_KEYS.K8S_DAEMON_SET_NAME, + QUERY_KEYS.K8S_NAMESPACE_NAME, + ]} /> )} {selectedView === VIEW_TYPES.EVENTS && ( diff --git a/frontend/src/container/InfraMonitoringK8s/Deployments/DeploymentDetails/DeploymentDetails.tsx b/frontend/src/container/InfraMonitoringK8s/Deployments/DeploymentDetails/DeploymentDetails.tsx index 20b8330de4..953c6f069a 100644 --- a/frontend/src/container/InfraMonitoringK8s/Deployments/DeploymentDetails/DeploymentDetails.tsx +++ b/frontend/src/container/InfraMonitoringK8s/Deployments/DeploymentDetails/DeploymentDetails.tsx @@ -157,13 +157,9 @@ function DeploymentDetails({ [deployment?.meta.k8s_deployment_name], ); - const [logFilters, setLogFilters] = useState( - initialFilters, - ); - - const [tracesFilters, setTracesFilters] = useState( - initialFilters, - ); + const [logAndTracesFilters, setLogAndTracesFilters] = useState< + IBuilderQuery['filters'] + >(initialFilters); const [eventsFilters, setEventsFilters] = useState( initialEventsFilters, @@ -177,8 +173,7 @@ function DeploymentDetails({ }, []); useEffect(() => { - setLogFilters(initialFilters); - setTracesFilters(initialFilters); + setLogAndTracesFilters(initialFilters); setEventsFilters(initialEventsFilters); }, [initialFilters, initialEventsFilters]); @@ -233,7 +228,7 @@ function DeploymentDetails({ const handleChangeLogFilters = useCallback( (value: IBuilderQuery['filters']) => { - setLogFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_DEPLOYMENT_NAME, QUERY_KEYS.K8S_NAMESPACE_NAME].includes( item.key?.key ?? '', @@ -271,7 +266,7 @@ function DeploymentDetails({ const handleChangeTracesFilters = useCallback( (value: IBuilderQuery['filters']) => { - setTracesFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_DEPLOYMENT_NAME, QUERY_KEYS.K8S_NAMESPACE_NAME].includes( item.key?.key ?? '', @@ -355,8 +350,8 @@ function DeploymentDetails({ if (selectedView === VIEW_TYPES.LOGS) { const filtersWithoutPagination = { - ...logFilters, - items: logFilters.items.filter((item) => item.key?.key !== 'id'), + ...logAndTracesFilters, + items: logAndTracesFilters.items.filter((item) => item.key?.key !== 'id'), }; const compositeQuery = { @@ -390,7 +385,7 @@ function DeploymentDetails({ { ...initialQueryBuilderFormValuesMap.traces, aggregateOperator: TracesAggregatorOperator.NOOP, - filters: tracesFilters, + filters: logAndTracesFilters, }, ], }, @@ -567,7 +562,7 @@ function DeploymentDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeLogFilters={handleChangeLogFilters} - logFilters={logFilters} + logFilters={logAndTracesFilters} selectedInterval={selectedInterval} queryKeyFilters={[ QUERY_KEYS.K8S_DEPLOYMENT_NAME, @@ -583,9 +578,13 @@ function DeploymentDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeTracesFilters={handleChangeTracesFilters} - tracesFilters={tracesFilters} + tracesFilters={logAndTracesFilters} selectedInterval={selectedInterval} queryKey="deploymentTraces" + queryKeyFilters={[ + QUERY_KEYS.K8S_DEPLOYMENT_NAME, + QUERY_KEYS.K8S_NAMESPACE_NAME, + ]} /> )} {selectedView === VIEW_TYPES.EVENTS && ( diff --git a/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityLogs/EntityLogsDetailedView.tsx b/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityLogs/EntityLogsDetailedView.tsx index bab5c68eb6..737f867ded 100644 --- a/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityLogs/EntityLogsDetailedView.tsx +++ b/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityLogs/EntityLogsDetailedView.tsx @@ -12,6 +12,7 @@ import { useMemo } from 'react'; import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData'; import { DataSource } from 'types/common/queryBuilder'; +import { filterOutPrimaryFilters } from '../utils'; import EntityLogs from './EntityLogs'; interface Props { @@ -58,14 +59,14 @@ function EntityLogsDetailedView({ ...currentQuery.builder.queryData[0].aggregateAttribute, }, filters: { - items: [], + items: filterOutPrimaryFilters(logFilters.items, queryKeyFilters), op: 'AND', }, }, ], }, }), - [currentQuery], + [currentQuery, logFilters.items, queryKeyFilters], ); const query = updatedCurrentQuery?.builder?.queryData[0] || null; diff --git a/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityTraces/EntityTraces.tsx b/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityTraces/EntityTraces.tsx index 189f047c88..d4f215e890 100644 --- a/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityTraces/EntityTraces.tsx +++ b/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityTraces/EntityTraces.tsx @@ -26,6 +26,7 @@ import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData'; import { DataSource } from 'types/common/queryBuilder'; import { + filterOutPrimaryFilters, getEntityTracesQueryPayload, selectedEntityTracesColumns, } from '../utils'; @@ -44,6 +45,7 @@ interface Props { tracesFilters: IBuilderQuery['filters']; selectedInterval: Time; queryKey: string; + queryKeyFilters: string[]; } function EntityTraces({ @@ -54,6 +56,7 @@ function EntityTraces({ tracesFilters, selectedInterval, queryKey, + queryKeyFilters, }: Props): JSX.Element { const [traces, setTraces] = useState([]); const [offset] = useState(0); @@ -73,14 +76,14 @@ function EntityTraces({ ...currentQuery.builder.queryData[0].aggregateAttribute, }, filters: { - items: [], + items: filterOutPrimaryFilters(tracesFilters.items, queryKeyFilters), op: 'AND', }, }, ], }, }), - [currentQuery], + [currentQuery, queryKeyFilters, tracesFilters.items], ); const query = updatedCurrentQuery?.builder?.queryData[0] || null; diff --git a/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/utils.tsx b/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/utils.tsx index 9b920832f1..24dac98376 100644 --- a/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/utils.tsx +++ b/frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/utils.tsx @@ -7,7 +7,10 @@ import { BaseAutocompleteData, DataTypes, } from 'types/api/queryBuilder/queryAutocompleteResponse'; -import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData'; +import { + IBuilderQuery, + TagFilterItem, +} from 'types/api/queryBuilder/queryBuilderData'; import { EQueryType } from 'types/common/dashboard'; import { DataSource } from 'types/common/queryBuilder'; import { nanoToMilli } from 'utils/timeUtils'; @@ -301,3 +304,12 @@ export const getEntityTracesQueryPayload = ( ], }, }); + +export const filterOutPrimaryFilters = ( + filters: TagFilterItem[], + primaryKeys: string[], +): TagFilterItem[] => + filters.filter( + (filter) => + !primaryKeys.includes(filter.key?.key ?? '') && filter.key?.key !== 'id', + ); diff --git a/frontend/src/container/InfraMonitoringK8s/Jobs/JobDetails/JobDetails.tsx b/frontend/src/container/InfraMonitoringK8s/Jobs/JobDetails/JobDetails.tsx index e836e604a5..216f3a9dce 100644 --- a/frontend/src/container/InfraMonitoringK8s/Jobs/JobDetails/JobDetails.tsx +++ b/frontend/src/container/InfraMonitoringK8s/Jobs/JobDetails/JobDetails.tsx @@ -152,13 +152,9 @@ function JobDetails({ [job?.meta.k8s_job_name], ); - const [logFilters, setLogFilters] = useState( - initialFilters, - ); - - const [tracesFilters, setTracesFilters] = useState( - initialFilters, - ); + const [logAndTracesFilters, setLogAndTracesFilters] = useState< + IBuilderQuery['filters'] + >(initialFilters); const [eventsFilters, setEventsFilters] = useState( initialEventsFilters, @@ -172,8 +168,7 @@ function JobDetails({ }, []); useEffect(() => { - setLogFilters(initialFilters); - setTracesFilters(initialFilters); + setLogAndTracesFilters(initialFilters); setEventsFilters(initialEventsFilters); }, [initialFilters, initialEventsFilters]); @@ -228,17 +223,16 @@ function JobDetails({ const handleChangeLogFilters = useCallback( (value: IBuilderQuery['filters']) => { - setLogFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => - [QUERY_KEYS.K8S_STATEFUL_SET_NAME, QUERY_KEYS.K8S_NAMESPACE_NAME].includes( + [QUERY_KEYS.K8S_JOB_NAME, QUERY_KEYS.K8S_NAMESPACE_NAME].includes( item.key?.key ?? '', ), ); const paginationFilter = value.items.find((item) => item.key?.key === 'id'); const newFilters = value.items.filter( (item) => - item.key?.key !== 'id' && - item.key?.key !== QUERY_KEYS.K8S_STATEFUL_SET_NAME, + item.key?.key !== 'id' && item.key?.key !== QUERY_KEYS.K8S_JOB_NAME, ); logEvent('Infra Monitoring: Jobs list details logs filters applied', { @@ -261,9 +255,9 @@ function JobDetails({ const handleChangeTracesFilters = useCallback( (value: IBuilderQuery['filters']) => { - setTracesFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => - [QUERY_KEYS.K8S_STATEFUL_SET_NAME, QUERY_KEYS.K8S_NAMESPACE_NAME].includes( + [QUERY_KEYS.K8S_JOB_NAME, QUERY_KEYS.K8S_NAMESPACE_NAME].includes( item.key?.key ?? '', ), ); @@ -277,7 +271,7 @@ function JobDetails({ items: [ ...primaryFilters, ...value.items.filter( - (item) => item.key?.key !== QUERY_KEYS.K8S_STATEFUL_SET_NAME, + (item) => item.key?.key !== QUERY_KEYS.K8S_JOB_NAME, ), ].filter((item): item is TagFilterItem => item !== undefined), }; @@ -335,8 +329,8 @@ function JobDetails({ if (selectedView === VIEW_TYPES.LOGS) { const filtersWithoutPagination = { - ...logFilters, - items: logFilters.items.filter((item) => item.key?.key !== 'id'), + ...logAndTracesFilters, + items: logAndTracesFilters.items.filter((item) => item.key?.key !== 'id'), }; const compositeQuery = { @@ -370,7 +364,7 @@ function JobDetails({ { ...initialQueryBuilderFormValuesMap.traces, aggregateOperator: TracesAggregatorOperator.NOOP, - filters: tracesFilters, + filters: logAndTracesFilters, }, ], }, @@ -536,7 +530,7 @@ function JobDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeLogFilters={handleChangeLogFilters} - logFilters={logFilters} + logFilters={logAndTracesFilters} selectedInterval={selectedInterval} category={K8sCategory.JOBS} queryKey="jobLogs" @@ -552,9 +546,13 @@ function JobDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeTracesFilters={handleChangeTracesFilters} - tracesFilters={tracesFilters} + tracesFilters={logAndTracesFilters} selectedInterval={selectedInterval} queryKey="jobTraces" + queryKeyFilters={[ + QUERY_KEYS.K8S_JOB_NAME, + QUERY_KEYS.K8S_NAMESPACE_NAME, + ]} /> )} {selectedView === VIEW_TYPES.EVENTS && ( diff --git a/frontend/src/container/InfraMonitoringK8s/Namespaces/NamespaceDetails/NamespaceDetails.tsx b/frontend/src/container/InfraMonitoringK8s/Namespaces/NamespaceDetails/NamespaceDetails.tsx index 04f0a9e8d2..ce48b3ea0a 100644 --- a/frontend/src/container/InfraMonitoringK8s/Namespaces/NamespaceDetails/NamespaceDetails.tsx +++ b/frontend/src/container/InfraMonitoringK8s/Namespaces/NamespaceDetails/NamespaceDetails.tsx @@ -143,13 +143,9 @@ function NamespaceDetails({ [namespace?.namespaceName], ); - const [logFilters, setLogFilters] = useState( - initialFilters, - ); - - const [tracesFilters, setTracesFilters] = useState( - initialFilters, - ); + const [logAndTracesFilters, setLogAndTracesFilters] = useState< + IBuilderQuery['filters'] + >(initialFilters); const [eventsFilters, setEventsFilters] = useState( initialEventsFilters, @@ -163,8 +159,7 @@ function NamespaceDetails({ }, []); useEffect(() => { - setLogFilters(initialFilters); - setTracesFilters(initialFilters); + setLogAndTracesFilters(initialFilters); setEventsFilters(initialEventsFilters); }, [initialFilters, initialEventsFilters]); @@ -219,7 +214,7 @@ function NamespaceDetails({ const handleChangeLogFilters = useCallback( (value: IBuilderQuery['filters']) => { - setLogFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_NAMESPACE_NAME, QUERY_KEYS.K8S_CLUSTER_NAME].includes( item.key?.key ?? '', @@ -251,7 +246,7 @@ function NamespaceDetails({ const handleChangeTracesFilters = useCallback( (value: IBuilderQuery['filters']) => { - setTracesFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_NAMESPACE_NAME, QUERY_KEYS.K8S_CLUSTER_NAME].includes( item.key?.key ?? '', @@ -331,8 +326,8 @@ function NamespaceDetails({ if (selectedView === VIEW_TYPES.LOGS) { const filtersWithoutPagination = { - ...logFilters, - items: logFilters.items.filter((item) => item.key?.key !== 'id'), + ...logAndTracesFilters, + items: logAndTracesFilters.items.filter((item) => item.key?.key !== 'id'), }; const compositeQuery = { @@ -366,7 +361,7 @@ function NamespaceDetails({ { ...initialQueryBuilderFormValuesMap.traces, aggregateOperator: TracesAggregatorOperator.NOOP, - filters: tracesFilters, + filters: logAndTracesFilters, }, ], }, @@ -532,7 +527,7 @@ function NamespaceDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeLogFilters={handleChangeLogFilters} - logFilters={logFilters} + logFilters={logAndTracesFilters} selectedInterval={selectedInterval} queryKey="namespaceLogs" category={K8sCategory.NAMESPACES} @@ -545,9 +540,10 @@ function NamespaceDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeTracesFilters={handleChangeTracesFilters} - tracesFilters={tracesFilters} + tracesFilters={logAndTracesFilters} selectedInterval={selectedInterval} queryKey="namespaceTraces" + queryKeyFilters={[QUERY_KEYS.K8S_NAMESPACE_NAME]} /> )} {selectedView === VIEW_TYPES.EVENTS && ( diff --git a/frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/NodeDetails.tsx b/frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/NodeDetails.tsx index b8b290f140..18f96ea9ec 100644 --- a/frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/NodeDetails.tsx +++ b/frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/NodeDetails.tsx @@ -141,13 +141,9 @@ function NodeDetails({ [node?.meta.k8s_node_name], ); - const [logFilters, setLogFilters] = useState( - initialFilters, - ); - - const [tracesFilters, setTracesFilters] = useState( - initialFilters, - ); + const [logAndTracesFilters, setLogAndTracesFilters] = useState< + IBuilderQuery['filters'] + >(initialFilters); const [eventsFilters, setEventsFilters] = useState( initialEventsFilters, @@ -161,8 +157,7 @@ function NodeDetails({ }, []); useEffect(() => { - setLogFilters(initialFilters); - setTracesFilters(initialFilters); + setLogAndTracesFilters(initialFilters); setEventsFilters(initialEventsFilters); }, [initialFilters, initialEventsFilters]); @@ -217,7 +212,7 @@ function NodeDetails({ const handleChangeLogFilters = useCallback( (value: IBuilderQuery['filters']) => { - setLogFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_NODE_NAME, QUERY_KEYS.K8S_CLUSTER_NAME].includes( item.key?.key ?? '', @@ -251,7 +246,7 @@ function NodeDetails({ const handleChangeTracesFilters = useCallback( (value: IBuilderQuery['filters']) => { - setTracesFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_NODE_NAME, QUERY_KEYS.K8S_CLUSTER_NAME].includes( item.key?.key ?? '', @@ -327,8 +322,8 @@ function NodeDetails({ if (selectedView === VIEW_TYPES.LOGS) { const filtersWithoutPagination = { - ...logFilters, - items: logFilters.items.filter((item) => item.key?.key !== 'id'), + ...logAndTracesFilters, + items: logAndTracesFilters.items.filter((item) => item.key?.key !== 'id'), }; const compositeQuery = { @@ -362,7 +357,7 @@ function NodeDetails({ { ...initialQueryBuilderFormValuesMap.traces, aggregateOperator: TracesAggregatorOperator.NOOP, - filters: tracesFilters, + filters: logAndTracesFilters, }, ], }, @@ -526,7 +521,7 @@ function NodeDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeLogFilters={handleChangeLogFilters} - logFilters={logFilters} + logFilters={logAndTracesFilters} selectedInterval={selectedInterval} queryKeyFilters={[QUERY_KEYS.K8S_NODE_NAME, QUERY_KEYS.K8S_CLUSTER_NAME]} queryKey="nodeLogs" @@ -539,8 +534,9 @@ function NodeDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeTracesFilters={handleChangeTracesFilters} - tracesFilters={tracesFilters} + tracesFilters={logAndTracesFilters} selectedInterval={selectedInterval} + queryKeyFilters={[QUERY_KEYS.K8S_NODE_NAME, QUERY_KEYS.K8S_CLUSTER_NAME]} queryKey="nodeTraces" /> )} diff --git a/frontend/src/container/InfraMonitoringK8s/Pods/PodDetails/PodDetails.tsx b/frontend/src/container/InfraMonitoringK8s/Pods/PodDetails/PodDetails.tsx index 969c3847cc..fbec26acef 100644 --- a/frontend/src/container/InfraMonitoringK8s/Pods/PodDetails/PodDetails.tsx +++ b/frontend/src/container/InfraMonitoringK8s/Pods/PodDetails/PodDetails.tsx @@ -158,13 +158,9 @@ function PodDetails({ [pod?.meta.k8s_pod_name], ); - const [logFilters, setLogFilters] = useState( - initialFilters, - ); - - const [tracesFilters, setTracesFilters] = useState( - initialFilters, - ); + const [logsAndTracesFilters, setLogsAndTracesFilters] = useState< + IBuilderQuery['filters'] + >(initialFilters); const [eventsFilters, setEventsFilters] = useState( initialEventsFilters, @@ -178,8 +174,7 @@ function PodDetails({ }, []); useEffect(() => { - setLogFilters(initialFilters); - setTracesFilters(initialFilters); + setLogsAndTracesFilters(initialFilters); setEventsFilters(initialEventsFilters); }, [initialFilters, initialEventsFilters]); @@ -234,7 +229,7 @@ function PodDetails({ const handleChangeLogFilters = useCallback( (value: IBuilderQuery['filters']) => { - setLogFilters((prevFilters) => { + setLogsAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [ QUERY_KEYS.K8S_POD_NAME, @@ -270,7 +265,7 @@ function PodDetails({ const handleChangeTracesFilters = useCallback( (value: IBuilderQuery['filters']) => { - setTracesFilters((prevFilters) => { + setLogsAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [ QUERY_KEYS.K8S_POD_NAME, @@ -348,8 +343,8 @@ function PodDetails({ if (selectedView === VIEW_TYPES.LOGS) { const filtersWithoutPagination = { - ...logFilters, - items: logFilters.items.filter((item) => item.key?.key !== 'id'), + ...logsAndTracesFilters, + items: logsAndTracesFilters.items.filter((item) => item.key?.key !== 'id'), }; const compositeQuery = { @@ -383,7 +378,7 @@ function PodDetails({ { ...initialQueryBuilderFormValuesMap.traces, aggregateOperator: TracesAggregatorOperator.NOOP, - filters: tracesFilters, + filters: logsAndTracesFilters, }, ], }, @@ -564,7 +559,7 @@ function PodDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeLogFilters={handleChangeLogFilters} - logFilters={logFilters} + logFilters={logsAndTracesFilters} selectedInterval={selectedInterval} queryKeyFilters={[ QUERY_KEYS.K8S_POD_NAME, @@ -581,9 +576,14 @@ function PodDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeTracesFilters={handleChangeTracesFilters} - tracesFilters={tracesFilters} + tracesFilters={logsAndTracesFilters} selectedInterval={selectedInterval} queryKey="podTraces" + queryKeyFilters={[ + QUERY_KEYS.K8S_POD_NAME, + QUERY_KEYS.K8S_CLUSTER_NAME, + QUERY_KEYS.K8S_NAMESPACE_NAME, + ]} /> )} diff --git a/frontend/src/container/InfraMonitoringK8s/StatefulSets/StatefulSetDetails/StatefulSetDetails.tsx b/frontend/src/container/InfraMonitoringK8s/StatefulSets/StatefulSetDetails/StatefulSetDetails.tsx index f16e2d0cb0..f4fc996012 100644 --- a/frontend/src/container/InfraMonitoringK8s/StatefulSets/StatefulSetDetails/StatefulSetDetails.tsx +++ b/frontend/src/container/InfraMonitoringK8s/StatefulSets/StatefulSetDetails/StatefulSetDetails.tsx @@ -158,13 +158,9 @@ function StatefulSetDetails({ [statefulSet?.meta.k8s_statefulset_name], ); - const [logFilters, setLogFilters] = useState( - initialFilters, - ); - - const [tracesFilters, setTracesFilters] = useState( - initialFilters, - ); + const [logAndTracesFilters, setLogAndTracesFilters] = useState< + IBuilderQuery['filters'] + >(initialFilters); const [eventsFilters, setEventsFilters] = useState( initialEventsFilters, @@ -178,8 +174,7 @@ function StatefulSetDetails({ }, []); useEffect(() => { - setLogFilters(initialFilters); - setTracesFilters(initialFilters); + setLogAndTracesFilters(initialFilters); setEventsFilters(initialEventsFilters); }, [initialFilters, initialEventsFilters]); @@ -234,7 +229,7 @@ function StatefulSetDetails({ const handleChangeLogFilters = useCallback( (value: IBuilderQuery['filters']) => { - setLogFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_STATEFUL_SET_NAME, QUERY_KEYS.K8S_NAMESPACE_NAME].includes( item.key?.key ?? '', @@ -270,7 +265,7 @@ function StatefulSetDetails({ const handleChangeTracesFilters = useCallback( (value: IBuilderQuery['filters']) => { - setTracesFilters((prevFilters) => { + setLogAndTracesFilters((prevFilters) => { const primaryFilters = prevFilters.items.filter((item) => [QUERY_KEYS.K8S_STATEFUL_SET_NAME, QUERY_KEYS.K8S_NAMESPACE_NAME].includes( item.key?.key ?? '', @@ -350,8 +345,8 @@ function StatefulSetDetails({ if (selectedView === VIEW_TYPES.LOGS) { const filtersWithoutPagination = { - ...logFilters, - items: logFilters.items.filter((item) => item.key?.key !== 'id'), + ...logAndTracesFilters, + items: logAndTracesFilters.items.filter((item) => item.key?.key !== 'id'), }; const compositeQuery = { @@ -385,7 +380,7 @@ function StatefulSetDetails({ { ...initialQueryBuilderFormValuesMap.traces, aggregateOperator: TracesAggregatorOperator.NOOP, - filters: tracesFilters, + filters: logAndTracesFilters, }, ], }, @@ -551,7 +546,7 @@ function StatefulSetDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeLogFilters={handleChangeLogFilters} - logFilters={logFilters} + logFilters={logAndTracesFilters} selectedInterval={selectedInterval} queryKey="statefulsetLogs" category={K8sCategory.STATEFULSETS} @@ -567,9 +562,13 @@ function StatefulSetDetails({ isModalTimeSelection={isModalTimeSelection} handleTimeChange={handleTimeChange} handleChangeTracesFilters={handleChangeTracesFilters} - tracesFilters={tracesFilters} + tracesFilters={logAndTracesFilters} selectedInterval={selectedInterval} queryKey="statefulsetTraces" + queryKeyFilters={[ + QUERY_KEYS.K8S_STATEFUL_SET_NAME, + QUERY_KEYS.K8S_NAMESPACE_NAME, + ]} /> )} {selectedView === VIEW_TYPES.EVENTS && (