@micha.bigler/ui-core-micha 2.1.20 → 2.2.1

package/dist/components/UserListComponent.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useMemo, useState, useEffect } from 'react';
-import { Box, Typography, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Paper, FormControl, Select, MenuItem, Button, Tooltip, CircularProgress, Alert, TableSortLabel, TextField } from '@mui/material';
+import React, { useMemo, useState, useEffect, useCallback } from 'react';
+import { Box, Typography, FormControl, Select, MenuItem, Button, Tooltip, CircularProgress, Alert, TextField, } from '@mui/material';
+import { DataGrid } from '@mui/x-data-grid';
 import DeleteIcon from '@mui/icons-material/Delete';
 import { useTranslation } from 'react-i18next';
 import { fetchUsersList, deleteUser, updateUserRole, updateUserSupportStatus } from '../auth/authApi';
@@ -12,16 +13,12 @@ export function UserListComponent({ roles = DEFAULT_ROLES, currentUser, extraCol
     const [error, setError] = useState(null);
     const [rowActionLoading, setRowActionLoading] = useState({});
     const [searchQuery, setSearchQuery] = useState('');
-    const [sortConfig, setSortConfig] = useState({ key: 'id', direction: 'asc' });
-    const cellSx = { verticalAlign: 'middle' };
     const controlSx = { minWidth: 140 };
     const actionButtonSx = { textTransform: 'none', minWidth: 90 };
-    const loadUsers = async () => {
+    const loadUsers = useCallback(async () => {
         setLoading(true);
         setError(null);
         try {
-            // FIX: Removed apiUrl parameter. 
-            // fetchUsersList uses USERS_BASE from authConfig internally.
             const data = await fetchUsersList();
             const list = Array.isArray(data) ? data : (Array.isArray(data === null || data === void 0 ? void 0 : data.results) ? data.results : []);
             // Keep row identity stable even if backend returns unordered results.
@@ -39,16 +36,14 @@ export function UserListComponent({ roles = DEFAULT_ROLES, currentUser, extraCol
         finally {
             setLoading(false);
         }
-    };
+    }, []);
     useEffect(() => {
         loadUsers();
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [refreshTrigger]); // Dependency on apiUrl removed
+    }, [loadUsers, refreshTrigger]);
     const handleDelete = async (userId) => {
         if (!window.confirm(t('UserList.DELETE_CONFIRM', 'Are you sure you want to delete this user?')))
             return;
         try {
-            // FIX: Removed apiUrl parameter.
             await deleteUser(userId);
             setUsers(prev => prev.filter(u => u.id !== userId));
         }
@@ -58,7 +53,6 @@ export function UserListComponent({ roles = DEFAULT_ROLES, currentUser, extraCol
     };
     const handleChangeRole = async (userId, newRole) => {
         try {
-            // FIX: Removed apiUrl parameter.
             await updateUserRole(userId, newRole);
             await loadUsers();
         }
@@ -68,7 +62,6 @@ export function UserListComponent({ roles = DEFAULT_ROLES, currentUser, extraCol
     };
     const handleToggleSupporter = async (userId, newValue) => {
         try {
-            // FIX: Removed apiUrl parameter.
             await updateUserSupportStatus(userId, newValue);
             await loadUsers();
         }
@@ -105,7 +98,7 @@ export function UserListComponent({ roles = DEFAULT_ROLES, currentUser, extraCol
         extraContext,
         t,
         reloadUsers: loadUsers,
-    }), [currentUser, extraContext, t]);
+    }), [currentUser, extraContext, t, loadUsers]);
     const visibleExtraColumns = useMemo(() => extraColumns.filter((column) => typeof column.visible === 'function' ? column.visible(listContext) : true), [extraColumns, listContext]);
     const visibleRowActions = useMemo(() => extraRowActions.filter((action) => typeof action.visible === 'function' ? action.visible(listContext) : true), [extraRowActions, listContext]);
     const getUserDisplayName = (user) => {
@@ -139,49 +132,6 @@ export function UserListComponent({ roles = DEFAULT_ROLES, currentUser, extraCol
         }
         return getExtraColumnSortValue(column, user);
     };
-    const normalizeSortValue = (value) => {
-        if (value === null || value === undefined)
-            return '';
-        if (typeof value === 'boolean')
-            return value ? 1 : 0;
-        if (typeof value === 'number')
-            return value;
-        if (value instanceof Date)
-            return value.getTime();
-        return String(value).toLocaleLowerCase();
-    };
-    const compareSortValues = (a, b) => {
-        const av = normalizeSortValue(a);
-        const bv = normalizeSortValue(b);
-        if (typeof av === 'number' && typeof bv === 'number') {
-            return av - bv;
-        }
-        return String(av).localeCompare(String(bv), undefined, {
-            numeric: true,
-            sensitivity: 'base',
-        });
-    };
-    const getSortValueByKey = (user, sortKey) => {
-        var _a, _b;
-        if (sortKey === 'id')
-            return Number((_a = user === null || user === void 0 ? void 0 : user.id) !== null && _a !== void 0 ? _a : 0);
-        if (sortKey === 'email')
-            return (user === null || user === void 0 ? void 0 : user.email) || '';
-        if (sortKey === 'name')
-            return getUserDisplayName(user);
-        if (sortKey === 'role')
-            return (user === null || user === void 0 ? void 0 : user.role) || '';
-        if (sortKey === 'is_support_agent')
-            return Boolean(user === null || user === void 0 ? void 0 : user.is_support_agent);
-        if (sortKey.startsWith('extra:')) {
-            const extraKey = sortKey.slice('extra:'.length);
-            const column = visibleExtraColumns.find((col) => String(col.key) === extraKey);
-            if (!column)
-                return '';
-            return getExtraColumnSortValue(column, user);
-        }
-        return (_b = user === null || user === void 0 ? void 0 : user[sortKey]) !== null && _b !== void 0 ? _b : '';
-    };
     const toSearchText = (value) => {
         if (value === null || value === undefined)
             return '';
@@ -207,36 +157,14 @@ export function UserListComponent({ roles = DEFAULT_ROLES, currentUser, extraCol
         return [...baseValues, ...extraValues].map((value) => toSearchText(value)).filter(Boolean);
     };
     const normalizedSearch = searchQuery.trim().toLocaleLowerCase();
-    const filteredAndSortedUsers = useMemo(() => {
-        const filtered = users.filter((user) => {
+    const filteredUsers = useMemo(() => {
+        return users.filter((user) => {
             if (!normalizedSearch)
                 return true;
             const bucket = getSearchBucketForUser(user);
             return bucket.some((entry) => entry.includes(normalizedSearch));
         });
-        const sorted = [...filtered].sort((a, b) => {
-            var _a, _b;
-            const aValue = getSortValueByKey(a, sortConfig.key);
-            const bValue = getSortValueByKey(b, sortConfig.key);
-            const cmp = compareSortValues(aValue, bValue);
-            if (cmp !== 0)
-                return sortConfig.direction === 'asc' ? cmp : -cmp;
-            // Stable fallback
-            return Number((_a = a === null || a === void 0 ? void 0 : a.id) !== null && _a !== void 0 ? _a : 0) - Number((_b = b === null || b === void 0 ? void 0 : b.id) !== null && _b !== void 0 ? _b : 0);
-        });
-        return sorted;
-    }, [users, normalizedSearch, sortConfig, visibleExtraColumns, currentUser, extraContext, t]);
-    const handleSort = (columnKey) => {
-        setSortConfig((prev) => {
-            if (prev.key === columnKey) {
-                return {
-                    key: columnKey,
-                    direction: prev.direction === 'asc' ? 'desc' : 'asc',
-                };
-            }
-            return { key: columnKey, direction: 'asc' };
-        });
-    };
+    }, [users, normalizedSearch, visibleExtraColumns, currentUser, extraContext, t]);
     const runRowAction = async (action, user) => {
         const actionId = `${action.key}:${user.id}`;
         setRowActionLoading((prev) => (Object.assign(Object.assign({}, prev), { [actionId]: true })));
@@ -258,27 +186,124 @@ export function UserListComponent({ roles = DEFAULT_ROLES, currentUser, extraCol
             setRowActionLoading((prev) => (Object.assign(Object.assign({}, prev), { [actionId]: false })));
         }
     };
-    return (_jsxs(Box, { children: [_jsx(Typography, { variant: "h6", gutterBottom: true, children: t('UserList.TITLE', 'All Users') }), _jsx(Box, { sx: { mb: 2, maxWidth: 420 }, children: _jsx(TextField, { fullWidth: true, size: "small", label: t('Common.SEARCH', 'Search'), placeholder: t('UserList.SEARCH_PLACEHOLDER', 'Search users...'), value: searchQuery, onChange: (event) => setSearchQuery(event.target.value) }) }), error && _jsx(Alert, { severity: "error", sx: { mb: 2 }, children: t(error) }), loading ? (_jsx(Box, { sx: { display: 'flex', justifyContent: 'center', p: 3 }, children: _jsx(CircularProgress, {}) })) : (_jsx(TableContainer, { component: Paper, children: _jsxs(Table, { size: "small", children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(TableCell, { sx: cellSx, sortDirection: sortConfig.key === 'email' ? sortConfig.direction : false, children: _jsx(TableSortLabel, { active: sortConfig.key === 'email', direction: sortConfig.key === 'email' ? sortConfig.direction : 'asc', onClick: () => handleSort('email'), children: t('Auth.EMAIL_LABEL', 'Email') }) }), _jsx(TableCell, { sx: cellSx, sortDirection: sortConfig.key === 'name' ? sortConfig.direction : false, children: _jsx(TableSortLabel, { active: sortConfig.key === 'name', direction: sortConfig.key === 'name' ? sortConfig.direction : 'asc', onClick: () => handleSort('name'), children: t('Profile.NAME_LABEL', 'Name') }) }), _jsx(TableCell, { sx: cellSx, sortDirection: sortConfig.key === 'role' ? sortConfig.direction : false, children: _jsx(TableSortLabel, { active: sortConfig.key === 'role', direction: sortConfig.key === 'role' ? sortConfig.direction : 'asc', onClick: () => handleSort('role'), children: t('UserList.ROLE', 'Role') }) }), _jsx(TableCell, { sx: cellSx, sortDirection: sortConfig.key === 'is_support_agent' ? sortConfig.direction : false, children: _jsx(TableSortLabel, { active: sortConfig.key === 'is_support_agent', direction: sortConfig.key === 'is_support_agent' ? sortConfig.direction : 'asc', onClick: () => handleSort('is_support_agent'), children: t('UserList.SUPPORTER', 'Support Agent') }) }), visibleExtraColumns.map((column) => (_jsx(TableCell, { sx: cellSx, align: column.align || 'left', sortDirection: sortConfig.key === `extra:${column.key}` ? sortConfig.direction : false, children: _jsx(TableSortLabel, { active: sortConfig.key === `extra:${column.key}`, direction: sortConfig.key === `extra:${column.key}` ? sortConfig.direction : 'asc', onClick: () => handleSort(`extra:${column.key}`), children: typeof column.label === 'function' ? column.label(listContext) : column.label }) }, column.key))), _jsx(TableCell, { sx: cellSx, children: t('Common.ACTIONS', 'Actions') })] }) }), _jsxs(TableBody, { children: [filteredAndSortedUsers.map((u) => (_jsxs(TableRow, { children: [_jsx(TableCell, { sx: cellSx, children: u.email }), _jsx(TableCell, { sx: cellSx, children: getUserDisplayName(u) }), _jsx(TableCell, { sx: cellSx, children: _jsx(FormControl, { size: "small", fullWidth: true, sx: controlSx, disabled: !canEdit(u), children: _jsx(Select, { value: u.role || 'none', onChange: (e) => handleChangeRole(u.id, e.target.value), variant: "outlined", children: roles.map(r => _jsx(MenuItem, { value: r, children: r }, r)) }) }) }), _jsx(TableCell, { sx: cellSx, children: _jsx(FormControl, { size: "small", fullWidth: true, sx: controlSx, disabled: !canEdit(u), children: _jsxs(Select, { value: u.is_support_agent ? 'yes' : 'no', onChange: (e) => handleToggleSupporter(u.id, e.target.value === 'yes'), variant: "outlined", children: [_jsx(MenuItem, { value: "yes", children: t('Common.YES', 'Yes') }), _jsx(MenuItem, { value: "no", children: t('Common.NO', 'No') })] }) }) }), visibleExtraColumns.map((column) => (_jsx(TableCell, { sx: cellSx, align: column.align || 'left', children: column.renderCell({
-                                                user: u,
-                                                canEdit: canEdit(u),
-                                                currentUser,
-                                                extraContext,
-                                                t,
-                                                reloadUsers: loadUsers,
-                                            }) }, `${column.key}-${u.id}`))), _jsx(TableCell, { sx: cellSx, children: _jsxs(Box, { sx: { display: 'flex', flexWrap: 'wrap', gap: 1, alignItems: 'center' }, children: [visibleRowActions.map((action) => {
-                                                        const actionId = `${action.key}:${u.id}`;
-                                                        const isBusy = Boolean(rowActionLoading[actionId]);
-                                                        const isDisabled = typeof action.disabled === 'function'
-                                                            ? action.disabled({
-                                                                user: u,
-                                                                canEdit: canEdit(u),
-                                                                currentUser,
-                                                                extraContext,
-                                                                t,
-                                                            })
-                                                            : false;
-                                                        return (_jsx(Button, { size: "small", variant: "outlined", onClick: () => runRowAction(action, u), disabled: isBusy || isDisabled, sx: actionButtonSx, children: typeof action.label === 'function'
-                                                                ? action.label({ user: u, t, currentUser, canEdit: canEdit(u) })
-                                                                : action.label }, `${action.key}-${u.id}`));
-                                                    }), _jsx(Tooltip, { title: t('Common.DELETE'), children: _jsx("span", { children: _jsx(Button, { size: "small", variant: "outlined", color: "error", startIcon: _jsx(DeleteIcon, {}), onClick: () => handleDelete(u.id), disabled: !canEdit(u), sx: actionButtonSx, children: t('Common.DELETE', 'Delete') }) }) })] }) })] }, u.id))), filteredAndSortedUsers.length === 0 && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: 5 + visibleExtraColumns.length, align: "center", children: t('UserList.NO_USERS', 'No users found.') }) }))] })] }) }))] }));
+    const columns = useMemo(() => {
+        const baseColumns = [
+            {
+                field: 'email',
+                headerName: t('Auth.EMAIL_LABEL', 'Email'),
+                minWidth: 240,
+                flex: 1.2,
+            },
+            {
+                field: 'name',
+                headerName: t('Profile.NAME_LABEL', 'Name'),
+                minWidth: 220,
+                flex: 1,
+                valueGetter: (_value, row) => getUserDisplayName(row),
+            },
+            {
+                field: 'role',
+                headerName: t('UserList.ROLE', 'Role'),
+                minWidth: 180,
+                flex: 0.8,
+                valueGetter: (_value, row) => (row === null || row === void 0 ? void 0 : row.role) || 'none',
+                renderCell: (params) => {
+                    const user = params.row;
+                    return (_jsx(FormControl, { size: "small", fullWidth: true, sx: controlSx, disabled: !canEdit(user), children: _jsx(Select, { value: user.role || 'none', onChange: (event) => handleChangeRole(user.id, event.target.value), variant: "outlined", children: roles.map((role) => _jsx(MenuItem, { value: role, children: role }, role)) }) }));
+                },
+            },
+            {
+                field: 'is_support_agent',
+                headerName: t('UserList.SUPPORTER', 'Support Agent'),
+                minWidth: 190,
+                flex: 0.8,
+                valueGetter: (_value, row) => Boolean(row === null || row === void 0 ? void 0 : row.is_support_agent),
+                renderCell: (params) => {
+                    const user = params.row;
+                    return (_jsx(FormControl, { size: "small", fullWidth: true, sx: controlSx, disabled: !canEdit(user), children: _jsxs(Select, { value: user.is_support_agent ? 'yes' : 'no', onChange: (event) => handleToggleSupporter(user.id, event.target.value === 'yes'), variant: "outlined", children: [_jsx(MenuItem, { value: "yes", children: t('Common.YES', 'Yes') }), _jsx(MenuItem, { value: "no", children: t('Common.NO', 'No') })] }) }));
+                },
+            },
+        ];
+        const mappedExtraColumns = visibleExtraColumns.map((column) => ({
+            field: `extra:${column.key}`,
+            headerName: typeof column.label === 'function' ? column.label(listContext) : column.label,
+            minWidth: Number(column.minWidth) || 180,
+            flex: Number(column.flex) || 0.9,
+            sortable: column.sortable !== false,
+            align: column.align || 'left',
+            headerAlign: column.align || 'left',
+            valueGetter: (_value, row) => getExtraColumnSortValue(column, row),
+            renderCell: (params) => column.renderCell({
+                user: params.row,
+                canEdit: canEdit(params.row),
+                currentUser,
+                extraContext,
+                t,
+                reloadUsers: loadUsers,
+            }),
+        }));
+        const actionColumn = {
+            field: 'actions',
+            headerName: t('Common.ACTIONS', 'Actions'),
+            minWidth: Math.max(220, 110 + visibleRowActions.length * 110),
+            flex: 1.4,
+            sortable: false,
+            filterable: false,
+            disableColumnMenu: true,
+            renderCell: (params) => {
+                const user = params.row;
+                return (_jsxs(Box, { sx: { display: 'flex', flexWrap: 'wrap', gap: 1, alignItems: 'center', py: 0.5 }, children: [visibleRowActions.map((action) => {
+                            const actionId = `${action.key}:${user.id}`;
+                            const isBusy = Boolean(rowActionLoading[actionId]);
+                            const isDisabled = typeof action.disabled === 'function'
+                                ? action.disabled({
+                                    user,
+                                    canEdit: canEdit(user),
+                                    currentUser,
+                                    extraContext,
+                                    t,
+                                })
+                                : false;
+                            return (_jsx(Button, { size: "small", variant: "outlined", onClick: () => runRowAction(action, user), disabled: isBusy || isDisabled, sx: actionButtonSx, children: typeof action.label === 'function'
+                                    ? action.label({ user, t, currentUser, canEdit: canEdit(user) })
+                                    : action.label }, `${action.key}-${user.id}`));
+                        }), _jsx(Tooltip, { title: t('Common.DELETE', 'Delete'), children: _jsx("span", { children: _jsx(Button, { size: "small", variant: "outlined", color: "error", startIcon: _jsx(DeleteIcon, {}), onClick: () => handleDelete(user.id), disabled: !canEdit(user), sx: actionButtonSx, children: t('Common.DELETE', 'Delete') }) }) })] }));
+            },
+        };
+        return [...baseColumns, ...mappedExtraColumns, actionColumn];
+    }, [
+        t,
+        roles,
+        visibleExtraColumns,
+        visibleRowActions,
+        listContext,
+        rowActionLoading,
+        currentUser,
+        extraContext,
+        loadUsers,
+        canEdit,
+    ]);
+    return (_jsxs(Box, { children: [_jsx(Typography, { variant: "h6", gutterBottom: true, children: t('UserList.TITLE', 'All Users') }), _jsx(Box, { sx: { mb: 2, maxWidth: 420 }, children: _jsx(TextField, { fullWidth: true, size: "small", label: t('Common.SEARCH', 'Search'), placeholder: t('UserList.SEARCH_PLACEHOLDER', 'Search users...'), value: searchQuery, onChange: (event) => setSearchQuery(event.target.value) }) }), error && _jsx(Alert, { severity: "error", sx: { mb: 2 }, children: t(error) }), loading && (_jsx(Box, { sx: { display: 'flex', justifyContent: 'center', p: 3 }, children: _jsx(CircularProgress, {}) })), !loading && (_jsx(Box, { sx: { width: '100%', minHeight: 520 }, children: _jsx(DataGrid, { rows: filteredUsers, columns: columns, disableRowSelectionOnClick: true, showToolbar: true, getRowHeight: () => 'auto', pageSizeOptions: [10, 25, 50, 100], initialState: {
+                        sorting: { sortModel: [{ field: 'email', sort: 'asc' }] },
+                        pagination: { paginationModel: { pageSize: 25, page: 0 } },
+                    }, localeText: {
+                        noRowsLabel: t('UserList.NO_USERS', 'No users found.'),
+                        toolbarQuickFilterPlaceholder: t('UserList.SEARCH_PLACEHOLDER', 'Search users...'),
+                    }, slotProps: {
+                        toolbar: {
+                            showQuickFilter: true,
+                            quickFilterProps: { debounceMs: 300 },
+                        },
+                    }, sx: {
+                        border: 1,
+                        borderColor: 'divider',
+                        '& .MuiDataGrid-cell': {
+                            display: 'flex',
+                            alignItems: 'flex-start',
+                            py: 1,
+                        },
+                        '& .MuiDataGrid-columnHeaders': {
+                            bgcolor: 'action.hover',
+                        },
+                    } }) }))] }));
 }

