bencripps /
react-redux-grid
| Conditions | 14 |
| Paths | 15 |
| Total Lines | 132 |
| Lines | 0 |
| Ratio | 0 % |
| Changes | 2 | ||
| Bugs | 0 | Features | 1 |
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
Complex classes like editor.js ➔ editor often do a lot of different things. To break such a class down, we need to identify a cohesive component within that class. A common approach to find such a component is to look for fields/methods that share the same prefixes, or suffixes.
Once you have determined the fields that belong together, you can apply the Extract Class refactoring. If the component makes sense as a sub-class, Extract Subclass is also a candidate, and is often faster.
| 1 | import { fromJS, Map } from 'immutable'; |
||
| 76 | export default function editor(state = initialState, action) { |
||
| 77 | |||
| 78 | switch (action.type) { |
||
| 79 | |||
| 80 | case EDIT_ROW: |
||
| 81 | |||
| 82 | const { values } = action; |
||
| 83 | const isValid = isRowValid(action.columns, values); |
||
| 84 | const iOverrides = state.getIn([stateKey, action.rowId, 'overrides']) |
||
| 85 | ? state.getIn([stateKey, action.rowId, 'overrides']).toJS() |
||
| 86 | : {}; |
||
| 87 | |||
| 88 | action.columns.forEach((col, i) => { |
||
| 89 | const val = getData(values, action.columns, i); |
||
| 90 | const dataIndex = col.dataIndex; |
||
| 91 | |||
| 92 | // setting disabled |
||
| 93 | iOverrides[dataIndex] = iOverrides[dataIndex] || {}; |
||
| 94 | iOverrides[dataIndex].disabled = setDisabled(col, val, values); |
||
| 95 | }); |
||
| 96 | |||
| 97 | const operation = action.editMode === 'inline' |
||
| 98 | ? 'setIn' |
||
| 99 | : 'mergeIn'; |
||
| 100 | |||
| 101 | return state[operation]([action.stateKey], fromJS({ |
||
| 102 | [action.rowId]: { |
||
| 103 | key: action.rowId, |
||
| 104 | values: action.values, |
||
| 105 | rowIndex: action.rowIndex, |
||
| 106 | top: action.top, |
||
| 107 | valid: isValid, |
||
| 108 | isCreate: action.isCreate || false, |
||
| 109 | overrides: iOverrides |
||
| 110 | }, |
||
| 111 | lastUpdate: generateLastUpdate() |
||
| 112 | })); |
||
| 113 | |||
| 114 | case SET_DATA: |
||
| 115 | |||
| 116 | // if grid editor is type 'grid', we need to map the datasource |
||
| 117 | // to editor state |
||
| 118 | if (action.editMode === 'grid') { |
||
| 119 | |||
| 120 | const dataWithKeys = setKeysInData(action.data); |
||
| 121 | const editorData = dataWithKeys.reduce((prev, curr, i) => { |
||
| 122 | return prev.set(curr.get('_key'), fromJS({ |
||
| 123 | key: curr.get('_key'), |
||
| 124 | values: curr, |
||
| 125 | rowIndex: i, |
||
| 126 | top: null, |
||
| 127 | valid: null, |
||
| 128 | isCreate: false, |
||
| 129 | overrides: {} |
||
| 130 | })); |
||
| 131 | }, Map({ lastUpdate: generateLastUpdate() })); |
||
| 132 | |||
| 133 | return state.mergeIn([action.stateKey], editorData); |
||
| 134 | } |
||
| 135 | |||
| 136 | return state; |
||
| 137 | |||
| 138 | case ROW_VALUE_CHANGE: |
||
| 139 | |||
| 140 | const { column, columns, value, stateKey } = action; |
||
| 141 | const previousValues = state.getIn([stateKey, action.rowId, 'values']) |
||
| 142 | ? state.getIn([stateKey, action.rowId, 'values']).toJS() |
||
| 143 | : {}; |
||
| 144 | const overrides = state.getIn([stateKey, action.rowId, 'overrides']) |
||
| 145 | ? state.getIn([stateKey, action.rowId, 'overrides']).toJS() |
||
| 146 | : {}; |
||
| 147 | |||
| 148 | let rowValues = setDataAtDataIndex( |
||
| 149 | previousValues, column.dataIndex, value |
||
| 150 | ); |
||
| 151 | |||
| 152 | columns.forEach((col, i) => { |
||
| 153 | const val = getData(rowValues, columns, i); |
||
| 154 | const dataIndex = col.dataIndex; |
||
| 155 | |||
| 156 | // interpreting `change func` to set final values |
||
| 157 | // happens first, due to other validation |
||
| 158 | rowValues = handleChangeFunc(col, rowValues); |
||
| 159 | |||
| 160 | // setting default value |
||
| 161 | if (col.defaultValue !== undefined |
||
| 162 | && val === undefined || val === null) { |
||
| 163 | setDataAtDataIndex(rowValues, dataIndex, col.defaultValue); |
||
| 164 | } |
||
| 165 | |||
| 166 | // setting disabled |
||
| 167 | overrides[dataIndex] = overrides[dataIndex] || {}; |
||
| 168 | overrides[dataIndex].disabled = setDisabled(col, val, rowValues); |
||
| 169 | |||
| 170 | }); |
||
| 171 | |||
| 172 | const valid = isRowValid(columns, rowValues); |
||
| 173 | |||
| 174 | state = state.mergeIn([action.stateKey, action.rowId], { |
||
| 175 | values: rowValues, |
||
| 176 | previousValues: state.getIn([stateKey, action.rowId, 'values']), |
||
| 177 | valid, |
||
| 178 | overrides |
||
| 179 | }); |
||
| 180 | |||
| 181 | return state.setIn( |
||
| 182 | [action.stateKey, 'lastUpdate'], |
||
| 183 | generateLastUpdate() |
||
| 184 | ); |
||
| 185 | |||
| 186 | case REPOSITION_EDITOR: |
||
| 187 | const newState = state.mergeIn([action.stateKey, action.rowId], { |
||
| 188 | top: action.top |
||
| 189 | }); |
||
| 190 | |||
| 191 | return newState.mergeIn( |
||
| 192 | [action.stateKey], |
||
| 193 | { lastUpdate: generateLastUpdate() } |
||
| 194 | ); |
||
| 195 | |||
| 196 | case REMOVE_ROW: |
||
| 197 | case DISMISS_EDITOR: |
||
| 198 | case CANCEL_ROW: |
||
| 199 | return state.setIn( |
||
| 200 | [action.stateKey], |
||
| 201 | fromJS({ lastUpdate: generateLastUpdate() }) |
||
| 202 | ); |
||
| 203 | |||
| 204 | default: |
||
| 205 | return state; |
||
| 206 | } |
||
| 207 | } |
||
| 208 |
Loading history...