Skip to content

Commit b903619

Browse files
committed
bug fixes and linting for all jsx
1 parent 6a00212 commit b903619

File tree

23 files changed

+451
-401
lines changed

23 files changed

+451
-401
lines changed

.eslintrc

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@
8080
"no-alert": 1,
8181
"no-caller": 1,
8282
"no-div-regex": 1,
83-
"no-else-return": 1,
83+
"no-else-return": 0,
8484
"no-empty-label": 1,
8585
"no-eq-null": 0,
8686
"no-eval": 1,
@@ -195,7 +195,7 @@
195195
"react/jsx-indent-props": 1,
196196
"react/jsx-indent": 1,
197197
"react/jsx-key": 1,
198-
"react/jsx-max-props-per-line": 1,
198+
"react/jsx-max-props-per-line": 0,
199199
"react/jsx-no-bind": 1,
200200
"react/jsx-no-duplicate-props": 1,
201201
"react/jsx-no-literals": 1,
@@ -214,7 +214,7 @@
214214
"react/no-is-mounted": 1,
215215
"react/no-multi-comp": 1,
216216
"react/no-set-state": 1,
217-
"react/no-string-refs": 1,
217+
"react/no-string-refs": 0,
218218
"react/no-unknown-property": 1,
219219
"react/prefer-es6-class": 1,
220220
"react/prop-types": 1,

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-redux-grid",
3-
"version": "1.0.6",
3+
"version": "1.1.0",
44
"description": "A React Grid Component written in the Redux Pattern",
55
"author": "Benjamin Cripps (https://github.com/bencripps)",
66
"contributors": [

src/components/core/draganddrop/DragAndDropManager.js

Lines changed: 9 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,6 @@ import { CLASS_NAMES } from '../../../constants/GridConstants';
22
import { prefix } from '../../../util/prefix';
33

44
export default class DragAndDropManager {
5-
constructor(plugins, store, events, columns) {
6-
7-
}
8-
95
initDragable(initialProps) {
106

117
const defaults = {
@@ -25,27 +21,27 @@ export default class DragAndDropManager {
2521
return props;
2622
}
2723

28-
handleDragStart(reactEvent) {
24+
handleDragStart() {
2925

3026
}
3127

32-
handleDrag(reactEvent) {
33-
// reactEvent.preventDefault();
28+
handleDrag() {
29+
3430
}
3531

3632
handleDragOver(reactEvent) {
3733
reactEvent.preventDefault();
3834
}
3935

40-
handleDragLeave(reactEvent) {
41-
// reactEvent.preventDefault();
36+
handleDragLeave() {
37+
4238
}
4339

44-
handleDragEnd(reactEvent) {
45-
// reactEvent.preventDefault();
40+
handleDragEnd() {
41+
4642
}
4743

48-
handleDrop(reactEvent) {
49-
// reactEvent.preventDefault();
44+
handleDrop() {
45+
5046
}
5147
}

src/components/layout/Cell.jsx

Lines changed: 15 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,26 @@
11
import React, { PropTypes, Component } from 'react';
22
import { connect } from 'react-redux';
3-
import store from '../../store/store';
4-
import { keyGenerator } from '../../util/keygenerator';
53
import { prefix } from '../../util/prefix';
6-
import { emptyFn } from '../../util/emptyFn';
74
import { CLASS_NAMES } from '../../constants/GridConstants';
85

96
class Cell extends Component {
107

11-
static defaultProps = {
12-
data: React.PropTypes.String,
13-
columns: React.PropTypes.object,
14-
index: React.PropTypes.number
8+
static propTypes = {
9+
cellData: PropTypes.string,
10+
columns: PropTypes.array,
11+
data: PropTypes.func,
12+
editorState: PropTypes.object,
13+
events: PropTypes.object,
14+
index: PropTypes.number,
15+
rowId: PropTypes.string
1516
}
1617

1718
handleClick(events, cellData, reactEvent) {
1819

1920
if (reactEvent.target && reactEvent.target.contentEditable === 'true') {
2021
reactEvent.stopPropagation();
2122
}
22-
23+
2324
if (events.HANDLE_CELL_CLICK) {
2425
events.HANDLE_CELL_CLICK.apply(this, arguments);
2526
}
@@ -39,15 +40,15 @@ class Cell extends Component {
3940
render() {
4041

4142
const { cellData, events, rowId, editorState, columns, index } = this.props;
42-
43-
const isEditable = editorState
43+
44+
const isEditable = editorState
4445
&& editorState.row
45-
&& editorState.row.key === rowId ? true : false;
46+
&& editorState.row.key === rowId;
4647

4748
const hidden = columns
48-
&& columns[index]
49-
&& columns[index].hidden !== undefined
50-
? columns[index].hidden
49+
&& columns[index]
50+
&& columns[index].hidden !== undefined
51+
? columns[index].hidden
5152
: null;
5253

5354
const cellProps = {

src/components/layout/Header.jsx

Lines changed: 46 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,24 @@
11
import React, { PropTypes, Component } from 'react';
22
import { connect } from 'react-redux';
3-
import ActionColumn from '../plugins/gridactions/ActionColumn.jsx';
43
import DragAndDropManager from '../core/draganddrop/DragAndDropManager';
54
import { keyGenerator, keyFromObject } from '../../util/keygenerator';
65
import { prefix } from '../../util/prefix';
76
import { throttle } from '../../util/throttle';
8-
import { emptyFn } from '../../util/emptyFn';
97
import { CLASS_NAMES, SORT_DIRECTIONS, SORT_METHODS } from '../../constants/GridConstants';
108
import { reorderColumn } from '../../actions/core/ColumnManager';
119
import { resizeColumns, setSortDirection } from '../../actions/GridActions';
1210

1311
class Header extends Component {
1412

15-
static defaultProps = {
16-
columnManager: React.PropTypes.object.isRequired,
17-
columns: React.PropTypes.arrayOf(React.PropTypes.Object).isRequired,
18-
plugins: React.PropTypes.object,
19-
store: React.PropTypes.func
13+
static propTypes = {
14+
columnManager: PropTypes.object.isRequired,
15+
columnStates: PropTypes.object,
16+
columns: PropTypes.arrayOf(PropTypes.Object).isRequired,
17+
dataSource: PropTypes.object,
18+
pager: PropTypes.object,
19+
plugins: PropTypes.object,
20+
selectionModel: PropTypes.object,
21+
store: PropTypes.object
2022
}
2123

2224
constructor() {
@@ -31,7 +33,7 @@ class Header extends Component {
3133
}
3234

3335
else if (columnManager.config.resizable !== undefined) {
34-
return columnManager.config.resizable;
36+
return columnManager.config.resizable;
3537
}
3638

3739
else {
@@ -46,7 +48,7 @@ class Header extends Component {
4648
}
4749

4850
else if (columnManager.config.sortable.enabled !== undefined) {
49-
return columnManager.config.sortable.enabled
51+
return columnManager.config.sortable.enabled;
5052
}
5153

5254
else {
@@ -55,11 +57,11 @@ class Header extends Component {
5557
}
5658

5759
handleDrop(droppedIndex, columns, reactEvent) {
58-
60+
5961
const { store } = this.props;
6062

6163
try {
62-
const colData = reactEvent
64+
const colData = reactEvent
6365
&& reactEvent.dataTransfer.getData
6466
? JSON.parse(reactEvent.dataTransfer.getData('Text'))
6567
: null;
@@ -68,7 +70,9 @@ class Header extends Component {
6870
store.dispatch(reorderColumn(colData.index, droppedIndex, columns));
6971
}
7072

71-
} catch(e) {
73+
}
74+
75+
catch(e) {
7276
console.warn('Invalid drop');
7377
}
7478

@@ -82,7 +86,7 @@ class Header extends Component {
8286
const columnOffsetLeft = columnNode.getBoundingClientRect().left;
8387
const headerWidth = parseFloat(window.getComputedStyle(header).width, 10);
8488
const computedWidth = (mousePosition - columnOffsetLeft) / headerWidth;
85-
const totalWidth = parseFloat(this.refs[id].style.width, 10)
89+
const totalWidth = parseFloat(this.refs[id].style.width, 10)
8690
+ parseFloat(this.refs[nextColumnKey].style.width, 10);
8791
let width = computedWidth * 100;
8892

@@ -91,7 +95,7 @@ class Header extends Component {
9195
if (nextColWidth < 0 || width < 0) {
9296
return false;
9397
}
94-
98+
9599
if (nextColWidth < columnManager.config.minColumnWidth) {
96100
nextColWidth = columnManager.config.minColumnWidth;
97101
width = totalWidth - columnManager.config.minColumnWidth;
@@ -109,7 +113,7 @@ class Header extends Component {
109113

110114
}
111115

112-
handleColumnClick(col, reactEvent) {
116+
handleColumnClick(col) {
113117

114118
if (col.HANDLE_CLICK) {
115119
col.HANDLE_CLICK.apply(this, arguments);
@@ -120,7 +124,7 @@ class Header extends Component {
120124
const { store, dataSource, pager } = this.props;
121125

122126
store.dispatch(setSortDirection(columns, col.id, direction));
123-
127+
124128
if (columnManager.config.sortable.method.toUpperCase() === SORT_METHODS.LOCAL) {
125129
columnManager.doSort(SORT_METHODS.LOCAL, col, direction, dataSource);
126130
}
@@ -136,8 +140,8 @@ class Header extends Component {
136140

137141
getSortHandle(col, columns, columnManager) {
138142

139-
const direction = col.sortDirection
140-
|| col.defaultSortDirection
143+
const direction = col.sortDirection
144+
|| col.defaultSortDirection
141145
|| SORT_DIRECTIONS.ASCEND;
142146
const visibile = col.sortDirection !== undefined
143147
|| columnManager.config.sortable.enabled
@@ -149,7 +153,7 @@ class Header extends Component {
149153
};
150154

151155
return (
152-
<span { ...handleProps } />
156+
<span { ...handleProps } />
153157
);
154158
}
155159

@@ -161,32 +165,32 @@ class Header extends Component {
161165
);
162166
}
163167

164-
getWidth(col, key, columns, defaultColumnWidth, index) {
168+
getWidth(col, key, columns, defaultColumnWidth) {
165169

166-
const visibleColumns = columns.filter((col) => !col.hidden);
167-
const lastColumn = visibleColumns[visibleColumns.length -1];
170+
const visibleColumns = columns.filter((_col) => !_col.hidden);
171+
const lastColumn = visibleColumns[visibleColumns.length - 1];
168172
const isLastColumn = lastColumn && lastColumn.name === col.name;
169-
const totalWidth = columns.reduce(function(a, col) {
170-
if (col.hidden) {
173+
const totalWidth = columns.reduce((a, _col) => {
174+
if (_col.hidden) {
171175
return a + 0;
172176
}
173-
return a + parseFloat(col.width || 0);
174-
}, 0);
177+
return a + parseFloat(_col.width || 0);
178+
}, 0);
175179

176180
let width = col.width || defaultColumnWidth;
177181

178-
if (isLastColumn
182+
if (isLastColumn
179183
&& totalWidth !== 0
180184
&& totalWidth < 100) {
181-
width = `${100 - (totalWidth - parseFloat(width))}%`
185+
width = `${100 - (totalWidth - parseFloat(width))}%`;
182186
}
183187

184188
return width;
185-
189+
186190
}
187191

188192
getHeaderText(col, index, columnManager, dragAndDropManager) {
189-
193+
190194
const innerHTML = col.renderer ? col.renderer(col) : col.name;
191195
const draggable = col.moveable !== undefined ? col.moveable : columnManager.config.moveable;
192196

@@ -204,7 +208,7 @@ class Header extends Component {
204208
index: index
205209
};
206210

207-
reactEvent.dataTransfer.setData('Text', JSON.stringify(data));
211+
reactEvent.dataTransfer.setData('Text', JSON.stringify(data));
208212
}
209213
});
210214

@@ -221,24 +225,24 @@ class Header extends Component {
221225
return false;
222226
}
223227

224-
const { columnManager, selectionModel, store } = this.props;
228+
const { columnManager, store } = this.props;
225229

226230
const isResizable = this.isColumnResizable(col, columnManager);
227231

228232
const isSortable = this.isSortable(col, columnManager);
229233

230-
const visibleColumns = columns.filter((col) => !col.hidden);
234+
const visibleColumns = columns.filter((_col) => !_col.hidden);
231235

232236
const key = keyGenerator(col.name, col.value);
233237

234-
const nextColumnKey = visibleColumns && visibleColumns[index + 1]
238+
const nextColumnKey = visibleColumns && visibleColumns[index + 1]
235239
? keyGenerator(visibleColumns[index + 1].name, visibleColumns[index + 1].value) : null;
236240

237241
const sortHandle = isSortable
238242
? this.getSortHandle(col, columns, columnManager) : null;
239243

240-
const dragHandle = isResizable
241-
? this.getDragHandle(col, dragAndDropManager) : null;
244+
const dragHandle = isResizable
245+
? this.getDragHandle(col, dragAndDropManager) : null;
242246

243247
const headerProps = {
244248
className: `${col.className} ${isResizable ? prefix('resizable') : ''}`,
@@ -273,32 +277,32 @@ class Header extends Component {
273277

274278
return (
275279
<th { ...headerProps } />
276-
);
280+
);
277281
}
278282

279283
addEmptyInsert(headers, visibleColumns) {
280284

281285
const { GRID_ACTIONS } = this.props.plugins;
282-
286+
283287
if (visibleColumns.length === 0) {
284288

285-
if (GRID_ACTIONS
286-
&& GRID_ACTIONS.menu
289+
if (GRID_ACTIONS
290+
&& GRID_ACTIONS.menu
287291
&& GRID_ACTIONS.menu.length > 0) {
288292

289293
headers.splice(1, 0, this.getEmptyHeader());
290294
}
291295

292296
else {
293-
headers.push(this.getEmptyHeader());
297+
headers.push(this.getEmptyHeader());
294298
}
295299
}
296300

297301
}
298302

299303
render() {
300304

301-
const { columns, selectionModel, columnManager, columnStates } = this.props;
305+
const { columns, selectionModel, columnManager } = this.props;
302306
const dragAndDropManager = new DragAndDropManager();
303307
const visibleColumns = columns.filter((col) => !col.hidden);
304308
const headers = visibleColumns.map((col, i) => this.getHeader(col, dragAndDropManager, visibleColumns, i));

0 commit comments

Comments
 (0)