Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 | 2x 1x 1x 1x 1x | import React, { useState }from "react";
import Container from "react-bootstrap/Container";
import Row from "react-bootstrap/Row";
import Col from "react-bootstrap/Col";
import Table from "react-bootstrap/Table";
import Form from 'react-bootstrap/Form';
import '../../index.css';
import { useHistory } from 'react-router-dom';
function AddData() {
// {buttonClicked, numRows}
const path = useHistory();
const NewData =[
{
Key: '',
Value: '',
}
]
const [rows, addRows] = useState(1);
return (
<div>
<Row>
<Col md={2}>
<p className="back-to-home font pt-3 pb-2 fs-4" onClick={() => path.push('/home')}><u>Back to Home</u></p>
</Col>
</Row>
<Row>
<Col>
<p className="add-data-title font pt-3 pb-2"><u>Add Data</u></p>
</Col>
</Row>
<Container>
<Row>
<Table className="table" bordered responsive="sm">
<thead className="table-header-footer">
<tr>
<th className="font-color-white weight-light">Key</th>
<th className="font-color-white weight-light">Value</th>
<th className="font-color-white weight-light">Remove Row</th>
</tr>
</thead>
<tbody>
<React.Fragment>
{NewData.map(entry => {
return (
<tr>
<td>
<Form>
<Form.Control type="key" placeholder={entry.Key}></Form.Control>
</Form>
</td>
<td>
<Form>
<Form.Control type="key"></Form.Control>
</Form>
</td>
<td>
<Form>
<Form.Control type="key"></Form.Control>
</Form>
</td>
</tr>
)
})}
</React.Fragment>
</tbody>
<tfoot className="table-header-footer">
<tr>
<th colSpan="3">
<Row>
<Col md="auto">
<button type="submit" className='btn btn-create btn-block weight-light' onClick={() => path.push('/upload')}>Upload Data</button>
</Col>
<Col md="auto">
<button type="submit" className='btn btn-add-row btn-block weight-light'>Add Row</button>
</Col>
<Col></Col>
</Row>
</th>
</tr>
</tfoot>
</Table>
</Row>
</Container>
</div>
)
}
export default AddData
|