Structure change (#4220)

* Structure change

* Remove duplicate folders from previous structure

* Cleanup websocket protocol

* Updating from based off PR

* Fixup - remove wrong files during conflict and get the websocket working

* renaming tsx to ts

Co-authored-by: Jeremy Letto <jeremy.letto@datasite.com>

webclient/src/forms/ConnectForm/ConnectForm.css

@@ -0,0 +1,14 @@
+.connectForm {
+  width: 100%;
+  padding: 20px;
+}
+
+.connectForm-item {
+  display: flex;
+  flex-direction: column;
+}
+
+.connectForm-submit.MuiButton-root {
+  display: block;
+  margin: 20px auto 0;
+}

webclient/src/forms/ConnectForm/ConnectForm.tsx

@@ -0,0 +1,48 @@
+// eslint-disable-next-line
+import React, { Component } from "react";
+import { connect } from "react-redux";
+import { Form, Field, InjectedFormProps, reduxForm } from "redux-form"
+
+import Button from "@material-ui/core/Button";
+import { InputField } from "../../components";
+
+import "./ConnectForm.css";
+
+class ConnectForm extends Component<InjectedFormProps> {
+  render() {
+    return (
+      <Form className="connectForm" onSubmit={this.props.handleSubmit}>
+        <div className="connectForm-item">
+          <Field label="Host" name="host" component={InputField} />
+        </div>
+        <div className="connectForm-item">
+          <Field label="Port" name="port" component={InputField} />
+        </div>
+        <div className="connectForm-item">
+          <Field label="User" name="user" component={InputField} autoComplete="username" />
+        </div>
+        <div className="connectForm-item">
+          <Field label="Pass" name="pass" type="password" component={InputField} autoComplete="current-password" />
+        </div>
+        <Button className="connectForm-submit" color="primary" variant="contained" type="submit">
+          Connect
+        </Button>
+      </Form>
+    );
+  }
+}
+
+const propsMap = {
+  form: "connect"
+};
+
+const mapStateToProps = () => ({
+  initialValues: {
+    // host: "mtg.tetrarch.co/servatrice",
+    // port: "443"
+    host: "server.cockatrice.us",
+    port: "4748"
+  }
+});
+
+export default connect(mapStateToProps)(reduxForm(propsMap)(ConnectForm));