Skip to content
This repository was archived by the owner on Apr 5, 2022. It is now read-only.

Commit 9a09cab

Browse files
joshhidleyjoshhidley
committed
CJPM-17455: Ran format on changed files.
1 parent b500e10 commit 9a09cab

9 files changed

Lines changed: 238 additions & 190 deletions

File tree

‎packages/visual-stack/src/components/Table/DataTable/DataTable.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@
2828
min-height: 32px;
2929
padding: 4px 8px;
3030
vertical-align: bottom;
31-
border-bottom: 2px solid #D8DCDF;
31+
border-bottom: 2px solid #d8dcdf;
3232
color: #757575;
3333
}
3434

‎packages/visual-stack/src/components/Table/DataTable/sortingHelper.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,8 @@ export const getSortingIcon = (sortingOption, currentLabel) => {
2020
return icon;
2121
};
2222

23-
const sort = order => (index, data) => R.sortWith([order(R.path(["row", index]))])(data);
23+
const sort = order => (index, data) =>
24+
R.sortWith([order(R.path(['row', index]))])(data);
2425
const sortAscendingByIndex = sort(R.ascend);
2526
const sortDescendingByIndex = sort(R.descend);
2627
const sortingFunctionMap = {

‎packages/visual-stack/src/components/Table/DataTable/tests/index.test.js‎

Lines changed: 132 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,14 @@ describe('DataTable', () => {
1212
describe('Top Level Header', () => {
1313
it('should display tool bar', () => {
1414
const renderToolbar = jest.fn(() => <div id="test">TEST</div>);
15-
const data = [{ id: 0, row: [1, 2, 3], selected: false }, { id: 1, row: [4, 5, 6], selected: true }];
15+
const data = [
16+
{ id: 0, row: [1, 2, 3], selected: false },
17+
{ id: 1, row: [4, 5, 6], selected: true },
18+
];
1619
const dataWithoutIds = [
1720
{ row: data[0].row, selected: data[0].selected },
1821
{ row: data[1].row, selected: data[1].selected },
19-
]
22+
];
2023
const columns = [
2124
{
2225
label: 'hello',
@@ -29,7 +32,9 @@ describe('DataTable', () => {
2932
columns={columns}
3033
/>
3134
);
32-
expect(renderToolbar.mock.calls).toEqual([[{ data: dataWithoutIds, columns }]]);
35+
expect(renderToolbar.mock.calls).toEqual([
36+
[{ data: dataWithoutIds, columns }],
37+
]);
3338
expect(wrapper.find('div#test').text()).toEqual('TEST');
3439
});
3540
});
@@ -104,10 +109,12 @@ describe('DataTable', () => {
104109
const data3 = 'data3';
105110
const data4 = 'data4';
106111
const wrapper = mount(
107-
<DataTable data={[
108-
{ id: 0, row: [data1, data2], selected: false },
109-
{ id: 1, row: [data3, data4], selected: false }]
110-
} />
112+
<DataTable
113+
data={[
114+
{ id: 0, row: [data1, data2], selected: false },
115+
{ id: 1, row: [data3, data4], selected: false },
116+
]}
117+
/>
111118
);
112119
expect(wrapper.find('td').map(node => node.text())).toEqual([
113120
data1,
@@ -174,7 +181,10 @@ describe('DataTable', () => {
174181
const wrapper = mount(
175182
<DataTable
176183
columns={columns}
177-
data={[{ id: 0, row: [targetData, 2], selected: false }, { id: 1, row: [1, 2], selected: false }]}
184+
data={[
185+
{ id: 0, row: [targetData, 2], selected: false },
186+
{ id: 1, row: [1, 2], selected: false },
187+
]}
178188
onClick={onClick}
179189
/>
180190
);
@@ -197,7 +207,10 @@ describe('DataTable', () => {
197207
},
198208
];
199209
const wrapper = mount(
200-
<DataTable columns={columns} data={[{ id: 0, row: [targetData], selected: false }]} />
210+
<DataTable
211+
columns={columns}
212+
data={[{ id: 0, row: [targetData], selected: false }]}
213+
/>
201214
);
202215
const targetTD = wrapper
203216
.find('td.vs-cell')
@@ -206,123 +219,148 @@ describe('DataTable', () => {
206219
});
207220
});
208221

209-
describe("selecting rows", () => {
210-
it("should not display any selectable rows if table is not selectable", () => {
211-
const data = [{ id: 0, row: [1], selected: true, }, { id: 1, row: [2], selected: false, }]
212-
const wrapper = mount(
213-
<DataTable data={data} selectable={false} />
222+
describe('selecting rows', () => {
223+
it('should not display any selectable rows if table is not selectable', () => {
224+
const data = [
225+
{ id: 0, row: [1], selected: true },
226+
{ id: 1, row: [2], selected: false },
227+
];
228+
const wrapper = mount(<DataTable data={data} selectable={false} />);
229+
const rowCheckboxes = wrapper.find(
230+
"input[aria-label='Select row from data table']"
231+
);
232+
const selectAllCheckbox = wrapper.find(
233+
"input[aria-label='Select all from data table']"
214234
);
215-
const rowCheckboxes = wrapper.find("input[aria-label='Select row from data table']");
216-
const selectAllCheckbox = wrapper.find("input[aria-label='Select all from data table']");
217235
expect(rowCheckboxes).toHaveLength(0);
218236
expect(selectAllCheckbox).toHaveLength(0);
219-
})
237+
});
220238

221-
it("should display selected rows", () => {
239+
it('should display selected rows', () => {
222240
const data = [
223-
{ id: 0, row: [1], selected: true, },
224-
{ id: 1, row: [2], selected: false, },
225-
]
226-
const wrapper = mount(
227-
<DataTable data={data} selectable />
228-
);
229-
const firstRowSelected = wrapper.find("input[aria-label='Select row from data table']").at(0).prop("checked")
230-
const secondRowSelected = wrapper.find("input[aria-label='Select row from data table']").at(1).prop("checked")
241+
{ id: 0, row: [1], selected: true },
242+
{ id: 1, row: [2], selected: false },
243+
];
244+
const wrapper = mount(<DataTable data={data} selectable />);
245+
const firstRowSelected = wrapper
246+
.find("input[aria-label='Select row from data table']")
247+
.at(0)
248+
.prop('checked');
249+
const secondRowSelected = wrapper
250+
.find("input[aria-label='Select row from data table']")
251+
.at(1)
252+
.prop('checked');
231253

232254
expect(firstRowSelected).toEqual(true);
233255
expect(secondRowSelected).toEqual(false);
234-
})
256+
});
235257

236-
it("should select one row", () => {
258+
it('should select one row', () => {
237259
const onSelect = jest.fn();
238-
const data = [{ id: 0, row: [1], selected: false, }, { id: 1, row: [2], selected: false, }]
260+
const data = [
261+
{ id: 0, row: [1], selected: false },
262+
{ id: 1, row: [2], selected: false },
263+
];
239264
const wrapper = mount(
240265
<DataTable data={data} selectable onSelect={onSelect} />
241266
);
242-
wrapper.find("input[aria-label='Select row from data table']").at(0).simulate('change');
267+
wrapper
268+
.find("input[aria-label='Select row from data table']")
269+
.at(0)
270+
.simulate('change');
243271

244272
expect(onSelect).lastCalledWith({
245-
data: [{
246-
id: 0, row: [1], selected: true
247-
},
248-
{
249-
id: 1, row: [2], selected: false
250-
}]
251-
})
252-
})
273+
data: [
274+
{
275+
id: 0,
276+
row: [1],
277+
selected: true,
278+
},
279+
{
280+
id: 1,
281+
row: [2],
282+
selected: false,
283+
},
284+
],
285+
});
286+
});
253287

254-
it("should check selected all checkbox when all rows are selected", () => {
288+
it('should check selected all checkbox when all rows are selected', () => {
255289
const data = [
256-
{ id: 0, row: [1], selected: true, },
257-
{ id: 1, row: [2], selected: true, },
258-
]
259-
const wrapper = mount(
260-
<DataTable data={data} selectable />
261-
);
290+
{ id: 0, row: [1], selected: true },
291+
{ id: 1, row: [2], selected: true },
292+
];
293+
const wrapper = mount(<DataTable data={data} selectable />);
262294

263-
const selectedAllRowsCheckbox = wrapper.find("input[aria-label='Select all from data table']").prop("checked")
295+
const selectedAllRowsCheckbox = wrapper
296+
.find("input[aria-label='Select all from data table']")
297+
.prop('checked');
264298

265299
expect(selectedAllRowsCheckbox).toEqual(true);
266-
})
300+
});
267301

268-
it("should uncheck selected all checkbox when some rows are not selected", () => {
302+
it('should uncheck selected all checkbox when some rows are not selected', () => {
269303
const data = [
270-
{ id: 0, row: [1], selected: true, },
271-
{ id: 1, row: [2], selected: false, },
272-
]
273-
const wrapper = mount(
274-
<DataTable data={data} selectable />
275-
);
304+
{ id: 0, row: [1], selected: true },
305+
{ id: 1, row: [2], selected: false },
306+
];
307+
const wrapper = mount(<DataTable data={data} selectable />);
276308

277-
const selectedAllRowsCheckbox = wrapper.find("input[aria-label='Select all from data table']").prop("checked")
309+
const selectedAllRowsCheckbox = wrapper
310+
.find("input[aria-label='Select all from data table']")
311+
.prop('checked');
278312

279313
expect(selectedAllRowsCheckbox).toEqual(false);
280-
})
314+
});
281315

282-
it("should select all rows at once when clicking on select all checkbox", () => {
316+
it('should select all rows at once when clicking on select all checkbox', () => {
283317
const data = [
284-
{ id: 0, row: [1], selected: false, },
285-
{ id: 1, row: [2], selected: false, },
286-
]
318+
{ id: 0, row: [1], selected: false },
319+
{ id: 1, row: [2], selected: false },
320+
];
287321
const onSelect = jest.fn();
288322

289323
const wrapper = mount(
290324
<DataTable data={data} selectable onSelect={onSelect} />
291325
);
292326

293-
const selectedAllRowsCheckbox = wrapper.find("input[aria-label='Select all from data table']");
327+
const selectedAllRowsCheckbox = wrapper.find(
328+
"input[aria-label='Select all from data table']"
329+
);
294330
selectedAllRowsCheckbox.simulate('change');
295331

296332
expect(onSelect).lastCalledWith({
297333
data: [
298-
{ id: 0, row: [1], selected: true, },
299-
{ id: 1, row: [2], selected: true, },
300-
]
334+
{ id: 0, row: [1], selected: true },
335+
{ id: 1, row: [2], selected: true },
336+
],
301337
});
302-
})
338+
});
303339

304-
it("should unselect all rows at once when clicking on select all checkbox", () => {
340+
it('should unselect all rows at once when clicking on select all checkbox', () => {
305341
const data = [
306-
{ id: 0, row: [1], selected: true, },
307-
{ id: 1, row: [2], selected: true, },
308-
]
342+
{ id: 0, row: [1], selected: true },
343+
{ id: 1, row: [2], selected: true },
344+
];
309345
const onSelect = jest.fn();
310346

311347
const wrapper = mount(
312348
<DataTable data={data} selectable onSelect={onSelect} />
313349
);
314350

315-
const selectedAllRowsCheckbox = wrapper.find("input[aria-label='Select all from data table']");
351+
const selectedAllRowsCheckbox = wrapper.find(
352+
"input[aria-label='Select all from data table']"
353+
);
316354
selectedAllRowsCheckbox.simulate('change');
317355

318356
expect(onSelect).lastCalledWith({
319357
data: [
320-
{ id: 0, row: [1], selected: false, },
321-
{ id: 1, row: [2], selected: false, },
322-
]
358+
{ id: 0, row: [1], selected: false },
359+
{ id: 1, row: [2], selected: false },
360+
],
323361
});
324-
})
325-
})
362+
});
363+
});
326364
});
327365

