From 302f3a4e5a3ad04e2e7746e7f86aca3db2fc7afc Mon Sep 17 00:00:00 2001
From: Jakub Piasecki <piaseckijakub@meta.com>
Date: Mon, 26 May 2025 23:55:12 -0700
Subject: [PATCH] Update types of Animated FlatList and SectionList (#51602)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/51602

Changelog: [GENERAL][FIXED] - Fixed the generated type definitions for `Animated.FlatList` and `Animated.SectionList` to correctly infer item types.

Current definitions for animated list components cast away their generic definitions, preventing the types to be inferred from usage. This diff addresses that.

Reviewed By: huntie

Differential Revision: D75407762

fbshipit-source-id: c86f20298ded707971c05a78d025a63e82fe2a64
---
 .../Libraries/Animated/AnimatedExports.js     |  4 ++--
 .../Animated/components/AnimatedFlatList.js   | 13 ++++++------
 .../components/AnimatedSectionList.js         | 18 ++++++++++-------
 .../__snapshots__/public-api-test.js.snap     | 20 +++++++++----------
 4 files changed, 30 insertions(+), 25 deletions(-)

diff --git a/packages/react-native/Libraries/Animated/AnimatedExports.js b/packages/react-native/Libraries/Animated/AnimatedExports.js
index a1563b1b6f3..3cc61a0300c 100644
--- a/packages/react-native/Libraries/Animated/AnimatedExports.js
+++ b/packages/react-native/Libraries/Animated/AnimatedExports.js
@@ -25,7 +25,7 @@ const Animated: typeof AnimatedImplementation = Platform.isDisableAnimations
   : AnimatedImplementation;
 
 export default {
-  get FlatList(): AnimatedFlatList {
+  get FlatList(): AnimatedFlatList<any> {
     return require('./components/AnimatedFlatList').default;
   },
   get Image(): AnimatedImage {
@@ -34,7 +34,7 @@ export default {
   get ScrollView(): AnimatedScrollView {
     return require('./components/AnimatedScrollView').default;
   },
-  get SectionList(): AnimatedSectionList {
+  get SectionList(): AnimatedSectionList<any, any> {
     return require('./components/AnimatedSectionList').default;
   },
   get Text(): AnimatedText {
diff --git a/packages/react-native/Libraries/Animated/components/AnimatedFlatList.js b/packages/react-native/Libraries/Animated/components/AnimatedFlatList.js
index aabdf6a00e8..d471a8cca43 100644
--- a/packages/react-native/Libraries/Animated/components/AnimatedFlatList.js
+++ b/packages/react-native/Libraries/Animated/components/AnimatedFlatList.js
@@ -8,13 +8,14 @@
  * @format
  */
 
-import type {AnimatedComponentType} from '../createAnimatedComponent';
+import type {AnimatedProps} from '../createAnimatedComponent';
 
-import FlatList from '../../Lists/FlatList';
+import FlatList, {type FlatListProps} from '../../Lists/FlatList';
 import createAnimatedComponent from '../createAnimatedComponent';
 import * as React from 'react';
 
-export default (createAnimatedComponent(FlatList): AnimatedComponentType<
-  React.ElementConfig<typeof FlatList>,
-  FlatList<mixed>,
->);
+// $FlowExpectedError[unclear-type]
+export default (createAnimatedComponent(FlatList): component<ItemT = any>(
+  ref?: React.RefSetter<FlatList<ItemT>>,
+  ...props: AnimatedProps<FlatListProps<ItemT>>
+));
diff --git a/packages/react-native/Libraries/Animated/components/AnimatedSectionList.js b/packages/react-native/Libraries/Animated/components/AnimatedSectionList.js
index 52b98b8dd26..5acb6c97e88 100644
--- a/packages/react-native/Libraries/Animated/components/AnimatedSectionList.js
+++ b/packages/react-native/Libraries/Animated/components/AnimatedSectionList.js
@@ -8,15 +8,19 @@
  * @format
  */
 
-import type {SectionBase} from '../../Lists/SectionList';
-import type {AnimatedComponentType} from '../createAnimatedComponent';
+import type {AnimatedProps} from '../createAnimatedComponent';
 
-import SectionList from '../../Lists/SectionList';
+import SectionList, {type SectionListProps} from '../../Lists/SectionList';
 import createAnimatedComponent from '../createAnimatedComponent';
 import * as React from 'react';
 
-export default (createAnimatedComponent(SectionList): AnimatedComponentType<
-  React.ElementConfig<typeof SectionList>,
+// $FlowFixMe
+export default (createAnimatedComponent(SectionList): component<
   // $FlowExpectedError[unclear-type]
-  SectionList<any, SectionBase<any>>,
->);
+  ItemT = any,
+  // $FlowExpectedError[unclear-type]
+  SectionT = any,
+>(
+  ref?: React.RefSetter<SectionList<ItemT, SectionT>>,
+  ...props: AnimatedProps<SectionListProps<ItemT, SectionT>>
+));
diff --git a/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap b/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap
index b87351b8292..b294be69136 100644
--- a/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap
+++ b/packages/react-native/Libraries/__tests__/__snapshots__/public-api-test.js.snap
@@ -156,10 +156,10 @@ declare export class AnimatedEvent {
 exports[`public API should not change unintentionally Libraries/Animated/AnimatedExports.js 1`] = `
 "declare const Animated: typeof AnimatedImplementation;
 declare export default {
-  get FlatList(): AnimatedFlatList,
+  get FlatList(): AnimatedFlatList<any>,
   get Image(): AnimatedImage,
   get ScrollView(): AnimatedScrollView,
-  get SectionList(): AnimatedSectionList,
+  get SectionList(): AnimatedSectionList<any, any>,
   get Text(): AnimatedText,
   get View(): AnimatedView,
   ...typeof Animated,
@@ -614,10 +614,10 @@ exports[`public API should not change unintentionally Libraries/Animated/bezier.
 `;
 
 exports[`public API should not change unintentionally Libraries/Animated/components/AnimatedFlatList.js 1`] = `
-"declare export default AnimatedComponentType<
-  React.ElementConfig<typeof FlatList>,
-  FlatList<mixed>,
->;
+"declare export default component<ItemT = any>(
+  ref?: React.RefSetter<FlatList<ItemT>>,
+  ...props: AnimatedProps<FlatListProps<ItemT>>
+);
 "
 `;
 
@@ -641,10 +641,10 @@ declare export default typeof AnimatedScrollView;
 `;
 
 exports[`public API should not change unintentionally Libraries/Animated/components/AnimatedSectionList.js 1`] = `
-"declare export default AnimatedComponentType<
-  React.ElementConfig<typeof SectionList>,
-  SectionList<any, SectionBase<any>>,
->;
+"declare export default component<ItemT = any, SectionT = any>(
+  ref?: React.RefSetter<SectionList<ItemT, SectionT>>,
+  ...props: AnimatedProps<SectionListProps<ItemT, SectionT>>
+);
 "
 `;