package/dist/index.js

@@ -22,5 +22,8 @@ export { AccessCodeManager } from './components/AccessCodeManager';
 export { UserListComponent } from './components/UserListComponent';
 export { UserInviteComponent } from './components/UserInviteComponent';
 export { BulkInviteCsvTab } from './components/BulkInviteCsvTab';
+export { RegistrationMethodsManager } from './components/RegistrationMethodsManager';
+export { AuthFactorRequirementCard } from './components/AuthFactorRequirementCard';
+export { QrSignupManager } from './components/QrSignupManager';
 // --- 6. Translations ---
 export { authTranslations } from './i18n/authTranslations';

package/dist/pages/AccountPage.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useContext, useMemo } from 'react';
+import React, { useContext, useMemo, useState } from 'react';
 import { Helmet } from 'react-helmet';
 import { useSearchParams } from 'react-router-dom';
 import { Tabs, Tab, Box, Typography, Alert, CircularProgress, Paper, Stack, } from '@mui/material';
@@ -13,6 +13,9 @@ import { SecurityComponent } from '../components/SecurityComponent';
 import { UserListComponent } from '../components/UserListComponent';
 import { UserInviteComponent } from '../components/UserInviteComponent';
 import { AccessCodeManager } from '../components/AccessCodeManager';
