import * as React from "react";
import { View } from "react-native";

type Props = {
  inViewport: boolean;
  Component: React.ComponentType<any>;
  id: string | number;
} & Record<string, any>;

// this needs to be a class component in order for the ViewTracker
// component to work properly, as it requires to have a ref
export class RenderInViewport extends React.PureComponent<Props> {
  render() {
    const { inViewport, Component, id, ...rest } = this.props;

    return inViewport ? <Component key={id} {...rest} /> : <View />;
  }
}