componente

import React, {Component} from 'react';
import {
  View,
  FlatList,
  TouchableOpacity,
  Image,
  Dimensions,
  StyleSheet,
  PixelRatio,
  RefreshControl,
  StatusBar,
} from 'react-native';
// import Orientation from 'react-native-orientation-locker';
// import AdBanner from '../components/AdBanner';
import {H3, IconLight} from '../components/Stylesheet';

const {width} = Dimensions.get('window');

const styles = StyleSheet.create({
  smallPost: {
    flex: 1,
    flexDirection: 'row',
    justifyContent: 'flex-start',
    maxWidth: width - 16,
    maxHeight: 100,
    marginBottom: 8,
  },
  smallImage: {
    width: 100,
    height: 100,
    borderRadius: 4,
    backgroundColor: '#e1e1fc',
  },
  smallTextBlock: {
    width: width - 138,
    margin: 8,
    paddingRight: 8,
  },
});

export default class PostCollection extends Component {
  render() {
    const {posts, loading, loadMore} = this.props;

    return !loading ? (
      <FlatList
        showsHorizontalScrollIndicator={false}
        onEndReached={loadMore}
        onEndReachedThreshold={0.8}
        data={posts}
        // keyExtractor={(item) => item.id}
        renderItem={({item}) => (
          <View>
            <View style={styles.smallPost}>
              <View style={styles.smallTextBlock}>
                <H3>{item.title.rendered}</H3>
              </View>
              {item._embedded['wp:featuredmedia'] ? (
                <Image
                  source={{
                    uri:
                      item._embedded['wp:featuredmedia'][0].media_details.sizes
                        .thumbnail.source_url,
                  }}
                  style={styles.smallImage}
                />
              ) : null}
            </View>
          </View>
        )}
      />
    ) : (
      <FlatList
        contentContainerStyle={styles.listContainer}
        showsHorizontalScrollIndicator={false}
        data={[1, 2, 3, 4, 5, 6, 7].map((i) => ({key: `${i}`}))}
        // keyExtractor={(item) => item.id}
        renderItem={() => (
          <View style={styles.smallPost}>
            <View style={styles.smallTextBlock}>
              <View
                style={{
                  backgroundColor: '#e1e1fc',
                  height: 60,
                }}
              />
            </View>
            <View style={styles.smallImage} />
          </View>
        )}
      />
    );
  }
}