+import { RegistrationMethodsManager } from '../components/RegistrationMethodsManager';
+import { AuthFactorRequirementCard } from '../components/AuthFactorRequirementCard';
+import { QrSignupManager } from '../components/QrSignupManager';
 import { SupportRecoveryRequestsTab } from '../components/SupportRecoveryRequestsTab';
 import { BulkInviteCsvTab } from '../components/BulkInviteCsvTab';
 import { updateUserProfile } from '../auth/authApi'; // Ggf. Pfad anpassen
@@ -21,6 +24,7 @@ export function AccountPage({ userListExtraColumns = [], userListExtraRowActions
     const { t } = useTranslation();
     const { user, login, loading } = useContext(AuthContext);
     const [searchParams, setSearchParams] = useSearchParams();
+    const [authPolicy, setAuthPolicy] = useState(null);
     // 1. URL State Management
     const currentTabRaw = searchParams.get('tab') || 'profile';
     const currentTab = ['invite', 'bulk-invite-csv', 'access'].includes(currentTabRaw)
@@ -87,5 +91,5 @@ export function AccountPage({ userListExtraColumns = [], userListExtraRowActions
     const activeExtraTab = builtInTabValues.has(safeTab)
         ? null
         : extraTabs.find((tab) => tab.value === safeTab);
-    return (_jsxs(WidePage, { title: t('Account.TITLE', 'Account & Administration'), children: [_jsx(Helmet, { children: _jsxs("title", { children: [t('Account.PAGE_TITLE', 'Account'), " \u2013 ", user.email] }) }), _jsx(Tabs, { value: safeTab, onChange: handleTabChange, variant: "scrollable", scrollButtons: "auto", sx: { mb: 3, borderBottom: 1, borderColor: 'divider' }, children: tabs.map((tab) => (_jsx(Tab, { label: tab.label, value: tab.value }, tab.value))) }), safeTab === 'profile' && (_jsx(Box, { sx: { mt: 2 }, children: _jsx(ProfileComponent, { onSubmit: handleProfileSubmit, showName: true, showPrivacy: true, showCookies: true }) })), safeTab === 'security' && (_jsx(Box, { sx: { mt: 2 }, children: _jsx(SecurityComponent, { fromRecovery: fromRecovery, fromWeakLogin: fromWeakLogin }) })), safeTab === 'users' && (_jsx(Box, { sx: { mt: 2 }, children: _jsx(UserListComponent, { roles: activeRoles, currentUser: user, extraColumns: userListExtraColumns, extraRowActions: userListExtraRowActions, extraContext: userListExtraContext, refreshTrigger: userListRefreshTrigger, canEditUser: userListCanEditUser }) })), safeTab === 'invite' && (_jsx(Box, { sx: { mt: 2 }, children: _jsxs(Stack, { spacing: 2.5, children: [(isSuperUser || perms.can_invite) && (_jsx(Paper, { variant: "outlined", sx: { p: 2.5, borderRadius: 2 }, children: _jsx(UserInviteComponent, {}) })), (isSuperUser || perms.can_manage_access_codes) && (_jsxs(Paper, { variant: "outlined", sx: { p: 2.5, borderRadius: 2 }, children: [_jsx(Typography, { variant: "body2", sx: { mb: 2, color: 'text.secondary' }, children: t('Account.ACCESS_CODES_HINT', 'Manage access codes for self-registration.') }), _jsx(AccessCodeManager, {})] })), (isSuperUser || perms.can_invite) && showBulkInviteCsvTab && (_jsx(Paper, { variant: "outlined", sx: { p: 2.5, borderRadius: 2 }, children: _jsx(BulkInviteCsvTab, Object.assign({}, bulkInviteCsvProps)) }))] }) })), safeTab === 'support' && (_jsx(Box, { sx: { mt: 2 }, children: _jsx(SupportRecoveryRequestsTab, {}) })), activeExtraTab && (_jsx(Box, { sx: { mt: 2 }, children: (_a = activeExtraTab.render) === null || _a === void 0 ? void 0 : _a.call(activeExtraTab, { user, perms, isSuperUser, t }) }))] }));
+    return (_jsxs(WidePage, { title: t('Account.TITLE', 'Account & Administration'), children: [_jsx(Helmet, { children: _jsxs("title", { children: [t('Account.PAGE_TITLE', 'Account'), " \u2013 ", user.email] }) }), _jsx(Tabs, { value: safeTab, onChange: handleTabChange, variant: "scrollable", scrollButtons: "auto", sx: { mb: 3, borderBottom: 1, borderColor: 'divider' }, children: tabs.map((tab) => (_jsx(Tab, { label: tab.label, value: tab.value }, tab.value))) }), safeTab === 'profile' && (_jsx(Box, { sx: { mt: 2 }, children: _jsx(ProfileComponent, { onSubmit: handleProfileSubmit, showName: true, showPrivacy: true, showCookies: true }) })), safeTab === 'security' && (_jsx(Box, { sx: { mt: 2 }, children: _jsx(SecurityComponent, { fromRecovery: fromRecovery, fromWeakLogin: fromWeakLogin }) })), safeTab === 'users' && (_jsx(Box, { sx: { mt: 2 }, children: _jsx(UserListComponent, { roles: activeRoles, currentUser: user, extraColumns: userListExtraColumns, extraRowActions: userListExtraRowActions, extraContext: userListExtraContext, refreshTrigger: userListRefreshTrigger, canEditUser: userListCanEditUser }) })), safeTab === 'invite' && (_jsx(Box, { sx: { mt: 2 }, children: _jsxs(Stack, { spacing: 2.5, children: [(isSuperUser || perms.can_invite) && (_jsx(Paper, { variant: "outlined", sx: { p: 2.5, borderRadius: 2 }, children: _jsx(RegistrationMethodsManager, { onPolicyChange: setAuthPolicy }) })), (isSuperUser || perms.can_invite) && (_jsx(Paper, { variant: "outlined", sx: { p: 2.5, borderRadius: 2 }, children: _jsx(AuthFactorRequirementCard, {}) })), (isSuperUser || perms.can_invite) && (_jsx(Paper, { variant: "outlined", sx: { p: 2.5, borderRadius: 2 }, children: _jsx(UserInviteComponent, {}) })), (isSuperUser || perms.can_manage_access_codes) && (_jsxs(Paper, { variant: "outlined", sx: { p: 2.5, borderRadius: 2 }, children: [_jsx(Typography, { variant: "body2", sx: { mb: 2, color: 'text.secondary' }, children: t('Account.ACCESS_CODES_HINT', 'Manage access codes for self-registration.') }), _jsx(AccessCodeManager, {})] })), (isSuperUser || perms.can_invite) && showBulkInviteCsvTab && (_jsx(Paper, { variant: "outlined", sx: { p: 2.5, borderRadius: 2 }, children: _jsx(BulkInviteCsvTab, Object.assign({}, bulkInviteCsvProps)) })), (isSuperUser || perms.can_invite) && (_jsx(Paper, { variant: "outlined", sx: { p: 2.5, borderRadius: 2 }, children: _jsx(QrSignupManager, { enabled: Boolean(authPolicy === null || authPolicy === void 0 ? void 0 : authPolicy.allow_self_signup_qr) }) }))] }) })), safeTab === 'support' && (_jsx(Box, { sx: { mt: 2 }, children: _jsx(SupportRecoveryRequestsTab, {}) })), activeExtraTab && (_jsx(Box, { sx: { mt: 2 }, children: (_a = activeExtraTab.render) === null || _a === void 0 ? void 0 : _a.call(activeExtraTab, { user, perms, isSuperUser, t }) }))] }));
 }

package/dist/pages/LoginPage.js

@@ -32,6 +32,21 @@ export function LoginPage() {
         : recoveryTokenRaw;
     // Backward-compatible fallback for legacy links using query parameters.
     const recoveryEmail = hashParams.get('email') || params.get('email') || '';
+    const requestedNext = params.get('next');
+    const getRedirectTarget = (currentUser, options = {}) => {
+        var _a;
+        if (options.forceSecurityRedirect) {
+            return options.forceSecurityRedirect;
+        }
+        const requiresExtra = ((_a = currentUser === null || currentUser === void 0 ? void 0 : currentUser.security_state) === null || _a === void 0 ? void 0 : _a.requires_additional_security) === true;
+        if (requiresExtra) {
+            return '/account?tab=security&from=weak_login';
+        }
+        if (requestedNext && requestedNext.startsWith('/')) {
+            return requestedNext;
+        }
+        return '/';
+    };
     useEffect(() => {
         const socialError = params.get('error') || params.get('social');
         if (socialError) {
@@ -39,30 +54,14 @@ export function LoginPage() {
         }
     }, [location.search]);
     useEffect(() => {
-        var _a;
         if (loading || !user)
             return;
-        const requiresExtra = ((_a = user.security_state) === null || _a === void 0 ? void 0 : _a.requires_additional_security) === true;
-        if (requiresExtra) {
-            navigate('/account?tab=security&from=weak_login', { replace: true });
-        }
-        else {
-            navigate('/', { replace: true });
-        }
-    }, [loading, user, navigate]);
+        navigate(getRedirectTarget(user), { replace: true });
+    }, [loading, user, navigate, requestedNext]);
     // --- Helper: Central Success Logic ---
     const handleLoginSuccess = (user) => {
-        var _a;
         login(user); // Update Context
-        // Check if "Strong Security" is enforced/required but not met
-        const requiresExtra = ((_a = user.security_state) === null || _a === void 0 ? void 0 : _a.requires_additional_security) === true;
-        if (requiresExtra) {
-            navigate('/account?tab=security&from=weak_login');
-        }
-        else {
-            // Standard Redirect (könnte man noch mit ?next=... erweitern)
-            navigate('/');
-        }
+        navigate(getRedirectTarget(user));
     };
     // --- Handlers ---
     const handleSubmitCredentials = async ({ identifier, password }) => {
@@ -72,9 +71,10 @@ export function LoginPage() {
             // A) Recovery Flow
             if (recoveryToken) {
                 const result = await loginWithRecoveryPassword(identifier, password, recoveryToken);
-                // Recovery login implies a specific redirect usually, usually straight to security settings
                 login(result.user);
-                navigate('/account?tab=security&from=recovery');
+                navigate(getRedirectTarget(result.user, {
+                    forceSecurityRedirect: '/account?tab=security&from=recovery',
+                }));
                 return;
             }
             // B) Standard Password Login
@@ -118,9 +118,10 @@ export function LoginPage() {
     const handleMfaSuccess = ({ user, method }) => {
         // MFA component should return the user object after verifying code
         if (method === 'recovery_code') {
-            // Recovery codes often trigger a security check prompt
             login(user);
-            navigate('/account?tab=security&from=recovery');
+            navigate(getRedirectTarget(user, {
+                forceSecurityRedirect: '/account?tab=security&from=recovery',
+            }));
         }
         else {
             handleLoginSuccess(user);
@@ -137,8 +138,13 @@ export function LoginPage() {
     const passwordLoginEnabled = Boolean(authMethods === null || authMethods === void 0 ? void 0 : authMethods.password_login) || Boolean(recoveryToken);
     const socialLoginEnabled = Boolean(authMethods === null || authMethods === void 0 ? void 0 : authMethods.social_login) && socialProviders.length > 0;
     const passkeyLoginEnabled = Boolean(authMethods === null || authMethods === void 0 ? void 0 : authMethods.passkey_login);
-    const signupEnabled = Boolean(authMethods === null || authMethods === void 0 ? void 0 : authMethods.signup);
+    const signupModes = Array.isArray(authMethods === null || authMethods === void 0 ? void 0 : authMethods.signup_modes)
+        ? authMethods.signup_modes.filter(Boolean)
+        : [];
+    const signupEnabled = signupModes.length > 0 || Boolean(authMethods === null || authMethods === void 0 ? void 0 : authMethods.signup);
     const passwordResetEnabled = Boolean(authMethods === null || authMethods === void 0 ? void 0 : authMethods.password_reset);
+    const twoFactorRequired = Boolean(authMethods === null || authMethods === void 0 ? void 0 : authMethods.two_factor_required)
+        || Number((authMethods === null || authMethods === void 0 ? void 0 : authMethods.required_auth_factor_count) || 1) >= 2;
     // --- Render ---
-    return (_jsxs(NarrowPage, { title: t('Auth.PAGE_LOGIN_TITLE'), subtitle: t('Auth.PAGE_LOGIN_SUBTITLE'), children: [_jsx(Helmet, { children: _jsxs("title", { children: [t('App.NAME'), " \u2013 ", t('Auth.PAGE_LOGIN_TITLE')] }) }), errorKey && (_jsx(Alert, { severity: "error", sx: { mb: 2 }, children: t(errorKey) })), recoveryToken && !errorKey && (_jsx(Alert, { severity: "info", sx: { mb: 2 }, children: t('Auth.RECOVERY_LOGIN_WARNING', 'Recovery link validated. Please enter your password.') })), step === 'credentials' && (_jsx(LoginForm, { onSubmit: passwordLoginEnabled ? handleSubmitCredentials : null, onForgotPassword: passwordResetEnabled ? () => navigate('/reset-request-password') : null, onSocialLogin: socialLoginEnabled ? (provider) => startSocialLogin(provider) : null, socialProviders: socialProviders, onPasskeyLogin: passkeyLoginEnabled ? handlePasskeyLoginInitial : null, onSignUp: signupEnabled ? () => navigate('/signup') : null, disabled: submitting, initialIdentifier: recoveryEmail })), step === 'mfa' && mfaState && (_jsx(Box, { children: _jsx(MfaLoginComponent, { availableTypes: mfaState.availableTypes, identifier: mfaState.identifier, onSuccess: handleMfaSuccess, onCancel: handleMfaCancel }) }))] }));
+    return (_jsxs(NarrowPage, { title: t('Auth.PAGE_LOGIN_TITLE'), subtitle: t('Auth.PAGE_LOGIN_SUBTITLE'), children: [_jsx(Helmet, { children: _jsxs("title", { children: [t('App.NAME'), " \u2013 ", t('Auth.PAGE_LOGIN_TITLE')] }) }), errorKey && (_jsx(Alert, { severity: "error", sx: { mb: 2 }, children: t(errorKey) })), recoveryToken && !errorKey && (_jsx(Alert, { severity: "info", sx: { mb: 2 }, children: t('Auth.RECOVERY_LOGIN_WARNING', 'Recovery link validated. Please enter your password.') })), twoFactorRequired && !recoveryToken && (_jsx(Alert, { severity: "info", sx: { mb: 2 }, children: t('Auth.TWO_FACTOR_REQUIRED_HINT', 'This app requires two authentication factors for full access.') })), step === 'credentials' && (_jsx(LoginForm, { onSubmit: passwordLoginEnabled ? handleSubmitCredentials : null, onForgotPassword: passwordResetEnabled ? () => navigate('/reset-request-password') : null, onSocialLogin: socialLoginEnabled ? (provider) => startSocialLogin(provider) : null, socialProviders: socialProviders, onPasskeyLogin: passkeyLoginEnabled ? handlePasskeyLoginInitial : null, onSignUp: signupEnabled ? () => navigate('/signup') : null, disabled: submitting, initialIdentifier: recoveryEmail })), step === 'mfa' && mfaState && (_jsx(Box, { children: _jsx(MfaLoginComponent, { availableTypes: mfaState.availableTypes, identifier: mfaState.identifier, onSuccess: handleMfaSuccess, onCancel: handleMfaCancel }) }))] }));
 }

package/dist/pages/PasswordInvitePage.js

@@ -13,6 +13,8 @@ export function PasswordInvitePage() {
     const location = useLocation();
     const navigate = useNavigate();
     const { t } = useTranslation();
+    const searchParams = new URLSearchParams(location.search);
+    const nextPath = searchParams.get('next');
     const [submitting, setSubmitting] = useState(false);
     const [errorKey, setErrorKey] = useState(null);
     const [successKey, setSuccessKey] = useState(null);
@@ -57,7 +59,10 @@ export function PasswordInvitePage() {
             setSuccessKey(isInvite
                 ? 'Auth.RESET_PASSWORD_SUCCESS_INVITE'
                 : 'Auth.RESET_PASSWORD_SUCCESS_RESET');
-            navigate('/login');
+            const target = nextPath
+                ? `/login?next=${encodeURIComponent(nextPath)}`
+                : '/login';
+            navigate(target);
         }
         catch (err) {
             setErrorKey(err.code || 'Auth.RESET_PASSWORD_FAILED');

package/dist/pages/SignUpPage.js

@@ -1,20 +1,79 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-// src/pages/SignUpPage.jsx
-import React, { useState } from 'react';
-import { useNavigate } from 'react-router-dom';
-import { Box, TextField, Button, Typography, Alert, } from '@mui/material';
+import React, { useContext, useEffect, useMemo, useState } from 'react';
+import { useNavigate, useLocation } from 'react-router-dom';
+import { Alert, Box, Button, Stack, TextField, Typography, } from '@mui/material';
 import { Helmet } from 'react-helmet';
 import { useTranslation } from 'react-i18next';
 import { NarrowPage } from '../layout/PageLayout';
-import { validateAccessCode, requestInviteWithCode } from '../auth/authApi';
+import { AuthContext } from '../auth/AuthContext';
+import { submitRegistrationRequest } from '../auth/authApi';
+const MODE_LABELS = {
+    self_signup_access_code: 'Auth.SIGNUP_ACCESS_CODE_TAB',
+    self_signup_open: 'Auth.SIGNUP_OPEN_TAB',
+    self_signup_email_domain: 'Auth.SIGNUP_EMAIL_DOMAIN_TAB',
+    self_signup_qr: 'Auth.SIGNUP_QR_TAB',
+};
+const MODE_HINTS = {
+    self_signup_access_code: 'Auth.SIGNUP_ACCESS_CODE_HINT',
+    self_signup_open: 'Auth.SIGNUP_OPEN_HINT',
+    self_signup_email_domain: 'Auth.SIGNUP_EMAIL_DOMAIN_HINT',
+    self_signup_qr: 'Auth.SIGNUP_QR_HINT',
+};
 export function SignUpPage() {
     const navigate = useNavigate();
+    const location = useLocation();
     const { t } = useTranslation();
+    const { authMethods } = useContext(AuthContext);
+    const signupModes = useMemo(() => {
+        const configured = Array.isArray(authMethods === null || authMethods === void 0 ? void 0 : authMethods.signup_modes)
+            ? authMethods.signup_modes.filter(Boolean)
+            : [];
+        if (configured.length > 0) {
+            return configured;
+        }
+        return (authMethods === null || authMethods === void 0 ? void 0 : authMethods.signup) ? ['self_signup_access_code'] : [];
+    }, [authMethods]);
+    const query = new URLSearchParams(location.search);
+    const tokenFromUrl = query.get('rt') || '';
+    const initialMode = useMemo(() => {
+        if (tokenFromUrl && signupModes.includes('self_signup_qr')) {
+            return 'self_signup_qr';
+        }
+        return signupModes[0] || 'self_signup_access_code';
+    }, [signupModes, tokenFromUrl]);
+    const [mode, setMode] = useState(initialMode);
     const [email, setEmail] = useState('');
     const [accessCode, setAccessCode] = useState('');
     const [submitting, setSubmitting] = useState(false);
     const [successKey, setSuccessKey] = useState(null);
     const [errorKey, setErrorKey] = useState(null);
+    const [qrHint, setQrHint] = useState('');
+    const modeHint = useMemo(() => {
+        if (mode === 'self_signup_access_code') {
+            return t(MODE_HINTS[mode], 'Use this option only if you were given an access code for signup.');
+        }
+        if (mode === 'self_signup_open') {
+            return t(MODE_HINTS[mode], 'Use this option for direct signup without an access code.');
+        }
+        if (mode === 'self_signup_email_domain') {
+            return t(MODE_HINTS[mode], 'Use an email address from an allowed domain for this signup flow.');
+        }
+        if (mode === 'self_signup_qr') {
+            return qrHint || t(MODE_HINTS[mode], 'Use a valid QR signup link to continue.');
+        }
+        return '';
+    }, [mode, qrHint, t]);
+    useEffect(() => {
+        setMode(initialMode);
+    }, [initialMode]);
+    useEffect(() => {
+        if (!tokenFromUrl || mode !== 'self_signup_qr') {
+            setQrHint('');
+            return undefined;
+        }
+        setQrHint(t('Auth.SIGNUP_QR_READY', 'QR signup token detected. You can complete your signup now.'));
+        return undefined;
+    }, [mode, tokenFromUrl, t]);
     const handleSubmit = async (event) => {
         event.preventDefault();
         setSuccessKey(null);
@@ -23,24 +82,25 @@ export function SignUpPage() {
             setErrorKey('Auth.EMAIL_REQUIRED');
             return;
         }
-        if (!accessCode) {
+        if (mode === 'self_signup_access_code' && !accessCode) {
             setErrorKey('Auth.SIGNUP_ACCESS_CODE_REQUIRED');
             return;
         }
+        if (mode === 'self_signup_qr' && !tokenFromUrl) {
+            setErrorKey('Auth.SIGNUP_QR_INVALID');
+            return;
+        }
         setSubmitting(true);
         try {
-            // 1) Access-Code prüfen
-            const res = await validateAccessCode(accessCode);
-            if (!(res === null || res === void 0 ? void 0 : res.valid)) {
-                setErrorKey('Auth.ACCESS_CODE_INVALID_OR_INACTIVE');
-                return;
-            }
-            // 2) Invite anfordern
-            await requestInviteWithCode(email, accessCode);
+            await submitRegistrationRequest({
+                email,
+                mode,
+                accessCode,
+                registrationContextToken: mode === 'self_signup_qr' ? tokenFromUrl : null,
+            });
             setSuccessKey('Auth.INVITE_REQUEST_SUCCESS');
         }
         catch (err) {
-            // validateAccessCode / requestInviteWithCode liefern normalisierte Errors
             setErrorKey(err.code || 'Auth.INVITE_FAILED');
         }
         finally {
@@ -50,7 +110,7 @@ export function SignUpPage() {
     const handleGoToLogin = () => {
         navigate('/login');
     };
-    return (_jsxs(NarrowPage, { title: t('Auth.LOGIN_SIGNUP_BUTTON'), subtitle: t('Auth.PAGE_SIGNUP_SUBTITLE'), children: [_jsx(Helmet, { children: _jsxs("title", { children: [t('App.NAME'), " \u2013 ", t('Auth.LOGIN_SIGNUP_BUTTON')] }) }), successKey && (_jsx(Alert, { severity: "success", sx: { mb: 2 }, children: t(successKey, { email }) })), errorKey && (_jsx(Alert, { severity: "error", sx: { mb: 2 }, children: t(errorKey) })), _jsxs(Box, { component: "form", onSubmit: handleSubmit, sx: { display: 'flex', flexDirection: 'column', gap: 2 }, children: [_jsx(TextField, { label: t('Auth.EMAIL_LABEL'), type: "email", required: true, fullWidth: true, value: email, onChange: (e) => setEmail(e.target.value), disabled: submitting }), _jsx(TextField, { label: t('Auth.ACCESS_CODE_LABEL'), type: "text", required: true, fullWidth: true, value: accessCode, onChange: (e) => setAccessCode(e.target.value), disabled: submitting }), _jsx(Button, { type: "submit", variant: "contained", disabled: submitting, children: submitting
+    return (_jsxs(NarrowPage, { title: t('Auth.LOGIN_SIGNUP_BUTTON'), subtitle: t('Auth.PAGE_SIGNUP_SUBTITLE'), children: [_jsx(Helmet, { children: _jsxs("title", { children: [t('App.NAME'), " \u2013 ", t('Auth.LOGIN_SIGNUP_BUTTON')] }) }), successKey && (_jsx(Alert, { severity: "success", sx: { mb: 2 }, children: t(successKey, { email }) })), errorKey && (_jsx(Alert, { severity: "error", sx: { mb: 2 }, children: t(errorKey, t('Auth.INVITE_FAILED', 'Could not complete signup.')) })), signupModes.length > 1 && (_jsxs(Stack, { spacing: 1, sx: { mb: 2 }, children: [_jsx(Alert, { severity: "info", children: t('Auth.SIGNUP_MODE_SELECTOR_HINT', 'Choose the signup option that matches how you want to register.') }), _jsx(Stack, { direction: { xs: 'column', sm: 'row' }, spacing: 1, flexWrap: "wrap", children: signupModes.map((entry) => (_jsx(Button, { variant: mode === entry ? 'contained' : 'outlined', onClick: () => setMode(entry), disabled: submitting, children: t(MODE_LABELS[entry] || entry, entry) }, entry))) })] })), _jsxs(Box, { component: "form", onSubmit: handleSubmit, sx: { display: 'flex', flexDirection: 'column', gap: 2 }, children: [modeHint && _jsx(Alert, { severity: "info", children: modeHint }), _jsx(TextField, { label: t('Auth.EMAIL_LABEL'), type: "email", required: true, fullWidth: true, value: email, onChange: (e) => setEmail(e.target.value), disabled: submitting }), mode === 'self_signup_access_code' && (_jsx(TextField, { label: t('Auth.ACCESS_CODE_LABEL'), type: "text", required: true, fullWidth: true, value: accessCode, onChange: (e) => setAccessCode(e.target.value), disabled: submitting })), mode === 'self_signup_qr' && (_jsx(Stack, { spacing: 1, children: _jsx(TextField, { label: t('Auth.SIGNUP_QR_TOKEN_LABEL', 'QR token'), value: tokenFromUrl, fullWidth: true, InputProps: { readOnly: true } }) })), _jsx(Button, { type: "submit", variant: "contained", disabled: submitting || signupModes.length === 0, children: submitting
                             ? t('Auth.SIGNUP_SUBMITTING')
                             : t('Auth.SIGNUP_SUBMIT') })] }), _jsx(Box, { sx: { mt: 3 }, children: _jsxs(Typography, { variant: "body2", children: [t('Auth.SIGNUP_ALREADY_HAVE_ACCOUNT'), ' ', _jsx(Button, { onClick: handleGoToLogin, variant: "text", size: "small", children: t('Auth.SIGNUP_GO_TO_LOGIN') })] }) })] }));
 }