GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-12 20:29:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: store columns while saving view and restore columns on selecting view without select columns (#5647)

Browse Source 
* feat: store columns while saving view and restore columns on selecting view without select columns

* fix: add null check to prevent storing empty selectItems

* fix: restore the default select columns and remove OLD_SELECT_COLUMNS

* chore: pr review changes
This commit is contained in:
Shaheer Kochai 2024-10-04 10:37:19 +04:30 committed by GitHub
parent 9390a815a8
commit 2eb3f6cb06
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 70 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/components/ExplorerCard/types.ts
View File

@ -22,7 +22,13 @@ export type GetViewDetailsUsingViewKey = (
viewKey: string,
data: ViewProps[] | undefined,
) =>
| { query: Query; name: string; uuid: string; panelType: PANEL_TYPES }
| {
query: Query;
name: string;
uuid: string;
panelType: PANEL_TYPES;
extraData?: string;
}
| undefined;
export interface IsQueryUpdatedInViewProps {

4
frontend/src/components/ExplorerCard/utils.ts
View File

@ -29,9 +29,9 @@ export const getViewDetailsUsingViewKey: GetViewDetailsUsingViewKey = (
) => {
const selectedView = data?.find((view) => view.uuid === viewKey);
if (selectedView) {
const { compositeQuery, name, uuid } = selectedView;
const { compositeQuery, name, uuid, extraData } = selectedView;
const query = mapQueryDataFromApi(compositeQuery);
return { query, name, uuid, panelType: compositeQuery.panelType };
return { query, name, uuid, panelType: compositeQuery.panelType, extraData };
}
return undefined;
};

64
frontend/src/container/ExplorerOptions/ExplorerOptions.tsx
View File

@ -24,6 +24,9 @@ import { QueryParams } from 'constants/query';
import { PANEL_TYPES } from 'constants/queryBuilder';
import ROUTES from 'constants/routes';
import ExportPanelContainer from 'container/ExportPanel/ExportPanelContainer';
import { useOptionsMenu } from 'container/OptionsMenu';
import { defaultTraceSelectedColumns } from 'container/OptionsMenu/constants';
import { OptionsQuery } from 'container/OptionsMenu/types';
import { useGetSearchQueryParam } from 'hooks/queryBuilder/useGetSearchQueryParam';
import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
import { useGetAllViews } from 'hooks/saveViews/useGetAllViews';
@ -34,7 +37,7 @@ import useErrorNotification from 'hooks/useErrorNotification';
import { useHandleExplorerTabChange } from 'hooks/useHandleExplorerTabChange';
import { useNotifications } from 'hooks/useNotifications';
import { mapCompositeQueryFromQuery } from 'lib/newQueryBuilder/queryBuilderMappers/mapCompositeQueryFromQuery';
import { cloneDeep } from 'lodash-es';
import { cloneDeep, isEqual } from 'lodash-es';
import {
Check,
ConciergeBell,
@ -58,7 +61,9 @@ import { useSelector } from 'react-redux';
import { useHistory } from 'react-router-dom';
import { AppState } from 'store/reducers';
import { Dashboard } from 'types/api/dashboard/getAll';
import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
import { Query } from 'types/api/queryBuilder/queryBuilderData';
import { ViewProps } from 'types/api/saveViews/types';
import { DataSource, StringOperators } from 'types/common/queryBuilder';
import AppReducer from 'types/reducer/app';
import { USER_ROLES } from 'types/roles';
@ -252,6 +257,46 @@ function ExplorerOptions({
const { handleExplorerTabChange } = useHandleExplorerTabChange();
const { options, handleOptionsChange } = useOptionsMenu({
storageKey: LOCALSTORAGE.TRACES_LIST_OPTIONS,
dataSource: DataSource.TRACES,
aggregateOperator: StringOperators.NOOP,
});
type ExtraData = {
selectColumns?: BaseAutocompleteData[];
};
const updateOrRestoreSelectColumns = (
key: string,
allViewsData: ViewProps[] | undefined,
options: OptionsQuery,
handleOptionsChange: (newQueryData: OptionsQuery) => void,
): void => {
const currentViewDetails = getViewDetailsUsingViewKey(key, allViewsData);
if (!currentViewDetails) {
return;
}
let extraData: ExtraData = {};
try {
extraData = JSON.parse(currentViewDetails?.extraData ?? '{}') as ExtraData;
} catch (error) {
console.error('Error parsing extraData:', error);
}
if (extraData.selectColumns?.length) {
handleOptionsChange({
...options,
selectColumns: extraData.selectColumns,
});
} else if (!isEqual(defaultTraceSelectedColumns, options.selectColumns)) {
handleOptionsChange({
...options,
selectColumns: defaultTraceSelectedColumns,
});
}
};
const onMenuItemSelectHandler = useCallback(
({ key }: { key: string }): void => {
const currentViewDetails = getViewDetailsUsingViewKey(
@ -321,6 +366,13 @@ function ExplorerOptions({
updatePreservedViewInLocalStorage(option);
updateOrRestoreSelectColumns(
option.key,
viewsData?.data?.data,
options,
handleOptionsChange,
);
if (ref.current) {
ref.current.blur();
}
@ -360,14 +412,20 @@ function ExplorerOptions({
viewName: newViewName || '',
compositeQuery,
sourcePage: sourcepage,
extraData: JSON.stringify({ color }),
extraData: JSON.stringify({
color,
selectColumns: options.selectColumns,
}),
});
const onSaveHandler = (): void => {
saveNewViewHandler({
compositeQuery,
handlePopOverClose: hideSaveViewModal,
extraData: JSON.stringify({ color }),
extraData: JSON.stringify({
color,
selectColumns: options.selectColumns,
}),
notifications,
panelType: panelType || PANEL_TYPES.LIST,
redirectWithQueryBuilderData,