OMG all the things are horrible

web/src/app/Api.js

@@ -172,6 +172,20 @@ class Api {
         console.log(`[Api] Account`, account);
         return account;
     }
+
+    async updateUserAccount(baseUrl, token, payload) {
+        const url = userAccountUrl(baseUrl);
+        const body = JSON.stringify(payload);
+        console.log(`[Api] Updating user account ${url}: ${body}`);
+        const response = await fetch(url, {
+            method: "POST",
+            headers: maybeWithBearerAuth({}, token),
+            body: body
+        });
+        if (response.status !== 200) {
+            throw new Error(`Unexpected server response ${response.status}`);
+        }
+    }
 }
 
 const api = new Api();

web/src/components/Preferences.js

@@ -34,6 +34,8 @@ import DialogActions from "@mui/material/DialogActions";
 import userManager from "../app/UserManager";
 import {playSound, shuffle, sounds, validTopic, validUrl} from "../app/utils";
 import {useTranslation} from "react-i18next";
+import api from "../app/Api";
+import session from "../app/Session";
 
 const Preferences = () => {
     return (
@@ -443,7 +445,9 @@ const Language = () => {
 
     const handleChange = async (ev) => {
         await i18n.changeLanguage(ev.target.value);
-        //api.update
+        await api.updateUserAccount("http://localhost:2586", session.token(), {
+            language: ev.target.value
+        });
     };
 
     // Remember: Flags are not languages. Don't put flags next to the language in the list.