import React, { useState } from 'react';
import { StyleSheet, View } from 'react-native';
import LinearGradient from 'react-native-linear-gradient';
import { Skeleton } from '@rneui/themed';
import { SIZES } from '../../common';
function ListItemTypeTwo(_a) {
    var _b = _a.count, count = _b === void 0 ? 2 : _b;
    var _c = useState(new Array(count).fill(null)), items = _c[0], _ = _c[1];
    return (<>
      {items.map(function (_, index) { return (<View key={index + 1} style={styles.listItem}>
          <View style={styles.itemTop}>
            <Skeleton LinearGradientComponent={LinearGradient} animation="wave" width={90 * SIZES.WIDTH_RATE} height={120 * SIZES.WIDTH_RATE} style={{ borderRadius: 20 * SIZES.WIDTH_RATE }}/>
            <View style={{
                marginLeft: 12 * SIZES.WIDTH_RATE,
                justifyContent: 'center',
            }}>
              <Skeleton LinearGradientComponent={LinearGradient} animation="wave" width={220 * SIZES.WIDTH_RATE} height={20 * SIZES.WIDTH_RATE} style={{ borderRadius: 10 * SIZES.WIDTH_RATE }}/>
              <Skeleton LinearGradientComponent={LinearGradient} animation="wave" width={160 * SIZES.WIDTH_RATE} height={20 * SIZES.WIDTH_RATE} style={{
                marginTop: 8 * SIZES.WIDTH_RATE,
                borderRadius: 10 * SIZES.WIDTH_RATE,
            }}/>
              <Skeleton LinearGradientComponent={LinearGradient} animation="wave" width={80 * SIZES.WIDTH_RATE} height={20 * SIZES.WIDTH_RATE} style={{
                marginTop: 8 * SIZES.WIDTH_RATE,
                borderRadius: 10 * SIZES.WIDTH_RATE,
            }}/>
              <Skeleton LinearGradientComponent={LinearGradient} animation="wave" width={130 * SIZES.WIDTH_RATE} height={20 * SIZES.WIDTH_RATE} style={{
                marginTop: 8 * SIZES.WIDTH_RATE,
                borderRadius: 10 * SIZES.WIDTH_RATE,
            }}/>
            </View>
          </View>
          <View style={styles.itemBottom}>
            <Skeleton LinearGradientComponent={LinearGradient} animation="wave" height={40 * SIZES.WIDTH_RATE} style={{ borderRadius: 10 * SIZES.WIDTH_RATE }}/>
          </View>
        </View>); })}
    </>);
}
var styles = StyleSheet.create({
    listItem: {
        marginTop: 24 * SIZES.WIDTH_RATE,
    },
    itemTop: {
        flexDirection: 'row',
    },
    itemBottom: {
        marginTop: 10 * SIZES.WIDTH_RATE,
    },
});
export default ListItemTypeTwo;
//# sourceMappingURL=ListItemTypeTwo.js.map