Alex Hunt
35f6ed1146
Update SectionList to accept React elements for separators ( #53599 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/53599
Runtime and types fix for the `ItemSeparatorComponent` prop on `virtualized-list` components (`FlatList`, `SectionList`, `VirtualizedList`).
- Docs source, where this prop (adjacent to other `*Component` props) is documented as accepting elements: https://reactnative.dev/docs/virtualizedlist#itemseparatorcomponent .
- Existing runtime behaviour matching this definition: https://github.com/facebook/react-native/blob/8d33e1c205b12fe27f4319e6566bb0c088197810/packages/virtualized-lists/Lists/VirtualizedListCellRenderer.js#L197-L203
**Changes**
- Update Flow, manual TS type defs.
- Align runtime behaviour in `VirtualizedSectionList` to add matching `React.isValidElement()` behaviour.
Resolves https://github.com/facebook/react-native/issues/53531 .
Changelog:
[General][Fixed] - The `ItemSeparatorComponent` prop on list components now accepts a React element as well as a component function.
Reviewed By: cortinico
Differential Revision: D81675423
fbshipit-source-id: 3eed93b1bea89554988d6e20fa61b72e17be55df
2025-09-12 07:54:04 -07:00
Sam Zhou
cf664c65e2
Standardize subtyping error code into incompatible-type in react native and metro ( #53312 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/53312
Changelog: [Internal]
Reviewed By: jbrown215
Differential Revision: D80400976
fbshipit-source-id: 196af69c0b9621b2a2675b232406639773e04933
2025-08-18 09:04:31 -07:00
Sam Zhou
35bee1a857
Add annotations to fix future natural inference errors in xplat/js
...
Summary: Changelog: [Internal]
Reviewed By: marcoww6
Differential Revision: D80207164
fbshipit-source-id: e9a786c83f89a97db8b383812767978c47d9536c
2025-08-13 18:15:27 -07:00
Sam Zhou
af1bcb6d44
Mass replace $FlowIgnore with $FlowFixMe in react-native ( #53076 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/53076
Changelog: [Internal]
Reviewed By: marcoww6
Differential Revision: D79672242
fbshipit-source-id: 560f057d8658ed602cf7241e584bade70d8f3a99
2025-08-05 15:44:41 -07:00
Jakub Piasecki
322142aab3
Further reduce naming collisions in the API snapshot ( #52281 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/52281
Changelog: [Internal]
Reviewed By: huntie
Differential Revision: D77355160
fbshipit-source-id: b1a59b3817b88bf6de953816fc272633b14b3a54
2025-06-26 03:37:05 -07:00
Jakub Piasecki
4f94028ca6
Reduce symbol collisions in the API snapshot ( #52213 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/52213
Changelog: [Internal]
Reviewed By: huntie
Differential Revision: D77207979
fbshipit-source-id: 10d8b9c8f24ddb52423197f5aa300402b1e45ebe
2025-06-25 00:16:24 -07:00
Susmita Horrow
f214a52a9a
Revert D76814453: Reduce symbol collisions in the API snapshot
...
Differential Revision:
D76814453
Original commit changeset: fffbf585d63e
Original Phabricator Diff: D76814453
fbshipit-source-id: 418ae90fb49c8c05f077bca7e434c039ad49c7ba
2025-06-23 01:43:20 -07:00
Jakub Piasecki
f338db9c17
Reduce symbol collisions in the API snapshot ( #52085 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/52085
Changelog: [Internal]
Reviewed By: huntie
Differential Revision: D76814453
fbshipit-source-id: fffbf585d63e282443830c08397ae5e4d745785a
2025-06-23 00:34:05 -07:00
Dawid Małecki
44b0f5560b
Fix VirtualizeSectionList generic arguments ( #51496 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/51496
Fixes problem with generics passed to `VirtualizedSectionList` in generated types. The `flow-api-translator` creates a re-declaration for `export default` variables which shadows generics.
Changelog:
[Internal]
Reviewed By: huntie
Differential Revision: D75141051
fbshipit-source-id: 260ef066038320eee3ffa93692f77f1eff5c9205
2025-05-22 03:41:25 -07:00
Tim Yung
3e70714cff
RN: Prefer Destructured Import for useEffect ( #51405 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/51405
Prefers using this as a destructured import instead of as a member expression of `React`.
Changelog:
[Internal]
Reviewed By: SamChou19815
Differential Revision: D74894042
fbshipit-source-id: 93fbadb32e4a1225836db9d729d7bf502ebddd84
2025-05-16 16:33:18 -07:00
Tim Yung
00108a1ac3
RN: Prefer Destructured Import for useState ( #51403 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/51403
Prefers using this as a destructured import instead of as a member expression of `React`.
Changelog:
[Internal]
Reviewed By: SamChou19815
Differential Revision: D74891875
fbshipit-source-id: 981e85b5da84950c9e66e8d6b6496019e536711d
2025-05-16 16:33:18 -07:00
Dawid Małecki
cfd4932bb0
Fix generated types base on __typetests__ ( #51383 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/51383
This diff is a set of alignments/improvements in generated TS types. It includes:
- extending `AppStateStatus` with `extension` and `unknown`,
- exporting `AnimatedProps` under `Animated` namespace,
- resolving issue with discriminated unions in `ProgressBarAndroidTypes`,
- fixing `StyleSheet.create` type to accept only specified style properties,
- extending `TextProps` with `AccessibilityProps`,
extending Fn Args generic with `$ReadOnlyArray` in `ErrorUtils`,
- small `__typetests__` adjustments,
- removing type test `styleDimensionValueValidAnimated` as `DimensionValue` no longer accepts `AnimatedNode`,
- removing `styleDimensionValueInvalid` as `DimensionValue` accepts any string now - template literal types in Flow are not supported,
- changing `overlayColor` type to `ColorValue` to align with manual types,
- fixing `AnimatedPropsAllowList` type which wasn't correct in TS because index signature type was different from style type,
- using `DeviceEventEmitter` instead of `DeviceEventEmitterStatic` in type tests which is equivalent in both new and old types - `DeviceEventEmitterStatic` was only a type of `DeviceEventEmitter`,
- removing type test for checking forwarded key type - doesn't work with new types and that shouldn't be supported,
- removing `Animated.legacyRef` type test - not included in new types,
- adding `DOMRect` from "dom" lib to `globals.d.ts` to not include "dom" lib in the tsconfig - tries to compare globals with `lib.dom.d.ts` and produces many errors,
- exporting `SectionListData`,
Changelog:
[Internal]
Reviewed By: huntie
Differential Revision: D74807552
fbshipit-source-id: c5254ea0f701f3602b9d716faeb50ca1ab21b013
2025-05-16 09:50:51 -07:00
Jakub Piasecki
ad5f5a332a
Make VirtualizedList use ScrollViewProps directly ( #50416 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50416
Changelog: [Internal]
Reviewed By: huntie
Differential Revision: D72223126
fbshipit-source-id: 8598a02c31e16302a3f2ce8678602a33fc090c8a
2025-04-01 03:46:00 -07:00
Andrew Wang
63160341d9
Revert D70615310: Collection of small type updates
...
Differential Revision:
D70615310
Original commit changeset: 11dc833aeeeb
Original Phabricator Diff: D70615310
fbshipit-source-id: 6508f8e27e1a17f6086fdecb5177472233dc3480
2025-03-31 06:14:37 -07:00
Jakub Piasecki
f8a4f80b6e
Collection of small type updates ( #50312 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50312
Changelog: [Internal]
Reviewed By: huntie
Differential Revision: D70615310
fbshipit-source-id: 11dc833aeeeb67e03808b18b50ff79ae6aa956ec
2025-03-31 04:13:04 -07:00
Sam Zhou
cbd2ee55ef
Eliminate $PropertyType and $ElementType in react-native ( #50262 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50262
Prepare for their removal in Flow
Changelog: [Internal]
Reviewed By: gkz
Differential Revision: D71823860
fbshipit-source-id: e1e18424ae731cd323999316a7f3a5d42f4b5b91
2025-03-25 14:00:17 -07:00
Jakub Piasecki
b2d88d33b7
Align SectionList types with OSS ( #50074 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/50074
Changelog: [Internal]
Reviewed By: huntie
Differential Revision: D71318882
fbshipit-source-id: ac26820bd4a9200c4156b703dce036535f677025
2025-03-25 11:03:54 -07:00
Jakub Piasecki
7b5b7b20de
Update VirtualizedSectionList props name ( #49592 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/49592
Changelog: [Internal]
Reviewed By: huntie
Differential Revision: D69984225
fbshipit-source-id: 753917f31a803c3bc8ea2e4635ec1d58cecb9224
2025-02-23 23:59:51 -08:00
Jakub Piasecki
b8e2bcd60d
Update types in virtualized-lists so that they produce valid TS output ( #49263 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/49263
Changelog: [Internal]
Reviewed By: huntie
Differential Revision: D69308533
fbshipit-source-id: 36dd38a5bfce3b19eabcf04ef5f14e006d581bcd
2025-02-11 09:25:22 -08:00
Jakub Piasecki
1cf4c84ba0
Update files in packages/virtualized-lists to use export syntax ( #49262 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/49262
Changelog: [General][Breaking] Deep imports into `react-native/virtualized-lists` with require syntax may need to be appended with `.default`
Reviewed By: huntie
Differential Revision: D69308532
fbshipit-source-id: 6de15d46e0931616bc9849edbccb7cf745e15dd5
2025-02-11 09:25:22 -08:00
Dawid Małecki
f36bfe5dfa
Remove redundant {||} syntax ( #48686 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/48686
Changelog:
[Internal] - Removed redundant `{||}` syntax
Reviewed By: javache
Differential Revision: D68205038
fbshipit-source-id: f7d3271142b6443a5859c3b668b7aebd3ce3ef3f
2025-01-15 07:07:01 -08:00
Sam Zhou
3a01a0c9c5
Fix signature of VirtualizedSectionList ( #47318 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/47318
Changelog: [Internal]
Reviewed By: gkz
Differential Revision: D65239931
fbshipit-source-id: c09eaad8d63f6c415e5d07a4d00dd0acc636c6b9
2024-10-30 18:15:03 -07:00
Sam Zhou
9b5fef32f1
Update some React.AbstractComponent type to use component type ( #46855 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/46855
Prepare for the ref-as-prop typing change in flow.
Changelog: [Internal]
Reviewed By: rshest
Differential Revision: D63947642
fbshipit-source-id: bec8a2498961b5bc602d86ecb2b5a4b5c4785e09
2024-10-08 09:20:42 -07:00
Sam Zhou
5b96e90f77
Replace React.Element<any> and unnecessarily specific React.Element with React.MixedElement ( #45923 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45923
Changelog: [Internal]
Reviewed By: gkz
Differential Revision: D60872182
fbshipit-source-id: b81fb43968c52cbfdb4a9fa57f1175aabc2a3939
2024-08-06 21:33:08 -07:00
Sam Zhou
4f47b385fa
Cleanup all uses of internal flow type React$ElementRef in react-native ( #45904 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45904
Flow will error on these dollar types soon. For all the ones changed here, they can all be further simplified.
Changelog: [Internal]
Reviewed By: gkz
Differential Revision: D60786768
fbshipit-source-id: e26bf0be1c4a933fc0bd8b59827e10cbd7242a83
2024-08-05 14:51:30 -07:00
Nick Gerleman
12b64b7824
Loosen SectionList renderItem required return type ( #45305 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/45305
Allow SectionList render functions to return any React node, instead of just React.Element. This matches VirtualizedList/FlatList, and general Flow component conventions.
Changelog:
[General][Fixed] - Loosen SectionList `renderItem` required return type
Reviewed By: joevilches
Differential Revision: D59404511
fbshipit-source-id: 3055d8f01845ff5ef8ae75b87f60d8cd26dc07b4
2024-07-08 17:40:59 -07:00
Fabrizio Cucci
95de14dc53
Drop unused code + minor lint fixes ( #44645 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44645
Changelog: [Internal]
As per title.
Reviewed By: NickGerleman
Differential Revision: D57664819
fbshipit-source-id: 2388bd01c00d814a12de7f2e285b78f207e6012c
2024-05-22 12:11:33 -07:00
Biki-das
6204ea36d3
- fixes component unmounting behaviour in itemSeperatorComponent ( #43223 )
...
Summary:
Reopen in reference to https://github.com/facebook/react-native/issues/42435 , as it had a lot of commits and fixes making it messed up.
Weirdly when using a [Section List](https://reactnative.dev/docs/sectionlist ) specifically when using the [SectionSeperatorComponent](https://reactnative.dev/docs/sectionlist#sectionseparatorcomponent ), and adding additional Data on the renderItem List, there is a unmount occurring as the new Data is added, this only happens while using the `SectionSeparatorComponent` and limited to the same
**Here is the Current Behaviour**
https://github.com/facebook/react-native/assets/72331432/0622e789-ddbc-4038-8ccc-a421050eecbf
**Here is the Expected Behaviour After Fixes**
https://github.com/facebook/react-native/assets/72331432/2f0cc3a9-da97-43f5-8a4b-3faca74ae834
The issues is happening because the Parent View gets removed, as we add Data, the separator moves causing the unmount, the solution that i proposed here is to conditionally render to make sure that our separator renders correctly which required to add an empty view as the `itemSeparatorComponent`.
## Changelog:
[General] [Added] - Fixes SectionList Unmounting issue with separatorComponent on data addition and removal.
Pull Request resolved: https://github.com/facebook/react-native/pull/43223
Test Plan:
i used the `rn-tester` App to test out the changes below is the code to test the same.
Update the snapshots to align with the changes.
```
import React, {useEffect, useState} from 'react';
import {
StyleSheet,
Text,
View,
SafeAreaView,
StatusBar,
SectionList,
Image,
} from 'react-native';
interface Item {
id: string;
title: string;
imgSrc: string;
}
interface Section {
title: string;
data: Item[];
}
const keyExtractor = (item: Item, index: number) => `${item.title}-${index}`;
const renderItem = ({item, index}: {item: Item; index: number}) => {
return <ItemComponent item={item} index={index} />;
};
const additionalFruits = [
{
id: '7',
title: 'Sandwich',
imgSrc:
'https://img.freepik.com/premium-vector/sanwich-vector-isolated-fast-food_484148-2.jpg ',
},
{
id: '8',
title: 'Burger',
imgSrc:
'https://static.vecteezy.com/system/resources/thumbnails/033/494/666/original/animated-illustration-of-burger-cartoon-for-foods-menu-animation-free-video.jpg ',
},
{
id: '9',
title: 'Juice',
imgSrc:
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQHg9yLXE7Jlq4OM9ey64TW4D9qUFaeGU76rg&usqp=CAU ',
},
{
id: '10',
title: 'Milkshake',
imgSrc:
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcROpBez3eZKvEVdxBce9XyG6j6caDFMjV_xUQ&usqp=CAU ',
},
];
const DATA: Section[] = [
{
title: 'Items',
data: [
{
id: '1',
title: 'Cake',
imgSrc:
'https://static.vecteezy.com/system/resources/previews/012/132/227/original/cute-cake-cartoon-icon-illustration-food-recreation-icon-concept-isolated-premium-flat-cartoon-style-vector.jpg ',
},
{
id: '2',
title: 'Pizza',
imgSrc:
'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcR2kYjlsayzKZx4hFo6fbH7S8pde2JRo2a0hfaeoz3O7bjqdJjhI0tFiSROM8G4UbdbwXU&usqp=CAU ',
},
{
id: '3',
title: 'Coke',
imgSrc:
'https://png.pngtree.com/png-clipart/20220116/original/pngtree-cartoon-hand-painted-coke-bottle-png-image_7106844.png ',
},
{
id: '4',
title: 'Noodles',
imgSrc:
'https://thumbs.dreamstime.com/z/cute-cartoon-vector-bowl-noodle-isolated-white-background-115120959.jpg ',
},
{
id: '5',
title: 'Pasta',
imgSrc:
'https://t4.ftcdn.net/jpg/02/65/00/69/360_F_265006936_2dlz2VtcqZZUbco1VnDpU2diyd8OagFS.jpg ',
},
{
id: '6',
title: 'Fries',
imgSrc:
'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxISEBUQEBAVFRMTERkVFRISDw8PEBIVFRcWFhcSFRYYHSggGBolGxgVITEhJSkrLi4uFx8zODMtNygtLisBCgoKDg0OGxAQGismICYwLS4vLS0tLS0tLTUvLS0tLS0tLS0vLS0tLS0tLy0tLS0tLS0tLS0tLS0tLS0tLS0tLf/AABEIAOMA3gMBIgACEQEDEQH/xAAcAAEAAgMBAQEAAAAAAAAAAAAABQYCBAcDAQj/xABEEAACAQIBBwgEDAUEAwAAAAAAAQIDEQQFEiExQVGRBhMiYXGBscFSkqHRBxcjMkJygrLC0uHwJDNiY6IUNFPxFUOT/8QAGwEBAAIDAQEAAAAAAAAAAAAAAAQFAQIDBgf/xAAzEQACAQICBwcDBAMBAAAAAAAAAQIDEQQhBRIxQVFhkRNxgaGx0fAUIuEVI2LBJDLxBv/aAAwDAQACEQMRAD8A7iAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAYZ63riYuDMHxHji62ZByMVJKEXKWxGUruyPcGjhsoQm1FtKbTtFvXbXbebxrSqwqx1oO6EouLswADoYAAAAAAAAAAAAAAAAAAAAAAAAAAAABq4nFZjStfRfXY51asKUdabsjMYuTsjaILKVFZ0otaJL2PX5m9QylCdTmrNSzc7TazV7aGYZYp9FS3Oz7H+viV2kVDEYZzhnq5+/kd6N4VEnv+IrfJzGOjiOZk+jN5vUpfRl36u9FnyvLoLrfkyl5bp2mqi0X2rZJanw8Cw4jKCq0aM9s02/rRspLjcraGK/w6tN7ll4tJ+vmTq9LWqQqLft7188iFyhP5ehb/kX3ol8Od46pfE0ktjg+/P8A0RboZUfO06Uo/wAzOtJO1nFX0o6aHxMIJwltbVjXG05OMLbk/VslgYTnZNvYrkDlDK06UHNNN3Vk0rPTpXC5c4nGU8O0p3z4ECnSlUdolhBhTldJrar8TMlHIAAAAAAAAAAAAAAAAAAAAAGKknqZqY+epX62V/A5SccbKP0ZLMt1xTafHO4kCrj4wrKm1lvd9h3p4eU4uS3K5bSOyqvmvtXgamUcqukoye2ola2y95ey/E3sqroJ7mcsTXhiMNU1N1n5p/0ZhCUJRb3kG6mZiaEt8nB/asl4kzlGs/maLNad+kreXJNQjJa41E1wb8iVxuITk57LJ91kVFPFOGGlBPa15p39LeJLnT1nF8n6/kr+Mq85zlO3zW3D7Ozx4mjhcQ83Mvoi3JdTla/gj3yY71HJ7m+9tEfPoVJLYm+Gsrm7NpcCzhFf68MyZyZk2VSp/qKzsk06cdTlm6py6ty2+O9HFRli6MYu7hUafere888jYzncPCT1pZsu2Ojws+81cHG2Ph11E+Kv7yTh2lVhHmvVEaSlJz1tyeRcco10oON9L0FUytJSnTpN2Td5Pcm7X4ZxJ4qtd6e3iVrHVr1KkvQi0u22b4tm2Lxnb1dfcti+cbnLCUdX54HRKVeDgpxknBq6kmnG3aeeJxShG+u+q20qHJnEy5iVNvoqpdcNKXVezMMp4+UalovRGLbWxtq/u4llV0xJq0I5tbeD395w+gtUcb7PQ9sPyqqqu4SipwlUzUklGSu7LNe3v4l2OZ8lMNzmMp7oXm/srR/lmnTCZoqdWdJym287K/dnn3mNIU6dOajBWyz/AKAALMrwAAAAAAAAAAAAAACOyrDQpdz8isY75OvTrbG7Pq0WvwfsLnWp50XF7UVTKNHOhKD17OqSPNaWpdnWVRbJeqy9LFjgp5WfxM1uUKbUJbm1xt7iy85n4WM99OD79F/MrVSXO4a+1Rv3x1+D4kvkPEKeCtfTC8Xxzl7GjTR801Vg98X5f9OmIi1Tjyl6kXlr+V2SXu8zCdb+Gv8A27cVYzyy/kn2rxNKd5UKdNa5yjFcf0KpvJd5KhH7V3mvkypZu/V5kdleXTnZ7Pwot2HyVQpQbm77XJtxXckVvlDToaZUs/ObtpazHo2Jq+w3dFqTndHajWjOpkn32yPTkfXdqkNmiS7XofguBJOWZjKE98lHi838RFcmYNRuk25S2LYlb3m3liXRjOL+bJNNePFIwp9nWjLg15CpG9VrjddVYlMRWteWxK/BFcqP5GT2zml220+NzYxGNvRenTJ+yTu/Mzo0LypQeqN5vut5sjXtlz9MzNOOorv5YlMDTVKkovYry7dbIPFVG4SqPXUnZdi6T/CiSytXtTzVrk7d233d5A4xylUp0IvctGxzelnenmKMbvWfy2fsWvk1hI0qfOuVpzjdu9lGOtLwbJ3JGUuelNR0wgl03tbvoXVoK7lqtm01BbX/AIx/aLHyfwfNUIprpS6cu16l3KyLvRTnKpZPJLP5zeZV4pJwdSW1vL5yRKgA9EVoAAAAAAAAAAAAAABpV8U4ysrWRCY/EwlWko/OUU5Ldf8Aa4m9jm4zd1r0p7yjyxU41nOXzs55y8YnlcfXnUcqUtz2cPi8mWuEoKX3Lh1JvDdGc4bJfKLv0SXG3E1Mk4t0as6X0al423P6Ev3vMqldPMqxejOs+yWiz7HY8MbG2Ipy9Jx4ppeFirpVZRldbc/RomqKd1LevNG3luXyX2l4M0cnV86tQp+i87xa8GbWW38mvr+TIrITvjF/TB/dt5mYZo2gv2m+8sOX61qaj6UvYv1sVHKM9Nty8SwZdqXqKO6Ptb/6K/lJdP7KN5S2I3wkbJFvVCMcKqdHQnSTutcrq7b7fMg6M86nOnuV4+NuPiS+T694Zno6uwhsQubxHU37Jft8DlVlrJrxOdFPOPiRc3nSpxerOu+taPK5Y8O7zk9yUV95+KITm7VGt0nb2krh5ZlLOe5y9y4WRxrPJW+XJFXNKx4Yipn1uqGjvX6+BrZCjzmMc9kc6X4Y+N+4xc8yjKe2Wrv0LzZIcjMP0ZTf0pW7oq/i3wJMVaPka1Ptpyfh7knQo8/jYwemMPnbrR6Vu9tIu5WcZjo0Y3zdb0JWjd67mzyfx1Ss5SkkqcdC1tuWvX1LxL/RdaMP2krt538PQpcTGU4qexLInQAXpAAAAAAAAAAAAAAAANfFYdTjZ69j3MofKLAtNztaUdE14S/fUX3FqXNzzHaWY817pWdnxOUYnL+JqPp1U9FtMKS0btESi0vRi3GS/wBvJrnzV8snw4FzomhVquTi1ZW23334J8D0w+JzU4v5slp6nskjerVtFN7qkbPcm1+hX6WItJOWmN1ddW32G5UrOClCT1PQ9zi78HYoqlFpplxVw7jJX3k9lv8Alr6/kzR5NU/4ipL0YW75ZvuZM43CZ2HnUldWpupFandRb0kfybh0ak/Skl6sV72c4pxhmQozTpSS7jHKUr133eCI3FYaVSvGnG2dJJK7stulm9jn/EPtX3UfMEv42m90G/ZMxf713HWL1YXXAka2DjQlCbq3bTjmKOluTjpvfUrI0Msq86e9u3tXvNrlBPp0n1vxiRmKxGfiacY6k03xbt7DFTOSaW5mlFN2k+ZjUjfENb5G3lSdoKK+k7dy/aNWH+5+2/BkbyoyjKNWMIStmRu9CfSenb1W4nOnTdSpGK4XJNKk6tSMVwueuWKls2mtiv5LzLXyeo5lKMfRWntbu/M5hWylVc87O6StpzVrXcK3KrGU7KFe19L6FJ+MSyWEm7JNefsd62jqkoaqcfP2Oj5UnKrXVKGlpqKX9T1+XAu2AwqpU4046orXve197OPfBtlTE18pQU6zlFRnOacIaVmta0tHSlE7WX2jMN2cXN7Xl4flnndKQlRlGi3sV8vEAAtCrAAAAAAAAAAAAAAABxTK1Hm61Wn6FWUe5SaXsO1nI+XdHMxtTdLNkvtRV/amVuk43hGXB+qL/wD8/L96cOKv0fsyDlImsi4iLq0ZySdpxhJNXWnown4d8SvuR9o4hwd12NbGtxS6qkeoxGH7Wm47zq2PrRzZQ1uUXF22XVir5Lqyo1HQnqbvF7L9Xb4o8clcoaclm1ZZstkpan2vf1m9j8Oq0M6DTlHTGUWnfquiHUvnGew84qEsO3TqK1/lzUxUvl39ZeCPbB/7qL/tvz95HUqzlNOWvOV9mnUSeDj8vnbqT9sl+pFl9slfgztNWi1yGX5dOn3+KIvJ3SxTfo39izfM2sr1b1lujH3v3EZkzKNOlKc6ktNrJLpSbbu7cNpsk5Qeqru3qb0oSdO0Vd29Tbq4qNOpKpLVFydtrelJLtZUsXXcpSqS+c22+1mxlDGurJvVG7aj27X1kbWlptuLPD0OzV3taLrC4fso3e1+XIwNHGPpdiN0jqzvJ9pNhtO09h0b4EsNfEV6uyFFQ9eSl+A7Ec5+BbC2wlWrb59ZRvvUIR08ZS4HRi5wytTR4PS09fGT5WXRe9wADuVwAAAAAAAAAAAAAAAObfCnQtVpVfSp5vqSv+M6SUz4T8PfCRqL/wBdVX+rJNeOaRcZHWoy69Cz0NU1MbDnddVZedjlzkYOQcjC5Qn0BINn2E5LSm+1Npny58NrGT1WKmndTlffzkr+J6f+Tr/81TuqVF5msfDVwi9qXQ01I8F0M6laUneUm3vlJyftMDEXNjKyVj5OVkazZlUldmBukYYbI5G7Xdos06cG5RjFXblZJa23oSOsDlLaj9A/BvguZyZQT1yi6j+221/i4loNXJ2EVKjTpLVTpxguyMVHyNovIq0Uj5vWqdpUlN7231YABscwAAAAAAAAAAAAAAAQ/KnB87g69NK7dJuK/qh04+2KJg+MxKKknF7zenN05qcdqafQ/O20+NkjyjwPMYqtRSsozeb9WWmH+LRGnmrNOzPp0ZqcVKOx2a7nmj4AfLgyBcHy4APKrPYfZzseLNkjDADZ8ubGDwxctCXWS3ILA89lLDwtdKopy3Wppz0+ql3kJiJXl2HSfgUyZ8rXxTWiMFTi9nTec+9KMfWJWHjrSSK3SVbssPUlyt1yR10AFweBAAAAAAAAAAAAAAAAAAAAAOXfCvk7Nq0sQlonHm5bs6Oni4t+oUK523lvk3n8FVileUFzkd94aWl2xzl3nEeopcbT1at+OZ7nQOI7XCKL2xy8Nq9vA+ny5g5GLqESxcnoecqh5ymY3MpGGw2LmINzUCTsrg8sTLRbeErsw3Y1us/QXwdZL/0+T6UWrSqLnpbHepa1+tQUF3HE+SuSv9VjKNG3RlVTlr0Qh0pdnRT4o/SSVtCLLBwzcjy+n69lCiu9+i/vyMgATzzIAAAAAAAAAAAAAAAAAAAAB8scA5X5NeGxdWl9HPzobsyXSjbsTt9ln6AK7yh5JYbGTjUrZ6lGGZenKKvFNtJ3TvZt8WRsTQdWKttRa6Jx8cJVbnfVas7Z93t3M4PcXOy/Flgd9b16f5D58WOB31vXp/kIP0VTl1PQfr+D/l0/JxkHZviywO+t69P8g+LLA763r0/yD6Kpy6j9ewn8un5OMg7N8WWB31vXp/kHxZYHfW9en+QfRVOXUfr2E/l0/Jxo0687vs0HcfiywO+t69P8h5fFVgPSrf8A1h+Q2jg6nI1lp7CPZrdPyQfwLZH/AJuMkv7UPZKb+4r9p1cjsiZJpYWhGhRTzIX+c86Tcm5Nt7XdkiWNKGpBI8tjcR9RXlU3PZ3LYAAdCKAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAf/Z',
},
],
},
];
const ItemComponent = ({item, index}: {item: Item; index: number}) => {
useEffect(() => {
console.log('Mount of', index, item.title);
return () => {
console.log('Unmount of', index, item.title);
};
}, []);
return (
<View style={styles.card}>
<Text style={styles.cardText}>{item.title}</Text>
<Image source={{uri: item.imgSrc}} style={styles.imageStyles} />
</View>
);
};
const App = () => {
const [data, setData] = useState(DATA);
const fetchNextPage = () => {
const newInnerData = [...data[0].data, ...additionalFruits];
setData([{...data[0], data: newInnerData}]);
};
return (
<SafeAreaView style={styles.container}>
<View style={styles.scrollView}>
<SectionList
keyExtractor={keyExtractor}
onEndReachedThreshold={0.5}
onEndReached={fetchNextPage}
sections={data}
renderItem={renderItem}
ItemSeparatorComponent={() => <View style={{height: 16}} />}
renderSectionHeader={({section}) => (
<Text style={styles.sectionHeaderText}>{section.title}</Text>
)}
/>
</View>
</SafeAreaView>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#F5F5F5',
paddingTop: StatusBar.currentHeight,
},
scrollView: {
paddingHorizontal: 16,
},
card: {
backgroundColor: '#FFFFFF',
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
gap: 8,
height: 200,
padding: 16,
borderRadius: 8,
marginBottom: 16,
borderWidth: 1,
},
cardText: {
fontSize: 30,
},
headerText: {
fontSize: 24,
textAlign: 'center',
marginBottom: 12,
},
footerText: {
fontSize: 24,
textAlign: 'center',
marginTop: 12,
},
sectionHeaderText: {
backgroundColor: '#FFFFFF',
fontSize: 24,
fontWeight: 'bold',
},
imageStyles: {
height: '100%',
width: 100,
},
});
export default App;
```
Reviewed By: yungsters
Differential Revision: D54301991
Pulled By: javache
fbshipit-source-id: d2cfafb1b4eb868761d849111b5abb7e9d584a46
2024-02-29 02:38:46 -08:00
Moti Zilberman
d6e0bc714a
Enable lint/sort-imports everywhere ( #41334 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/41334
TSIA.
Changelog: [Internal]
Reviewed By: robhogan
Differential Revision: D51025812
fbshipit-source-id: e10d437be775a6b80946483aa96460f34927f870
2023-11-06 12:59:38 -08:00
Nick Gerleman
8f7f0bf2a3
Extract logic to CellMetricsAggregator ( #37777 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/37777
This extracts the state and logic VirtualizedList uses to query information related to cell metrics. We will need to modify this (and other places) when fixing up RTL support for horizontal FlatList.
Changelog: [Internal]
Reviewed By: javache
Differential Revision: D46427052
fbshipit-source-id: 0a23f6c726447de0f20c583b4d507003efd6a754
2023-06-08 15:53:10 -07:00
Nick Gerleman
96225cec2b
Rename FrameMetrics to CellMetrics ( #37778 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/37778
These functions describe how to get the metrics of a specific cell. "Frame" here seems non-descriptive and redundant to the "Metrics" part. Renaming this before a larger refactor.
Changelog: [Internal]
Reviewed By: philIip
Differential Revision: D46427058
fbshipit-source-id: e9ad9cf15e1adfd07604eb11526de0ed8cf99000
2023-06-08 15:53:10 -07:00
George Zahariev
e2116d277d
Codemod $Shape to Partial in xplat, suppressing errors [4] ( #36960 )
...
Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/36960
We're deprecating the unsafe `$Shape` and moving to the safe `Partial`: https://fb.workplace.com/groups/flowlang/posts/1251655088773485
I have previously codemodded all locations that do not cause errors. Now start on the remaining ones: codemod and suppress.
Changelog: [Internal]
Reviewed By: SamChou19815
Differential Revision: D45076273
fbshipit-source-id: 27ebf33370143e19751dbdcfcc1876cf3c586e14
2023-04-18 13:49:07 -07:00
Nick Gerleman
0daf83ac51
Reconnect VirtualizedList Source History 2/2 (Apply D41745930 + history, D42805202, D43063551)
...
Summary:
This change re-applies D41745930 (https://github.com/facebook/react-native/commit/2e3dbe9c2fbff52448e2d5a7c1e4c96b1016cf25 ) (and D42805202 (https://github.com/facebook/react-native/commit/1479b2ac26fded3840c596f53e6eb86a4b0c2c71 ) which was also partially reverted), re-registers additions as moves, then applies D43063551 which has been added to the changes since migration.
Changelog: [Internal]
Reviewed By: hoxyq
Differential Revision: D43068114
fbshipit-source-id: 72997700bf9962d82a988599481e255b69e68a9b
2023-02-06 20:00:19 -08:00
Nick Gerleman
ebaa00e327
Reconnect VirtualizedList Source History 1/2 (Revert D41745930)
...
Summary:
This change reverts D41745930 (https://github.com/facebook/react-native/commit/2e3dbe9c2fbff52448e2d5a7c1e4c96b1016cf25 ) as part of a stack to splice back source history which was lost (Git registered the file moves as additions).
It is expected this diff will individually fail. The entire stack should be applied at once.
Changelog: [Internal]
Reviewed By: hoxyq
Differential Revision: D43068113
fbshipit-source-id: c8398629fe5dcc1ca4bf02f550adc00c78a8487a
2023-02-06 20:00:19 -08:00
Gabriel Donadel Dall'Agnol
2e3dbe9c2f
feat: Move virtualized lists to @react-native/virtualized-lists ( #35406 )
...
Summary:
This PR moves `VirtualizedList`, `VirtualizedSectionList`, and its files to a separate package called `react-native/virtualized-lists` located under `packages/virtualized-lists` as proposed on https://github.com/facebook/react-native/issues/35263
## Changelog
[General] [Changed] - Move virtualized lists to react-native/virtualized-lists package
Pull Request resolved: https://github.com/facebook/react-native/pull/35406
Test Plan:
1. Open the RNTester app and navigate to `FlatList` or `SectionList` page
2. Test virtualized lists through the many sections
https://user-images.githubusercontent.com/11707729/202878843-2b1322f5-cfee-484e-aaf3-d8d4dc0b96cc.mov
Reviewed By: cipolleschi
Differential Revision: D41745930
Pulled By: hoxyq
fbshipit-source-id: d3d33896801fd69448c6893b86fd5c2363144fd0
2023-02-06 13:39:13 -08:00