Skip to content

Commit 861d799

Browse files
dlabrecqdlabrecq
authored
Merge pull request #4177 from dlabrecq/COST-5830_2
Reset details page date range dropdown
2 parents 6ef1723 + c3b0e9b commit 861d799

File tree

8 files changed

+105
-27
lines changed

8 files changed

+105
-27
lines changed

‎src/routes/details/awsDetails/detailsHeader.tsx

+16-3
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import { GroupBy } from 'routes/components/groupBy';
2121
import { ProviderDetailsModal } from 'routes/details/components/providerStatus';
2222
import type { ComputedAwsReportItemsParams } from 'routes/utils/computedReport/getComputedAwsReportItems';
2323
import { getIdKeyForGroupBy } from 'routes/utils/computedReport/getComputedAwsReportItems';
24-
import { DateRangeType } from 'routes/utils/dateRange';
24+
import { DateRangeType, getCurrentDateRangeType } from 'routes/utils/dateRange';
2525
import { filterProviders } from 'routes/utils/providers';
2626
import type { FetchStatus } from 'store/common';
2727
import { createMapStateToProps } from 'store/common';
@@ -83,11 +83,24 @@ const tagPathsType = TagPathsType.aws;
8383

8484
class DetailsHeaderBase extends React.Component<DetailsHeaderProps, any> {
8585
protected defaultState: DetailsHeaderState = {
86-
currentDateRangeType:
87-
this.props.timeScopeValue === -2 ? DateRangeType.previousMonth : DateRangeType.currentMonthToDate,
86+
currentDateRangeType: DateRangeType.currentMonthToDate,
8887
};
8988
public state: DetailsHeaderState = { ...this.defaultState };
9089

90+
public componentDidMount() {
91+
const { timeScopeValue } = this.props;
92+
93+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
94+
}
95+
96+
public componentDidUpdate(prevProps: DetailsHeaderProps) {
97+
const { timeScopeValue } = this.props;
98+
99+
if (prevProps.timeScopeValue !== timeScopeValue) {
100+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
101+
}
102+
}
103+
91104
private handleOnCostTypeSelect = (value: string) => {
92105
const { onCostTypeSelect } = this.props;
93106

‎src/routes/details/azureDetails/detailsHeader.tsx

+16-3
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ import { GroupBy } from 'routes/components/groupBy';
1818
import { ProviderDetailsModal } from 'routes/details/components/providerStatus';
1919
import type { ComputedAzureReportItemsParams } from 'routes/utils/computedReport/getComputedAzureReportItems';
2020
import { getIdKeyForGroupBy } from 'routes/utils/computedReport/getComputedAzureReportItems';
21-
import { DateRangeType } from 'routes/utils/dateRange';
21+
import { DateRangeType, getCurrentDateRangeType } from 'routes/utils/dateRange';
2222
import { filterProviders } from 'routes/utils/providers';
2323
import type { FetchStatus } from 'store/common';
2424
import { createMapStateToProps } from 'store/common';
@@ -76,11 +76,24 @@ const tagPathsType = TagPathsType.azure;
7676

7777
class DetailsHeaderBase extends React.Component<DetailsHeaderProps, any> {
7878
protected defaultState: DetailsHeaderState = {
79-
currentDateRangeType:
80-
this.props.timeScopeValue === -2 ? DateRangeType.previousMonth : DateRangeType.currentMonthToDate,
79+
currentDateRangeType: DateRangeType.currentMonthToDate,
8180
};
8281
public state: DetailsHeaderState = { ...this.defaultState };
8382

83+
public componentDidMount() {
84+
const { timeScopeValue } = this.props;
85+
86+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
87+
}
88+
89+
public componentDidUpdate(prevProps: DetailsHeaderProps) {
90+
const { timeScopeValue } = this.props;
91+
92+
if (prevProps.timeScopeValue !== timeScopeValue) {
93+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
94+
}
95+
}
96+
8497
private handleOnDateRangeSelect = (value: string) => {
8598
const { onDateRangeSelect } = this.props;
8699

‎src/routes/details/gcpDetails/detailsHeader.tsx

+16-3
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ import { GroupBy } from 'routes/components/groupBy';
1818
import { ProviderDetailsModal } from 'routes/details/components/providerStatus';
1919
import type { ComputedGcpReportItemsParams } from 'routes/utils/computedReport/getComputedGcpReportItems';
2020
import { getIdKeyForGroupBy } from 'routes/utils/computedReport/getComputedGcpReportItems';
21-
import { DateRangeType } from 'routes/utils/dateRange';
21+
import { DateRangeType, getCurrentDateRangeType } from 'routes/utils/dateRange';
2222
import { filterProviders } from 'routes/utils/providers';
2323
import type { FetchStatus } from 'store/common';
2424
import { createMapStateToProps } from 'store/common';
@@ -77,11 +77,24 @@ const tagPathsType = TagPathsType.gcp;
7777

7878
class DetailsHeaderBase extends React.Component<DetailsHeaderProps, any> {
7979
protected defaultState: DetailsHeaderState = {
80-
currentDateRangeType:
81-
this.props.timeScopeValue === -2 ? DateRangeType.previousMonth : DateRangeType.currentMonthToDate,
80+
currentDateRangeType: DateRangeType.currentMonthToDate,
8281
};
8382
public state: DetailsHeaderState = { ...this.defaultState };
8483

84+
public componentDidMount() {
85+
const { timeScopeValue } = this.props;
86+
87+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
88+
}
89+
90+
public componentDidUpdate(prevProps: DetailsHeaderProps) {
91+
const { timeScopeValue } = this.props;
92+
93+
if (prevProps.timeScopeValue !== timeScopeValue) {
94+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
95+
}
96+
}
97+
8598
private handleOnDateRangeSelect = (value: string) => {
8699
const { onDateRangeSelect } = this.props;
87100

‎src/routes/details/ibmDetails/detailsHeader.tsx

+16-3
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ import { GroupBy } from 'routes/components/groupBy';
1818
import { ProviderDetailsModal } from 'routes/details/components/providerStatus';
1919
import type { ComputedIbmReportItemsParams } from 'routes/utils/computedReport/getComputedIbmReportItems';
2020
import { getIdKeyForGroupBy } from 'routes/utils/computedReport/getComputedIbmReportItems';
21-
import { DateRangeType } from 'routes/utils/dateRange';
21+
import { DateRangeType, getCurrentDateRangeType } from 'routes/utils/dateRange';
2222
import { filterProviders } from 'routes/utils/providers';
2323
import type { FetchStatus } from 'store/common';
2424
import { createMapStateToProps } from 'store/common';
@@ -77,11 +77,24 @@ const tagPathsType = TagPathsType.ibm;
7777

7878
class DetailsHeaderBase extends React.Component<DetailsHeaderProps, any> {
7979
protected defaultState: DetailsHeaderState = {
80-
currentDateRangeType:
81-
this.props.timeScopeValue === -2 ? DateRangeType.previousMonth : DateRangeType.currentMonthToDate,
80+
currentDateRangeType: DateRangeType.currentMonthToDate,
8281
};
8382
public state: DetailsHeaderState = { ...this.defaultState };
8483

84+
public componentDidMount() {
85+
const { timeScopeValue } = this.props;
86+
87+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
88+
}
89+
90+
public componentDidUpdate(prevProps: DetailsHeaderProps) {
91+
const { timeScopeValue } = this.props;
92+
93+
if (prevProps.timeScopeValue !== timeScopeValue) {
94+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
95+
}
96+
}
97+
8598
private handleOnDateRangeSelect = (value: string) => {
8699
const { onDateRangeSelect } = this.props;
87100

‎src/routes/details/ociDetails/detailsHeader.tsx

+16-3
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ import { GroupBy } from 'routes/components/groupBy';
1818
import { ProviderDetailsModal } from 'routes/details/components/providerStatus';
1919
import type { ComputedOciReportItemsParams } from 'routes/utils/computedReport/getComputedOciReportItems';
2020
import { getIdKeyForGroupBy } from 'routes/utils/computedReport/getComputedOciReportItems';
21-
import { DateRangeType } from 'routes/utils/dateRange';
21+
import { DateRangeType, getCurrentDateRangeType } from 'routes/utils/dateRange';
2222
import { filterProviders } from 'routes/utils/providers';
2323
import type { FetchStatus } from 'store/common';
2424
import { createMapStateToProps } from 'store/common';
@@ -76,11 +76,24 @@ const tagPathsType = TagPathsType.oci;
7676

7777
class DetailsHeaderBase extends React.Component<DetailsHeaderProps, any> {
7878
protected defaultState: DetailsHeaderState = {
79-
currentDateRangeType:
80-
this.props.timeScopeValue === -2 ? DateRangeType.previousMonth : DateRangeType.currentMonthToDate,
79+
currentDateRangeType: DateRangeType.currentMonthToDate,
8180
};
8281
public state: DetailsHeaderState = { ...this.defaultState };
8382

83+
public componentDidMount() {
84+
const { timeScopeValue } = this.props;
85+
86+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
87+
}
88+
89+
public componentDidUpdate(prevProps: DetailsHeaderProps) {
90+
const { timeScopeValue } = this.props;
91+
92+
if (prevProps.timeScopeValue !== timeScopeValue) {
93+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
94+
}
95+
}
96+
8497
private handleOnDateRangeSelect = (value: string) => {
8598
const { onDateRangeSelect } = this.props;
8699

‎src/routes/details/ocpDetails/detailsHeader.tsx

+5-9
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import { EmptyValueState } from 'routes/components/state/emptyValueState';
2121
import { ProviderDetailsModal } from 'routes/details/components/providerStatus';
2222
import type { ComputedOcpReportItemsParams } from 'routes/utils/computedReport/getComputedOcpReportItems';
2323
import { getIdKeyForGroupBy } from 'routes/utils/computedReport/getComputedOcpReportItems';
24-
import { DateRangeType } from 'routes/utils/dateRange';
24+
import { DateRangeType, getCurrentDateRangeType } from 'routes/utils/dateRange';
2525
import { filterProviders } from 'routes/utils/providers';
2626
import type { FetchStatus } from 'store/common';
2727
import { createMapStateToProps } from 'store/common';
@@ -86,23 +86,19 @@ class DetailsHeaderBase extends React.Component<DetailsHeaderProps, DetailsHeade
8686
public state: DetailsHeaderState = { ...this.defaultState };
8787

8888
public componentDidMount() {
89-
this.setState({ currentDateRangeType: this.getCurrentDateRangeType() });
89+
const { timeScopeValue } = this.props;
90+
91+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
9092
}
9193

9294
public componentDidUpdate(prevProps: DetailsHeaderProps) {
9395
const { timeScopeValue } = this.props;
9496

9597
if (prevProps.timeScopeValue !== timeScopeValue) {
96-
this.setState({ currentDateRangeType: this.getCurrentDateRangeType() });
98+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
9799
}
98100
}
99101

100-
private getCurrentDateRangeType = () => {
101-
const { timeScopeValue } = this.props;
102-
103-
return timeScopeValue === -2 ? DateRangeType.previousMonth : DateRangeType.currentMonthToDate;
104-
};
105-
106102
private handleOnDateRangeSelect = (value: string) => {
107103
const { onDateRangeSelect } = this.props;
108104

‎src/routes/details/rhelDetails/detailsHeader.tsx

+16-3
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ import { EmptyValueState } from 'routes/components/state/emptyValueState';
1919
import { ProviderDetailsModal } from 'routes/details/components/providerStatus';
2020
import type { ComputedRhelReportItemsParams } from 'routes/utils/computedReport/getComputedRhelReportItems';
2121
import { getIdKeyForGroupBy } from 'routes/utils/computedReport/getComputedRhelReportItems';
22-
import { DateRangeType } from 'routes/utils/dateRange';
22+
import { DateRangeType, getCurrentDateRangeType } from 'routes/utils/dateRange';
2323
import { filterProviders } from 'routes/utils/providers';
2424
import type { FetchStatus } from 'store/common';
2525
import { createMapStateToProps } from 'store/common';
@@ -79,11 +79,24 @@ const tagPathsType = TagPathsType.rhel;
7979

8080
class DetailsHeaderBase extends React.Component<DetailsHeaderProps> {
8181
protected defaultState: DetailsHeaderState = {
82-
currentDateRangeType:
83-
this.props.timeScopeValue === -2 ? DateRangeType.previousMonth : DateRangeType.currentMonthToDate,
82+
currentDateRangeType: DateRangeType.currentMonthToDate,
8483
};
8584
public state: DetailsHeaderState = { ...this.defaultState };
8685

86+
public componentDidMount() {
87+
const { timeScopeValue } = this.props;
88+
89+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
90+
}
91+
92+
public componentDidUpdate(prevProps: DetailsHeaderProps) {
93+
const { timeScopeValue } = this.props;
94+
95+
if (prevProps.timeScopeValue !== timeScopeValue) {
96+
this.setState({ currentDateRangeType: getCurrentDateRangeType(timeScopeValue) });
97+
}
98+
}
99+
87100
private handleOnDateRangeSelect = (value: string) => {
88101
const { onDateRangeSelect } = this.props;
89102

‎src/routes/utils/dateRange.ts

+4
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,10 @@ export const getDateRange = (dateRangeType: DateRangeType, isFormatted = true) =
7575
return dateRange;
7676
};
7777

78+
export const getCurrentDateRangeType = (timeScopeValue: number) => {
79+
return timeScopeValue === -2 ? DateRangeType.previousMonth : DateRangeType.currentMonthToDate;
80+
};
81+
7882
export const getDateRangeTypeDefault = (queryFromRoute: Query, defaultToPreviousMonth: boolean): DateRangeType => {
7983
if (queryFromRoute.dateRangeType) {
8084
return queryFromRoute.dateRangeType;

0 commit comments

Comments
 (0)