Skip to content

Commit

Permalink
Properly clear openRowID when a row is swiped to closed position.
Browse files Browse the repository at this point in the history
Summary:
If a SwipeableRow does not have background color defined, QuickAction is rendered below the row. In such case, you can leverage openRowID defined in dataSource. For instance, one can render quickAction only for the open row. The openRowID, however, does not clear when the row is closed. It only clears when the ListView is scrolled. This is s small PR to fix address it.
Closes #11380

Differential Revision: D4500952

Pulled By: mkonicek

fbshipit-source-id: a965dfb45b77cc1669de405b627d13e2cee59420
  • Loading branch information
cryptobiote authored and facebook-github-bot committed Feb 2, 2017
1 parent 5938e16 commit 2edd455
Show file tree
Hide file tree
Showing 2 changed files with 10 additions and 0 deletions.
7 changes: 7 additions & 0 deletions Libraries/Experimental/SwipeableRow/SwipeableListView.js
Original file line number Diff line number Diff line change
Expand Up @@ -196,6 +196,7 @@ class SwipeableListView extends React.Component {
maxSwipeDistance={this._getMaxSwipeDistance(rowData, sectionID, rowID)}
key={rowID}
onOpen={() => this._onOpen(rowData.id)}
onClose={() => this._onClose(rowData.id)}
onSwipeEnd={() => this._setListViewScrollable(true)}
onSwipeStart={() => this._setListViewScrollable(false)}
shouldBounceOnMount={shouldBounceOnMount}>
Expand All @@ -209,6 +210,12 @@ class SwipeableListView extends React.Component {
dataSource: this.state.dataSource.setOpenRowID(rowID),
});
}

_onClose(rowID: string): void {
this.setState({
dataSource: this.state.dataSource.setOpenRowID(null),
});
}
}

module.exports = SwipeableListView;
3 changes: 3 additions & 0 deletions Libraries/Experimental/SwipeableRow/SwipeableRow.js
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,7 @@ const SwipeableRow = React.createClass({
isOpen: PropTypes.bool,
maxSwipeDistance: PropTypes.number.isRequired,
onOpen: PropTypes.func.isRequired,
onClose: PropTypes.func.isRequired,
onSwipeEnd: PropTypes.func.isRequired,
onSwipeStart: PropTypes.func.isRequired,
// Should bounce the row on mount
Expand Down Expand Up @@ -120,6 +121,7 @@ const SwipeableRow = React.createClass({
isOpen: false,
maxSwipeDistance: 0,
onOpen: emptyFunction,
onClose: emptyFunction,
onSwipeEnd: emptyFunction,
onSwipeStart: emptyFunction,
swipeThreshold: 30,
Expand Down Expand Up @@ -369,6 +371,7 @@ const SwipeableRow = React.createClass({
this._animateToOpenPositionWith(gestureState.vx, horizontalDistance);
} else {
// Swiped right
this.props.onClose();
this._animateToClosedPosition();
}
} else {
Expand Down

0 comments on commit 2edd455

Please sign in to comment.