Skip to content

Commit e2dfaf1

Browse files
brunolemosbrunolemos
committed
[Patch] Fix ItemSeparatorComponent's leadingItem prop not being updated
facebook/react-native#25114 facebook/react-native#24592
1 parent 1db1b11 commit e2dfaf1

File tree

2 files changed

+113
-24
lines changed

2 files changed

+113
-24
lines changed

‎patches/react-native+0.59.8.patch

Lines changed: 76 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,79 @@
1-
diff --git a/node_modules/react-native/React/Views/RCTBorderDrawing.m b/node_modules/react-native/React/Views/RCTBorderDrawing.m
2-
index 2a8d105..a92db47 100644
3-
--- a/node_modules/react-native/React/Views/RCTBorderDrawing.m
4-
+++ b/node_modules/react-native/React/Views/RCTBorderDrawing.m
5-
@@ -224,13 +224,15 @@ static CGContextRef RCTUIGraphicsBeginImageContext(CGSize size, CGColorRef backg
6-
borderInsets.right + MAX(cornerInsets.bottomRight.width, cornerInsets.topRight.width)
7-
};
1+
diff --git a/node_modules/react-native/Libraries/Lists/VirtualizedList.js b/node_modules/react-native/Libraries/Lists/VirtualizedList.js
2+
index e02c7ad..86da589 100644
3+
--- a/node_modules/react-native/Libraries/Lists/VirtualizedList.js
4+
+++ b/node_modules/react-native/Libraries/Lists/VirtualizedList.js
5+
@@ -1641,26 +1641,36 @@ class VirtualizedList extends React.PureComponent<Props, State> {
6+
}
7+
}
88

9-
- // Asymmetrical edgeInsets cause strange artifacting on iOS 10 and earlier.
10-
- edgeInsets = (UIEdgeInsets){
11-
- MAX(edgeInsets.top, edgeInsets.bottom),
12-
- MAX(edgeInsets.left, edgeInsets.right),
13-
- MAX(edgeInsets.top, edgeInsets.bottom),
14-
- MAX(edgeInsets.left, edgeInsets.right),
15-
- };
16-
+ if (hasCornerRadii) {
17-
+ // Asymmetrical edgeInsets cause strange artifacting on iOS 10 and earlier.
18-
+ edgeInsets = (UIEdgeInsets){
19-
+ MAX(edgeInsets.top, edgeInsets.bottom),
20-
+ MAX(edgeInsets.left, edgeInsets.right),
21-
+ MAX(edgeInsets.top, edgeInsets.bottom),
22-
+ MAX(edgeInsets.left, edgeInsets.right),
9+
-class CellRenderer extends React.Component<
10+
- {
11+
- CellRendererComponent?: ?React.ComponentType<any>,
12+
- ItemSeparatorComponent: ?React.ComponentType<*>,
13+
- cellKey: string,
14+
- fillRateHelper: FillRateHelper,
15+
- horizontal: ?boolean,
16+
- index: number,
17+
- inversionStyle: ViewStyleProp,
18+
- item: Item,
19+
- onLayout: (event: Object) => void, // This is extracted by ScrollViewStickyHeader
20+
- onUnmount: (cellKey: string) => void,
21+
- onUpdateSeparators: (cellKeys: Array<?string>, props: Object) => void,
22+
- parentProps: {
23+
- getItemLayout?: ?Function,
24+
- renderItem: renderItemType,
25+
- },
26+
- prevCellKey: ?string,
27+
+type CellRendererProps = {
28+
+ CellRendererComponent?: ?React.ComponentType<any>,
29+
+ ItemSeparatorComponent: ?React.ComponentType<*>,
30+
+ cellKey: string,
31+
+ fillRateHelper: FillRateHelper,
32+
+ horizontal: ?boolean,
33+
+ index: number,
34+
+ inversionStyle: ViewStyleProp,
35+
+ item: Item,
36+
+ onLayout: (event: Object) => void, // This is extracted by ScrollViewStickyHeader
37+
+ onUnmount: (cellKey: string) => void,
38+
+ onUpdateSeparators: (cellKeys: Array<?string>, props: Object) => void,
39+
+ parentProps: {
40+
+ getItemLayout?: ?Function,
41+
+ renderItem?: ?RenderItemType<Item>,
42+
+ ListItemComponent?: ?(React.ComponentType<any> | React.Element<any>),
43+
},
44+
- $FlowFixMeState,
45+
+ prevCellKey: ?string,
46+
+};
47+
+
48+
+type CellRendererState = {
49+
+ separatorProps: $ReadOnly<{|
50+
+ highlighted: boolean,
51+
+ leadingItem: ?Item,
52+
+ |}>,
53+
+};
54+
+
55+
+class CellRenderer extends React.Component<
56+
+ CellRendererProps,
57+
+ CellRendererState,
58+
> {
59+
state = {
60+
separatorProps: {
61+
@@ -1683,6 +1693,18 @@ class CellRenderer extends React.Component<
62+
};
63+
}
64+
65+
+ static getDerivedStateFromProps(
66+
+ props: CellRendererProps,
67+
+ prevState: CellRendererState,
68+
+ ): ?CellRendererState {
69+
+ return {
70+
+ separatorProps: {
71+
+ ...prevState.separatorProps,
72+
+ leadingItem: props.item,
73+
+ },
2374
+ };
2475
+ }
25-
26-
const CGSize size = makeStretchable ? (CGSize){
27-
// 1pt for the middle stretchable area along each axis
76+
+
77+
// TODO: consider factoring separator stuff out of VirtualizedList into FlatList since it's not
78+
// reused by SectionList and we can keep VirtualizedList simpler.
79+
_separators = {

‎patches/react-native-web+0.11.1.patch

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
diff --git a/node_modules/react-native-web/dist/exports/VirtualizedList/index.js b/node_modules/react-native-web/dist/exports/VirtualizedList/index.js
2+
index e60fa0c..bf9cb04 100644
3+
--- a/node_modules/react-native-web/dist/exports/VirtualizedList/index.js
4+
+++ b/node_modules/react-native-web/dist/exports/VirtualizedList/index.js
5+
@@ -6,5 +6,6 @@
6+
*
7+
*
8+
*/
9+
+
10+
import VirtualizedList from '../../vendor/react-native/VirtualizedList';
11+
export default VirtualizedList;
12+
\ No newline at end of file
13+
diff --git a/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js b/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
14+
index c08437e..68d082b 100644
15+
--- a/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
16+
+++ b/node_modules/react-native-web/dist/vendor/react-native/VirtualizedList/index.js
17+
@@ -1,3 +1,4 @@
18+
+
19+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
20+
21+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
22+
@@ -1380,6 +1381,15 @@ function (_React$Component) {
23+
// reused by SectionList and we can keep VirtualizedList simpler.
24+
;
25+
26+
+ CellRenderer.getDerivedStateFromProps = function getDerivedStateFromProps(props, prevState) {
27+
+ return {
28+
+ separatorProps: {
29+
+ ...prevState.separatorProps,
30+
+ leadingItem: props.item,
31+
+ },
32+
+ };
33+
+ };
34+
+
35+
_proto2.updateSeparatorProps = function updateSeparatorProps(newProps) {
36+
this.setState(function (state) {
37+
return {

0 commit comments

Comments
 (0)