From ac70240b72855668a164d040526c7e667fb8438b Mon Sep 17 00:00:00 2001 From: Palash gupta Date: Thu, 24 Mar 2022 15:39:33 +0530 Subject: [PATCH] chore: some tsc fix --- .../src/components/NotFound/NotFound.test.tsx | 1 + frontend/src/components/Styled/types.ts | 2 +- .../container/GantChart/SpanLength/index.tsx | 2 +- .../src/container/ListOfDashboard/index.tsx | 2 +- .../LeftContainer/QuerySection/Query.tsx | 25 +++++++++++++++++-- frontend/src/container/Trace/Graph/index.tsx | 2 +- frontend/src/hooks/useFetch.ts | 2 +- frontend/src/lib/__tests__/getStep.test.ts | 1 + frontend/src/pages/DashboardWidget/index.tsx | 7 +++++- 9 files changed, 36 insertions(+), 8 deletions(-) diff --git a/frontend/src/components/NotFound/NotFound.test.tsx b/frontend/src/components/NotFound/NotFound.test.tsx index e00ecc939f..c8aab78ef7 100644 --- a/frontend/src/components/NotFound/NotFound.test.tsx +++ b/frontend/src/components/NotFound/NotFound.test.tsx @@ -1,3 +1,4 @@ +import { expect } from '@jest/globals'; import { render } from '@testing-library/react'; import React from 'react'; import { MemoryRouter } from 'react-router-dom'; diff --git a/frontend/src/components/Styled/types.ts b/frontend/src/components/Styled/types.ts index fb829fb394..4a02884334 100644 --- a/frontend/src/components/Styled/types.ts +++ b/frontend/src/components/Styled/types.ts @@ -1,5 +1,5 @@ import { FlattenSimpleInterpolation } from 'styled-components'; export interface IStyledClass { - styledclass?: FlattenSimpleInterpolation[]; + styledclass: FlattenSimpleInterpolation[]; } diff --git a/frontend/src/container/GantChart/SpanLength/index.tsx b/frontend/src/container/GantChart/SpanLength/index.tsx index 4ee15a9332..4e27e6e624 100644 --- a/frontend/src/container/GantChart/SpanLength/index.tsx +++ b/frontend/src/container/GantChart/SpanLength/index.tsx @@ -33,7 +33,7 @@ function SpanLength(props: SpanLengthProps): JSX.Element { leftOffset={leftOffset} width={width} /> - {`${toFixed( + {`${toFixed( resolveTimeFromInterval(inMsCount, intervalUnit), 2, )} ${intervalUnit.name}`} diff --git a/frontend/src/container/ListOfDashboard/index.tsx b/frontend/src/container/ListOfDashboard/index.tsx index 8828d748f2..492da5c846 100644 --- a/frontend/src/container/ListOfDashboard/index.tsx +++ b/frontend/src/container/ListOfDashboard/index.tsx @@ -157,7 +157,7 @@ function ListOfAllDashboard(): JSX.Element { diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/Query.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/Query.tsx index 42b22fe206..97aa24d180 100644 --- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/Query.tsx +++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/Query.tsx @@ -2,8 +2,8 @@ import { Button, Divider } from 'antd'; import Input from 'components/Input'; import TextToolTip from 'components/TextToolTip'; import { timePreferance } from 'container/NewWidget/RightContainer/timeItems'; -import React, { useCallback, useState } from 'react'; -import { connect } from 'react-redux'; +import React, { useCallback, useMemo, useState } from 'react'; +import { connect, useSelector } from 'react-redux'; import { useLocation } from 'react-router-dom'; import { bindActionCreators, Dispatch } from 'redux'; import { ThunkDispatch } from 'redux-thunk'; @@ -12,8 +12,11 @@ import { UpdateQuery, UpdateQueryProps, } from 'store/actions/dashboard/updateQuery'; +import { AppState } from 'store/reducers'; import AppActions from 'types/actions'; import { DeleteQueryProps } from 'types/actions/dashboard'; +import { Widgets } from 'types/api/dashboard/getAll'; +import DashboardReducer from 'types/reducer/dashboards'; import { ButtonContainer, @@ -32,10 +35,27 @@ function Query({ const [promqlQuery, setPromqlQuery] = useState(preQuery); const [legendFormat, setLegendFormat] = useState(preLegend); const { search } = useLocation(); + const { dashboards } = useSelector( + (state) => state.dashboards, + ); + + const [selectedDashboards] = dashboards; + const { widgets } = selectedDashboards.data; const query = new URLSearchParams(search); const widgetId = query.get('widgetId') || ''; + const urlQuery = useMemo(() => { + return new URLSearchParams(search); + }, [search]); + + const getWidget = useCallback(() => { + const widgetId = urlQuery.get('widgetId'); + return widgets?.find((e) => e.id === widgetId); + }, [widgets, urlQuery]); + + const selectedWidget = getWidget() as Widgets; + const onChangeHandler = useCallback( (setFunc: React.Dispatch>, value: string) => { setFunc(value); @@ -49,6 +69,7 @@ function Query({ legend: legendFormat, query: promqlQuery, widgetId, + yAxisUnit: selectedWidget.yAxisUnit, }); }; diff --git a/frontend/src/container/Trace/Graph/index.tsx b/frontend/src/container/Trace/Graph/index.tsx index 01630d4711..179ff792de 100644 --- a/frontend/src/container/Trace/Graph/index.tsx +++ b/frontend/src/container/Trace/Graph/index.tsx @@ -43,7 +43,7 @@ function TraceGraph(): JSX.Element { } return ( - + ( loading: false, success: false, error: true, - errorMessage: error, + errorMessage: error as string, }); } return (): void => { diff --git a/frontend/src/lib/__tests__/getStep.test.ts b/frontend/src/lib/__tests__/getStep.test.ts index 638c21cf4e..399f0cfbc6 100644 --- a/frontend/src/lib/__tests__/getStep.test.ts +++ b/frontend/src/lib/__tests__/getStep.test.ts @@ -1,3 +1,4 @@ +import { expect } from '@jest/globals'; import dayjs from 'dayjs'; import getStep, { DefaultStepSize } from 'lib/getStep'; diff --git a/frontend/src/pages/DashboardWidget/index.tsx b/frontend/src/pages/DashboardWidget/index.tsx index e4eedd4b24..7e9f4e8f73 100644 --- a/frontend/src/pages/DashboardWidget/index.tsx +++ b/frontend/src/pages/DashboardWidget/index.tsx @@ -74,7 +74,12 @@ function DashboardWidget({ getDashboard }: NewDashboardProps): JSX.Element { ); } - return ; + return ( + + ); } export interface DashboardWidgetPageParams {