Skip to content

Commit 3d0a3bd

Browse files
authored
Scheduler: fix currentView changes (T1310474) (#31391)
1 parent 4abc842 commit 3d0a3bd

File tree

8 files changed

+71
-39
lines changed

8 files changed

+71
-39
lines changed

packages/devextreme/js/__internal/scheduler/header/m_header.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import dateUtils from '@js/core/utils/date';
1010
import { extend } from '@js/core/utils/extend';
1111
import Toolbar from '@js/ui/toolbar';
1212
import Widget from '@js/ui/widget/ui.widget';
13+
import type { NormalizedView } from '@ts/scheduler/utils/options/types';
1314

1415
import type { Direction } from './constants';
1516
import SchedulerCalendar from './m_calendar';
@@ -214,7 +215,7 @@ export class SchedulerHeader extends Widget<HeaderOptions> {
214215
}
215216
}
216217

217-
_updateCurrentView(view) {
218+
_updateCurrentView(view: Required<NormalizedView>) {
218219
this.option('onCurrentViewChange')(view.name);
219220
}
220221

packages/devextreme/js/__internal/scheduler/header/m_utils.ts

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import dateUtils from '@js/core/utils/date';
33
import { isFunction, isObject } from '@js/core/utils/type';
44
import messageLocalization from '@js/localization/message';
55
import type { DateNavigatorTextInfo, Properties } from '@js/ui/scheduler';
6+
import { camelize } from '@ts/core/utils/m_inflector';
67
import type { IntervalOptions, Step } from '@ts/scheduler/header/types';
78
import type { NormalizedView, RawViewType, ViewType } from '@ts/scheduler/utils/options/types';
89

@@ -333,20 +334,18 @@ export const getViewName = (view: RawViewType): string | undefined => {
333334
return view;
334335
};
335336

336-
export const getViewText = (view: RawViewType): string => {
337-
const viewName = getViewName(view);
338-
const viewText = messageLocalization.format(`dxScheduler-switcher${viewName}`);
339-
340-
if (!viewText) {
341-
return viewName ?? '';
342-
}
343-
344-
return viewText;
345-
};
337+
export const getViewText = (
338+
view: NormalizedView,
339+
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
340+
): string => view.name || messageLocalization.format(`dxScheduler-switcher${camelize(view.type, true)}`);
346341

347342
export const formatViews = (
348343
views: NormalizedView[],
349-
): NormalizedView[] => views.map((view) => ({ ...view, text: getViewText(view) }));
344+
): NormalizedView[] => views.map((view) => ({
345+
...view,
346+
name: getViewName(view),
347+
text: getViewText(view),
348+
}));
350349

351350
export const getStep = (type: ViewType): Step => STEP_MAP[type];
352351

packages/devextreme/js/__internal/scheduler/header/m_view_switcher.integration.test.ts

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,9 @@ const SELECTORS = {
1717
invisibleState: '.dx-state-invisible',
1818
viewSwitcher: '.dx-scheduler-view-switcher',
1919
viewSwitcherButton: '.dx-scheduler-view-switcher .dx-button',
20+
viewButtonInDropdown: '.dx-scheduler-view-switcher-dropdown-button-content .dx-list-item',
2021
};
22+
const defaultViews = ['day', 'week', 'workWeek', 'month', 'timelineDay', 'timelineWeek', 'timelineWorkWeek', 'timelineMonth', 'agenda'] as const;
2123

