From 5553334654ba2b438ebca7f7569f25957ea2046b Mon Sep 17 00:00:00 2001
From: Dave Smith-Hayes <me@davesmithhayes.com>
Date: Mon, 30 Sep 2024 22:07:05 -0400
Subject: [PATCH] Add a login form

---
 chat-app/src/components/ChatApp.js |  3 ++-
 chat-app/src/components/Login.js   | 11 +++++++++++
 chat-app/src/components/index.js   |  4 ++++
 chat-app/static/js/index.js        | 23 +++++++++++++++--------
 4 files changed, 32 insertions(+), 9 deletions(-)
 create mode 100644 chat-app/src/components/Login.js

diff --git a/chat-app/src/components/ChatApp.js b/chat-app/src/components/ChatApp.js
index e21646d..4f6d389 100644
--- a/chat-app/src/components/ChatApp.js
+++ b/chat-app/src/components/ChatApp.js
@@ -1,11 +1,12 @@
 import m from "mithril";
 import { MessageBox } from "./MessageBox";
+import { LoginForm } from "./Login";
 
 export const ChatApp = {
   view: function () {
     return m("div", { class: "container" }, [
       m("h1", "A Stupid Chat Application"),
-      m(MessageBox)
+      m(LoginForm)
     ]);
   }
 };
diff --git a/chat-app/src/components/Login.js b/chat-app/src/components/Login.js
new file mode 100644
index 0000000..68aa3ef
--- /dev/null
+++ b/chat-app/src/components/Login.js
@@ -0,0 +1,11 @@
+import m from "mithril";
+
+export const LoginForm = {
+  view: function() {
+    return m("form", { action: "/login" }, [
+      m("label", { for: "username" }, "Username"),
+      m("input", { type: "text", name: "username" }),
+      m("input", { type: "submit", value: "Login" })
+    ]);
+  }
+};
diff --git a/chat-app/src/components/index.js b/chat-app/src/components/index.js
index 53eefe7..1506099 100644
--- a/chat-app/src/components/index.js
+++ b/chat-app/src/components/index.js
@@ -1,4 +1,8 @@
 import m from "mithril";
 import { ChatApp } from "./ChatApp";
 
+const localState = {
+  messages: []
+}
+
 m.mount(document.getElementById("app"), ChatApp);
diff --git a/chat-app/static/js/index.js b/chat-app/static/js/index.js
index 7a07f29..068c06e 100644
--- a/chat-app/static/js/index.js
+++ b/chat-app/static/js/index.js
@@ -1717,28 +1717,35 @@ var require_mithril = __commonJS((exports, module) => {
 });
 
 // src/components/index.js
-var import_mithril3 = __toESM(require_mithril(), 1);
+var import_mithril4 = __toESM(require_mithril(), 1);
 
 // src/components/ChatApp.js
-var import_mithril2 = __toESM(require_mithril(), 1);
+var import_mithril3 = __toESM(require_mithril(), 1);
 
 // src/components/MessageBox.js
 var import_mithril = __toESM(require_mithril(), 1);
-var MessageBox = {
+
+// src/components/Login.js
+var import_mithril2 = __toESM(require_mithril(), 1);
+var LoginForm = {
   view: function() {
-    return import_mithril.default("div", { id: "message-box" }, "Do Something");
+    return import_mithril2.default("form", { action: "/login" }, [
+      import_mithril2.default("label", { for: "username" }, "Username"),
+      import_mithril2.default("input", { type: "text", name: "username" }),
+      import_mithril2.default("input", { type: "submit", value: "Login" })
+    ]);
   }
 };
 
 // src/components/ChatApp.js
 var ChatApp = {
   view: function() {
-    return import_mithril2.default("div", { class: "container" }, [
-      import_mithril2.default("h1", "A Stupid Chat Application"),
-      import_mithril2.default(MessageBox)
+    return import_mithril3.default("div", { class: "container" }, [
+      import_mithril3.default("h1", "A Stupid Chat Application"),
+      import_mithril3.default(LoginForm)
     ]);
   }
 };
 
 // src/components/index.js
-import_mithril3.default.mount(document.getElementById("app"), ChatApp);
+import_mithril4.default.mount(document.getElementById("app"), ChatApp);