import React from 'react';
import { connect } from 'react-redux';
import Input from '../components/Input';
import Select from '../components/Select';
import Button from '../components/Button';

const ListForm = connect(state => state)(
	({ dataFromAPI }) => {
		if (dataFromAPI.loading) {
			return (<div>Loading...</div>);
		}

		return (
			<div>
				<table>
					<tbody>
						<tr>
							<td>
								<input type="checkbox" />
							</td>
							<td>
								<input type="text" value="Title" />
								<Button text="Down" />
								<Button text="Close" />
							</td>
							<td>
								<Select
									title="[Type]"
									data={['All', 'Deposits', 'Withdrawals']}
								/>
								<Button text="Down" />
								<Button text="Close" />
							</td>
							<td>
								<Select
									title="[Day]"
									data={['All', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday']}
								/>
								<Button text="Down" />
								<Button text="Close" />
							</td>
							<td>
								<input type="text" value="Min Amount" />
								<Button text="Down" />
								<Button text="Close" />
							</td>
							<td>
								<input type="text" value="Max Amount" />
								<Button text="Down" />
								<Button text="Close" />
							</td>
							<td>
								<Select
									title="[Platforms]"
									data={['All', 'MT4', 'MT5', 'Tradologic']}
								/>
								<Button text="Down" />
								<Button text="Close" />
							</td>
							<td>
								<Select
									title="[Servers]"
									data={['All', 'Live20', 'Live21']}
								/>
								<Button text="Down" />
								<Button text="Close" />
							</td>
							<td>
								<Select
									title="[Groups]"
									data={['All', 'usd-11', 'usd-risk']}
								/>
								<Button text="Down" />
								<Button text="Close" />
							</td>
							<td>
								<Select
									title="[Modified By]"
									data={['All', 'admin', 'user']}
								/>
								<Button text="Down" />
								<Button text="Close" />
							</td>
							<td>
								<Select
									title="Modified Date"
									data={['All']}
								/>
							</td>
							<td>
								Save
							</td>
							<td>
								Delete
							</td>
						</tr>
						{dataFromAPI.response.data.map((item) => (
							<tr key={item.id}>
								<td>
									<input type="checkbox" />
								</td>
								<td>
									{item.comment}
								</td>
								<td>
									<Select
										data={['All', 'Deposits', 'Withdrawals']}
									/>
								</td>
								<td>
									<Select
										data={['All', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday']}
									/>
								</td>
								<td>
									<input type="text" value="Min Amount" value={item.amount} />
								</td>
								<td>
									<input type="text" value="Max Amount" value={item.amount} />
								</td>
								<td>
									<Select
										data={['All', 'MT4', 'MT5', 'Tradologic']}
									/>
								</td>
								<td>
									<Select
										data={['All', 'Live20', 'Live21']}
									/>
								</td>
								<td>
									<Select
										data={['All', 'usd-11', 'usd-risk']}
									/>
								</td>
								<td>
									<Select
										data={['All', 'admin', 'user']}
									/>
								</td>
								<td>
									<Select
										data={['All']}
									/>
								</td>
								<td>
									<Button text="Save" />
								</td>
								<td>
									<Button text="Delete" />
								</td>
							</tr>
						))}
					</tbody>
				</table>
				<div>
					<Button text="Delete All"/ >
					<Button text="Save All" />
					<div>
						Prev
						1
						...
						2
						15
						Next
					</div>
					Show Per:
					<Select data={[100, 200, 300]} />
				</div>
			</div>
		);
	}
);

export default ListForm;

@@ -472,25 +472,32 @@
 type=%22text%22 
-v
+defaultV
 alue=%22Title%22
@@ -1015,33 +1015,40 @@
 put type=%22text%22 
-v
+defaultV
 alue=%22Min Amount
@@ -1159,33 +1159,40 @@
 put type=%22text%22 
-v
+defaultV
 alue=%22Max Amount
@@ -2703,28 +2703,16 @@
 xt%22 
-value=%22Min Amount%22 v
+defaultV
 alue
@@ -2788,28 +2788,16 @@
 xt%22 
-value=%22Max Amount%22 v
+defaultV
 alue

Fix warning