1 | import * as React from 'react';
|
2 | import { SingleComponent } from '../context/DataStore';
|
3 | import * as _ from 'lodash';
|
4 |
|
5 | interface ResultsListProps<T> {
|
6 | docs: T[];
|
7 | render: SingleComponent<T>;
|
8 |
|
9 | height?: number;
|
10 | columnWidth?: 'one' | 'two' | 'three' | 'four' |
|
11 | 'five' | 'six' | 'seven' | 'eight' | 'nine' |
|
12 | 'ten' | 'eleven' | 'twelve' | 'thirteen' |
|
13 | 'fourteen' | 'fifteen' | 'sixteen';
|
14 | }
|
15 |
|
16 | class ResultsList<T> extends React.Component<ResultsListProps<T>> {
|
17 | render() {
|
18 | const { docs, render, height } = this.props;
|
19 |
|
20 | let style = _.get(this.props, 'style', {});
|
21 | if (this.props.height) {
|
22 | style = _.extend(
|
23 | {
|
24 | height: height + 'px',
|
25 | float: 'left'
|
26 | },
|
27 | style
|
28 | );
|
29 | }
|
30 |
|
31 |
|
32 | const thisColumnClass = (this.props.columnWidth || 'sixteen') + ' wide column';
|
33 |
|
34 | return (
|
35 | <div className="ui grid">
|
36 | {
|
37 | (docs || []).map(
|
38 | (doc, i) =>
|
39 | <div
|
40 | className={thisColumnClass}
|
41 | key={i}
|
42 | style={style}
|
43 | >
|
44 | {render(doc, i)}
|
45 | </div>
|
46 | )
|
47 | }
|
48 | </div>
|
49 | );
|
50 | }
|
51 | }
|
52 |
|
53 | export {
|
54 | ResultsListProps,
|
55 | ResultsList
|
56 | }; |
\ | No newline at end of file |