Skip to content

Commit

Permalink
Migrate index.js to function component
Browse files Browse the repository at this point in the history
  • Loading branch information
BartoszGrajdek committed Aug 24, 2023
1 parent 4f412db commit 266ddf2
Showing 1 changed file with 21 additions and 25 deletions.
46 changes: 21 additions & 25 deletions src/components/InvertedFlatList/index.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React, {forwardRef} from 'react';
import React, {forwardRef, useEffect} from 'react';
import PropTypes from 'prop-types';
import {FlatList, StyleSheet} from 'react-native';
import _ from 'underscore';
Expand All @@ -18,34 +18,30 @@ const propTypes = {

// This is adapted from https://codesandbox.io/s/react-native-dsyse
// It's a HACK alert since FlatList has inverted scrolling on web
class InvertedFlatList extends React.Component {
constructor(props) {
super(props);
function InvertedFlatList(props) {
const {innerRef, contentContainerStyle} = props;
let list;

this.list = undefined;
}

componentDidMount() {
if (!_.isFunction(this.props.innerRef)) {
useEffect(() => {
if (!_.isFunction(innerRef)) {
// eslint-disable-next-line no-param-reassign
this.props.innerRef.current = this.list;
innerRef.current = list;
} else {
this.props.innerRef(this.list);
innerRef(list);
}
}

render() {
return (
<BaseInvertedFlatList
// eslint-disable-next-line react/jsx-props-no-spreading
{...this.props}
inverted
ref={(el) => (this.list = el)}
shouldMeasureItems
contentContainerStyle={StyleSheet.compose(this.props.contentContainerStyle, styles.justifyContentEnd)}
/>
);
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

return (
<BaseInvertedFlatList
// eslint-disable-next-line react/jsx-props-no-spreading
{...props}
inverted
ref={(el) => (list = el)}
shouldMeasureItems
contentContainerStyle={StyleSheet.compose(contentContainerStyle, styles.justifyContentEnd)}
/>
);
}

InvertedFlatList.propTypes = propTypes;
Expand Down

0 comments on commit 266ddf2

Please sign in to comment.