From baf620133bb056aca056aabca62eca4958994ba0 Mon Sep 17 00:00:00 2001
From: Timothy Warren <twarren@nabancard.com>
Date: Thu, 19 Apr 2018 14:46:20 -0400
Subject: [PATCH] Add more views

---
 src/Routes.js                      |  2 +-
 src/views/Camera/CameraAddView.js  | 91 ++++++++++++++++++++++++++++++
 src/views/Camera/index.js          |  1 +
 src/views/Lenses/LensesListView.js |  3 +
 src/views/Lenses/index.js          |  1 +
 5 files changed, 97 insertions(+), 1 deletion(-)
 create mode 100644 src/views/Camera/CameraAddView.js
 create mode 100644 src/views/Lenses/LensesListView.js
 create mode 100644 src/views/Lenses/index.js

diff --git a/src/Routes.js b/src/Routes.js
index 026f40f..1cc506b 100644
--- a/src/Routes.js
+++ b/src/Routes.js
@@ -5,7 +5,7 @@ import * as V from './views';
 export const Routes = (props) => (
 	<Switch>
 		<Route exact path="/" component={V.HomeView} />
-		<Route path="/camera" component={V.CameraListView} />
+		<Route path="/camera" component={V.CameraAddView} />
 		<Route path="/film" component={V.FilmAddView} />
 		<Route component={V.OopsView} />
 	</Switch>
diff --git a/src/views/Camera/CameraAddView.js b/src/views/Camera/CameraAddView.js
new file mode 100644
index 0000000..b1c468a
--- /dev/null
+++ b/src/views/Camera/CameraAddView.js
@@ -0,0 +1,91 @@
+import { linkEvent, Component } from 'inferno';
+
+import {
+	Button,
+	Card,
+	CardBody,
+	CardHeader,
+	CardFooter,
+	CardTitle,
+	Col,
+	Form,
+	Row,
+} from '../../components/Bootstrap';
+
+import { FormBlock } from '../../components/Form';
+
+export class CameraAddView extends Component {
+	constructor (props) {
+		super(props);
+
+		this.state = {
+			form: {
+				valid: {},
+				values: {},
+			},
+		};
+	}
+
+	handleFormChange (instance, e) {
+		instance.setState({
+			form: {
+				...instance.state.form,
+				values: {
+					...instance.state.form.values,
+					[e.target.id]: e.target.value,
+				},
+			},
+		});
+	}
+
+	render () {
+		return (
+			<Row className="full-height">
+				<Col sm={12} md={8} lg={4} className="abs-center">
+					<Form onKeyDown={ linkEvent(this, this.handleFormChange) }>
+						<Card>
+							<CardHeader>
+								<CardTitle>Add a Camera</CardTitle>
+							</CardHeader>
+							<CardBody>
+								<Row className="align-items-baseline">
+									<FormBlock
+										label="Brand"
+										name="brand"
+										required
+										value={this.state.form.values['brand']}
+									/>
+									<FormBlock
+										label="Model"
+										name="model"
+										required
+										value={this.state.form.values['model']}
+									/>
+									<FormBlock
+										label="Film Format"
+										name="film-format"
+										value={this.state.form.values['film-format']}
+									>
+										<select className="custom-select" id="film-format" name="film-format">
+											<option value="110">110</option>
+											<option value="120">120</option>
+											<option value="127">127</option>
+											<option value="135">135</option>
+										</select>
+									</FormBlock>
+								</Row>
+							</CardBody>
+							<CardFooter>
+								<Row>
+									<Col xs={12}>
+										<Button color="primary" type="submit">Save</Button>
+									</Col>
+								</Row>
+							</CardFooter>
+						</Card>
+					</Form>
+				</Col>
+			</Row>
+		);
+	}
+}
diff --git a/src/views/Camera/index.js b/src/views/Camera/index.js
index 98f47fe..65492d7 100644
--- a/src/views/Camera/index.js
+++ b/src/views/Camera/index.js
@@ -1 +1,2 @@
+export * from './CameraAddView';
 export * from './CameraListView';
diff --git a/src/views/Lenses/LensesListView.js b/src/views/Lenses/LensesListView.js
new file mode 100644
index 0000000..7da9be0
--- /dev/null
+++ b/src/views/Lenses/LensesListView.js
@@ -0,0 +1,3 @@
+export const LensesListView = () => {
+	return <div />
+};
diff --git a/src/views/Lenses/index.js b/src/views/Lenses/index.js
new file mode 100644
index 0000000..8163038
--- /dev/null
+++ b/src/views/Lenses/index.js
@@ -0,0 +1 @@
+export * from './LensesListView';