328366
describe('pagination', () => {
@@ -380,9 +418,21 @@ describe('DataTable', () => {
380418
const group1 = range(1, 26);
381419
const group2 = range(26, 51);
382420
const group3 = range(51, 76);
383-
const groupedData1 = group1.map(number => ({ id: number, row: [number], selected: false }));
384-
const groupedData2 = group2.map(number => ({ id: number, row: [number], selected: false }));
385-
const groupedData3 = group3.map(number => ({ id: number, row: [number], selected: false }));
421+
const groupedData1 = group1.map(number => ({
422+
id: number,
423+
row: [number],
424+
selected: false,
425+
}));
426+
const groupedData2 = group2.map(number => ({
427+
id: number,
428+
row: [number],
429+
selected: false,
430+
}));
431+
const groupedData3 = group3.map(number => ({
432+
id: number,
433+
row: [number],
434+
selected: false,
435+
}));
386436

387437
it('should render a fixed number of rows when pagination is enabled', () => {
388438
const onPageChange = jest.fn();
@@ -641,7 +691,7 @@ describe('DataTable', () => {
641691
data={[
642692
{ id: 0, row: [second], selected: false },
643693
{ id: 1, row: [first], selected: false },
644-
{ id: 2, row: [third], selected: false }
694+
{ id: 2, row: [third], selected: false },
645695
]}
646696
onSort={onSort}
647697
sortable
@@ -679,7 +729,7 @@ describe('DataTable', () => {
679729
data={[
680730
{ id: 0, row: [second], selected: false },
681731
{ id: 1, row: [first], selected: false },
682-
{ id: 2, row: [third], selected: false }
732+
{ id: 2, row: [third], selected: false },
683733
]}
684734
onSort={onSort}
685735
sortable
@@ -717,7 +767,8 @@ describe('DataTable', () => {
717767
data={[
718768
{ id: 0, row: [second], selected: false },
719769
{ id: 1, row: [first], selected: false },
720-
{ id: 2, row: [third], selected: false }]}
770+
{ id: 2, row: [third], selected: false },
771+
]}
721772
onSort={onSort}
722773
sortable
723774
/>

0 commit comments

Comments
 (0)