Add webui

webui/src/home/Home.css

@@ -0,0 +1,31 @@
+body {
+    background-color: #616161;
+}
+
+#home {
+  width: 90%;
+  margin: 50px auto;
+  background-color: #43A047;
+  border-radius: 10px;
+  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
+  font-family: "Poppins", sans-serif;
+  padding: 20px 10px;
+}
+
+#logout {
+    border: none;
+    text-align: center;
+    text-decoration: underline;
+    display: inline-block;
+    font-size: 16px;
+    transition-duration: 0.4s;
+    float: right;
+    background-color: yellow;
+    border-radius: 30px;
+    padding: 5px 20px;
+    cursor: pointer;
+}
+
+#logout:hover {
+    background-color: red;
+}

webui/src/home/Home.jsx

@@ -0,0 +1,42 @@
+import { useState, useParams, useEffect } from 'react'
+import './Home.css'
+import Request from '../Request.jsx'
+
+function Home() {
+    const [user, userdata] = useState();
+    
+    const logout = () => {
+        window.location.href = "/webui/logout";
+    }
+    
+    useEffect(() => {
+        if (user) return;
+        (async () => {
+            let resp = await Request("/api/webui/userInfo");
+            if (resp.result !== "OK") {
+                window.location.href = "/?message=" + encodeURIComponent(resp.message);
+                return;
+            }
+            let user = resp.data.userdata;
+            //let login = resp.data.loginbonus;
+            userdata(
+                <div>
+                    <p>User id: { user.user.id } </p>
+                    <p>Rank: { user.user.rank } ({ user.user.exp } exp)</p>
+                    <p>Last Login: { (new Date(user.user.last_login_time * 1000)).toString() } </p>
+                </div>
+            );
+        })();
+    });
+  
+    return (
+        <div id="home">
+            <button id="logout" onClick={logout}>Logout</button>
+            <h1>Home</h1>
+            
+            { user ? <div> { user } </div> : <p>Loading...</p> }
+        </div>
+    );
+}
+
+export default Home;