2224
const createScheduler = (options: SchedulerProperties): Promise<{
2325
$container: dxElementWrapper; instance: Scheduler;
@@ -96,4 +98,60 @@ describe('ViewSwitcher', () => {
9698
expect(buttonText.text()).toBe('День');
9799
});
98100
});
101+
102+
it('currentView should equal type or name if it is set by config on switch, useDropDownViewSwitcher=false', async () => {
103+
const changes: string[] = [];
104+
await createScheduler({
105+
dataSource: [],
106+
views: [...defaultViews, { name: 'Week 2', type: 'week' }],
107+
currentView: 'timelineDay',
108+
width: 10_000,
109+
useDropDownViewSwitcher: false,
110+
onOptionChanged: (e) => {
111+
if (e.name === 'currentView') {
112+
const currentView = e.component.option('currentView');
113+
changes.push(currentView ?? '');
114+
}
115+
},
116+
});
117+
118+
const buttons = document.querySelectorAll(SELECTORS.viewSwitcherButton);
119+
buttons.forEach((button) => {
120+
(button as HTMLButtonElement).click();
121+
});
122+
123+
expect(changes).toEqual([
124+
...defaultViews,
125+
'Week 2',
126+
]);
127+
});
128+
129+
it('currentView should equal type or name if it is set by config on switch, useDropDownViewSwitcher=true', async () => {
130+
const changes: string[] = [];
131+
await createScheduler({
132+
dataSource: [],
133+
views: [...defaultViews, { name: 'Week 2', type: 'week' }],
134+
currentView: 'timelineDay',
135+
useDropDownViewSwitcher: true,
136+
onOptionChanged: (e) => {
137+
if (e.name === 'currentView') {
138+
const currentView = e.component.option('currentView');
139+
changes.push(currentView ?? '');
140+
}
141+
},
142+
});
143+
144+
const dropdown = document.querySelector(SELECTORS.viewSwitcherButton) as HTMLButtonElement;
145+
dropdown.click();
146+
const buttons = document.querySelectorAll(SELECTORS.viewButtonInDropdown);
147+
buttons.forEach((button) => {
148+
(button as HTMLButtonElement).click();
149+
dropdown.click();
150+
});
151+
152+
expect(changes).toEqual([
153+
...defaultViews,
154+
'Week 2',
155+
]);
156+
});
99157
});

