Skip to content

Commit 6501a13

Browse files
culturedbarbarianculturedbarbarian
authored
Merge pull request #89 from kylekim-oicr/master
 Cascading Pane subview fix
2 parents c674b4e + a2bc69f commit 6501a13

7 files changed

Lines changed: 108 additions & 175 deletions

File tree

‎lib/CascadingPane/CascadingPane.js‎

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -183,15 +183,11 @@ var CascadingPane = function (_React$Component) {
183183

184184
return _react2.default.createElement(
185185
'div',
186-
{
187-
className: (0, _classnames2.default)(className, 'cascading-pane cascading-pane-container')
188-
},
186+
{ className: (0, _classnames2.default)(className, 'cascading-pane cascading-pane-container') },
189187
this.renderNav(children[0]),
190188
Object.keys(selectedMember).length === 0 ? _react2.default.createElement(
191189
'div',
192-
{
193-
className: (0, _classnames2.default)(viewClassName, 'cascading-pane-view')
194-
},
190+
{ className: (0, _classnames2.default)(viewClassName, 'cascading-pane-view') },
195191
this.renderMainView(children[1])
196192
) : _react2.default.createElement(
197193
_reactSplitPane2.default,
@@ -262,9 +258,6 @@ CascadingPane.defaultProps = {
262258
getCascadingMainView: function getCascadingMainView(f) {
263259
return f;
264260
},
265-
getCascadingSubView: function getCascadingSubView(f) {
266-
return f;
267-
},
268261
navData: [],
269262
mainData: [],
270263
subData: {},

‎lib/CascadingPane/CascadingPaneMainView.js‎

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -206,20 +206,14 @@ var CascadingPaneMainView = function (_React$Component) {
206206
if (!navSelect) {
207207
return _react2.default.createElement(
208208
'div',
209-
{
210-
className: (0, _classnames2.default)(className, 'cascading-pane-mainview'),
211-
key: key
212-
},
209+
{ className: (0, _classnames2.default)(className, 'cascading-pane-mainview'), key: key },
213210
noneSelectedDisplay
214211
);
215212
}
216213

217214
return _react2.default.createElement(
218215
'div',
219-
{
220-
className: (0, _classnames2.default)(className, 'cascading-pane-mainview'),
221-
key: key
222-
},
216+
{ className: (0, _classnames2.default)(className, 'cascading-pane-mainview'), key: key },
223217
_react2.default.createElement(
224218
_LoadingComponent2.default,
225219
navFetch,

‎lib/CascadingPane/CascadingPaneSubView.js‎

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -119,14 +119,11 @@ var CascadingPaneSubView = function (_React$Component) {
119119

120120
return _react2.default.createElement(
121121
'div',
122-
{
123-
className: (0, _classnames2.default)(className, 'cascading-pane-subview'),
124-
key: key
125-
},
122+
{ className: (0, _classnames2.default)(className, 'cascading-pane-subview'), key: key },
126123
_react2.default.createElement(
127124
_LoadingComponent2.default,
128125
mainViewFetch,
129-
_react2.default.createElement(
126+
getCascadingSubview ? _react2.default.createElement(
130127
_LoadingComponent2.default,
131128
subViewFetch,
132129
fetchedSub && fetchedMain && _react2.default.cloneElement(contentDisplay, {
@@ -138,7 +135,14 @@ var CascadingPaneSubView = function (_React$Component) {
138135
navSelect: navSelect,
139136
mainSelect: mainSelect
140137
})
141-
)
138+
) : _react2.default.cloneElement(contentDisplay, {
139+
groupData: groupData,
140+
memberData: memberData,
141+
data: data,
142+
reloadMainView: reloadMainView,
143+
navSelect: navSelect,
144+
mainSelect: mainSelect
145+
})
142146
)
143147
);
144148
}
@@ -179,9 +183,6 @@ CascadingPaneSubView.defaultProps = {
179183
groupData: {},
180184
memberData: {},
181185
data: {},
182-
getCascadingSubView: function getCascadingSubView(f) {
183-
return f;
184-
},
185186
subViewFetch: {
186187
status: '',
187188
isFetching: false

‎src/CascadingPane/CascadingPane.jsx‎

Lines changed: 25 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ class CascadingPane extends React.Component {
2323
mainSelectIdx: -1,
2424

2525
selectedGroup: {},
26-
selectedMember: {}
26+
selectedMember: {},
2727
};
2828
}
2929

@@ -33,13 +33,7 @@ class CascadingPane extends React.Component {
3333
}
3434

3535
renderNav(child) {
36-
const {
37-
location,
38-
getCascadingNav,
39-
navData,
40-
navFetch,
41-
fetchedNav
42-
} = this.props;
36+
const { location, getCascadingNav, navData, navFetch, fetchedNav } = this.props;
4337

4438
return React.cloneElement(child, {
4539
key: 0,
@@ -48,7 +42,7 @@ class CascadingPane extends React.Component {
4842
navFetch,
4943
fetchedNav,
5044
cascNav: location.query.cascNav,
51-
updateGroupSelect: item => this.setState({ selectedGroup: item })
45+
updateGroupSelect: item => this.setState({ selectedGroup: item }),
5246
});
5347
}
5448

@@ -62,7 +56,7 @@ class CascadingPane extends React.Component {
6256
mainViewFetch,
6357
fetchedNav,
6458
fetchedMainView,
65-
visibilityFilter
59+
visibilityFilter,
6660
} = this.props;
6761
const { selectedGroup } = this.state;
6862

@@ -79,9 +73,8 @@ class CascadingPane extends React.Component {
7973
cascNav: location.query.cascNav,
8074
cascSelect: location.query.cascSelect,
8175
reloadNav: getCascadingNav,
82-
updateMemberSelect: item =>
83-
this.setState({ selectedMember: item || {} }),
84-
visibilityFilter
76+
updateMemberSelect: item => this.setState({ selectedMember: item || {} }),
77+
visibilityFilter,
8578
});
8679
}
8780

@@ -94,7 +87,7 @@ class CascadingPane extends React.Component {
9487
subViewFetch,
9588
mainViewFetch,
9689
fetchedSubView,
97-
fetchedMainView
90+
fetchedMainView,
9891
} = this.props;
9992
const { selectedGroup, selectedMember } = this.state;
10093

@@ -110,44 +103,24 @@ class CascadingPane extends React.Component {
110103
fetchedMainView,
111104
cascNav: location.query.cascNav,
112105
cascSelect: location.query.cascSelect,
113-
reloadMainView: getCascadingMainView
106+
reloadMainView: getCascadingMainView,
114107
});
115108
}
116109

117110
render() {
118-
const {
119-
className,
120-
viewClassName,
121-
splitClassName,
122-
defaultSize,
123-
children
124-
} = this.props;
111+
const { className, viewClassName, splitClassName, defaultSize, children } = this.props;
125112
const { selectedMember } = this.state;
126113

127114
return (
128-
<div
129-
className={classNames(
130-
className,
131-
'cascading-pane cascading-pane-container'
132-
)}
133-
>
115+
<div className={classNames(className, 'cascading-pane cascading-pane-container')}>
134116
{this.renderNav(children[0])}
135117
{Object.keys(selectedMember).length === 0 ? (
136-
<div
137-
className={classNames(
138-
viewClassName,
139-
'cascading-pane-view'
140-
)}
141-
>
118+
<div className={classNames(viewClassName, 'cascading-pane-view')}>
142119
{this.renderMainView(children[1])}
143120
</div>
144121
) : (
145122
<SplitPane
146-
className={classNames(
147-
viewClassName,
148-
splitClassName,
149-
'cascading-pane-view'
150-
)}
123+
className={classNames(viewClassName, splitClassName, 'cascading-pane-view')}
151124
split="vertical"
152125
minSize={50}
153126
defaultSize={defaultSize || 150}
@@ -187,23 +160,21 @@ CascadingPane.propTypes = {
187160
navDataSelector: PropTypes.func,
188161
mainDataSelector: PropTypes.func,
189162
subDataSelector: PropTypes.func,
190-
children: PropTypes.arrayOf(propValue => {
163+
children: PropTypes.arrayOf((propValue) => {
191164
if (propValue.length !== 3) {
192165
return new Error(
193-
'The Cascading Pane requires exactly three children: CascadingPane.Nav, CascadingPane.MainView and CascadingPane.SubView'
166+
'The Cascading Pane requires exactly three children: CascadingPane.Nav, CascadingPane.MainView and CascadingPane.SubView',
194167
);
195168
}
196169
const roles = ['nav', 'mainView', 'subView'];
197-
const rolesMatch = propValue.every(
198-
(child, idx) => child.props.role === roles[idx]
199-
);
170+
const rolesMatch = propValue.every((child, idx) => child.props.role === roles[idx]);
200171
if (!rolesMatch) {
201172
return new Error(
202-
'The Cascading Pane requires exactly three children in the following order: CascadingPane.Nav, CascadingPane.MainView and CascadingPane.SubView'
173+
'The Cascading Pane requires exactly three children in the following order: CascadingPane.Nav, CascadingPane.MainView and CascadingPane.SubView',
203174
);
204175
}
205176
}).isRequired,
206-
visibilityFilter: PropTypes.object
177+
visibilityFilter: PropTypes.object,
207178
};
208179

209180
CascadingPane.defaultProps = {
@@ -212,17 +183,16 @@ CascadingPane.defaultProps = {
212183
splitClassName: '',
213184
getCascadingNav: f => f,
214185
getCascadingMainView: f => f,
215-
getCascadingSubView: f => f,
216186
navData: [],
217187
mainData: [],
218188
subData: {},
219189
location: {
220190
query: {
221191
cascNav: '',
222-
cascSelect: ''
223-
}
192+
cascSelect: '',
193+
},
224194
},
225-
defaultSize: 0
195+
defaultSize: 0,
226196
};
227197

228198
export default connect((state, props) => {
@@ -234,25 +204,16 @@ export default connect((state, props) => {
234204
navFetch,
235205
mainViewFetch,
236206
subViewFetch,
237-
navData: props.navDataSelector
238-
? props.navDataSelector(casData)(state)
239-
: casData.navData,
207+
navData: props.navDataSelector ? props.navDataSelector(casData)(state) : casData.navData,
240208
mainData: props.mainDataSelector
241209
? props.mainDataSelector(casData)(state)
242210
: casData.mainData,
243-
subData: props.subDataSelector
244-
? props.subDataSelector(casData)(state)
245-
: casData.subData,
211+
subData: props.subDataSelector ? props.subDataSelector(casData)(state) : casData.subData,
246212
visibilityFilter: state.visibilityFilter,
247-
fetchedNav:
248-
navFetch && !navFetch.isFetching && navFetch.status === 'success',
213+
fetchedNav: navFetch && !navFetch.isFetching && navFetch.status === 'success',
249214
fetchedMainView:
250-
mainViewFetch &&
251-
!mainViewFetch.isFetching &&
252-
mainViewFetch.status === 'success',
215+
mainViewFetch && !mainViewFetch.isFetching && mainViewFetch.status === 'success',
253216
fetchedSubView:
254-
subViewFetch &&
255-
!subViewFetch.isFetching &&
256-
subViewFetch.status === 'success'
217+
subViewFetch && !subViewFetch.isFetching && subViewFetch.status === 'success',
257218
};
258219
})(CascadingPane);

0 commit comments

Comments
 (0)