chore: fix reported bugs and issues

SigNoz · Dec 24, 2024 · 7a06d6a · 7a06d6a
1 parent 172d693
commit 7a06d6a
Show file tree

Hide file tree

Showing 9 changed files with 1,853 additions and 351 deletions.
diff --git a/frontend/src/api/infra/getHostAttributeKeys.ts b/frontend/src/api/infra/getHostAttributeKeys.ts
@@ -2,6 +2,7 @@ import { ApiBaseInstance } from 'api';
 import { ErrorResponseHandler } from 'api/ErrorResponseHandler';
 import { AxiosError, AxiosResponse } from 'axios';
 import { baseAutoCompleteIdKeysOrder } from 'constants/queryBuilder';
+import { K8sCategory } from 'container/InfraMonitoringK8s/constants';
 import { createIdFromObjectFields } from 'lib/createIdFromObjectFields';
 import { ErrorResponse, SuccessResponse } from 'types/api';
 import {
@@ -11,12 +12,13 @@ import {
 
 export const getHostAttributeKeys = async (
 	searchText = '',
+	entity: K8sCategory,
 ): Promise<SuccessResponse<IQueryAutocompleteResponse> | ErrorResponse> => {
 	try {
 		const response: AxiosResponse<{
 			data: IQueryAutocompleteResponse;
 		}> = await ApiBaseInstance.get(
-			`/hosts/attribute_keys?dataSource=metrics&searchText=${searchText}`,
+			`/${entity}/attribute_keys?dataSource=metrics&searchText=${searchText}`,
 		);
 
 		const payload: BaseAutocompleteData[] =

diff --git a/frontend/src/components/QuickFilters/FilterRenderers/Checkbox/Checkbox.tsx b/frontend/src/components/QuickFilters/FilterRenderers/Checkbox/Checkbox.tsx
@@ -8,9 +8,11 @@ import { Button, Checkbox, Input, Skeleton, Typography } from 'antd';
 import cx from 'classnames';
 import { IQuickFiltersConfig } from 'components/QuickFilters/QuickFilters';
 import { OPERATORS } from 'constants/queryBuilder';
+import { DEBOUNCE_DELAY } from 'constants/queryBuilderFilterConfig';
 import { getOperatorValue } from 'container/QueryBuilder/filters/QueryBuilderSearch/utils';
 import { useGetAggregateValues } from 'hooks/queryBuilder/useGetAggregateValues';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
+import useDebouncedFn from 'hooks/useDebouncedFunction';
 import { cloneDeep, isArray, isEmpty, isEqual, isFunction } from 'lodash-es';
 import { ChevronDown, ChevronRight } from 'lucide-react';
 import { useMemo, useState } from 'react';
@@ -73,6 +75,10 @@ export default function CheckboxFilter(props: ICheckboxProps): JSX.Element {
 	);
 	const currentAttributeKeys = attributeValues.slice(0, visibleItemsCount);
 
+	const setSearchTextDebounced = useDebouncedFn((...args) => {
+		setSearchText(args[0] as string);
+	}, DEBOUNCE_DELAY);
+
 	// derive the state of each filter key here in the renderer itself and keep it in sync with current query
 	// also we need to keep a note of last focussed query.
 	// eslint-disable-next-line sonarjs/cognitive-complexity
@@ -450,7 +456,7 @@ export default function CheckboxFilter(props: ICheckboxProps): JSX.Element {
 					<section className="search">
 						<Input
 							placeholder="Filter values"
-							onChange={(e): void => setSearchText(e.target.value)}
+							onChange={(e): void => setSearchTextDebounced(e.target.value)}
 							disabled={isFilterDisabled}
 						/>
 					</section>

diff --git a/frontend/src/container/InfraMonitoringK8s/InfraMonitoringK8s.tsx b/frontend/src/container/InfraMonitoringK8s/InfraMonitoringK8s.tsx
@@ -72,8 +72,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 					<div className="k8s-quick-filters-category-label-container">
 						<Container size={14} className="k8s-quick-filters-category-label-icon" />
 						<Typography.Text>Pods</Typography.Text>
-
-						<Typography.Text> ({PodsQuickFiltersConfig.length}) </Typography.Text>
 					</div>
 				</div>
 			),
@@ -94,8 +92,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 					<div className="k8s-quick-filters-category-label-container">
 						<Workflow size={14} className="k8s-quick-filters-category-label-icon" />
 						<Typography.Text>Nodes</Typography.Text>
-
-						<Typography.Text> ({NodesQuickFiltersConfig.length}) </Typography.Text>
 					</div>
 				</div>
 			),
@@ -119,11 +115,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 							className="k8s-quick-filters-category-label-icon"
 						/>
 						<Typography.Text>Namespace</Typography.Text>
-
-						<Typography.Text>
-							{' '}
-							({NamespaceQuickFiltersConfig.length}){' '}
-						</Typography.Text>
 					</div>
 				</div>
 			),
@@ -144,8 +135,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 					<div className="k8s-quick-filters-category-label-container">
 						<Boxes size={14} className="k8s-quick-filters-category-label-icon" />
 						<Typography.Text>Clusters</Typography.Text>
-
-						<Typography.Text> ({ClustersQuickFiltersConfig.length}) </Typography.Text>
 					</div>
 				</div>
 			),
@@ -169,11 +158,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 							className="k8s-quick-filters-category-label-icon"
 						/>
 						<Typography.Text>Containers</Typography.Text>
-
-						<Typography.Text>
-							{' '}
-							({ContainersQuickFiltersConfig.length}){' '}
-						</Typography.Text>
 					</div>
 				</div>
 			),
