Skip to content

Commit 2dd57f7

Browse files
time range selector fix
1 parent 81bb0e6 commit 2dd57f7

File tree

6 files changed

+34
-42
lines changed

6 files changed

+34
-42
lines changed

public/app/core/components/TimePicker/TimePickerWithHistory.tsx

Lines changed: 4 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,9 @@
1-
import { isEqual, uniqBy } from 'lodash';
2-
import { CSSProperties, FC, useEffect, useRef } from 'react';
3-
// eslint-disable-next-line no-restricted-imports
4-
import { useDispatch, useSelector } from 'react-redux';
1+
import { uniqBy } from 'lodash';
2+
import { CSSProperties, FC } from 'react';
53

64
import { TimeRange, isDateTime, rangeUtil } from '@grafana/data';
75
import { TimeRangePickerProps, TimeRangePicker, useTheme2 } from '@grafana/ui';
8-
import { FnGlobalState, updateFnTimeRange } from 'app/core/reducers/fn-slice';
9-
import { StoreState } from 'app/types';
6+
import { useSelector } from 'app/types';
107

118
import { LocalStorageValueProvider } from '../LocalStorageValueProvider';
129

@@ -24,7 +21,7 @@ interface TimePickerHistoryItem {
2421
type LSTimePickerHistoryItem = TimePickerHistoryItem | TimeRange;
2522

2623
const FnText: React.FC = () => {
27-
const { FNDashboard } = useSelector<StoreState, FnGlobalState>(({ fnGlobalState }) => fnGlobalState);
24+
const { FNDashboard } = useSelector(({ fnGlobalState }) => fnGlobalState);
2825
const theme = useTheme2();
2926

3027
const FN_TEXT_STYLE: CSSProperties = { fontWeight: 700, fontSize: 14, marginLeft: 8 };
@@ -47,28 +44,9 @@ export interface PickerProps {
4744
}
4845

4946
export const Picker: FC<PickerProps> = ({ rawValues, onSaveToStore, pickerProps }) => {
50-
const { fnGlobalTimeRange } = useSelector<StoreState, FnGlobalState>(({ fnGlobalState }) => fnGlobalState);
51-
const dispatch = useDispatch();
52-
5347
const values = migrateHistory(rawValues);
5448
const history = deserializeHistory(values);
5549

56-
const didMountRef = useRef(false);
57-
useEffect(() => {
58-
/* The condition below skips the first run of useeffect that happens when this component gets mounted */
59-
if (didMountRef.current) {
60-
/* If the current timerange value has changed, update fnGlobalTimeRange */
61-
if (!isEqual(fnGlobalTimeRange?.raw, pickerProps.value.raw)) {
62-
dispatch(updateFnTimeRange(pickerProps.value));
63-
}
64-
} else if (fnGlobalTimeRange && !isEqual(fnGlobalTimeRange.raw, pickerProps.value.raw)) {
65-
/* If fnGlobalTimeRange exists in the initial render, set the time as that */
66-
pickerProps.onChange(fnGlobalTimeRange);
67-
}
68-
69-
didMountRef.current = true;
70-
}, [dispatch, fnGlobalTimeRange, pickerProps]);
71-
7250
return (
7351
<TimeRangePicker
7452
{...pickerProps}

public/app/core/reducers/fn-slice.ts

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { createSlice, PayloadAction, SliceCaseReducers, SliceSelectors } from '@reduxjs/toolkit';
22

3-
import { GrafanaThemeType, TimeRange } from '@grafana/data';
3+
import { GrafanaThemeType } from '@grafana/data';
44

55
import { AnyObject } from '../../fn-app/types';
66

@@ -64,16 +64,9 @@ export const INITIAL_FN_STATE: FnState = {
6464
export interface FnGlobalState extends FnState {
6565
FNDashboard: boolean;
6666
mode: GrafanaThemeType.Light | GrafanaThemeType.Dark;
67-
fnGlobalTimeRange: TimeRange | null;
6867
}
6968

7069
const reducers: SliceCaseReducers<FnGlobalState> = {
71-
updateFnTimeRange: (state, action: PayloadAction<TimeRange | null>) => {
72-
return {
73-
...state,
74-
fnGlobalTimeRange: action.payload,
75-
};
76-
},
7770
updatePartialFnStates: (state, action: UpdateFNGlobalStateAction) => {
7871
return {
7972
...state,
@@ -89,7 +82,6 @@ const fnSlice = createSlice<FnGlobalState, SliceCaseReducers<FnGlobalState>, str
8982
...INITIAL_FN_STATE,
9083
FNDashboard: false,
9184
mode: INITIAL_MODE,
92-
fnGlobalTimeRange: null,
9385
},
9486
reducers,
9587
});

public/app/features/dashboard/components/DashNav/DashNavTimeControls.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ export interface Props {
2020
onToolbarRefreshClick?: () => void;
2121
onToolbarZoomClick?: () => void;
2222
onToolbarTimePickerClick?: () => void;
23+
isFnDashboard?: boolean;
2324
}
2425

2526
export class DashNavTimeControls extends Component<Props> {
@@ -52,7 +53,7 @@ export class DashNavTimeControls extends Component<Props> {
5253
};
5354

5455
onChangeTimePicker = (timeRange: TimeRange) => {
55-
const { dashboard } = this.props;
56+
const { dashboard, isFnDashboard } = this.props;
5657
const panel = dashboard.timepicker;
5758
const hasDelay = panel.nowDelay && timeRange.raw.to === 'now';
5859

@@ -64,6 +65,9 @@ export class DashNavTimeControls extends Component<Props> {
6465
};
6566

6667
getTimeSrv().setTime(nextRange);
68+
if (isFnDashboard) {
69+
this.forceUpdate();
70+
}
6771
};
6872

6973
onChangeTimeZone = (timeZone: TimeZone) => {

public/app/features/dashboard/containers/DashboardPage.tsx

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -406,12 +406,22 @@ export class UnthemedDashboardPage extends PureComponent<Props, State> {
406406

407407
const FNTimeRange = !controlsContainer ? (
408408
<ToolbarButtonRow alignment="right" style={{ marginBottom: '16px' }}>
409-
<DashNavTimeControls dashboard={dashboard} onChangeTimeZone={updateTimeZoneForSession} key="time-controls" />
409+
<DashNavTimeControls
410+
dashboard={dashboard}
411+
onChangeTimeZone={updateTimeZoneForSession}
412+
key="time-controls"
413+
isFnDashboard={FNDashboard}
414+
/>
410415
</ToolbarButtonRow>
411416
) : (
412417
<Portal container={document.getElementById(controlsContainer)!}>
413418
<ToolbarButtonRow>
414-
<DashNavTimeControls dashboard={dashboard} onChangeTimeZone={updateTimeZoneForSession} key="time-controls" />
419+
<DashNavTimeControls
420+
dashboard={dashboard}
421+
onChangeTimeZone={updateTimeZoneForSession}
422+
key="time-controls"
423+
isFnDashboard={FNDashboard}
424+
/>
415425
</ToolbarButtonRow>
416426
</Portal>
417427
);

public/app/fn-app/fn-dashboard-page/render-fn-dashboard.tsx

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,17 @@ export const RenderFNDashboard: FC<FNDashboardProps> = (props) => {
5050
}, [firstError, setErrors]);
5151

5252
useEffect(() => {
53-
mfeLocationService.fnPathnameChange(window.location.pathname, queryParams);
53+
const params = new URLSearchParams(window.location.search);
54+
const queryParamsInUrl = Object.fromEntries(params.entries());
55+
mfeLocationService.fnPathnameChange(window.location.pathname, {
56+
...(queryParamsInUrl['from'] && queryParamsInUrl['to']
57+
? {
58+
from: queryParamsInUrl['from'],
59+
to: queryParamsInUrl['to'],
60+
}
61+
: {}),
62+
...queryParams,
63+
});
5464
}, [queryParams]);
5565

5666
const dashboardPageProps: DashboardPageProps = useMemo(

public/app/store/configureMfeStore.ts

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
} from '@reduxjs/toolkit';
99
import { WritableDraft } from 'immer';
1010

11-
import { GrafanaThemeType, TimeRange } from '@grafana/data';
11+
import { GrafanaThemeType } from '@grafana/data';
1212
import { FnState, INITIAL_FN_STATE, UpdateFNGlobalStateAction } from 'app/core/reducers/fn-slice';
1313
import { FnLoggerService } from 'app/fn_logger';
1414
import { StoreState } from 'app/types';
@@ -22,7 +22,6 @@ interface MfeState {
2222
dashboards: Record<string, FnState>;
2323
FNDashboard: boolean;
2424
mode: GrafanaThemeType.Light | GrafanaThemeType.Dark;
25-
fnGlobalTimeRange: TimeRange | null;
2625
}
2726

2827
function setGrafanaStore(state: WritableDraft<MfeGlobalState>, uid: string) {
@@ -92,7 +91,6 @@ const fnSlice = createSlice<MfeGlobalState, SliceCaseReducers<MfeGlobalState>, s
9291
dashboards: {},
9392
FNDashboard: false,
9493
mode: INITIAL_MODE,
95-
fnGlobalTimeRange: null,
9694
grafanaStores: {},
9795
renderingDashboardUID: '',
9896
},

0 commit comments

Comments
 (0)