react-virtualized-list

gistfile1.js

//top-level imports
import React from 'react';
import { List } from 'react-virtualized';
//custom components
import { TransactionItem } from './transaction-item';
//styles
import { StyleSheet, css } from 'aphrodite';
import { styles } from './styles.js';
import 'react-virtualized/styles.css'; // only needs to be imported once




// EXPORTED COMPONENT
//----------------------------------------



export class TransactionFeed extends React.Component {
	constructor(props){
		super(props)
		this.rowRenderer = this.rowRenderer.bind(this);
	}
	rowRenderer({key, index, style}){
		const { transactions } = this.props;
		return (<TransactionItem key={key} transaction={transactions[index]} />)
	}
	render(){
		const { transactions } = this.props;
		return <List
			    width={300}
			    height={500}
			    rowCount={transactions.length}
			    rowHeight={75}
			    rowRenderer={this.rowRenderer}
			    overscanRowCount={30}
			  />
	}
};