packages/devextreme/js/__internal/scheduler/header/m_view_switcher.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ const ClASS = {
1717

1818
const getViewsAndSelectedView = (header: SchedulerHeader) => {
1919
const views = formatViews(header.option('views'));
20-
const selectedView = header.option('currentView').name;
20+
const selectedView = getViewName(header.option('currentView'));
2121
const isSelectedViewInViews = views.some((view) => view.name === selectedView);
2222

2323
return {

packages/devextreme/js/__internal/scheduler/utils/options/constants_view.ts

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,3 @@
1-
import messageLocalization from '@js/common/core/localization/message';
2-
import { camelize } from '@ts/core/utils/m_inflector';
3-
41
import type { AgendaView, View, ViewType } from './types';
52

63
export const VIEWS: Record<string, ViewType> = {
@@ -16,11 +13,9 @@ export const VIEWS: Record<string, ViewType> = {
1613
};
1714
export const VIEW_TYPES: ViewType[] = Object.values(VIEWS);
1815

19-
const getName = (type: ViewType): string => messageLocalization.format(`dxScheduler-switcher${camelize(type, true)}`);
2016
const getView = (type: ViewType, groupOrientation: View['groupOrientation']): View => ({
2117
groupOrientation,
2218
intervalCount: 1,
23-
name: getName(type),
2419
type,
2520
});
2621

@@ -38,7 +33,6 @@ export const DEFAULT_VIEW_OPTIONS: Record<Exclude<ViewType, 'agenda'>, View> & {
3833
agenda: {
3934
agendaDuration: 7,
4035
intervalCount: 1,
41-
name: getName('agenda'),
4236
type: 'agenda',
4337
},
4438
};

packages/devextreme/js/__internal/scheduler/utils/options/types.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,11 @@ export type ViewObject = Extract<RawViewType, object>;
77
export type View = ViewObject & Required<Pick<ViewObject,
88
'groupOrientation'
99
| 'intervalCount'
10-
| 'name'
1110
| 'type'
1211
>>;
1312
export type AgendaView = ViewObject & Required<Pick<ViewObject,
1413
'agendaDuration'
1514
| 'intervalCount'
16-
| 'name'
1715
| 'type'
1816
>>;
1917
export type NormalizedView = View | AgendaView;

packages/devextreme/js/__internal/scheduler/utils/options/utils.test.ts

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,6 @@ describe('views utils', () => {
3838
output: {
3939
groupOrientation: 'horizontal',
4040
intervalCount: 1,
41-
name: 'Day',
4241
type: 'day',
4342
},
4443
},
@@ -51,7 +50,6 @@ describe('views utils', () => {
5150
output: {
5251
agendaDuration: 7,
5352
intervalCount: 1,
54-
name: 'Agenda',
5553
type: 'agenda',
5654
},
5755
},
@@ -66,55 +64,46 @@ describe('views utils', () => {
6664
{
6765
groupOrientation: 'horizontal',
6866
intervalCount: 1,
69-
name: 'Day',
7067
type: 'day',
7168
},
7269
{
7370
groupOrientation: 'horizontal',
7471
intervalCount: 1,
75-
name: 'Week',
7672
type: 'week',
7773
},
7874
{
7975
groupOrientation: 'horizontal',
8076
intervalCount: 1,
81-
name: 'Work Week',
8277
type: 'workWeek',
8378
},
8479
{
8580
groupOrientation: 'horizontal',
8681
intervalCount: 1,
87-
name: 'Month',
8882
type: 'month',
8983
},
9084
{
9185
groupOrientation: 'vertical',
9286
intervalCount: 1,
93-
name: 'Timeline Day',
9487
type: 'timelineDay',
9588
},
9689
{
9790
groupOrientation: 'vertical',
9891
intervalCount: 1,
99-
name: 'Timeline Week',
10092
type: 'timelineWeek',
10193
},
10294
{
10395
groupOrientation: 'vertical',
10496
intervalCount: 1,
105-
name: 'Timeline Work Week',
10697
type: 'timelineWorkWeek',
10798
},
10899
{
109100
groupOrientation: 'vertical',
110101
intervalCount: 1,
111-
name: 'Timeline Month',
112102
type: 'timelineMonth',
113103
},
114104
{
115105
agendaDuration: 7,
116106
intervalCount: 1,
117-
name: 'Agenda',
118107
type: 'agenda',
119108
},
120109
][index],
@@ -129,7 +118,6 @@ describe('views utils', () => {
129118
expect(getCurrentView('agenda', ['agenda'])).toEqual({
130119
agendaDuration: 7,
131120
intervalCount: 1,
132-
name: 'Agenda',
133121
type: 'agenda',
134122
});
135123
});
@@ -138,7 +126,6 @@ describe('views utils', () => {
138126
expect(getCurrentView('agenda', ['month', { type: 'agenda' }])).toEqual({
139127
agendaDuration: 7,
140128
intervalCount: 1,
141-
name: 'Agenda',
142129
type: 'agenda',
143130
});
144131
});
@@ -156,7 +143,6 @@ describe('views utils', () => {
156143
expect(getCurrentView('agenda', ['month'])).toEqual({
157144
agendaDuration: 7,
158145
intervalCount: 1,
159-
name: 'Agenda',
160146
type: 'agenda',
161147
});
162148
});
@@ -165,7 +151,6 @@ describe('views utils', () => {
165151
expect(getCurrentView('agendaShort', ['month', 'agenda'])).toEqual({
166152
groupOrientation: 'horizontal',
167153
intervalCount: 1,
168-
name: 'Month',
169154
type: 'month',
170155
});
171156
});
@@ -178,7 +163,6 @@ describe('views utils', () => {
178163
} as any])).toEqual({
179164
groupOrientation: 'horizontal',
180165
intervalCount: 1,
181-
name: 'Day',
182166
type: 'day',
183167
});
184168
});

packages/devextreme/testing/tests/DevExpress.ui.widgets.scheduler/integration.base.tests.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,13 +49,11 @@ QUnit.test('Header should be initialized with correct views and currentView opti
4949
{
5050
'groupOrientation': 'horizontal',
5151
'intervalCount': 1,
52-
'name': 'Day',
5352
'type': 'day',
5453
},
5554
{
5655
'groupOrientation': 'horizontal',
5756
'intervalCount': 1,
58-
'name': 'Week',
5957
'type': 'week',
6058
}
6159
];

0 commit comments

Comments
 (0)