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

feat: unit selection for value graph on dashboard (#898)

Browse Source
This commit is contained in:
Pranshu Chittora 2022-03-23 22:03:57 +05:30 committed by GitHub
parent 7765cee610
commit 8a883f1b5e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/container/GridGraphComponent/index.tsx
View File

@ -1,6 +1,7 @@
import { Typography } from 'antd';
import { ChartData } from 'chart.js';
import Graph, { graphOnClickHandler } from 'components/Graph';
import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
import ValueGraph from 'components/ValueGraph';
import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
import history from 'lib/history';
@ -57,7 +58,11 @@ function GridGraphComponent({
<Typography>{title}</Typography>
</TitleContainer>
<ValueContainer isDashboardPage={isDashboardPage}>
<ValueGraph value={value.toString()} />
<ValueGraph
value={
yAxisUnit ? getYAxisFormattedValue(value, yAxisUnit) : value.toString()
}
/>
</ValueContainer>
</>
);

4
frontend/src/container/NewWidget/RightContainer/YAxisUnitSelector.tsx
View File

@ -9,7 +9,7 @@ const findCategoryById = (searchValue) =>
const findCategoryByName = (searchValue) =>
find(flattenedCategories, (option) => option.name == searchValue);
function YAxisUnitSelector({ defaultValue, onSelect }): JSX.Element {
function YAxisUnitSelector({ defaultValue, onSelect, fieldLabel }): JSX.Element {
const onSelectHandler = (selectedValue: string): void => {
onSelect(findCategoryByName(selectedValue)?.id);
};
@ -19,7 +19,7 @@ function YAxisUnitSelector({ defaultValue, onSelect }): JSX.Element {
return (
<Col style={{ marginTop: '1rem' }}>
<div style={{ margin: '0.5rem 0' }}>
<Typography.Text>Y Axis Unit</Typography.Text>
<Typography.Text>{fieldLabel}</Typography.Text>
</div>
<AutoComplete
style={{ width: '100%' }}

6
frontend/src/container/NewWidget/RightContainer/index.tsx
View File

@ -148,7 +148,11 @@ function RightContainer({
setSelectedTime,
}}
/>
<YAxisUnitSelector defaultValue={yAxisUnit} onSelect={setYAxisUnit} />
<YAxisUnitSelector
defaultValue={yAxisUnit}
onSelect={setYAxisUnit}
fieldLabel={selectedGraphType === 'Value' ? 'Unit' : 'Y Axis Unit'}
/>
</Container>
);
}