From c7c0f05a7b157e32374fb4bed2e2533383e4d802 Mon Sep 17 00:00:00 2001
From: Nick Gerleman <ngerlem@meta.com>
Date: Wed, 22 Feb 2023 14:39:50 -0800
Subject: [PATCH] Constrain data type in `getItemLayout` callback (#36237)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/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: a0fa45917dfe9dcb71c543b6c86d0ce188a48c4c
---
 Libraries/Lists/FlatList.d.ts |  2 +-
 Libraries/Lists/FlatList.js   |  2 +-
 types/__typetests__/index.tsx | 15 +++++++++++++++
 3 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/Libraries/Lists/FlatList.d.ts b/Libraries/Lists/FlatList.d.ts
index f4958fe93610e1..8676fb4d28b4f8 100644
--- a/Libraries/Lists/FlatList.d.ts
+++ b/Libraries/Lists/FlatList.d.ts
@@ -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;
diff --git a/Libraries/Lists/FlatList.js b/Libraries/Lists/FlatList.js
index 2492bf028aa675..a3145876396def 100644
--- a/Libraries/Lists/FlatList.js
+++ b/Libraries/Lists/FlatList.js
@@ -91,7 +91,7 @@ type OptionalProps<ItemT> = {|
    * specify `ItemSeparatorComponent`.
    */
   getItemLayout?: (
-    data: ?Array<ItemT>,
+    data: ?$ArrayLike<ItemT>,
     index: number,
   ) => {
     length: number,
diff --git a/types/__typetests__/index.tsx b/types/__typetests__/index.tsx
index 070a59abe2cc45..848a7b5239dfd2 100644
--- a/types/__typetests__/index.tsx
+++ b/types/__typetests__/index.tsx
@@ -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>,
   {}