@gravity-ui/dashkit 6.6.1 → 6.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,7 @@
1
1
  export function prepareItem(Component: any): {
2
2
  new (props: any): {
3
3
  shouldComponentUpdate(nextProps: any): boolean;
4
- _onStateAndParamsChange: (stateAndParams: any) => void;
4
+ _onStateAndParamsChange: (stateAndParams: any, options: any) => void;
5
5
  render(): JSX.Element;
6
6
  context: unknown;
7
7
  setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
@@ -25,7 +25,7 @@ export function prepareItem(Component: any): {
25
25
  };
26
26
  new (props: any, context: any): {
27
27
  shouldComponentUpdate(nextProps: any): boolean;
28
- _onStateAndParamsChange: (stateAndParams: any) => void;
28
+ _onStateAndParamsChange: (stateAndParams: any, options: any) => void;
29
29
  render(): JSX.Element;
30
30
  context: unknown;
31
31
  setState<K extends string | number | symbol>(state: any, callback?: (() => void) | undefined): void;
@@ -6,8 +6,8 @@ export function prepareItem(Component) {
6
6
  return _a = class PrepareItem extends React.Component {
7
7
  constructor() {
8
8
  super(...arguments);
9
- this._onStateAndParamsChange = (stateAndParams) => {
10
- this.context.onItemStateAndParamsChange(this.props.id, stateAndParams);
9
+ this._onStateAndParamsChange = (stateAndParams, options) => {
10
+ this.context.onItemStateAndParamsChange(this.props.id, stateAndParams, options);
11
11
  };
12
12
  }
13
13
  shouldComponentUpdate(nextProps) {
@@ -47,13 +47,14 @@ function useMemoStateContext(props) {
47
47
  itemsStateAndParams: props.itemsStateAndParams,
48
48
  }));
49
49
  }, [props.config, props.itemsStateAndParams, onChange]);
50
- const onItemStateAndParamsChange = React.useCallback((id, stateAndParams) => {
50
+ const onItemStateAndParamsChange = React.useCallback((id, stateAndParams, options) => {
51
51
  onChange({
52
52
  itemsStateAndParams: UpdateManager.changeStateAndParams({
53
53
  id,
54
54
  config: props.config,
55
55
  stateAndParams,
56
56
  itemsStateAndParams: props.itemsStateAndParams,
57
+ options,
57
58
  }),
58
59
  });
59
60
  }, [props.config, props.itemsStateAndParams, onChange]);
@@ -18,5 +18,8 @@ export type ItemStateAndParams = {
18
18
  params?: StringParams;
19
19
  state?: ItemState;
20
20
  };
21
+ export type ItemStateAndParamsChangeOptions = {
22
+ action: 'setParams' | 'removeItem';
23
+ };
21
24
  export type ItemsStateAndParamsBase = Record<string, ItemStateAndParams>;
22
25
  export type ItemsStateAndParams = ItemsStateAndParamsBase | StateAndParamsMeta;
@@ -1,13 +1,13 @@
1
1
  import React from 'react';
2
2
  import { ContextProps, SettingsProps, WidgetLayout } from './common';
3
- import { StringParams, ConfigItem, ItemState, ItemStateAndParams, PluginBase } from '../shared';
3
+ import { StringParams, ConfigItem, ItemState, ItemStateAndParams, PluginBase, ItemStateAndParamsChangeOptions } from '../shared';
4
4
  import type { ReactGridLayoutProps } from 'react-grid-layout';
5
5
  export interface PluginWidgetProps {
6
6
  id: string;
7
7
  editMode: boolean;
8
8
  params: StringParams;
9
9
  state: ItemState;
10
- onStateAndParamsChange: (stateAndParams: ItemStateAndParams) => void;
10
+ onStateAndParamsChange: (stateAndParams: ItemStateAndParams, options?: ItemStateAndParamsChangeOptions) => void;
11
11
  width: number;
12
12
  height: number;
13
13
  data: ConfigItem['data'];
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,474 @@
1
+ import { UpdateManager } from '../update-manager';
2
+ const config = {
3
+ salt: '0.09852189776033704',
4
+ counter: 14,
5
+ items: [
6
+ {
7
+ id: 'al',
8
+ data: {
9
+ tabs: [
10
+ {
11
+ id: 'Jn',
12
+ title: 'tab 1',
13
+ params: {
14
+ Country: 'Germany',
15
+ },
16
+ chartId: 'h8hfbffyo3dg8',
17
+ isDefault: true,
18
+ autoHeight: false,
19
+ },
20
+ {
21
+ id: 'Pf',
22
+ title: 'tab 2',
23
+ params: {},
24
+ chartId: 'f5hfbl3yo3dh7',
25
+ isDefault: false,
26
+ autoHeight: false,
27
+ },
28
+ ],
29
+ hideTitle: true,
30
+ },
31
+ type: 'widget',
32
+ namespace: 'default',
33
+ },
34
+ {
35
+ id: 'Q8',
36
+ data: {
37
+ tabs: [
38
+ {
39
+ id: 'K0',
40
+ title: 'filtering_charts_table (charteditor)',
41
+ params: {
42
+ Year: '',
43
+ Country: '',
44
+ _ap_Country: 'Belgium',
45
+ },
46
+ chartId: '245z37u4ylvet',
47
+ isDefault: true,
48
+ autoHeight: false,
49
+ },
50
+ ],
51
+ hideTitle: false,
52
+ },
53
+ type: 'widget',
54
+ namespace: 'default',
55
+ },
56
+ {
57
+ id: 'L5',
58
+ data: {
59
+ title: 'Country',
60
+ source: {
61
+ datasetId: 'gyrnhj945gum9',
62
+ fieldType: 'string',
63
+ showTitle: true,
64
+ innerTitle: 'Inner title',
65
+ elementType: 'select',
66
+ datasetFieldId: 'd079',
67
+ showInnerTitle: false,
68
+ datasetFieldType: 'DIMENSION',
69
+ },
70
+ sourceType: 'dataset',
71
+ },
72
+ type: 'control',
73
+ defaults: {
74
+ d079: ['Italy', 'France'],
75
+ },
76
+ namespace: 'default',
77
+ },
78
+ {
79
+ id: 'C8',
80
+ data: {
81
+ title: 'Client',
82
+ source: {
83
+ datasetId: 'rfvnhj345gugf',
84
+ fieldType: 'string',
85
+ showTitle: true,
86
+ innerTitle: 'Inner title',
87
+ elementType: 'select',
88
+ datasetFieldId: 'g129',
89
+ showInnerTitle: false,
90
+ datasetFieldType: 'DIMENSION',
91
+ },
92
+ sourceType: 'dataset',
93
+ },
94
+ type: 'control',
95
+ defaults: {
96
+ g129: ['Alex'],
97
+ },
98
+ namespace: 'default',
99
+ },
100
+ {
101
+ id: 'lko',
102
+ data: {
103
+ title: 'External control',
104
+ source: {
105
+ chartId: 'deuaclrdakbc4',
106
+ },
107
+ autoHeight: true,
108
+ sourceType: 'external',
109
+ },
110
+ type: 'control',
111
+ defaults: {
112
+ Name: '',
113
+ Brand: '',
114
+ Label: '',
115
+ },
116
+ namespace: 'default',
117
+ },
118
+ ],
119
+ layout: [
120
+ { h: 4, i: 'al', w: 4, x: 8, y: 0 },
121
+ { h: 16, i: 'Q8', w: 12, x: 12, y: 0 },
122
+ { h: 2, i: 'L5', w: 8, x: 0, y: 2 },
123
+ { h: 2, i: 'C8', w: 8, x: 10, y: 30 },
124
+ { h: 2, i: 'lko', w: 8, x: 0, y: 12 },
125
+ ],
126
+ aliases: {},
127
+ connections: [],
128
+ };
129
+ beforeEach(() => {
130
+ jest.spyOn(console, 'warn').mockImplementation(jest.fn());
131
+ });
132
+ describe('UpdateManager', () => {
133
+ describe('changeStateAndParams', () => {
134
+ it('control adds params to empty itemsStateAndParams', () => {
135
+ expect(UpdateManager.changeStateAndParams({
136
+ id: 'L5',
137
+ config,
138
+ itemsStateAndParams: {},
139
+ stateAndParams: {
140
+ params: {
141
+ d079: ['Russia'],
142
+ },
143
+ },
144
+ })).toEqual({
145
+ L5: {
146
+ params: {
147
+ d079: ['Russia'],
148
+ },
149
+ },
150
+ __meta__: { queue: [{ id: 'L5' }], version: 2 },
151
+ });
152
+ });
153
+ it('state changes only do not push into the queue', () => {
154
+ expect(UpdateManager.changeStateAndParams({
155
+ id: 'al',
156
+ config,
157
+ itemsStateAndParams: {
158
+ L5: {
159
+ params: {
160
+ d079: ['Russia'],
161
+ },
162
+ },
163
+ __meta__: { queue: [{ id: 'L5' }, { id: 'Unk' }], version: 2 },
164
+ },
165
+ stateAndParams: {
166
+ state: { tabId: 'Pf' },
167
+ },
168
+ })).toEqual({
169
+ L5: {
170
+ params: {
171
+ d079: ['Russia'],
172
+ },
173
+ },
174
+ al: {
175
+ state: {
176
+ tabId: 'Pf',
177
+ },
178
+ },
179
+ __meta__: { queue: [{ id: 'L5' }], version: 2 },
180
+ });
181
+ });
182
+ it('tab changes clear previous tab params', () => {
183
+ expect(UpdateManager.changeStateAndParams({
184
+ id: 'al',
185
+ config,
186
+ itemsStateAndParams: {
187
+ al: {
188
+ state: {
189
+ tabId: 'Jn',
190
+ },
191
+ params: {
192
+ Country: 'USA',
193
+ },
194
+ },
195
+ __meta__: { queue: [{ id: 'al', tabId: 'Jn' }], version: 2 },
196
+ },
197
+ stateAndParams: {
198
+ state: { tabId: 'Pf' },
199
+ },
200
+ })).toEqual({
201
+ al: {
202
+ state: {
203
+ tabId: 'Pf',
204
+ },
205
+ },
206
+ __meta__: { queue: [], version: 2 },
207
+ });
208
+ });
209
+ it('control changes rearrange position in the queue', () => {
210
+ expect(UpdateManager.changeStateAndParams({
211
+ id: 'L5',
212
+ config,
213
+ itemsStateAndParams: {
214
+ al: {
215
+ state: {
216
+ tabId: 'Jn',
217
+ },
218
+ params: {
219
+ Country: 'USA',
220
+ },
221
+ },
222
+ L5: {
223
+ params: {
224
+ d079: ['Russia'],
225
+ },
226
+ },
227
+ C8: {
228
+ params: {
229
+ g129: ['Anton'],
230
+ },
231
+ },
232
+ __meta__: {
233
+ queue: [{ id: 'L5' }, { id: 'C8' }, { id: 'al', tabId: 'Jn' }, { id: 'Unk' }],
234
+ version: 2,
235
+ },
236
+ },
237
+ stateAndParams: {
238
+ params: {
239
+ d079: ['Oman'],
240
+ },
241
+ },
242
+ })).toEqual({
243
+ al: {
244
+ state: {
245
+ tabId: 'Jn',
246
+ },
247
+ params: {
248
+ Country: 'USA',
249
+ },
250
+ },
251
+ L5: {
252
+ params: {
253
+ d079: ['Oman'],
254
+ },
255
+ },
256
+ C8: {
257
+ params: {
258
+ g129: ['Anton'],
259
+ },
260
+ },
261
+ __meta__: {
262
+ queue: [{ id: 'C8' }, { id: 'al', tabId: 'Jn' }, { id: 'L5' }],
263
+ version: 2,
264
+ },
265
+ });
266
+ });
267
+ it('control params should merge', () => {
268
+ expect(UpdateManager.changeStateAndParams({
269
+ id: 'lko',
270
+ config,
271
+ itemsStateAndParams: {
272
+ L5: {
273
+ params: {
274
+ d079: ['Russia'],
275
+ },
276
+ },
277
+ lko: {
278
+ params: {
279
+ Brand: ['Nuke'],
280
+ Label: ['pin'],
281
+ },
282
+ },
283
+ __meta__: {
284
+ queue: [{ id: 'lko' }, { id: 'L5' }],
285
+ version: 2,
286
+ },
287
+ },
288
+ stateAndParams: {
289
+ params: {
290
+ Name: ['Jack'],
291
+ Label: ['clone'],
292
+ },
293
+ },
294
+ })).toEqual({
295
+ L5: {
296
+ params: {
297
+ d079: ['Russia'],
298
+ },
299
+ },
300
+ lko: {
301
+ params: {
302
+ Brand: ['Nuke'],
303
+ Name: ['Jack'],
304
+ Label: ['clone'],
305
+ },
306
+ },
307
+ __meta__: { queue: [{ id: 'L5' }, { id: 'lko' }], version: 2 },
308
+ });
309
+ });
310
+ it('control cannot set params not from defaults', () => {
311
+ expect(UpdateManager.changeStateAndParams({
312
+ id: 'lko',
313
+ config,
314
+ itemsStateAndParams: {},
315
+ stateAndParams: {
316
+ params: {
317
+ Brand: ['Nuke'],
318
+ UnknownParam: ['Value'],
319
+ },
320
+ },
321
+ })).toEqual({
322
+ lko: {
323
+ params: {
324
+ Brand: ['Nuke'],
325
+ },
326
+ },
327
+ __meta__: { queue: [{ id: 'lko' }], version: 2 },
328
+ });
329
+ });
330
+ it('filtering_charts_table can set action params not from defaults', () => {
331
+ expect(UpdateManager.changeStateAndParams({
332
+ id: 'Q8',
333
+ config,
334
+ itemsStateAndParams: {},
335
+ stateAndParams: {
336
+ params: {
337
+ _ap_Country: 'Germany',
338
+ _ap_Brand: 'Pule',
339
+ _ap_Year: '2020',
340
+ },
341
+ state: {
342
+ tabId: 'K0',
343
+ },
344
+ },
345
+ })).toEqual({
346
+ Q8: {
347
+ state: {
348
+ tabId: 'K0',
349
+ },
350
+ params: {
351
+ _ap_Country: 'Germany',
352
+ _ap_Brand: 'Pule',
353
+ _ap_Year: '2020',
354
+ },
355
+ },
356
+ __meta__: { queue: [{ id: 'Q8', tabId: 'K0' }], version: 2 },
357
+ });
358
+ });
359
+ it('the item is correctly removed from the queue', () => {
360
+ expect(UpdateManager.changeStateAndParams({
361
+ id: 'Q8',
362
+ config,
363
+ itemsStateAndParams: {
364
+ L5: {
365
+ params: {
366
+ d079: ['Russia'],
367
+ },
368
+ },
369
+ Q8: {
370
+ state: {
371
+ tabId: 'K0',
372
+ },
373
+ params: {
374
+ _ap_Country: 'Germany',
375
+ _ap_Year: '2020',
376
+ },
377
+ },
378
+ Unk: {
379
+ params: {
380
+ Country: 'Unknown',
381
+ },
382
+ },
383
+ __meta__: {
384
+ queue: [{ id: 'Q8', tabId: 'K0' }, { id: 'Unk' }, { id: 'L5' }],
385
+ version: 2,
386
+ },
387
+ },
388
+ stateAndParams: {},
389
+ options: { action: 'removeItem' },
390
+ })).toEqual({
391
+ L5: {
392
+ params: {
393
+ d079: ['Russia'],
394
+ },
395
+ },
396
+ __meta__: { queue: [{ id: 'L5' }], version: 2 },
397
+ });
398
+ expect(UpdateManager.changeStateAndParams({
399
+ id: 'Q8',
400
+ config,
401
+ itemsStateAndParams: {
402
+ L5: {
403
+ params: {
404
+ d079: ['Russia'],
405
+ },
406
+ },
407
+ __meta__: {
408
+ queue: [{ id: 'L5' }],
409
+ version: 2,
410
+ },
411
+ },
412
+ stateAndParams: {},
413
+ options: { action: 'removeItem' },
414
+ })).toEqual({
415
+ L5: {
416
+ params: {
417
+ d079: ['Russia'],
418
+ },
419
+ },
420
+ __meta__: { queue: [{ id: 'L5' }], version: 2 },
421
+ });
422
+ });
423
+ it('the item is correctly setParams using additional options', () => {
424
+ expect(UpdateManager.changeStateAndParams({
425
+ id: 'Q8',
426
+ config,
427
+ itemsStateAndParams: {
428
+ L5: {
429
+ params: {
430
+ d079: ['Russia'],
431
+ },
432
+ },
433
+ Q8: {
434
+ state: {
435
+ tabId: 'K0',
436
+ },
437
+ params: {
438
+ _ap_Country: 'Germany',
439
+ _ap_Year: '2020',
440
+ },
441
+ },
442
+ __meta__: {
443
+ queue: [{ id: 'Q8', tabId: 'K0' }, { id: 'L5' }],
444
+ version: 2,
445
+ },
446
+ },
447
+ stateAndParams: {
448
+ state: {
449
+ tabId: 'K0',
450
+ },
451
+ params: {
452
+ _ap_Country: 'Russia',
453
+ },
454
+ },
455
+ options: { action: 'setParams' },
456
+ })).toEqual({
457
+ L5: {
458
+ params: {
459
+ d079: ['Russia'],
460
+ },
461
+ },
462
+ Q8: {
463
+ state: {
464
+ tabId: 'K0',
465
+ },
466
+ params: {
467
+ _ap_Country: 'Russia',
468
+ },
469
+ },
470
+ __meta__: { queue: [{ id: 'L5' }, { id: 'Q8', tabId: 'K0' }], version: 2 },
471
+ });
472
+ });
473
+ });
474
+ });
@@ -1,4 +1,4 @@
1
- import { Config, ConfigItem, ItemsStateAndParams, ItemStateAndParams } from '../shared';
1
+ import { Config, ConfigItem, ItemsStateAndParams, ItemStateAndParams, ItemStateAndParamsChangeOptions } from '../shared';
2
2
  import { AddConfigItem, WidgetLayout, SetItemOptions } from '../typings';
3
3
  import { RegisterManagerPluginLayout } from './register-manager';
4
4
  interface RemoveItemArg {
@@ -11,6 +11,7 @@ interface ChangeStateAndParamsArg {
11
11
  config: Config;
12
12
  itemsStateAndParams: ItemsStateAndParams;
13
13
  stateAndParams: ItemStateAndParams;
14
+ options?: ItemStateAndParamsChangeOptions;
14
15
  }
15
16
  export declare class UpdateManager {
16
17
  static addItem({ item, namespace, layout, config, options, }: {
@@ -34,6 +35,6 @@ export declare class UpdateManager {
34
35
  layout: WidgetLayout[];
35
36
  config: Config;
36
37
  }): Config;
37
- static changeStateAndParams({ id: initiatorId, config, stateAndParams, itemsStateAndParams, }: ChangeStateAndParamsArg): ItemsStateAndParams;
38
+ static changeStateAndParams({ id: initiatorId, config, stateAndParams, itemsStateAndParams, options, }: ChangeStateAndParamsArg): ItemsStateAndParams;
38
39
  }
39
40
  export {};
@@ -65,9 +65,13 @@ function getAllowableChangedParams(item, stateAndParams, itemsStateAndParams, pa
65
65
  const paramsTypeName = (paramsSettings === null || paramsSettings === void 0 ? void 0 : paramsSettings.type) || 'params';
66
66
  const isActionParamsMode = paramsTypeName === 'actionParams';
67
67
  let allowedParams = {};
68
- const stateParamsConf = isActionParamsMode
69
- ? pickActionParamsFromParams(stateAndParams.params, false)
70
- : stateAndParams.params;
68
+ if (isActionParamsMode) {
69
+ allowedParams = pickActionParamsFromParams(stateAndParams.params, false);
70
+ return (paramsSettings === null || paramsSettings === void 0 ? void 0 : paramsSettings.returnPrefix)
71
+ ? transformParamsToActionParams(allowedParams)
72
+ : allowedParams;
73
+ }
74
+ const stateParamsConf = stateAndParams.params;
71
75
  if (isItemWithTabs(item)) {
72
76
  let tab;
73
77
  if ('state' in stateAndParams && ((_a = stateAndParams.state) === null || _a === void 0 ? void 0 : _a.tabId)) {
@@ -85,11 +89,6 @@ function getAllowableChangedParams(item, stateAndParams, itemsStateAndParams, pa
85
89
  if (Object.keys(allowedParams || {}).length !== Object.keys(stateParamsConf || {}).length) {
86
90
  console.warn('Параметры, которых нет в defaults, будут проигнорированы!');
87
91
  }
88
- if (isActionParamsMode) {
89
- return (paramsSettings === null || paramsSettings === void 0 ? void 0 : paramsSettings.returnPrefix)
90
- ? transformParamsToActionParams(allowedParams)
91
- : allowedParams;
92
- }
93
92
  return allowedParams;
94
93
  }
95
94
  function changeStateAndParamsVersion1({ id: initiatorId, config, stateAndParams, itemsStateAndParams, }) {
@@ -229,7 +228,7 @@ export class UpdateManager {
229
228
  },
230
229
  });
231
230
  }
232
- static changeStateAndParams({ id: initiatorId, config, stateAndParams, itemsStateAndParams, }) {
231
+ static changeStateAndParams({ id: initiatorId, config, stateAndParams, itemsStateAndParams, options, }) {
233
232
  var _a, _b;
234
233
  if (getCurrentVersion(itemsStateAndParams) === 1) {
235
234
  return changeStateAndParamsVersion1({
@@ -239,6 +238,7 @@ export class UpdateManager {
239
238
  itemsStateAndParams,
240
239
  });
241
240
  }
241
+ const action = options === null || options === void 0 ? void 0 : options.action;
242
242
  const hasState = 'state' in stateAndParams;
243
243
  const { items } = config;
244
244
  const itemsIds = items.map(({ id: itemId }) => itemId);
@@ -248,6 +248,20 @@ export class UpdateManager {
248
248
  const newTabId = (_a = stateAndParams.state) === null || _a === void 0 ? void 0 : _a.tabId;
249
249
  const isTabSwitched = isItemWithTabs(initiatorItem) && Boolean(newTabId);
250
250
  const currentMeta = getItemsStateAndParamsMeta(itemsStateAndParams);
251
+ if (action === 'removeItem') {
252
+ return update(itemsStateAndParams, {
253
+ $unset: [...unusedIds, initiatorId],
254
+ [META_KEY]: {
255
+ $set: currentMeta
256
+ ? deleteFromQueue({
257
+ id: initiatorId,
258
+ itemsStateAndParams,
259
+ config,
260
+ })
261
+ : getInitialItemsStateAndParamsMeta(),
262
+ },
263
+ });
264
+ }
251
265
  if ('params' in stateAndParams) {
252
266
  const allowableParams = getAllowableChangedParams(initiatorItem, stateAndParams, itemsStateAndParams);
253
267
  const allowableActionParams = getAllowableChangedParams(initiatorItem, stateAndParams, itemsStateAndParams, { type: 'actionParams', returnPrefix: true });
@@ -258,7 +272,7 @@ export class UpdateManager {
258
272
  let commandUpdateParams = ((_b = itemsStateAndParams[initiatorId]) === null || _b === void 0 ? void 0 : _b.params)
259
273
  ? '$merge'
260
274
  : '$set';
261
- if (isTabSwitched) {
275
+ if (isTabSwitched || action === 'setParams') {
262
276
  commandUpdateParams = '$set';
263
277
  }
264
278
  const obj = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/dashkit",
3
- "version": "6.6.1",
3
+ "version": "6.7.0",
4
4
  "description": "Library for rendering dashboard grid layout",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -1,8 +0,0 @@
1
- "use strict";
2
- describe('test: mock', () => {
3
- describe('mock', () => {
4
- test('adds 1 + 2 to equal 3', () => {
5
- expect(1 + 2).toBe(3);
6
- });
7
- });
8
- });
@@ -1,8 +0,0 @@
1
- "use strict";
2
- describe('test: mock', () => {
3
- describe('mock', () => {
4
- test('adds 1 + 2 to equal 3', () => {
5
- expect(1 + 2).toBe(3);
6
- });
7
- });
8
- });