orc-shared 5.10.1-dev.6 → 5.10.1-dev.8

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.
Files changed (42) hide show
  1. package/dist/components/AppFrame/MenuItem.js +3 -12
  2. package/dist/components/MaterialUI/DataDisplay/Table.js +2 -1
  3. package/dist/components/MaterialUI/DataDisplay/TableProps.js +3 -1
  4. package/dist/components/MaterialUI/Surfaces/SectionExpansionPanel.js +3 -2
  5. package/dist/components/ToastList.js +95 -64
  6. package/dist/getTheme.js +0 -5
  7. package/dist/utils/toastHelper.js +52 -0
  8. package/package.json +1 -1
  9. package/src/components/AppFrame/MenuItem.js +1 -9
  10. package/src/components/MaterialUI/DataDisplay/Table.js +6 -1
  11. package/src/components/MaterialUI/DataDisplay/Table.test.js +20 -0
  12. package/src/components/MaterialUI/DataDisplay/TableProps.js +2 -0
  13. package/src/components/MaterialUI/DataDisplay/TableProps.test.js +20 -2
  14. package/src/components/MaterialUI/Surfaces/SectionExpansionPanel.js +2 -1
  15. package/src/components/ToastList.js +79 -90
  16. package/src/components/ToastList.test.js +29 -103
  17. package/src/getTheme.js +0 -5
  18. package/src/utils/toastHelper.js +8 -0
  19. package/src/utils/toastHelper.test.js +41 -0
  20. package/dist/components/CategoryList.js +0 -197
  21. package/dist/components/List/DataCell.js +0 -129
  22. package/dist/components/List/HeadCell.js +0 -125
  23. package/dist/components/List/HeadRow.js +0 -73
  24. package/dist/components/List/List.js +0 -274
  25. package/dist/components/List/Row.js +0 -109
  26. package/dist/components/List/enhanceColumnDefs.js +0 -111
  27. package/dist/components/List/index.js +0 -59
  28. package/src/components/CategoryList.js +0 -140
  29. package/src/components/CategoryList.test.js +0 -667
  30. package/src/components/List/DataCell.js +0 -77
  31. package/src/components/List/DataCell.test.js +0 -357
  32. package/src/components/List/HeadCell.js +0 -105
  33. package/src/components/List/HeadCell.test.js +0 -331
  34. package/src/components/List/HeadRow.js +0 -21
  35. package/src/components/List/HeadRow.test.js +0 -27
  36. package/src/components/List/List.js +0 -162
  37. package/src/components/List/List.test.js +0 -705
  38. package/src/components/List/Row.js +0 -72
  39. package/src/components/List/Row.test.js +0 -194
  40. package/src/components/List/enhanceColumnDefs.js +0 -54
  41. package/src/components/List/enhanceColumnDefs.test.js +0 -179
  42. package/src/components/List/index.js +0 -6
