GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-07-25 02:44:26 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(FE): encode URL query params (#3501)

Browse Source
This commit is contained in:
Kanishka Chowdhury 2023-09-06 18:45:32 +05:30 committed by GitHub
parent e55a4da2bc
commit b1cee71621
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 46 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/container/ErrorDetails/index.tsx
View File

@ -5,6 +5,7 @@ import { ResizeTable } from 'components/ResizeTable';
import { getNanoSeconds } from 'container/AllError/utils';
import dayjs from 'dayjs';
import { useNotifications } from 'hooks/useNotifications';
import createQueryParams from 'lib/createQueryParams';
import history from 'lib/history';
import { urlKey } from 'pages/ErrorDetails/utils';
import { useMemo, useState } from 'react';
@ -95,10 +96,14 @@ function ErrorDetails(props: ErrorDetailsProps): JSX.Element {
return;
}
const queryParams = {
groupId: idPayload.groupID,
timestamp: getNanoSeconds(timestamp),
errorId: id,
};
history.replace(
`${history.location.pathname}?&groupId=${
idPayload.groupID
}&timestamp=${getNanoSeconds(timestamp)}&errorId=${id}`,
`${history.location.pathname}?${createQueryParams(queryParams)}`,
);
} catch (error) {
notifications.error({

7
frontend/src/container/GridGraphLayout/Graph/WidgetGraphComponent.tsx
View File

@ -4,6 +4,7 @@ import { Events } from 'constants/events';
import GridPanelSwitch from 'container/GridPanelSwitch';
import { useChartMutable } from 'hooks/useChartMutable';
import { useNotifications } from 'hooks/useNotifications';
import createQueryParams from 'lib/createQueryParams';
import history from 'lib/history';
import { isEmpty, isEqual } from 'lodash-es';
import {
@ -190,9 +191,13 @@ function WidgetGraphComponent({
message: 'Panel cloned successfully, redirecting to new copy.',
});
const queryParams = {
graphType: widget?.panelTypes,
widgetId: uuid,
};
setTimeout(() => {
history.push(
`${history.location.pathname}/new?graphType=${widget?.panelTypes}&widgetId=${uuid}`,
`${history.location.pathname}/new?${createQueryParams(queryParams)}`,
);
}, 1500);
});

15
frontend/src/container/NewDashboard/ComponentsSlider/index.tsx
View File

@ -2,6 +2,7 @@ import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
import { queryParamNamesMap } from 'constants/queryBuilderQueryNames';
import { useIsDarkMode } from 'hooks/useDarkMode';
import { useNotifications } from 'hooks/useNotifications';
import createQueryParams from 'lib/createQueryParams';
import history from 'lib/history';
import { CSSProperties, useCallback } from 'react';
import { connect, useSelector } from 'react-redux';
@ -42,12 +43,16 @@ function DashboardGraphSlider({ toggleAddWidget }: Props): JSX.Element {
toggleAddWidget(false);
const queryParams = {
graphType: name,
widgetId: emptyLayout.i,
[queryParamNamesMap.compositeQuery]: JSON.stringify(
initialQueriesMap.metrics,
),
};
history.push(
`${history.location.pathname}/new?graphType=${name}&widgetId=${
emptyLayout.i
}&${queryParamNamesMap.compositeQuery}=${encodeURIComponent(
JSON.stringify(initialQueriesMap.metrics),
)}`,
`${history.location.pathname}/new?${createQueryParams(queryParams)}`,
);
} catch (error) {
notifications.error({

4
frontend/src/lib/createQueryParams.ts
View File

@ -1,6 +1,8 @@
const createQueryParams = (params: { [x: string]: string | number }): string =>
Object.keys(params)
.map((k) => `${k}=${encodeURI(String(params[k]))}`)
.map(
(k) => `${encodeURIComponent(k)}=${encodeURIComponent(String(params[k]))}`,
)
.join('&');
export default createQueryParams;

32
frontend/src/store/actions/trace/util.ts
View File

@ -1,4 +1,5 @@
import { AllTraceFilterEnum } from 'container/Trace/Filters';
import createQueryParams from 'lib/createQueryParams';
import history from 'lib/history';
import { PayloadProps as GetFilterPayload } from 'types/api/trace/getFilters';
import { TraceFilterEnum, TraceReducer } from 'types/reducer/trace';
@ -51,20 +52,25 @@ export const updateURL = (
}
});
const preResultParams = preResult.reduce((acc, item) => {
acc[item.key] = item.value;
return acc;
}, {} as Record<string, string>);
const queryParams = {
selected: JSON.stringify(Object.fromEntries(selectedFilter)),
filterToFetchData: JSON.stringify(filterToFetchData),
spanAggregateCurrentPage,
spanAggregateOrder,
spanAggregateCurrentPageSize,
spanAggregateOrderParam,
selectedTags: JSON.stringify(selectedTags),
...preResultParams,
isFilterExclude: JSON.stringify(Object.fromEntries(isFilterExclude)),
userSelectedFilter: JSON.stringify(Object.fromEntries(userSelectedFilter)),
};
history.replace(
`${history.location.pathname}?selected=${JSON.stringify(
Object.fromEntries(selectedFilter),
)}&filterToFetchData=${JSON.stringify(
filterToFetchData,
)}&spanAggregateCurrentPage=${spanAggregateCurrentPage}&selectedTags=${JSON.stringify(
selectedTags,
)}&${preResult
.map((e) => `${e.key}=${e.value}`)
.join('&')}&isFilterExclude=${JSON.stringify(
Object.fromEntries(isFilterExclude),
)}&userSelectedFilter=${JSON.stringify(
Object.fromEntries(userSelectedFilter),
)}&spanAggregateCurrentPage=${spanAggregateCurrentPage}&spanAggregateOrder=${spanAggregateOrder}&spanAggregateCurrentPageSize=${spanAggregateCurrentPageSize}&spanAggregateOrderParam=${spanAggregateOrderParam}`,
`${history.location.pathname}?${createQueryParams(queryParams)}`,
);
};