feat: add gender

src/TeamPanel.tsx

@@ -1,5 +1,5 @@
 import { FormEvent, useEffect, useState } from "react";
-import { apiAuth, loadPlayers, User } from "./api";
+import { apiAuth, Gender, loadPlayers, User } from "./api";
 import { useSession } from "./Session";
 import { ErrorState } from "./types";
 import { useNavigate } from "react-router";
@@ -15,6 +15,7 @@ const TeamPanel = () => {
     id: 0,
     username: "",
     display_name: "",
+    gender: undefined,
     number: "",
     email: "",
   } as User;
@@ -95,7 +96,7 @@ const TeamPanel = () => {
               {players &&
                 players.map((p) => (
                   <button
-                    className="team-player"
+                    className={"team-player " + p.gender}
                     key={p.id}
                     onClick={() => {
                       setPlayer(p);
@@ -151,6 +152,22 @@ const TeamPanel = () => {
                 }}
               />
             </div>
+            <div>
+              <label>gender</label>
+              <select
+                name="gender"
+                required
+                value={player.gender}
+                onChange={(e) => {
+                  setPlayer({ ...player, gender: e.target.value as Gender });
+                  setError({ ok: true, message: "" });
+                }}
+              >
+                <option value={undefined}></option>
+                <option value="fmp">FMP</option>
+                <option value="mmp">MMP</option>
+              </select>
+            </div>
             <div>
               <label>number (optional)</label>
               <input