package/src/components/CategoryList.test.js DELETED
@@ -1,667 +0,0 @@
1
- import React from "react";
2
- import { Provider } from "react-redux";
3
- import sinon from "sinon";
4
- import { Ignore } from "unexpected-reaction";
5
- import { CategoryList, CategoryRow, CategoryHeader, CategoryIndicator } from "./CategoryList";
6
- import { Wrapper as Checkbox, Cover } from "./Checkbox";
7
- import { Table, Placeholder } from "./List/List";
8
- import { TableRow } from "./List/Row";
9
- import { TableData } from "./List/DataCell";
10
- import { HeadTableRow } from "./List/HeadRow";
11
- import { HeadBox, TableHeader } from "./List/HeadCell";
12
-
13
- describe("CategoryList", () => {
14
- let store, viewState;
15
- beforeEach(() => {
16
- store = {
17
- subscribe: () => {},
18
- dispatch: sinon.spy().named("dispatch"),
19
- getState: () => ({ getIn: () => viewState }),
20
- };
21
- });
22
-
23
- it("renders nothing if no columnDefs", () =>
24
- expect(
25
- <div>
26
- <Provider store={store}>
27
- <CategoryList rows={[{ id: "foo" }]} />
28
- </Provider>
29
- </div>,
30
- "when mounted",
31
- "to satisfy",
32
- <div />,
33
- ));
34
-
35
- it("renders a table", () =>
36
- expect(
37
- <Provider store={store}>
38
- <CategoryList columnDefs={[{ fieldName: "a" }]} />
39
- </Provider>,
40
- "when mounted",
41
- "to satisfy",
42
- <Table>
43
- <thead>
44
- <tr>
45
- <th>
46
- <Ignore />
47
- </th>
48
- </tr>
49
- </thead>
50
- <tbody></tbody>
51
- </Table>,
52
- ));
53
-
54
- it("renders just a header", () =>
55
- expect(
56
- <Provider store={store}>
57
- <CategoryList columnDefs={[{ fieldName: "a" }, { fieldName: "b" }, { fieldName: "c" }]} />
58
- </Provider>,
59
- "when mounted",
60
- "to satisfy",
61
- <table>
62
- <thead>
63
- <tr>
64
- <th>
65
- <Ignore />
66
- </th>
67
- <th>
68
- <Ignore />
69
- </th>
70
- <th>
71
- <Ignore />
72
- </th>
73
- </tr>
74
- </thead>
75
- <tbody />
76
- </table>,
77
- ));
78
-
79
- it("renders a placeholder if one given and no rows", () =>
80
- expect(
81
- <Provider store={store}>
82
- <CategoryList
83
- height={121}
84
- columnDefs={[{ fieldName: "a" }, { fieldName: "b" }, { fieldName: "c" }]}
85
- placeholder={<div />}
86
- />
87
- </Provider>,
88
- "when mounted",
89
- "to satisfy",
90
- <table>
91
- <thead>
92
- <tr>
93
- <th>
94
- <Ignore />
95
- </th>
96
- <th>
97
- <Ignore />
98
- </th>
99
- <th>
100
- <Ignore />
101
- </th>
102
- </tr>
103
- </thead>
104
- <tbody>
105
- <Placeholder width={3} height={80}>
106
- <div />
107
- </Placeholder>
108
- </tbody>
109
- </table>,
110
- ));
111
-
112
- it("renders a category row and a row for each row data object", () => {
113
- const rows = [{ key: "a" }, { key: "b" }, { key: "c" }];
114
- const columnDefs = [{ fieldName: "key" }];
115
- return expect(
116
- <Provider store={store}>
117
- <CategoryList columnDefs={columnDefs} rows={rows} keyField={["key"]} />
118
- </Provider>,
119
- "when mounted",
120
- "to satisfy",
121
- <table>
122
- <thead>
123
- <tr>
124
- <th>
125
- <Ignore />
126
- </th>
127
- </tr>
128
- </thead>
129
- <tbody>
130
- <CategoryRow>
131
- <td>
132
- <Ignore />
133
- <Ignore />
134
- </td>
135
- </CategoryRow>
136
- <TableRow>
137
- <TableData>a</TableData>
138
- </TableRow>
139
- <TableRow>
140
- <TableData>b</TableData>
141
- </TableRow>
142
- <TableRow>
143
- <TableData>c</TableData>
144
- </TableRow>
145
- </tbody>
146
- </table>,
147
- );
148
- });
149
-
150
- it("renders rows with onClick handlers", () => {
151
- const rows = [{ key: "a" }, { key: "b" }, { key: "c" }];
152
- const columnDefs = [{ fieldName: "key" }];
153
- return expect(
154
- <Provider store={store}>
155
- <CategoryList columnDefs={columnDefs} rows={rows} keyField={["key"]} rowOnClick={() => {}} />
156
- </Provider>,
157
- "when mounted",
158
- "to satisfy",
159
- <table>
160
- <thead>
161
- <tr>
162
- <th>
163
- <Ignore />
164
- </th>
165
- </tr>
166
- </thead>
167
- <tbody>
168
- <CategoryRow>
169
- <td>
170
- <Ignore />
171
- <Ignore />
172
- </td>
173
- </CategoryRow>
174
- <TableRow onClick={() => {}}>
175
- <TableData>a</TableData>
176
- </TableRow>
177
- <TableRow onClick={() => {}}>
178
- <TableData>b</TableData>
179
- </TableRow>
180
- <TableRow onClick={() => {}}>
181
- <TableData>c</TableData>
182
- </TableRow>
183
- </tbody>
184
- </table>,
185
- );
186
- });
187
-
188
- it("renders a category header for each found category", () => {
189
- const rows = [
190
- { key: "a", category: "Stuff" },
191
- { key: "b", category: "Things" },
192
- { key: "c", category: "Stuff" },
193
- { key: "d", category: "Things" },
194
- { key: "e", category: "Things" },
195
- { key: "f", category: "Stuff" },
196
- ];
197
- const columnDefs = [{ fieldName: "key" }, { fieldName: "category" }];
198
- return expect(
199
- <Provider store={store}>
200
- <CategoryList columnDefs={columnDefs} rows={rows} keyField={["key"]} />
201
- </Provider>,
202
- "when mounted",
203
- "to satisfy",
204
- <table>
205
- <thead>
206
- <tr>
207
- <th>
208
- <Ignore />
209
- </th>
210
- <th>
211
- <Ignore />
212
- </th>
213
- </tr>
214
- </thead>
215
- <tbody>
216
- <CategoryRow>
217
- <CategoryHeader colSpan={2}>
218
- <CategoryIndicator />
219
- Stuff
220
- </CategoryHeader>
221
- </CategoryRow>
222
- <TableRow>
223
- <TableData>a</TableData>
224
- <TableData>Stuff</TableData>
225
- </TableRow>
226
- <TableRow>
227
- <TableData>c</TableData>
228
- <TableData>Stuff</TableData>
229
- </TableRow>
230
- <TableRow>
231
- <TableData>f</TableData>
232
- <TableData>Stuff</TableData>
233
- </TableRow>
234
- <CategoryRow>
235
- <CategoryHeader colSpan={2}>
236
- <CategoryIndicator />
237
- Things
238
- </CategoryHeader>
239
- </CategoryRow>
240
- <TableRow>
241
- <TableData>b</TableData>
242
- <TableData>Things</TableData>
243
- </TableRow>
244
- <TableRow>
245
- <TableData>d</TableData>
246
- <TableData>Things</TableData>
247
- </TableRow>
248
- <TableRow>
249
- <TableData>e</TableData>
250
- <TableData>Things</TableData>
251
- </TableRow>
252
- </tbody>
253
- </table>,
254
- );
255
- });
256
-
257
- it("renders a closed category", () => {
258
- const rows = [
259
- { key: "a", category: "Stuff" },
260
- { key: "b", category: "Things" },
261
- { key: "c", category: "Stuff" },
262
- { key: "d", category: "Things" },
263
- { key: "e", category: "Things" },
264
- { key: "f", category: "Stuff" },
265
- ];
266
- const columnDefs = [{ fieldName: "key" }, { fieldName: "category" }];
267
- viewState = { closedCategories: ["Stuff"] };
268
- return expect(
269
- <Provider store={store}>
270
- <CategoryList columnDefs={columnDefs} rows={rows} keyField={["key"]} />
271
- </Provider>,
272
- "when mounted",
273
- "to satisfy",
274
- <table>
275
- <thead>
276
- <tr>
277
- <th>
278
- <Ignore />
279
- </th>
280
- <th>
281
- <Ignore />
282
- </th>
283
- </tr>
284
- </thead>
285
- <tbody>
286
- <CategoryRow>
287
- <CategoryHeader colSpan={2} closed>
288
- <CategoryIndicator closed />
289
- Stuff
290
- </CategoryHeader>
291
- </CategoryRow>
292
- <CategoryRow>
293
- <CategoryHeader colSpan={2}>
294
- <CategoryIndicator />
295
- Things
296
- </CategoryHeader>
297
- </CategoryRow>
298
- <TableRow>
299
- <TableData>b</TableData>
300
- <TableData>Things</TableData>
301
- </TableRow>
302
- <TableRow>
303
- <TableData>d</TableData>
304
- <TableData>Things</TableData>
305
- </TableRow>
306
- <TableRow>
307
- <TableData>e</TableData>
308
- <TableData>Things</TableData>
309
- </TableRow>
310
- </tbody>
311
- </table>,
312
- );
313
- });
314
-
315
- it("renders a closed category open when flagged to open all", () => {
316
- const rows = [
317
- { key: "a", category: "Stuff" },
318
- { key: "b", category: "Things" },
319
- { key: "c", category: "Stuff" },
320
- { key: "d", category: "Things" },
321
- { key: "e", category: "Things" },
322
- { key: "f", category: "Stuff" },
323
- ];
324
- const columnDefs = [{ fieldName: "key" }, { fieldName: "category" }];
325
- viewState = { closedCategories: ["Stuff"] };
326
- return expect(
327
- <Provider store={store}>
328
- <CategoryList columnDefs={columnDefs} rows={rows} keyField={["key"]} openAll />
329
- </Provider>,
330
- "when mounted",
331
- "to satisfy",
332
- <table>
333
- <thead>
334
- <tr>
335
- <th>
336
- <Ignore />
337
- </th>
338
- <th>
339
- <Ignore />
340
- </th>
341
- </tr>
342
- </thead>
343
- <tbody>
344
- <CategoryRow>
345
- <CategoryHeader colSpan={2}>
346
- <CategoryIndicator />
347
- Stuff
348
- </CategoryHeader>
349
- </CategoryRow>
350
- <TableRow>
351
- <TableData>a</TableData>
352
- <TableData>Stuff</TableData>
353
- </TableRow>
354
- <TableRow>
355
- <TableData>c</TableData>
356
- <TableData>Stuff</TableData>
357
- </TableRow>
358
- <TableRow>
359
- <TableData>f</TableData>
360
- <TableData>Stuff</TableData>
361
- </TableRow>
362
- <CategoryRow>
363
- <CategoryHeader colSpan={2}>
364
- <CategoryIndicator />
365
- Things
366
- </CategoryHeader>
367
- </CategoryRow>
368
- <TableRow>
369
- <TableData>b</TableData>
370
- <TableData>Things</TableData>
371
- </TableRow>
372
- <TableRow>
373
- <TableData>d</TableData>
374
- <TableData>Things</TableData>
375
- </TableRow>
376
- <TableRow>
377
- <TableData>e</TableData>
378
- <TableData>Things</TableData>
379
- </TableRow>
380
- </tbody>
381
- </table>,
382
- );
383
- });
384
-
385
- it("toggles a category closed", () => {
386
- const rows = [
387
- { key: "a", category: "Stuff" },
388
- { key: "b", category: "Things" },
389
- { key: "c", category: "Stuff" },
390
- { key: "d", category: "Things" },
391
- { key: "e", category: "Things" },
392
- { key: "f", category: "Stuff" },
393
- ];
394
- const columnDefs = [{ fieldName: "key" }, { fieldName: "category" }];
395
- viewState = { closedCategories: [] };
396
- return expect(
397
- <Provider store={store}>
398
- <CategoryList name="test" columnDefs={columnDefs} rows={rows} keyField={["key"]} />
399
- </Provider>,
400
- "when mounted",
401
- "with event",
402
- { type: "click", target: '[data-test-id="category_Stuff"]' },
403
- ).then(() =>
404
- expect(store.dispatch, "to have calls satisfying", [
405
- {
406
- args: [
407
- {
408
- type: "VIEW_STATE_SET_FIELD",
409
- payload: {
410
- name: "test",
411
- field: "closedCategories",
412
- value: ["Stuff"],
413
- },
414
- },
415
- ],
416
- },
417
- ]),
418
- );
419
- });
420
-
421
- it("toggles a category open", () => {
422
- const rows = [
423
- { key: "a", category: "Stuff" },
424
- { key: "b", category: "Things" },
425
- { key: "c", category: "Stuff" },
426
- { key: "d", category: "Things" },
427
- { key: "e", category: "Things" },
428
- { key: "f", category: "Stuff" },
429
- ];
430
- const columnDefs = [{ fieldName: "a" }, { fieldName: "b" }];
431
- viewState = { closedCategories: ["Stuff"] };
432
- return expect(
433
- <Provider store={store}>
434
- <CategoryList name="test" columnDefs={columnDefs} rows={rows} keyField={["key"]} />
435
- </Provider>,
436
- "when mounted",
437
- "with event",
438
- { type: "click", target: '[data-test-id="category_Stuff"]' },
439
- ).then(() =>
440
- expect(store.dispatch, "to have calls satisfying", [
441
- {
442
- args: [
443
- {
444
- type: "VIEW_STATE_SET_FIELD",
445
- payload: { name: "test", field: "closedCategories", value: [] },
446
- },
447
- ],
448
- },
449
- ]),
450
- );
451
- });
452
-
453
- it("renders rows with data-based backgrounds", () => {
454
- const rows = [{ key: "a" }, { key: "b" }, { key: "c" }];
455
- const columnDefs = [{ fieldName: "key" }];
456
- const colorMap = {
457
- a: "#ff0000",
458
- b: "#00ff00",
459
- c: "#0000ff",
460
- };
461
- const colorGetter = row => colorMap[row.key];
462
- return expect(
463
- <Provider store={store}>
464
- <CategoryList columnDefs={columnDefs} rows={rows} keyField={["key"]} rowBackgroundGetter={colorGetter} />
465
- </Provider>,
466
- "when mounted",
467
- "to satisfy",
468
- <table>
469
- <thead>
470
- <tr>
471
- <th>
472
- <Ignore />
473
- </th>
474
- </tr>
475
- </thead>
476
- <tbody>
477
- <CategoryRow>
478
- <td>
479
- <Ignore />
480
- <Ignore />
481
- </td>
482
- </CategoryRow>
483
- <TableRow bgColor="#ff0000">
484
- <TableData>a</TableData>
485
- </TableRow>
486
- <TableRow bgColor="#00ff00">
487
- <TableData>b</TableData>
488
- </TableRow>
489
- <TableRow bgColor="#0000ff">
490
- <TableData>c</TableData>
491
- </TableRow>
492
- </tbody>
493
- </table>,
494
- );
495
- });
496
-
497
- it("renders rows with index-based backgrounds", () => {
498
- const rows = [{ key: "a" }, { key: "b" }, { key: "c" }];
499
- const columnDefs = [{ fieldName: "key" }];
500
- const colorGetter = (row, index) => (index % 2 ? "red" : "green");
501
- return expect(
502
- <Provider store={store}>
503
- <CategoryList columnDefs={columnDefs} rows={rows} keyField={["key"]} rowBackgroundGetter={colorGetter} />
504
- </Provider>,
505
- "when mounted",
506
- "to satisfy",
507
- <table>
508
- <thead>
509
- <tr>
510
- <th>
511
- <Ignore />
512
- </th>
513
- </tr>
514
- </thead>
515
- <tbody>
516
- <CategoryRow>
517
- <td>
518
- <Ignore />
519
- <Ignore />
520
- </td>
521
- </CategoryRow>
522
- <TableRow bgColor="green">
523
- <TableData>a</TableData>
524
- </TableRow>
525
- <TableRow bgColor="red">
526
- <TableData>b</TableData>
527
- </TableRow>
528
- <TableRow bgColor="green">
529
- <TableData>c</TableData>
530
- </TableRow>
531
- </tbody>
532
- </table>,
533
- );
534
- });
535
-
536
- it("renders a header based on column definitions", () => {
537
- const rows = [{ key: "a" }, { key: "b" }, { key: "c" }];
538
- const columnDefs = [
539
- { type: "select", fieldName: "select" },
540
- { fieldName: "key", label: "Key" },
541
- ];
542
- const selection = ["a"];
543
- return expect(
544
- <Provider store={store}>
545
- <CategoryList columnDefs={columnDefs} rows={rows} keyField={["key"]} selection={selection} />
546
- </Provider>,
547
- "when mounted",
548
- "to satisfy",
549
- <table>
550
- <thead>
551
- <HeadTableRow>
552
- <TableHeader select>
553
- <HeadBox>
554
- <Checkbox>
555
- <Ignore />
556
- <Ignore />
557
- </Checkbox>
558
- </HeadBox>
559
- </TableHeader>
560
- <TableHeader>
561
- <HeadBox>Key</HeadBox>
562
- </TableHeader>
563
- </HeadTableRow>
564
- </thead>
565
- <tbody>
566
- <tr>
567
- <td>
568
- <Ignore />
569
- <Ignore />
570
- </td>
571
- </tr>
572
- <tr>
573
- <td>
574
- <Ignore />
575
- </td>
576
- <td>
577
- <Ignore />
578
- </td>
579
- </tr>
580
- <tr>
581
- <td>
582
- <Ignore />
583
- </td>
584
- <td>
585
- <Ignore />
586
- </td>
587
- </tr>
588
- <tr>
589
- <td>
590
- <Ignore />
591
- </td>
592
- <td>
593
- <Ignore />
594
- </td>
595
- </tr>
596
- </tbody>
597
- </table>,
598
- );
599
- });
600
-
601
- it("renders a header when all rows are selected", () => {
602
- const rows = [{ key: "a" }, { key: "b" }, { key: "c" }];
603
- const columnDefs = [
604
- { type: "select", fieldName: "select" },
605
- { fieldName: "key", label: "Key" },
606
- ];
607
- viewState = {
608
- selection: ["a", "b", "c"],
609
- };
610
- return expect(
611
- <Provider store={store}>
612
- <CategoryList columnDefs={columnDefs} rows={rows} keyField={["key"]} />
613
- </Provider>,
614
- "when mounted",
615
- "to satisfy",
616
- <table>
617
- <thead>
618
- <HeadTableRow>
619
- <TableHeader select>
620
- <HeadBox>
621
- <Checkbox>
622
- <Ignore />
623
- <Cover value={true} />
624
- </Checkbox>
625
- </HeadBox>
626
- </TableHeader>
627
- <TableHeader>
628
- <HeadBox>Key</HeadBox>
629
- </TableHeader>
630
- </HeadTableRow>
631
- </thead>
632
- <tbody>
633
- <tr>
634
- <td>
635
- <Ignore />
636
- <Ignore />
637
- </td>
638
- </tr>
639
- <tr>
640
- <td>
641
- <Ignore />
642
- </td>
643
- <td>
644
- <Ignore />
645
- </td>
646
- </tr>
647
- <tr>
648
- <td>
649
- <Ignore />
650
- </td>
651
- <td>
652
- <Ignore />
653
- </td>
654
- </tr>
655
- <tr>
656
- <td>
657
- <Ignore />
658
- </td>
659
- <td>
660
- <Ignore />
661
- </td>
662
- </tr>
663
- </tbody>
664
- </table>,
665
- );
666
- });
667
- });