@@ -194,8 +178,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 					<div className="k8s-quick-filters-category-label-container">
 						<HardDrive size={14} className="k8s-quick-filters-category-label-icon" />
 						<Typography.Text>Volumes</Typography.Text>
-
-						<Typography.Text> ({VolumesQuickFiltersConfig.length}) </Typography.Text>
 					</div>
 				</div>
 			),
@@ -216,11 +198,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 					<div className="k8s-quick-filters-category-label-container">
 						<Computer size={14} className="k8s-quick-filters-category-label-icon" />
 						<Typography.Text>Deployments</Typography.Text>
-
-						<Typography.Text>
-							{' '}
-							({DeploymentsQuickFiltersConfig.length}){' '}
-						</Typography.Text>
 					</div>
 				</div>
 			),
@@ -241,8 +218,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 					<div className="k8s-quick-filters-category-label-container">
 						<Bolt size={14} className="k8s-quick-filters-category-label-icon" />
 						<Typography.Text>Jobs</Typography.Text>
-
-						<Typography.Text> ({JobsQuickFiltersConfig.length}) </Typography.Text>
 					</div>
 				</div>
 			),
@@ -263,11 +238,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 					<div className="k8s-quick-filters-category-label-container">
 						<Group size={14} className="k8s-quick-filters-category-label-icon" />
 						<Typography.Text>DaemonSets</Typography.Text>
-
-						<Typography.Text>
-							{' '}
-							({DaemonSetsQuickFiltersConfig.length}){' '}
-						</Typography.Text>
 					</div>
 				</div>
 			),
@@ -291,11 +261,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 							className="k8s-quick-filters-category-label-icon"
 						/>
 						<Typography.Text>StatefulSets</Typography.Text>
-
-						<Typography.Text>
-							{' '}
-							({StatefulsetsQuickFiltersConfig.length}){' '}
-						</Typography.Text>
 					</div>
 				</div>
 			),

diff --git a/frontend/src/container/InfraMonitoringK8s/Pods/K8sPodLists.tsx b/frontend/src/container/InfraMonitoringK8s/Pods/K8sPodLists.tsx