@@ -166,6 +171,7 @@ function AppRoutes() {
} />
} />
} />
+
} />
} />
} />
} />
diff --git a/frontend/src/app.css b/frontend/src/app.css
index 9868097..4ebd9a0 100644
--- a/frontend/src/app.css
+++ b/frontend/src/app.css
@@ -69,8 +69,42 @@ body { font-family: var(--font); background: var(--bg); color: var(--text1); -we
padding-right: max(16px, env(safe-area-inset-right, 0px));
}
}
+.app-header--mobile-stack {
+ flex-direction: column;
+ align-items: stretch;
+ gap: 0.5rem;
+ padding-bottom: 10px;
+}
+.app-header-mobile__top {
+ display: flex;
+ align-items: center;
+ min-height: var(--header-h);
+}
.app-logo { font-size: 18px; font-weight: 700; color: var(--accent); letter-spacing: -0.02em; }
+.active-club-switch {
+ display: flex;
+ flex-direction: column;
+ gap: 0.35rem;
+}
+.active-club-switch__label {
+ font-size: 0.75rem;
+ font-weight: 500;
+ color: var(--text2);
+}
+.active-club-switch__select {
+ width: 100%;
+ font-size: 0.875rem;
+ padding: 0.4rem 0.5rem;
+}
+.active-club-switch--sidebar {
+ width: 100%;
+ padding-bottom: 4px;
+}
+.active-club-switch--mobile {
+ width: 100%;
+}
+
/* === Seiten-Inhalt: volle Breite der Spalte, kein künstlicher Max-Wert auf großen Screens === */
.app-page {
width: 100%;
@@ -2198,7 +2232,14 @@ a.analysis-split__nav-item {
.desktop-sidebar__footer {
border-top: 1px solid var(--border);
- padding: 16px 12px 0;
+ padding: 16px 12px 16px;
+ display: flex;
+ flex-direction: column;
+ align-items: stretch;
+ gap: 12px;
+}
+
+.desktop-sidebar__footer-row {
display: flex;
align-items: center;
gap: 8px;
diff --git a/frontend/src/components/ActiveClubSwitcher.jsx b/frontend/src/components/ActiveClubSwitcher.jsx
new file mode 100644
index 0000000..0243b79
--- /dev/null
+++ b/frontend/src/components/ActiveClubSwitcher.jsx
@@ -0,0 +1,44 @@
+import { useAuth } from '../context/AuthContext'
+
+/**
+ * Zeigt einen Vereins-Umschalter, wenn der Nutzer mehreren Vereinen zugeordnet ist.
+ * Steuert den Mandanten-Kontext (Header X-Active-Club-Id + Profilfeld active_club_id).
+ */
+export default function ActiveClubSwitcher({ variant = 'sidebar' }) {
+ const { user, setActiveClub } = useAuth()
+ const clubs = user?.clubs || []
+ if (clubs.length <= 1) return null
+
+ const selectClubId =
+ user?.active_club_id != null && clubs.some((c) => c.id === user.active_club_id)
+ ? user.active_club_id
+ : clubs[0]?.id
+
+ const isMobile = variant === 'mobile'
+
+ return (
+
+ Aktiver Verein
+ {
+ const v = e.target.value
+ if (v) setActiveClub(Number(v))
+ }}
+ >
+ {clubs.map((c) => (
+
+ {c.name || `Verein #${c.id}`}
+
+ ))}
+
+
+ )
+}
diff --git a/frontend/src/components/AdminPageNav.jsx b/frontend/src/components/AdminPageNav.jsx
index 9677611..4ad7a50 100644
--- a/frontend/src/components/AdminPageNav.jsx
+++ b/frontend/src/components/AdminPageNav.jsx
@@ -1,5 +1,5 @@
import { NavLink, useLocation } from 'react-router-dom'
-import { TreePine, FolderTree, Download, Grid3x3 } from 'lucide-react'
+import { TreePine, FolderTree, Download, Grid3x3, Users } from 'lucide-react'
/**
* Admin-Seiten-Navigation (horizontal)
@@ -10,6 +10,7 @@ export default function AdminPageNav() {
const pages = [
{ to: '/admin/hierarchy', label: 'Hierarchie', icon: TreePine },
+ { to: '/admin/users', label: 'Nutzer', icon: Users },
{ to: '/admin/maturity-models', label: 'Fähigkeitsmatrix', icon: Grid3x3 },
{ to: '/admin/catalogs', label: 'Kataloge', icon: FolderTree },
{ to: '/admin/mediawiki-import', label: 'Wiki-Import', icon: Download }
diff --git a/frontend/src/components/DesktopSidebar.jsx b/frontend/src/components/DesktopSidebar.jsx
index b95be31..a918e17 100644
--- a/frontend/src/components/DesktopSidebar.jsx
+++ b/frontend/src/components/DesktopSidebar.jsx
@@ -1,6 +1,7 @@
import { NavLink, useLocation } from 'react-router-dom'
import { LogOut } from 'lucide-react'
import { getMainNavItems } from '../config/appNav'
+import ActiveClubSwitcher from './ActiveClubSwitcher'
function sidebarLinkActive(pathname, item, routerIsActive) {
if (item.to.startsWith('/admin')) return pathname.startsWith('/admin')
@@ -46,40 +47,43 @@ export default function DesktopSidebar({
-
-
+
+
+
+ {(user?.name || user?.email || '?').trim().slice(0, 1).toUpperCase()}
+
+
+
+ {user?.name || user?.email || 'User'}
+
+ {tier ? (
+ {tier}
+ ) : null}
+
+
+
- {(user?.name || user?.email || '?').trim().slice(0, 1).toUpperCase()}
-
-
-
- {user?.name || user?.email || 'User'}
-
- {tier ? (
- {tier}
- ) : null}
-
+
+
-
-
)
diff --git a/frontend/src/components/Navigation.jsx b/frontend/src/components/Navigation.jsx
index 0871d43..f56485f 100644
--- a/frontend/src/components/Navigation.jsx
+++ b/frontend/src/components/Navigation.jsx
@@ -4,7 +4,13 @@ import { useAuth } from '../context/AuthContext'
function Navigation() {
const location = useLocation()
const navigate = useNavigate()
- const { user, logout } = useAuth()
+ const { user, logout, setActiveClub } = useAuth()
+
+ const clubs = user?.clubs || []
+ const selectClubId =
+ user?.active_club_id != null && clubs.some((c) => c.id === user.active_club_id)
+ ? user.active_club_id
+ : clubs[0]?.id
const handleLogout = async () => {
await logout()
@@ -84,6 +90,25 @@ function Navigation() {
Profil
+ {(clubs?.length ?? 0) > 1 && (
+
+ Verein
+ {
+ const v = e.target.value
+ if (v) setActiveClub(Number(v))
+ }}
+ >
+ {clubs.map((c) => (
+ {c.name}
+ ))}
+
+
+ )}
+
{/* User Menu */}
String(c.id)))
+ const eff = profile?.effective_club_id
+ if (eff != null && eff !== '' && ids.has(String(eff))) {
+ localStorage.setItem(ACTIVE_CLUB_STORAGE_KEY, String(eff))
+ return
+ }
+ const stored = localStorage.getItem(ACTIVE_CLUB_STORAGE_KEY)
+ if (stored && ids.has(stored)) return
+
+ const ac =
+ profile?.active_club_id != null && profile.active_club_id !== ''
+ ? String(profile.active_club_id)
+ : ''
+ if (ac && ids.has(ac)) {
+ localStorage.setItem(ACTIVE_CLUB_STORAGE_KEY, ac)
+ return
+ }
+ if (clubs.length >= 1) {
+ localStorage.setItem(ACTIVE_CLUB_STORAGE_KEY, String(clubs[0].id))
+ }
+}
+
export function AuthProvider({ children }) {
const [user, setUser] = useState(null)
const [loading, setLoading] = useState(true)
+ const userRef = useRef(null)
+
+ useEffect(() => {
+ userRef.current = user
+ }, [user])
const checkAuth = useCallback(async () => {
const token = localStorage.getItem('authToken')
@@ -16,6 +45,7 @@ export function AuthProvider({ children }) {
try {
const profile = await api.getCurrentProfile()
+ syncStoredActiveClub(profile)
setUser(profile)
} catch (err) {
console.error('Auth check failed:', err)
@@ -29,9 +59,23 @@ export function AuthProvider({ children }) {
checkAuth()
}, [checkAuth])
+ const setActiveClub = useCallback(async (clubId) => {
+ const cid = Number(clubId)
+ const uid = userRef.current?.id
+ if (!Number.isFinite(cid) || cid < 1 || !uid) return
+ localStorage.setItem(ACTIVE_CLUB_STORAGE_KEY, String(cid))
+ setUser((prev) => (prev?.id ? { ...prev, active_club_id: cid } : prev))
+ try {
+ await api.updateProfile(uid, { active_club_id: cid })
+ } catch (e) {
+ console.error(e)
+ }
+ }, [])
+
/** Fallback, falls ohne checkAuth gesetzt wird (Legacy / Token-Injektion) */
const login = (payload) => {
if (payload?.profile != null) {
+ syncStoredActiveClub(payload.profile)
setUser(payload.profile)
return
}
@@ -52,6 +96,7 @@ export function AuthProvider({ children }) {
const logout = () => {
setUser(null)
localStorage.removeItem('authToken')
+ localStorage.removeItem(ACTIVE_CLUB_STORAGE_KEY)
}
const value = {
@@ -60,7 +105,8 @@ export function AuthProvider({ children }) {
loading,
login,
logout,
- checkAuth
+ checkAuth,
+ setActiveClub,
}
return (
diff --git a/frontend/src/pages/AccountSettingsPage.jsx b/frontend/src/pages/AccountSettingsPage.jsx
index cba52d3..ea6634c 100644
--- a/frontend/src/pages/AccountSettingsPage.jsx
+++ b/frontend/src/pages/AccountSettingsPage.jsx
@@ -10,6 +10,12 @@ function AccountSettingsPage() {
const [name, setName] = useState('')
const [savingProfile, setSavingProfile] = useState(false)
+ const [publicClubsDir, setPublicClubsDir] = useState([])
+ const [myJoinRequests, setMyJoinRequests] = useState([])
+ const [joinClubId, setJoinClubId] = useState('')
+ const [joinMessage, setJoinMessage] = useState('')
+ const [joinBusy, setJoinBusy] = useState(false)
+
const [newPw1, setNewPw1] = useState('')
const [newPw2, setNewPw2] = useState('')
const [savingPw, setSavingPw] = useState(false)
@@ -22,6 +28,32 @@ function AccountSettingsPage() {
setName(typeof user?.name === 'string' ? user.name : '')
}, [user])
+ const refreshJoinRequests = () => {
+ api.getMyClubJoinRequests().then(setMyJoinRequests).catch(() => {})
+ }
+
+ useEffect(() => {
+ if (!user?.id) return
+ api.listPublicClubsDirectory().then(setPublicClubsDir).catch(() => {})
+ refreshJoinRequests()
+ }, [user?.id])
+
+ const memberClubIds = new Set((user?.clubs || []).map((c) => c.id))
+ const pendingClubIds = new Set(
+ myJoinRequests.filter((r) => r.status === 'pending').map((r) => r.club_id)
+ )
+ const joinClubChoices = publicClubsDir.filter(
+ (c) => !memberClubIds.has(c.id) && !pendingClubIds.has(c.id)
+ )
+
+ const joinStatusLabel = (s) =>
+ ({
+ pending: 'ausstehend',
+ accepted: 'angenommen',
+ rejected: 'abgelehnt',
+ withdrawn: 'zurückgezogen',
+ })[s] || s
+
/** API: boolean true / Legacy: fehlt oder false → als „nicht verifiziert“ behandeln */
const emailExplicitlyVerified =
user?.email_verified === true ||
@@ -214,9 +246,133 @@ function AccountSettingsPage() {
{user?.tier || 'free'}
+
+
Vereine
+
+ {user?.clubs?.length ? (
+ <>
+ {user.clubs.map((c) => (
+
+ {c.name}
+ {': '}
+ {(c.roles || []).length ? (c.roles || []).join(', ') : '—'}
+
+ ))}
+
+ ) : (
+ '—'
+ )}
+