More styling for linter, more better code

usentrycoach.client/src/Components/Login.tsx

@@ -0,0 +1,60 @@
+import { useState, type FormEvent } from 'react';
+import { z } from 'zod';
+
+export default function Login({ setToken } : {setToken: (token: string) => void})
+{
+    const [username, setUsername] = useState<string>("");
+    const [password, setPassword] = useState<string>("");
+
+    async function doLogin(event: FormEvent<HTMLFormElement>)
+    {
+        event.preventDefault();
+
+        const token = await loginUser({username, password});
+
+        setToken(token);
+    }
+
+    return (
+        <div>
+            <form className="login-form" onSubmit={e => void doLogin(e)} method="action">
+                <label>
+                    Email:
+                    <input type="text" name="username" placeholder="Username" required onChange={event => setUsername(event.target.value)} />
+                </label>
+                <label>
+                    Password:
+                    <input type="password" name="password" placeholder="Password" required onChange={event => setPassword(event.target.value)} />
+                </label>
+
+                <button type="submit">Login</button>
+            </form>
+        </div>
+    );
+}
+
+const LoginResponse = z.object({
+   token: z.string()
+});
+
+async function loginUser(credentials : {username: string, password: string}): Promise<string>
+{
+    // Get a session token for OpenAI Realtime API
+    const response = await fetch('login', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(credentials)
+    });
+
+    if (!response.ok)
+    {
+        throw new Error(response.statusText);
+    }
+
+    const responseJson:unknown = await response.json();
+    const parsedToken = LoginResponse.parse(responseJson);
+
+    return parsedToken.token;
+}