Skip to content

Commit

Permalink
Fix/animated lists types (#36292)
Browse files Browse the repository at this point in the history
Summary:
I was working on `Animated.FlatList` and found some types missing as below

![Screen Shot 2023-02-25 at 4 32 43 PM](https://user-images.githubusercontent.com/64301935/221345457-74252131-5207-4e17-ad96-92221a915305.png)

also `Animated.SectionList`

![Screen Shot 2023-02-25 at 4 31 34 PM](https://user-images.githubusercontent.com/64301935/221345679-07ba862b-708e-400e-ac14-7d2156fcc1e8.png)

So I refactored type definition for `Animated.FlatList` and `Animated.SectionList` using `abstract class`.

## Changelog

[GENERAL] [FIXED] - add missing FlatList types for Animated FlatList
[GENERAL] [FIXED] - add missing SectionList types for Animated SectionList

<!-- Help reviewers and the release process by writing your own changelog entry.

Pick one each for the category and type tags:

[ANDROID|GENERAL|IOS|INTERNAL] [BREAKING|ADDED|CHANGED|DEPRECATED|REMOVED|FIXED|SECURITY] - Message

For more details, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->

Pull Request resolved: #36292

Test Plan: Ran `yarn test-typescript` and `yarn test-typescript-offline` with no errors.

Reviewed By: lunaleaps

Differential Revision: D43673884

Pulled By: NickGerleman

fbshipit-source-id: 7ccab5997fa2f22226fb0e106672cee98e568ba4
  • Loading branch information
jeongshin authored and facebook-github-bot committed Feb 28, 2023
1 parent d4b228b commit ed39d63
Show file tree
Hide file tree
Showing 3 changed files with 30 additions and 11 deletions.
17 changes: 13 additions & 4 deletions Libraries/Animated/Animated.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,12 @@ import type * as React from 'react';
import {ScrollView} from '../Components/ScrollView/ScrollView';
import {View} from '../Components/View/View';
import {Image} from '../Image/Image';
import {FlatListProps} from '../Lists/FlatList';
import {DefaultSectionT, SectionListProps} from '../Lists/SectionList';
import {FlatListComponent, FlatListProps} from '../Lists/FlatList';
import {
DefaultSectionT,
SectionListComponent,
SectionListProps,
} from '../Lists/SectionList';
import {ColorValue} from '../StyleSheet/StyleSheet';
import {Text} from '../Text/Text';
import {NativeSyntheticEvent} from '../Types/CoreEventTypes';
Expand Down Expand Up @@ -598,13 +602,18 @@ export namespace Animated {
/**
* FlatList and SectionList infer generic Type defined under their `data` and `section` props.
*/
export class FlatList<ItemT = any> extends React.Component<

export class FlatList<ItemT = any> extends FlatListComponent<
ItemT,
AnimatedProps<FlatListProps<ItemT>>
> {}

export class SectionList<
ItemT = any,
SectionT = DefaultSectionT,
> extends React.Component<AnimatedProps<SectionListProps<ItemT, SectionT>>> {}
> extends SectionListComponent<
AnimatedProps<SectionListProps<ItemT, SectionT>>
> {}
}

// We need to alias these views so we can reference them in the Animated
Expand Down
12 changes: 9 additions & 3 deletions Libraries/Lists/FlatList.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -166,9 +166,10 @@ export interface FlatListProps<ItemT> extends VirtualizedListProps<ItemT> {
fadingEdgeLength?: number | undefined;
}

export class FlatList<ItemT = any> extends React.Component<
FlatListProps<ItemT>
> {
export abstract class FlatListComponent<
ItemT,
Props,
> extends React.Component<Props> {
/**
* Scrolls to the end of the content. May be janky without `getItemLayout` prop.
*/
Expand Down Expand Up @@ -236,3 +237,8 @@ export class FlatList<ItemT = any> extends React.Component<
// TODO: use `unknown` instead of `any` for Typescript >= 3.0
setNativeProps: (props: {[key: string]: any}) => void;
}

export class FlatList<ItemT = any> extends FlatListComponent<
ItemT,
FlatListProps<ItemT>
> {}
12 changes: 8 additions & 4 deletions Libraries/Lists/SectionList.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -210,10 +210,9 @@ export interface SectionListScrollParams {
viewPosition?: number | undefined;
}

export class SectionList<
ItemT = any,
SectionT = DefaultSectionT,
> extends React.Component<SectionListProps<ItemT, SectionT>> {
export abstract class SectionListComponent<
Props,
> extends React.Component<Props> {
/**
* Scrolls to the item at the specified sectionIndex and itemIndex (within the section)
* positioned in the viewable area such that viewPosition 0 places it at the top
Expand Down Expand Up @@ -246,6 +245,11 @@ export class SectionList<
getScrollableNode(): NodeHandle | undefined;
}

export class SectionList<
ItemT = any,
SectionT = DefaultSectionT,
> extends SectionListComponent<SectionListProps<ItemT, SectionT>> {}

/* This definition is deprecated because it extends the wrong base type */
export interface SectionListStatic<ItemT, SectionT = DefaultSectionT>
extends React.ComponentClass<SectionListProps<ItemT, SectionT>> {
Expand Down

0 comments on commit ed39d63

Please sign in to comment.