Anpassung Menü

web/html/js/views/settings.js

@@ -6,6 +6,7 @@ import { del, patch, post } from "../api.js";
 import { el, mount } from "../dom.js";
 import * as push from "../push.js";
 import { set, state } from "../store.js";
+import { appBar } from "../appbar.js";
 
 function formatDate(iso) {
   return new Date(iso).toLocaleDateString("de-DE", {
@@ -205,22 +206,24 @@ export async function settingsView(root, { back, admin }) {
 
   function render() {
     mount(root,
-      el("header.bar", {},
-        el("button.linklike", { type: "button", onclick: back }, "‹ Zurück"),
-        el("span.who", {}, state.user.display_name || state.user.email)),
+      appBar({
+        back: { label: "Listen", onClick: back },
+        title: "Einstellungen",
+        actions: state.user.is_admin
+          ? [{ label: "Benutzerverwaltung", onClick: admin,
+               hint: "Konten, Einladungen, Bereinigung" }]
+          : [],
+      }),
 
       banner ? el(banner.kind === "error" ? "p.error" : "p.notice", {}, banner.message) : null,
 
+      // Die Benutzerverwaltung steht im Menü der Kopfleiste - nur für
+      // Administratoren, und der Endpunkt prüft zusätzlich.
       el("section.card", {},
-        el("h1", {}, "Einstellungen"),
-        // Nur für Administratoren sichtbar - der Endpunkt prüft
-        // zusätzlich, die Oberfläche allein wäre kein Schutz.
-        state.user.is_admin
-          ? el("div", {},
-              el("p.lead", {}, "Du hast Administratorrechte."),
-              el("button.secondary", { type: "button", onclick: admin },
-                "Benutzerverwaltung"))
-          : null),
+        el("h1", {}, state.user.display_name || state.user.email),
+        el("p.lead", {},
+          state.user.email,
+          state.user.is_admin ? " · Administrator" : "")),
       pushSection(),
       profileSection(),
       passwordSection()