Skip to content

Commit

Permalink
Constrain data type in getItemLayout callback (#36237)
Browse files Browse the repository at this point in the history
Summary:
Pull Request resolved: #36237

This changes the data parameter type for `getItemLayout` from a mutable array (too lenient, even before), to `ArrayLike`, which is now the most constrained subset of data which may be passed to a FlatList.

We could do something more exact by adding another generic parameter to FlatList, but that would be likely be noticeably more breaking, since during testing I couldn't manage a pattern that both kept the same minimum number of generic arguments while keeping inference working.

Changelog:
[General][Breaking] - Constrain data type in `getItemLayout` callback

Reviewed By: javache

Differential Revision: D43466967

fbshipit-source-id: 7a1ce717e7d5cc96a58b8d3ad9def6cf6250871f
  • Loading branch information
NickGerleman authored and facebook-github-bot committed Feb 25, 2023
1 parent c03de97 commit febf6b7
Show file tree
Hide file tree
Showing 3 changed files with 17 additions and 2 deletions.
2 changes: 1 addition & 1 deletion Libraries/Lists/FlatList.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ export interface FlatListProps<ItemT> extends VirtualizedListProps<ItemT> {
*/
getItemLayout?:
| ((
data: Array<ItemT> | null | undefined,
data: ArrayLike<ItemT> | null | undefined,
index: number,
) => {length: number; offset: number; index: number})
| undefined;
Expand Down
2 changes: 1 addition & 1 deletion Libraries/Lists/FlatList.js
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ type OptionalProps<ItemT> = {|
* specify `ItemSeparatorComponent`.
*/
getItemLayout?: (
data: ?Array<ItemT>,
data: ?$ArrayLike<ItemT>,
index: number,
) => {
length: number,
Expand Down
15 changes: 15 additions & 0 deletions types/__typetests__/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -705,6 +705,21 @@ export class FlatListTest extends React.Component<FlatListProps<number>, {}> {
}
}

<FlatList
data={[1, 2, 3]}
renderItem={null}
getItemLayout={(
data: ArrayLike<number> | null | undefined,
index: number,
) => {
return {
length: data![index] % 2 === 0 ? 10 : 5,
offset: 1234,
index,
};
}}
/>;

export class SectionListTest extends React.Component<
SectionListProps<string>,
{}
Expand Down

0 comments on commit febf6b7

Please sign in to comment.