@micha.bigler/ui-core-micha 2.6.1 → 2.8.0

package/.github/workflows/publish.yml

@@ -51,18 +51,22 @@ jobs:
           }
 
           const current = JSON.parse(fs.readFileSync('package.json', 'utf8')).version;
-          let previous;
+          let published;
           try {
-            previous = JSON.parse(
-              cp.execFileSync('git', ['show', 'HEAD^:package.json'], { encoding: 'utf8' })
-            ).version;
+            published = cp.execFileSync(
+              'npm',
+              ['view', '@micha.bigler/ui-core-micha', 'version'],
+              { encoding: 'utf8' }
+            ).trim();
           } catch (error) {
-            console.log('No previous package.json found. Publishing.');
+            console.log(
+              'Could not fetch the published npm version (the package may not exist yet or the registry is unavailable). Publishing.'
+            );
             writeOutput('true');
             process.exit(0);
           }
 
-          console.log(`Previous version: ${previous}`);
+          console.log(`Published version: ${published}`);
           console.log(`Current version:  ${current}`);
 
           function parse(version) {
@@ -82,7 +86,7 @@ jobs:
             return false;
           }
 
-          if (greaterThan(current, previous)) {
+          if (greaterThan(current, published)) {
             console.log('Version increased. Publishing.');
             writeOutput('true');
           } else {

package/dist/auth/AuthContext.js

@@ -69,6 +69,11 @@ export const AuthProvider = ({ children }) => {
     const login = (userData) => {
         setUser((prev) => (Object.assign(Object.assign({}, prev), mapUserFromApi(userData))));
     };
+    const refreshUser = async () => {
+        const data = await fetchCurrentUser();
+        if (data)
+            setUser(mapUserFromApi(data));
+    };
     const logout = async () => {
         try {
             await logoutSession();
@@ -87,5 +92,6 @@ export const AuthProvider = ({ children }) => {
             loading,
             login,
             logout,
+            refreshUser,
         }, children: [children, _jsx(ReauthModal, {})] }));
 };

package/dist/i18n/onboardingTranslations.js

@@ -1,17 +1,25 @@
 export const onboardingTranslations = {
     'Onboarding.SETUP': { de: 'Einrichtung', fr: 'Configuration', en: 'Setup', sw: 'Usanidi' },
     'Onboarding.STEP_COUNTER': { de: 'Schritt {{current}} von {{total}}', fr: 'Étape {{current}} sur {{total}}', en: 'Step {{current}} of {{total}}', sw: 'Hatua ya {{current}} kati ya {{total}}' },
-    'Onboarding.COOKIE_CONSENT_TITLE': { de: 'Cookie-Einstellungen', fr: 'Préférences des cookies', en: 'Cookie preferences', sw: 'Mapendeleo ya vidakuzi' },
-    'Onboarding.COOKIE_CONSENT_BODY': { de: 'Diese App verwendet optionale Cookies, um deine Einstellungen und Präferenzen zu speichern. Möchtest du diese aktivieren?', fr: 'Cette application utilise des cookies facultatifs pour enregistrer vos réglages et préférences. Souhaitez-vous les activer ?', en: 'This app uses optional cookies to save your settings and preferences. Would you like to enable them?', sw: 'Programu hii hutumia vidakuzi vya hiari kuhifadhi mipangilio na mapendeleo yako. Je, ungependa kuviwasha?' },
-    'Onboarding.COOKIE_CONSENT_ACCEPT': { de: 'Akzeptieren', fr: 'Accepter', en: 'Accept', sw: 'Kubali' },
-    'Onboarding.COOKIE_CONSENT_ERROR': { de: 'Die Cookie-Einstellung konnte nicht gespeichert werden. Bitte versuche es erneut.', fr: 'Impossible d’enregistrer votre préférence de cookies. Veuillez réessayer.', en: 'Your cookie preference could not be saved. Please try again.', sw: 'Upendeleo wako wa vidakuzi haukuweza kuhifadhiwa. Tafadhali jaribu tena.' },
+    'Onboarding.PRIVACY_COOKIES_TITLE': { de: 'Datenschutz & Cookies', fr: 'Confidentialité et cookies', en: 'Privacy & cookies', sw: 'Faragha na vidakuzi' },
+    'Onboarding.PRIVACY_COOKIES_BODY': { de: 'Bitte lies unsere Datenschutzerklärung und stimme ihr zu, um fortzufahren. Optionale Cookies helfen uns, deine Einstellungen und Präferenzen zu speichern.', fr: 'Veuillez lire et accepter notre politique de confidentialité pour continuer. Les cookies facultatifs nous aident à enregistrer vos réglages et préférences.', en: 'Please read and agree to our privacy statement to continue. Optional cookies help us save your settings and preferences.', sw: 'Tafadhali soma na ukubali taarifa yetu ya faragha ili kuendelea. Vidakuzi vya hiari hutusaidia kuhifadhi mipangilio na mapendeleo yako.' },
+    'Onboarding.PRIVACY_AGREEMENT_LABEL': { de: 'Ich habe die Datenschutzerklärung gelesen und stimme ihr zu.', fr: 'J’ai lu et j’accepte la politique de confidentialité.', en: 'I have read and agree to the privacy statement.', sw: 'Nimesoma na ninakubali taarifa ya faragha.' },
+    'Onboarding.COOKIES_OPT_IN_LABEL': { de: 'Optionale Cookies aktivieren, um meine Einstellungen und Präferenzen zu speichern.', fr: 'Activer les cookies facultatifs pour enregistrer mes réglages et préférences.', en: 'Enable optional cookies to save my settings and preferences.', sw: 'Washa vidakuzi vya hiari kuhifadhi mipangilio na mapendeleo yangu.' },
+    'Onboarding.VIEW_STATEMENT': { de: 'Text anzeigen', fr: 'Afficher le texte', en: 'View text', sw: 'Angalia maandishi' },
+    'Onboarding.CONTINUE': { de: 'Weiter', fr: 'Continuer', en: 'Continue', sw: 'Endelea' },
+    'Onboarding.PRIVACY_COOKIES_ERROR': { de: 'Deine Angaben konnten nicht gespeichert werden. Bitte versuche es erneut.', fr: 'Vos préférences n’ont pas pu être enregistrées. Veuillez réessayer.', en: 'Your preferences could not be saved. Please try again.', sw: 'Mapendeleo yako hayakuweza kuhifadhiwa. Tafadhali jaribu tena.' },
     'Onboarding.COMPLETE_NAME_TITLE': { de: 'Dein Name', fr: 'Votre nom', en: 'Your name', sw: 'Jina lako' },
     'Onboarding.COMPLETE_NAME_BODY': { de: 'Bitte gib deinen Vor- und Nachnamen an, damit andere dich erkennen.', fr: 'Veuillez indiquer votre prénom et votre nom afin que les autres puissent vous reconnaître.', en: 'Please provide your first and last name so others can recognise you.', sw: 'Tafadhali weka jina lako la kwanza na la mwisho ili wengine wakutambue.' },
     'Onboarding.FIRST_NAME_LABEL': { de: 'Vorname', fr: 'Prénom', en: 'First name', sw: 'Jina la kwanza' },
     'Onboarding.LAST_NAME_LABEL': { de: 'Nachname', fr: 'Nom', en: 'Last name', sw: 'Jina la mwisho' },
     'Onboarding.SAVE': { de: 'Speichern', fr: 'Enregistrer', en: 'Save', sw: 'Hifadhi' },
     'Onboarding.COMPLETE_NAME_ERROR': { de: 'Der Name konnte nicht gespeichert werden. Bitte versuche es erneut.', fr: 'Impossible d’enregistrer votre nom. Veuillez réessayer.', en: 'Your name could not be saved. Please try again.', sw: 'Jina lako halikuweza kuhifadhiwa. Tafadhali jaribu tena.' },
-    'Onboarding.BROWSER_PUSH_TITLE': { de: 'Push-Benachrichtigungen', fr: 'Notifications push', en: 'Push notifications', sw: 'Arifa za push' },
-    'Onboarding.BROWSER_PUSH_BODY': { de: 'Erhalte Benachrichtigungen direkt im Browser, auch wenn die App nicht geöffnet ist.', fr: 'Recevez des notifications directement dans votre navigateur, même lorsque l’application est fermée.', en: 'Receive notifications directly in your browser, even when the app is not open.', sw: 'Pokea arifa moja kwa moja kwenye kivinjari chako, hata programu haijafunguliwa.' },
+    'Onboarding.NOTIFICATIONS_TITLE': { de: 'Benachrichtigungen', fr: 'Notifications', en: 'Notifications', sw: 'Arifa' },
+    'Onboarding.NOTIFICATIONS_BODY': { de: 'Wähle aus, wie du über wichtige Neuigkeiten informiert werden möchtest.', fr: 'Choisissez comment vous souhaitez être informé des informations importantes.', en: 'Choose how you would like to be notified about important updates.', sw: 'Chagua jinsi unavyotaka kuarifiwa kuhusu taarifa muhimu.' },
+    'Onboarding.EMAIL_NOTIFICATIONS_LABEL': { de: 'E-Mail-Benachrichtigungen', fr: 'Notifications par e-mail', en: 'Email notifications', sw: 'Arifa za barua pepe' },
+    'Onboarding.EMAIL_NOTIFICATIONS_HINT': { de: 'Erhalte wichtige Informationen per E-Mail.', fr: 'Recevez les informations importantes par e-mail.', en: 'Receive important information by email.', sw: 'Pokea taarifa muhimu kwa barua pepe.' },
+    'Onboarding.PUSH_NOTIFICATIONS_LABEL': { de: 'Push-Benachrichtigungen', fr: 'Notifications push', en: 'Push notifications', sw: 'Arifa za push' },
+    'Onboarding.PUSH_NOTIFICATIONS_HINT': { de: 'Aktiviere Benachrichtigungen für dieses Gerät.', fr: 'Activez les notifications pour cet appareil.', en: 'Enable notifications for this device.', sw: 'Washa arifa kwa kifaa hiki.' },
+    'Onboarding.PUSH_ENABLED': { de: 'Push-Benachrichtigungen sind auf diesem Gerät aktiviert.', fr: 'Les notifications push sont activées sur cet appareil.', en: 'Push notifications are enabled on this device.', sw: 'Arifa za push zimewashwa kwenye kifaa hiki.' },
     'Onboarding.SKIP': { de: 'Überspringen', fr: 'Passer', en: 'Skip', sw: 'Ruka' },
 };

package/dist/onboarding/OnboardingProvider.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React, { createContext, useCallback, useContext, useEffect, useMemo, useState, } from 'react';
 import { AuthContext } from '../auth/AuthContext';
+import { getNotificationPreferences } from '../notifications/api';
 import { getOnboardingStepConfig } from './api';
 import { selectActiveSteps } from './stepSelection';
 import CookieConsentStep from './steps/CookieConsentStep';
@@ -9,11 +10,11 @@ import BrowserPushStep from './steps/BrowserPushStep';
 export const UNIVERSAL_STEP_DESCRIPTORS = [
     {
         id: 'cookie_consent',
-        condition: (ctx) => Boolean(ctx.user && !ctx.user.accepted_convenience_cookies),
+        condition: (ctx) => Boolean(ctx.user && !ctx.user.accepted_privacy_statement),
         blocking: true,
         skipable: false,
         persistDismissed: false,
-        titleKey: 'Onboarding.COOKIE_CONSENT_TITLE',
+        titleKey: 'Onboarding.PRIVACY_COOKIES_TITLE',
         Component: CookieConsentStep,
     },
     {
@@ -27,11 +28,15 @@ export const UNIVERSAL_STEP_DESCRIPTORS = [
     },
     {
         id: 'browser_push',
-        condition: (ctx) => { var _a; return Boolean(((_a = ctx.pushState) === null || _a === void 0 ? void 0 : _a.supported) && !ctx.pushState.subscribed); },
+        condition: (ctx) => {
+            var _a, _b;
+            return Boolean((((_a = ctx.pushState) === null || _a === void 0 ? void 0 : _a.supported) && (!ctx.pushState.subscribed || !ctx.emailOptedIn))
+                || (!((_b = ctx.pushState) === null || _b === void 0 ? void 0 : _b.supported) && !ctx.emailOptedIn));
+        },
         blocking: false,
         skipable: true,
         persistDismissed: true,
-        titleKey: 'Onboarding.BROWSER_PUSH_TITLE',
+        titleKey: 'Onboarding.NOTIFICATIONS_TITLE',
         Component: BrowserPushStep,
     },
 ];
@@ -61,6 +66,7 @@ export function OnboardingProvider({ children, extraSteps = [] }) {
     const [configMap, setConfigMap] = useState({});
     const [configLoaded, setConfigLoaded] = useState(false);
     const [pushState, setPushState] = useState(getInitialPushState);
+    const [emailOptedIn, setEmailOptedIn] = useState(false);
     const [dismissedSet, setDismissedSet] = useState(loadDismissedSteps);
     const descriptors = useMemo(() => [...UNIVERSAL_STEP_DESCRIPTORS, ...extraSteps], [extraSteps]);
     useEffect(() => {
@@ -107,6 +113,24 @@ export function OnboardingProvider({ children, extraSteps = [] }) {
         });
         return () => { cancelled = true; };
     }, []);
+    useEffect(() => {
+        let cancelled = false;
+        if (!user) {
+            setEmailOptedIn(false);
+            return undefined;
+        }
+        setEmailOptedIn(false);
+        getNotificationPreferences()
+            .then((data) => {
+            if (!cancelled)
+                setEmailOptedIn(Boolean(data === null || data === void 0 ? void 0 : data.email_opt_in));
+        })
+            .catch(() => {
+            if (!cancelled)
+                setEmailOptedIn(false);
+        });
+        return () => { cancelled = true; };
+    }, [user]);
     const dismissStep = useCallback((id) => {
         setDismissedSet((previous) => {
             const next = new Set(previous);
@@ -122,7 +146,7 @@ export function OnboardingProvider({ children, extraSteps = [] }) {
             return next;
         });
     }, []);
-    const ctx = useMemo(() => ({ user, pushState }), [user, pushState]);
+    const ctx = useMemo(() => ({ user, pushState, emailOptedIn }), [user, pushState, emailOptedIn]);
     const activeSteps = useMemo(() => {
         if (!configLoaded || !user)
             return [];

package/dist/onboarding/OnboardingWizard.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useContext, useEffect, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import Box from '@mui/material/Box';
 import Dialog from '@mui/material/Dialog';
@@ -7,10 +7,12 @@ import DialogContent from '@mui/material/DialogContent';
 import DialogTitle from '@mui/material/DialogTitle';
 import LinearProgress from '@mui/material/LinearProgress';
 import Typography from '@mui/material/Typography';
+import { AuthContext } from '../auth/AuthContext';
 import { useOnboarding } from './OnboardingProvider';
 export function OnboardingWizard() {
     const { t } = useTranslation();
     const onboarding = useOnboarding();
+    const authContext = useContext(AuthContext);
     const [sessionDismissed, setSessionDismissed] = useState(() => new Set());
     const totalRef = useRef(null);
     const [completed, setCompleted] = useState(0);
@@ -34,8 +36,12 @@ export function OnboardingWizard() {
     const progress = total > 1 ? Math.round((completed / total) * 100) : 0;
     const StepComponent = currentStep.Component;
     const completeCurrentStep = () => {
+        var _a, _b;
         setSessionDismissed((previous) => new Set([...previous, currentStep.id]));
         setCompleted((count) => count + 1);
+        (_b = (_a = authContext === null || authContext === void 0 ? void 0 : authContext.refreshUser) === null || _a === void 0 ? void 0 : _a.call(authContext)) === null || _b === void 0 ? void 0 : _b.catch(() => {
+            // Best-effort refresh; the step itself already persisted successfully.
+        });
     };
     const dismissCurrentStep = () => {
         if (currentStep.persistDismissed)

package/dist/onboarding/steps/BrowserPushStep.js

@@ -1,22 +1,58 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import Alert from '@mui/material/Alert';
 import Box from '@mui/material/Box';
 import Button from '@mui/material/Button';
 import CircularProgress from '@mui/material/CircularProgress';
+import FormControlLabel from '@mui/material/FormControlLabel';
+import Switch from '@mui/material/Switch';
 import Typography from '@mui/material/Typography';
+import CheckCircleIcon from '@mui/icons-material/CheckCircle';
 import NotificationsIcon from '@mui/icons-material/Notifications';
 import { getVapidPublicKey, patchNotificationPreferences, savePushSubscription, urlBase64ToUint8Array, } from '../../notifications/api';
-export function BrowserPushStep({ onComplete, onDismiss }) {
+export function BrowserPushStep({ onComplete, onDismiss, ctx }) {
+    var _a, _b, _c;
     const { t } = useTranslation();
     const [loading, setLoading] = useState(false);
+    const [savingEmail, setSavingEmail] = useState(false);
+    const [emailOptedIn, setEmailOptedIn] = useState(Boolean(ctx === null || ctx === void 0 ? void 0 : ctx.emailOptedIn));
+    const [pushSubscribed, setPushSubscribed] = useState(Boolean((_a = ctx === null || ctx === void 0 ? void 0 : ctx.pushState) === null || _a === void 0 ? void 0 : _a.subscribed));
     const [error, setError] = useState('');
+    const pushSupported = Boolean((_b = ctx === null || ctx === void 0 ? void 0 : ctx.pushState) === null || _b === void 0 ? void 0 : _b.supported);
+    useEffect(() => {
+        setEmailOptedIn(Boolean(ctx === null || ctx === void 0 ? void 0 : ctx.emailOptedIn));
+    }, [ctx === null || ctx === void 0 ? void 0 : ctx.emailOptedIn]);
+    useEffect(() => {
+        var _a;
+        setPushSubscribed(Boolean((_a = ctx === null || ctx === void 0 ? void 0 : ctx.pushState) === null || _a === void 0 ? void 0 : _a.subscribed));
+    }, [(_c = ctx === null || ctx === void 0 ? void 0 : ctx.pushState) === null || _c === void 0 ? void 0 : _c.subscribed]);
+    const handleEmailToggle = async (event) => {
+        const nextEmailOptedIn = event.target.checked;
+        const previousEmailOptedIn = emailOptedIn;
+        setSavingEmail(true);
+        setError('');
+        setEmailOptedIn(nextEmailOptedIn);
+        try {
+            await patchNotificationPreferences({ email_opt_in: nextEmailOptedIn });
+        }
+        catch (_a) {
+            setEmailOptedIn(previousEmailOptedIn);
+            setError(t('NotificationSettings.SAVE_ERROR'));
+        }
+        finally {
+            setSavingEmail(false);
+        }
+    };
     const enable = async () => {
         var _a;
         setLoading(true);
         setError('');
         try {
+            if (typeof Notification === 'undefined') {
+                setError(t('NotificationSettings.PUSH_ERROR'));
+                return;
+            }
             const permission = await Notification.requestPermission();
             if (permission !== 'granted') {
                 setError(t('NotificationSettings.PUSH_DENIED'));
@@ -30,6 +66,7 @@ export function BrowserPushStep({ onComplete, onDismiss }) {
             });
             await savePushSubscription(subscription.toJSON(), navigator.userAgent);
             await patchNotificationPreferences({ push_opt_in: true });
+            setPushSubscribed(true);
             onComplete();
         }
         catch (requestError) {
@@ -44,6 +81,6 @@ export function BrowserPushStep({ onComplete, onDismiss }) {
             setLoading(false);
         }
     };
-    return (_jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', gap: 2 }, children: [_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 }, children: [_jsx(NotificationsIcon, { color: "primary" }), _jsx(Typography, { variant: "h6", children: t('Onboarding.BROWSER_PUSH_TITLE') })] }), _jsx(Typography, { variant: "body2", color: "text.secondary", children: t('Onboarding.BROWSER_PUSH_BODY') }), error && _jsx(Alert, { severity: "warning", onClose: () => setError(''), children: error }), _jsxs(Box, { sx: { display: 'flex', justifyContent: 'flex-end', gap: 1 }, children: [_jsx(Button, { variant: "text", onClick: onDismiss, disabled: loading, children: t('Onboarding.SKIP') }), _jsx(Button, { variant: "contained", onClick: enable, disabled: loading, startIcon: loading ? _jsx(CircularProgress, { size: 16 }) : undefined, children: t('NotificationSettings.PUSH_ENABLE') })] })] }));
+    return (_jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', gap: 2 }, children: [_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 }, children: [_jsx(NotificationsIcon, { color: "primary" }), _jsx(Typography, { variant: "h6", children: t('Onboarding.NOTIFICATIONS_TITLE') })] }), _jsx(Typography, { variant: "body2", color: "text.secondary", children: t('Onboarding.NOTIFICATIONS_BODY') }), error && _jsx(Alert, { severity: "warning", onClose: () => setError(''), children: error }), _jsx(FormControlLabel, { control: _jsx(Switch, { checked: emailOptedIn, onChange: handleEmailToggle, disabled: savingEmail }), label: _jsxs(Box, { children: [_jsx(Typography, { variant: "body1", children: t('Onboarding.EMAIL_NOTIFICATIONS_LABEL') }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: t('Onboarding.EMAIL_NOTIFICATIONS_HINT') })] }), labelPlacement: "end", sx: { alignItems: 'flex-start', ml: 0 } }), pushSupported && (_jsxs(Box, { children: [_jsx(Typography, { variant: "body1", gutterBottom: true, children: t('Onboarding.PUSH_NOTIFICATIONS_LABEL') }), _jsx(Typography, { variant: "caption", color: "text.secondary", display: "block", sx: { mb: 1.5 }, children: t('Onboarding.PUSH_NOTIFICATIONS_HINT') }), pushSubscribed ? (_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 }, children: [_jsx(CheckCircleIcon, { color: "success", fontSize: "small" }), _jsx(Typography, { variant: "body2", children: t('Onboarding.PUSH_ENABLED') })] })) : (_jsx(Button, { variant: "contained", onClick: enable, disabled: loading, startIcon: loading ? _jsx(CircularProgress, { size: 16 }) : undefined, children: t('NotificationSettings.PUSH_ENABLE') }))] })), _jsxs(Box, { sx: { display: 'flex', justifyContent: 'flex-end', gap: 1 }, children: [_jsx(Button, { variant: "text", onClick: onDismiss, disabled: loading || savingEmail, children: t('Onboarding.SKIP') }), _jsx(Button, { variant: "contained", onClick: onComplete, disabled: loading || savingEmail, children: t('Onboarding.CONTINUE') })] })] }));
 }
 export default BrowserPushStep;

package/dist/onboarding/steps/CookieConsentStep.js

@@ -4,28 +4,65 @@ import { useTranslation } from 'react-i18next';
 import Alert from '@mui/material/Alert';
 import Box from '@mui/material/Box';
 import Button from '@mui/material/Button';
+import Checkbox from '@mui/material/Checkbox';
 import CircularProgress from '@mui/material/CircularProgress';
+import FormControlLabel from '@mui/material/FormControlLabel';
+import Link from '@mui/material/Link';
 import Typography from '@mui/material/Typography';
-import CookieIcon from '@mui/icons-material/Cookie';
-import { updateUserProfile } from '../../auth/authApi';
+import PrivacyTipIcon from '@mui/icons-material/PrivacyTip';
+import { fetchCookieStatement, fetchPrivacyStatement, updateUserProfile } from '../../auth/authApi';
 export function CookieConsentStep({ onComplete }) {
     const { t } = useTranslation();
+    const [privacyAccepted, setPrivacyAccepted] = useState(false);
+    const [cookiesAccepted, setCookiesAccepted] = useState(false);
+    const [privacyText, setPrivacyText] = useState('');
+    const [cookieText, setCookieText] = useState('');
+    const [showPrivacyText, setShowPrivacyText] = useState(false);
+    const [showCookieText, setShowCookieText] = useState(false);
     const [loading, setLoading] = useState(false);
     const [error, setError] = useState('');
-    const accept = async () => {
+    const togglePrivacyText = async () => {
+        if (!showPrivacyText && !privacyText) {
+            try {
+                setPrivacyText(await fetchPrivacyStatement());
+            }
+            catch (_a) {
+                // Non-fatal: the link simply won't reveal inline text this time.
+            }
+        }
+        setShowPrivacyText((previous) => !previous);
+    };
+    const toggleCookieText = async () => {
+        if (!showCookieText && !cookieText) {
+            try {
+                setCookieText(await fetchCookieStatement());
+            }
+            catch (_a) {
+                // Non-fatal: the link simply won't reveal inline text this time.
+            }
+        }
+        setShowCookieText((previous) => !previous);
+    };
+    const submit = async (event) => {
+        event.preventDefault();
+        if (!privacyAccepted)
+            return;
         setLoading(true);
         setError('');
         try {
-            await updateUserProfile({ accepted_convenience_cookies: true });
+            await updateUserProfile({
+                accepted_privacy_statement: true,
+                accepted_convenience_cookies: cookiesAccepted,
+            });
             onComplete();
         }
         catch (_a) {
-            setError(t('Onboarding.COOKIE_CONSENT_ERROR'));
+            setError(t('Onboarding.PRIVACY_COOKIES_ERROR'));
         }
         finally {
             setLoading(false);
         }
     };
-    return (_jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', gap: 2 }, children: [_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 }, children: [_jsx(CookieIcon, { color: "primary" }), _jsx(Typography, { variant: "h6", children: t('Onboarding.COOKIE_CONSENT_TITLE') })] }), _jsx(Typography, { variant: "body2", color: "text.secondary", children: t('Onboarding.COOKIE_CONSENT_BODY') }), error && _jsx(Alert, { severity: "error", onClose: () => setError(''), children: error }), _jsx(Box, { sx: { display: 'flex', justifyContent: 'flex-end' }, children: _jsx(Button, { variant: "contained", onClick: accept, disabled: loading, startIcon: loading ? _jsx(CircularProgress, { size: 16 }) : undefined, children: t('Onboarding.COOKIE_CONSENT_ACCEPT') }) })] }));
+    return (_jsxs(Box, { component: "form", onSubmit: submit, sx: { display: 'flex', flexDirection: 'column', gap: 2 }, children: [_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', gap: 1 }, children: [_jsx(PrivacyTipIcon, { color: "primary" }), _jsx(Typography, { variant: "h6", children: t('Onboarding.PRIVACY_COOKIES_TITLE') })] }), _jsx(Typography, { variant: "body2", color: "text.secondary", children: t('Onboarding.PRIVACY_COOKIES_BODY') }), error && _jsx(Alert, { severity: "error", onClose: () => setError(''), children: error }), _jsxs(Box, { children: [_jsx(FormControlLabel, { control: (_jsx(Checkbox, { checked: privacyAccepted, onChange: (event) => setPrivacyAccepted(event.target.checked), required: true })), label: t('Onboarding.PRIVACY_AGREEMENT_LABEL') }), _jsxs(Box, { children: [_jsx(Link, { component: "button", type: "button", variant: "body2", onClick: togglePrivacyText, children: t('Onboarding.VIEW_STATEMENT') }), showPrivacyText && privacyText && (_jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mt: 1, whiteSpace: 'pre-wrap' }, children: privacyText }))] })] }), _jsxs(Box, { children: [_jsx(FormControlLabel, { control: (_jsx(Checkbox, { checked: cookiesAccepted, onChange: (event) => setCookiesAccepted(event.target.checked) })), label: t('Onboarding.COOKIES_OPT_IN_LABEL') }), _jsxs(Box, { children: [_jsx(Link, { component: "button", type: "button", variant: "body2", onClick: toggleCookieText, children: t('Onboarding.VIEW_STATEMENT') }), showCookieText && cookieText && (_jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mt: 1, whiteSpace: 'pre-wrap' }, children: cookieText }))] })] }), _jsx(Box, { sx: { display: 'flex', justifyContent: 'flex-end' }, children: _jsx(Button, { variant: "contained", type: "submit", disabled: loading || !privacyAccepted, startIcon: loading ? _jsx(CircularProgress, { size: 16 }) : undefined, children: t('Onboarding.CONTINUE') }) })] }));
 }
 export default CookieConsentStep;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@micha.bigler/ui-core-micha",
-  "version": "2.6.1",
+  "version": "2.8.0",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "repository": {

package/src/auth/AuthContext.jsx

@@ -115,6 +115,11 @@ export const AuthProvider = ({ children }) => {
     }));
   };
 
+  const refreshUser = async () => {
+    const data = await fetchCurrentUser();
+    if (data) setUser(mapUserFromApi(data));
+  };
+
   const logout = async () => {
     try {
       await logoutSession();
@@ -134,6 +139,7 @@ export const AuthProvider = ({ children }) => {
         loading,
         login,
         logout,
+        refreshUser,
       }}
     >
       {children}

package/src/i18n/onboardingTranslations.ts

@@ -1,17 +1,25 @@
 export const onboardingTranslations = {
   'Onboarding.SETUP': { de: 'Einrichtung', fr: 'Configuration', en: 'Setup', sw: 'Usanidi' },
   'Onboarding.STEP_COUNTER': { de: 'Schritt {{current}} von {{total}}', fr: 'Étape {{current}} sur {{total}}', en: 'Step {{current}} of {{total}}', sw: 'Hatua ya {{current}} kati ya {{total}}' },
-  'Onboarding.COOKIE_CONSENT_TITLE': { de: 'Cookie-Einstellungen', fr: 'Préférences des cookies', en: 'Cookie preferences', sw: 'Mapendeleo ya vidakuzi' },
-  'Onboarding.COOKIE_CONSENT_BODY': { de: 'Diese App verwendet optionale Cookies, um deine Einstellungen und Präferenzen zu speichern. Möchtest du diese aktivieren?', fr: 'Cette application utilise des cookies facultatifs pour enregistrer vos réglages et préférences. Souhaitez-vous les activer ?', en: 'This app uses optional cookies to save your settings and preferences. Would you like to enable them?', sw: 'Programu hii hutumia vidakuzi vya hiari kuhifadhi mipangilio na mapendeleo yako. Je, ungependa kuviwasha?' },
-  'Onboarding.COOKIE_CONSENT_ACCEPT': { de: 'Akzeptieren', fr: 'Accepter', en: 'Accept', sw: 'Kubali' },
-  'Onboarding.COOKIE_CONSENT_ERROR': { de: 'Die Cookie-Einstellung konnte nicht gespeichert werden. Bitte versuche es erneut.', fr: 'Impossible d’enregistrer votre préférence de cookies. Veuillez réessayer.', en: 'Your cookie preference could not be saved. Please try again.', sw: 'Upendeleo wako wa vidakuzi haukuweza kuhifadhiwa. Tafadhali jaribu tena.' },
+  'Onboarding.PRIVACY_COOKIES_TITLE': { de: 'Datenschutz & Cookies', fr: 'Confidentialité et cookies', en: 'Privacy & cookies', sw: 'Faragha na vidakuzi' },
+  'Onboarding.PRIVACY_COOKIES_BODY': { de: 'Bitte lies unsere Datenschutzerklärung und stimme ihr zu, um fortzufahren. Optionale Cookies helfen uns, deine Einstellungen und Präferenzen zu speichern.', fr: 'Veuillez lire et accepter notre politique de confidentialité pour continuer. Les cookies facultatifs nous aident à enregistrer vos réglages et préférences.', en: 'Please read and agree to our privacy statement to continue. Optional cookies help us save your settings and preferences.', sw: 'Tafadhali soma na ukubali taarifa yetu ya faragha ili kuendelea. Vidakuzi vya hiari hutusaidia kuhifadhi mipangilio na mapendeleo yako.' },
+  'Onboarding.PRIVACY_AGREEMENT_LABEL': { de: 'Ich habe die Datenschutzerklärung gelesen und stimme ihr zu.', fr: 'J’ai lu et j’accepte la politique de confidentialité.', en: 'I have read and agree to the privacy statement.', sw: 'Nimesoma na ninakubali taarifa ya faragha.' },
+  'Onboarding.COOKIES_OPT_IN_LABEL': { de: 'Optionale Cookies aktivieren, um meine Einstellungen und Präferenzen zu speichern.', fr: 'Activer les cookies facultatifs pour enregistrer mes réglages et préférences.', en: 'Enable optional cookies to save my settings and preferences.', sw: 'Washa vidakuzi vya hiari kuhifadhi mipangilio na mapendeleo yangu.' },
+  'Onboarding.VIEW_STATEMENT': { de: 'Text anzeigen', fr: 'Afficher le texte', en: 'View text', sw: 'Angalia maandishi' },
+  'Onboarding.CONTINUE': { de: 'Weiter', fr: 'Continuer', en: 'Continue', sw: 'Endelea' },
+  'Onboarding.PRIVACY_COOKIES_ERROR': { de: 'Deine Angaben konnten nicht gespeichert werden. Bitte versuche es erneut.', fr: 'Vos préférences n’ont pas pu être enregistrées. Veuillez réessayer.', en: 'Your preferences could not be saved. Please try again.', sw: 'Mapendeleo yako hayakuweza kuhifadhiwa. Tafadhali jaribu tena.' },
   'Onboarding.COMPLETE_NAME_TITLE': { de: 'Dein Name', fr: 'Votre nom', en: 'Your name', sw: 'Jina lako' },
   'Onboarding.COMPLETE_NAME_BODY': { de: 'Bitte gib deinen Vor- und Nachnamen an, damit andere dich erkennen.', fr: 'Veuillez indiquer votre prénom et votre nom afin que les autres puissent vous reconnaître.', en: 'Please provide your first and last name so others can recognise you.', sw: 'Tafadhali weka jina lako la kwanza na la mwisho ili wengine wakutambue.' },
   'Onboarding.FIRST_NAME_LABEL': { de: 'Vorname', fr: 'Prénom', en: 'First name', sw: 'Jina la kwanza' },
   'Onboarding.LAST_NAME_LABEL': { de: 'Nachname', fr: 'Nom', en: 'Last name', sw: 'Jina la mwisho' },
   'Onboarding.SAVE': { de: 'Speichern', fr: 'Enregistrer', en: 'Save', sw: 'Hifadhi' },
   'Onboarding.COMPLETE_NAME_ERROR': { de: 'Der Name konnte nicht gespeichert werden. Bitte versuche es erneut.', fr: 'Impossible d’enregistrer votre nom. Veuillez réessayer.', en: 'Your name could not be saved. Please try again.', sw: 'Jina lako halikuweza kuhifadhiwa. Tafadhali jaribu tena.' },
-  'Onboarding.BROWSER_PUSH_TITLE': { de: 'Push-Benachrichtigungen', fr: 'Notifications push', en: 'Push notifications', sw: 'Arifa za push' },
-  'Onboarding.BROWSER_PUSH_BODY': { de: 'Erhalte Benachrichtigungen direkt im Browser, auch wenn die App nicht geöffnet ist.', fr: 'Recevez des notifications directement dans votre navigateur, même lorsque l’application est fermée.', en: 'Receive notifications directly in your browser, even when the app is not open.', sw: 'Pokea arifa moja kwa moja kwenye kivinjari chako, hata programu haijafunguliwa.' },
+  'Onboarding.NOTIFICATIONS_TITLE': { de: 'Benachrichtigungen', fr: 'Notifications', en: 'Notifications', sw: 'Arifa' },
+  'Onboarding.NOTIFICATIONS_BODY': { de: 'Wähle aus, wie du über wichtige Neuigkeiten informiert werden möchtest.', fr: 'Choisissez comment vous souhaitez être informé des informations importantes.', en: 'Choose how you would like to be notified about important updates.', sw: 'Chagua jinsi unavyotaka kuarifiwa kuhusu taarifa muhimu.' },
+  'Onboarding.EMAIL_NOTIFICATIONS_LABEL': { de: 'E-Mail-Benachrichtigungen', fr: 'Notifications par e-mail', en: 'Email notifications', sw: 'Arifa za barua pepe' },
+  'Onboarding.EMAIL_NOTIFICATIONS_HINT': { de: 'Erhalte wichtige Informationen per E-Mail.', fr: 'Recevez les informations importantes par e-mail.', en: 'Receive important information by email.', sw: 'Pokea taarifa muhimu kwa barua pepe.' },
+  'Onboarding.PUSH_NOTIFICATIONS_LABEL': { de: 'Push-Benachrichtigungen', fr: 'Notifications push', en: 'Push notifications', sw: 'Arifa za push' },
+  'Onboarding.PUSH_NOTIFICATIONS_HINT': { de: 'Aktiviere Benachrichtigungen für dieses Gerät.', fr: 'Activez les notifications pour cet appareil.', en: 'Enable notifications for this device.', sw: 'Washa arifa kwa kifaa hiki.' },
+  'Onboarding.PUSH_ENABLED': { de: 'Push-Benachrichtigungen sind auf diesem Gerät aktiviert.', fr: 'Les notifications push sont activées sur cet appareil.', en: 'Push notifications are enabled on this device.', sw: 'Arifa za push zimewashwa kwenye kifaa hiki.' },
   'Onboarding.SKIP': { de: 'Überspringen', fr: 'Passer', en: 'Skip', sw: 'Ruka' },
 };

package/src/onboarding/OnboardingProvider.jsx

@@ -7,6 +7,7 @@ import React, {
   useState,
 } from 'react';
 import { AuthContext } from '../auth/AuthContext';
+import { getNotificationPreferences } from '../notifications/api';
 import { getOnboardingStepConfig } from './api';
 import { selectActiveSteps } from './stepSelection';
 import CookieConsentStep from './steps/CookieConsentStep';
@@ -16,11 +17,11 @@ import BrowserPushStep from './steps/BrowserPushStep';
 export const UNIVERSAL_STEP_DESCRIPTORS = [
   {
     id: 'cookie_consent',
-    condition: (ctx) => Boolean(ctx.user && !ctx.user.accepted_convenience_cookies),
+    condition: (ctx) => Boolean(ctx.user && !ctx.user.accepted_privacy_statement),
     blocking: true,
     skipable: false,
     persistDismissed: false,
-    titleKey: 'Onboarding.COOKIE_CONSENT_TITLE',
+    titleKey: 'Onboarding.PRIVACY_COOKIES_TITLE',
     Component: CookieConsentStep,
   },
   {
@@ -34,11 +35,14 @@ export const UNIVERSAL_STEP_DESCRIPTORS = [
   },
   {
     id: 'browser_push',
-    condition: (ctx) => Boolean(ctx.pushState?.supported && !ctx.pushState.subscribed),
+    condition: (ctx) => Boolean(
+      (ctx.pushState?.supported && (!ctx.pushState.subscribed || !ctx.emailOptedIn))
+      || (!ctx.pushState?.supported && !ctx.emailOptedIn),
+    ),
     blocking: false,
     skipable: true,
     persistDismissed: true,
-    titleKey: 'Onboarding.BROWSER_PUSH_TITLE',
+    titleKey: 'Onboarding.NOTIFICATIONS_TITLE',
     Component: BrowserPushStep,
   },
 ];
@@ -71,6 +75,7 @@ export function OnboardingProvider({ children, extraSteps = [] }) {
   const [configMap, setConfigMap] = useState({});
   const [configLoaded, setConfigLoaded] = useState(false);
   const [pushState, setPushState] = useState(getInitialPushState);
+  const [emailOptedIn, setEmailOptedIn] = useState(false);
   const [dismissedSet, setDismissedSet] = useState(loadDismissedSteps);
 
   const descriptors = useMemo(
@@ -123,6 +128,25 @@ export function OnboardingProvider({ children, extraSteps = [] }) {
     return () => { cancelled = true; };
   }, []);
 
+  useEffect(() => {
+    let cancelled = false;
+    if (!user) {
+      setEmailOptedIn(false);
+      return undefined;
+    }
+
+    setEmailOptedIn(false);
+    getNotificationPreferences()
+      .then((data) => {
+        if (!cancelled) setEmailOptedIn(Boolean(data?.email_opt_in));
+      })
+      .catch(() => {
+        if (!cancelled) setEmailOptedIn(false);
+      });
+
+    return () => { cancelled = true; };
+  }, [user]);
+
   const dismissStep = useCallback((id) => {
     setDismissedSet((previous) => {
       const next = new Set(previous);
@@ -138,7 +162,7 @@ export function OnboardingProvider({ children, extraSteps = [] }) {
     });
   }, []);
 
-  const ctx = useMemo(() => ({ user, pushState }), [user, pushState]);
+  const ctx = useMemo(() => ({ user, pushState, emailOptedIn }), [user, pushState, emailOptedIn]);
   const activeSteps = useMemo(() => {
     if (!configLoaded || !user) return [];
     return selectActiveSteps(descriptors, configMap, ctx, dismissedSet);

package/src/onboarding/OnboardingWizard.jsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useContext, useEffect, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import Box from '@mui/material/Box';
 import Dialog from '@mui/material/Dialog';
@@ -6,11 +6,13 @@ import DialogContent from '@mui/material/DialogContent';
 import DialogTitle from '@mui/material/DialogTitle';
 import LinearProgress from '@mui/material/LinearProgress';
 import Typography from '@mui/material/Typography';
+import { AuthContext } from '../auth/AuthContext';
 import { useOnboarding } from './OnboardingProvider';
 
 export function OnboardingWizard() {
   const { t } = useTranslation();
   const onboarding = useOnboarding();
+  const authContext = useContext(AuthContext);
   const [sessionDismissed, setSessionDismissed] = useState(() => new Set());
   const totalRef = useRef(null);
   const [completed, setCompleted] = useState(0);
@@ -39,6 +41,9 @@ export function OnboardingWizard() {
   const completeCurrentStep = () => {
     setSessionDismissed((previous) => new Set([...previous, currentStep.id]));
     setCompleted((count) => count + 1);
+    authContext?.refreshUser?.()?.catch(() => {
+      // Best-effort refresh; the step itself already persisted successfully.
+    });
   };
 
   const dismissCurrentStep = () => {

package/src/onboarding/steps/BrowserPushStep.jsx

@@ -1,10 +1,13 @@
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import Alert from '@mui/material/Alert';
 import Box from '@mui/material/Box';
 import Button from '@mui/material/Button';
 import CircularProgress from '@mui/material/CircularProgress';
+import FormControlLabel from '@mui/material/FormControlLabel';
+import Switch from '@mui/material/Switch';
 import Typography from '@mui/material/Typography';
+import CheckCircleIcon from '@mui/icons-material/CheckCircle';
 import NotificationsIcon from '@mui/icons-material/Notifications';
 import {
   getVapidPublicKey,
@@ -13,15 +16,47 @@ import {
   urlBase64ToUint8Array,
 } from '../../notifications/api';
 
-export function BrowserPushStep({ onComplete, onDismiss }) {
+export function BrowserPushStep({ onComplete, onDismiss, ctx }) {
   const { t } = useTranslation();
   const [loading, setLoading] = useState(false);
+  const [savingEmail, setSavingEmail] = useState(false);
+  const [emailOptedIn, setEmailOptedIn] = useState(Boolean(ctx?.emailOptedIn));
+  const [pushSubscribed, setPushSubscribed] = useState(Boolean(ctx?.pushState?.subscribed));
   const [error, setError] = useState('');
+  const pushSupported = Boolean(ctx?.pushState?.supported);
+
+  useEffect(() => {
+    setEmailOptedIn(Boolean(ctx?.emailOptedIn));
+  }, [ctx?.emailOptedIn]);
+
+  useEffect(() => {
+    setPushSubscribed(Boolean(ctx?.pushState?.subscribed));
+  }, [ctx?.pushState?.subscribed]);
+
+  const handleEmailToggle = async (event) => {
+    const nextEmailOptedIn = event.target.checked;
+    const previousEmailOptedIn = emailOptedIn;
+    setSavingEmail(true);
+    setError('');
+    setEmailOptedIn(nextEmailOptedIn);
+    try {
+      await patchNotificationPreferences({ email_opt_in: nextEmailOptedIn });
+    } catch {
+      setEmailOptedIn(previousEmailOptedIn);
+      setError(t('NotificationSettings.SAVE_ERROR'));
+    } finally {
+      setSavingEmail(false);
+    }
+  };
 
   const enable = async () => {
     setLoading(true);
     setError('');
     try {
+      if (typeof Notification === 'undefined') {
+        setError(t('NotificationSettings.PUSH_ERROR'));
+        return;
+      }
       const permission = await Notification.requestPermission();
       if (permission !== 'granted') {
         setError(t('NotificationSettings.PUSH_DENIED'));
@@ -35,6 +70,7 @@ export function BrowserPushStep({ onComplete, onDismiss }) {
       });
       await savePushSubscription(subscription.toJSON(), navigator.userAgent);
       await patchNotificationPreferences({ push_opt_in: true });
+      setPushSubscribed(true);
       onComplete();
     } catch (requestError) {
       if (requestError?.response?.status === 409) {
@@ -49,12 +85,32 @@ export function BrowserPushStep({ onComplete, onDismiss }) {
 
   return (
     <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
-      <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}><NotificationsIcon color="primary" /><Typography variant="h6">{t('Onboarding.BROWSER_PUSH_TITLE')}</Typography></Box>
-      <Typography variant="body2" color="text.secondary">{t('Onboarding.BROWSER_PUSH_BODY')}</Typography>
+      <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}><NotificationsIcon color="primary" /><Typography variant="h6">{t('Onboarding.NOTIFICATIONS_TITLE')}</Typography></Box>
+      <Typography variant="body2" color="text.secondary">{t('Onboarding.NOTIFICATIONS_BODY')}</Typography>
       {error && <Alert severity="warning" onClose={() => setError('')}>{error}</Alert>}
+      <FormControlLabel
+        control={<Switch checked={emailOptedIn} onChange={handleEmailToggle} disabled={savingEmail} />}
+        label={<Box><Typography variant="body1">{t('Onboarding.EMAIL_NOTIFICATIONS_LABEL')}</Typography><Typography variant="caption" color="text.secondary">{t('Onboarding.EMAIL_NOTIFICATIONS_HINT')}</Typography></Box>}
+        labelPlacement="end"
+        sx={{ alignItems: 'flex-start', ml: 0 }}
+      />
+      {pushSupported && (
+        <Box>
+          <Typography variant="body1" gutterBottom>{t('Onboarding.PUSH_NOTIFICATIONS_LABEL')}</Typography>
+          <Typography variant="caption" color="text.secondary" display="block" sx={{ mb: 1.5 }}>{t('Onboarding.PUSH_NOTIFICATIONS_HINT')}</Typography>
+          {pushSubscribed ? (
+            <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
+              <CheckCircleIcon color="success" fontSize="small" />
+              <Typography variant="body2">{t('Onboarding.PUSH_ENABLED')}</Typography>
+            </Box>
+          ) : (
+            <Button variant="contained" onClick={enable} disabled={loading} startIcon={loading ? <CircularProgress size={16} /> : undefined}>{t('NotificationSettings.PUSH_ENABLE')}</Button>
+          )}
+        </Box>
+      )}
       <Box sx={{ display: 'flex', justifyContent: 'flex-end', gap: 1 }}>
-        <Button variant="text" onClick={onDismiss} disabled={loading}>{t('Onboarding.SKIP')}</Button>
-        <Button variant="contained" onClick={enable} disabled={loading} startIcon={loading ? <CircularProgress size={16} /> : undefined}>{t('NotificationSettings.PUSH_ENABLE')}</Button>
+        <Button variant="text" onClick={onDismiss} disabled={loading || savingEmail}>{t('Onboarding.SKIP')}</Button>
+        <Button variant="contained" onClick={onComplete} disabled={loading || savingEmail}>{t('Onboarding.CONTINUE')}</Button>
       </Box>
     </Box>
   );

package/src/onboarding/steps/CookieConsentStep.jsx

@@ -3,35 +3,129 @@ import { useTranslation } from 'react-i18next';
 import Alert from '@mui/material/Alert';
 import Box from '@mui/material/Box';
 import Button from '@mui/material/Button';
+import Checkbox from '@mui/material/Checkbox';
 import CircularProgress from '@mui/material/CircularProgress';
+import FormControlLabel from '@mui/material/FormControlLabel';
+import Link from '@mui/material/Link';
 import Typography from '@mui/material/Typography';
-import CookieIcon from '@mui/icons-material/Cookie';
-import { updateUserProfile } from '../../auth/authApi';
+import PrivacyTipIcon from '@mui/icons-material/PrivacyTip';
+import { fetchCookieStatement, fetchPrivacyStatement, updateUserProfile } from '../../auth/authApi';
 
 export function CookieConsentStep({ onComplete }) {
   const { t } = useTranslation();
+  const [privacyAccepted, setPrivacyAccepted] = useState(false);
+  const [cookiesAccepted, setCookiesAccepted] = useState(false);
+  const [privacyText, setPrivacyText] = useState('');
+  const [cookieText, setCookieText] = useState('');
+  const [showPrivacyText, setShowPrivacyText] = useState(false);
+  const [showCookieText, setShowCookieText] = useState(false);
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState('');
 
-  const accept = async () => {
+  const togglePrivacyText = async () => {
+    if (!showPrivacyText && !privacyText) {
+      try {
+        setPrivacyText(await fetchPrivacyStatement());
+      } catch {
+        // Non-fatal: the link simply won't reveal inline text this time.
+      }
+    }
+    setShowPrivacyText((previous) => !previous);
+  };
+
+  const toggleCookieText = async () => {
+    if (!showCookieText && !cookieText) {
+      try {
+        setCookieText(await fetchCookieStatement());
+      } catch {
+        // Non-fatal: the link simply won't reveal inline text this time.
+      }
+    }
+    setShowCookieText((previous) => !previous);
+  };
+
+  const submit = async (event) => {
+    event.preventDefault();
+    if (!privacyAccepted) return;
     setLoading(true);
     setError('');
     try {
-      await updateUserProfile({ accepted_convenience_cookies: true });
+      await updateUserProfile({
+        accepted_privacy_statement: true,
+        accepted_convenience_cookies: cookiesAccepted,
+      });
       onComplete();
     } catch {
-      setError(t('Onboarding.COOKIE_CONSENT_ERROR'));
+      setError(t('Onboarding.PRIVACY_COOKIES_ERROR'));
     } finally {
       setLoading(false);
     }
   };
 
   return (
-    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
-      <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}><CookieIcon color="primary" /><Typography variant="h6">{t('Onboarding.COOKIE_CONSENT_TITLE')}</Typography></Box>
-      <Typography variant="body2" color="text.secondary">{t('Onboarding.COOKIE_CONSENT_BODY')}</Typography>
+    <Box component="form" onSubmit={submit} sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
+      <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
+        <PrivacyTipIcon color="primary" />
+        <Typography variant="h6">{t('Onboarding.PRIVACY_COOKIES_TITLE')}</Typography>
+      </Box>
+      <Typography variant="body2" color="text.secondary">{t('Onboarding.PRIVACY_COOKIES_BODY')}</Typography>
       {error && <Alert severity="error" onClose={() => setError('')}>{error}</Alert>}
-      <Box sx={{ display: 'flex', justifyContent: 'flex-end' }}><Button variant="contained" onClick={accept} disabled={loading} startIcon={loading ? <CircularProgress size={16} /> : undefined}>{t('Onboarding.COOKIE_CONSENT_ACCEPT')}</Button></Box>
+
+      <Box>
+        <FormControlLabel
+          control={(
+            <Checkbox
+              checked={privacyAccepted}
+              onChange={(event) => setPrivacyAccepted(event.target.checked)}
+              required
+            />
+          )}
+          label={t('Onboarding.PRIVACY_AGREEMENT_LABEL')}
+        />
+        <Box>
+          <Link component="button" type="button" variant="body2" onClick={togglePrivacyText}>
+            {t('Onboarding.VIEW_STATEMENT')}
+          </Link>
+          {showPrivacyText && privacyText && (
+            <Typography variant="body2" color="text.secondary" sx={{ mt: 1, whiteSpace: 'pre-wrap' }}>
+              {privacyText}
+            </Typography>
+          )}
+        </Box>
+      </Box>
+
+      <Box>
+        <FormControlLabel
+          control={(
+            <Checkbox
+              checked={cookiesAccepted}
+              onChange={(event) => setCookiesAccepted(event.target.checked)}
+            />
+          )}
+          label={t('Onboarding.COOKIES_OPT_IN_LABEL')}
+        />
+        <Box>
+          <Link component="button" type="button" variant="body2" onClick={toggleCookieText}>
+            {t('Onboarding.VIEW_STATEMENT')}
+          </Link>
+          {showCookieText && cookieText && (
+            <Typography variant="body2" color="text.secondary" sx={{ mt: 1, whiteSpace: 'pre-wrap' }}>
+              {cookieText}
+            </Typography>
+          )}
+        </Box>
+      </Box>
+
+      <Box sx={{ display: 'flex', justifyContent: 'flex-end' }}>
+        <Button
+          variant="contained"
+          type="submit"
+          disabled={loading || !privacyAccepted}
+          startIcon={loading ? <CircularProgress size={16} /> : undefined}
+        >
+          {t('Onboarding.CONTINUE')}
+        </Button>
+      </Box>
     </Box>
   );
 }

package/tests/AuthContext.test.jsx

@@ -0,0 +1,50 @@
+// @vitest-environment jsdom
+import React, { useContext } from 'react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { render, screen, waitFor } from '@testing-library/react';
+
+const apiClient = vi.hoisted(() => ({
+  ensureCsrfToken: vi.fn().mockResolvedValue(undefined),
+}));
+const authApi = vi.hoisted(() => ({
+  fetchAuthMethods: vi.fn().mockResolvedValue({}),
+  fetchCurrentUser: vi.fn(),
+  logoutSession: vi.fn(),
+}));
+
+vi.mock('../src/auth/apiClient', () => apiClient);
+vi.mock('../src/auth/authApi', () => authApi);
+vi.mock('../src/auth/ReauthModal', () => ({ ReauthModal: () => null }));
+
+import { AuthContext, AuthProvider } from '../src/auth/AuthContext';
+
+function Probe() {
+  const { user, refreshUser } = useContext(AuthContext);
+  return (
+    <div>
+      <span data-testid="first-name">{user?.first_name || ''}</span>
+      <button type="button" onClick={() => refreshUser()}>refresh</button>
+    </div>
+  );
+}
+
+describe('AuthContext refreshUser', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('re-fetches the current user and updates context state', async () => {
+    authApi.fetchCurrentUser
+      .mockResolvedValueOnce({ id: 1, first_name: 'Ada' })
+      .mockResolvedValueOnce({ id: 1, first_name: 'Grace' });
+
+    render(<AuthProvider><Probe /></AuthProvider>);
+
+    await waitFor(() => expect(screen.getByTestId('first-name').textContent).toBe('Ada'));
+
+    screen.getByRole('button', { name: 'refresh' }).click();
+
+    await waitFor(() => expect(screen.getByTestId('first-name').textContent).toBe('Grace'));
+    expect(authApi.fetchCurrentUser).toHaveBeenCalledTimes(2);
+  });
+});

package/tests/BrowserPushStep.test.jsx

@@ -0,0 +1,110 @@
+// @vitest-environment jsdom
+import React from 'react';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react';
+
+const notificationsApi = vi.hoisted(() => ({
+  getVapidPublicKey: vi.fn(),
+  patchNotificationPreferences: vi.fn(),
+  savePushSubscription: vi.fn(),
+  urlBase64ToUint8Array: vi.fn(() => new Uint8Array([1, 2, 3])),
+}));
+
+vi.mock('../src/notifications/api', () => notificationsApi);
+vi.mock('react-i18next', () => ({ useTranslation: () => ({ t: (key) => key }) }));
+
+import { BrowserPushStep } from '../src/onboarding/steps/BrowserPushStep';
+
+function renderStep(ctx, props = {}) {
+  return render(
+    <BrowserPushStep
+      ctx={ctx}
+      onComplete={vi.fn()}
+      onDismiss={vi.fn()}
+      {...props}
+    />,
+  );
+}
+
+function installPushEnvironment(subscription) {
+  const registration = {
+    pushManager: {
+      subscribe: vi.fn(),
+    },
+  };
+  vi.stubGlobal('navigator', {
+    serviceWorker: { ready: Promise.resolve(registration) },
+    userAgent: 'Unit Test Browser',
+  });
+  Object.defineProperty(window, 'PushManager', { value: class PushManager {}, configurable: true });
+  return registration;
+}
+
+describe('BrowserPushStep', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    notificationsApi.patchNotificationPreferences.mockResolvedValue({});
+    notificationsApi.getVapidPublicKey.mockResolvedValue('AQID');
+  });
+
+  afterEach(() => {
+    cleanup();
+    vi.unstubAllGlobals();
+  });
+
+  it.each([
+    [false, true],
+    [true, false],
+  ])('saves the selected email notification preference', async (emailOptedIn, expectedEmailOptIn) => {
+    renderStep({ emailOptedIn, pushState: { supported: false, subscribed: false } });
+
+    fireEvent.click(screen.getByRole('switch', { name: /Onboarding.EMAIL_NOTIFICATIONS_LABEL/ }));
+
+    await waitFor(() => expect(notificationsApi.patchNotificationPreferences).toHaveBeenCalledWith({ email_opt_in: expectedEmailOptIn }));
+  });
+
+  it('reverts the email toggle when saving the preference fails', async () => {
+    notificationsApi.patchNotificationPreferences.mockRejectedValue(new Error('unavailable'));
+    renderStep({ emailOptedIn: false, pushState: { supported: false, subscribed: false } });
+
+    const toggle = screen.getByRole('switch', { name: /Onboarding.EMAIL_NOTIFICATIONS_LABEL/ });
+    fireEvent.click(toggle);
+
+    await waitFor(() => expect(toggle.checked).toBe(false));
+    expect(screen.getByRole('alert').textContent).toBe('NotificationSettings.SAVE_ERROR');
+  });
+
+  it('subscribes to push and opts in after saving the subscription', async () => {
+    const registration = installPushEnvironment();
+    const subscription = {
+      toJSON: vi.fn(() => ({ endpoint: 'https://fcm.googleapis.com/fcm/send/example' })),
+    };
+    const onComplete = vi.fn();
+    registration.pushManager.subscribe.mockResolvedValue(subscription);
+    vi.stubGlobal('Notification', { requestPermission: vi.fn().mockResolvedValue('granted') });
+
+    renderStep({ emailOptedIn: false, pushState: { supported: true, subscribed: false } }, { onComplete });
+    fireEvent.click(screen.getByRole('button', { name: 'NotificationSettings.PUSH_ENABLE' }));
+
+    await waitFor(() => expect(notificationsApi.patchNotificationPreferences).toHaveBeenCalledWith({ push_opt_in: true }));
+    expect(Notification.requestPermission).toHaveBeenCalledOnce();
+    expect(registration.pushManager.subscribe).toHaveBeenCalledWith({
+      userVisibleOnly: true,
+      applicationServerKey: new Uint8Array([1, 2, 3]),
+    });
+    expect(notificationsApi.savePushSubscription).toHaveBeenCalledWith(
+      { endpoint: 'https://fcm.googleapis.com/fcm/send/example' },
+      'Unit Test Browser',
+    );
+    expect(notificationsApi.savePushSubscription.mock.invocationCallOrder[0])
+      .toBeLessThan(notificationsApi.patchNotificationPreferences.mock.invocationCallOrder[0]);
+    expect(onComplete).toHaveBeenCalledOnce();
+  });
+
+  it('shows an enabled state instead of a redundant push enable action', () => {
+    renderStep({ emailOptedIn: false, pushState: { supported: true, subscribed: true } });
+
+    expect(screen.getByText('Onboarding.PUSH_ENABLED')).toBeTruthy();
+    expect(screen.queryByRole('button', { name: 'NotificationSettings.PUSH_ENABLE' })).toBeNull();
+  });
+});

package/tests/CookieConsentStep.test.jsx

@@ -0,0 +1,69 @@
+// @vitest-environment jsdom
+import React from 'react';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react';
+
+const authApi = vi.hoisted(() => ({
+  fetchCookieStatement: vi.fn(),
+  fetchPrivacyStatement: vi.fn(),
+  updateUserProfile: vi.fn(),
+}));
+
+vi.mock('../src/auth/authApi', () => authApi);
+vi.mock('react-i18next', () => ({ useTranslation: () => ({ t: (key) => key }) }));
+
+import { CookieConsentStep } from '../src/onboarding/steps/CookieConsentStep';
+
+describe('CookieConsentStep (combined privacy + cookies)', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    authApi.fetchPrivacyStatement.mockResolvedValue('privacy text');
+    authApi.fetchCookieStatement.mockResolvedValue('cookie text');
+    authApi.updateUserProfile.mockResolvedValue({});
+  });
+
+  afterEach(() => {
+    cleanup();
+  });
+
+  it('does not submit while the privacy checkbox is unchecked', async () => {
+    const onComplete = vi.fn();
+    render(<CookieConsentStep onComplete={onComplete} />);
+
+    const button = screen.getByRole('button', { name: 'Onboarding.CONTINUE' });
+    expect(button.disabled).toBe(true);
+    fireEvent.click(button);
+
+    await waitFor(() => expect(authApi.updateUserProfile).not.toHaveBeenCalled());
+    expect(onComplete).not.toHaveBeenCalled();
+  });
+
+  it('submits both fields with cookies unchecked (privacy only)', async () => {
+    const onComplete = vi.fn();
+    render(<CookieConsentStep onComplete={onComplete} />);
+
+    fireEvent.click(screen.getByRole('checkbox', { name: 'Onboarding.PRIVACY_AGREEMENT_LABEL' }));
+    fireEvent.click(screen.getByRole('button', { name: 'Onboarding.CONTINUE' }));
+
+    await waitFor(() => expect(authApi.updateUserProfile).toHaveBeenCalledWith({
+      accepted_privacy_statement: true,
+      accepted_convenience_cookies: false,
+    }));
+    expect(onComplete).toHaveBeenCalled();
+  });
+
+  it('submits both fields with cookies checked', async () => {
+    const onComplete = vi.fn();
+    render(<CookieConsentStep onComplete={onComplete} />);
+
+    fireEvent.click(screen.getByRole('checkbox', { name: 'Onboarding.PRIVACY_AGREEMENT_LABEL' }));
+    fireEvent.click(screen.getByRole('checkbox', { name: 'Onboarding.COOKIES_OPT_IN_LABEL' }));
+    fireEvent.click(screen.getByRole('button', { name: 'Onboarding.CONTINUE' }));
+
+    await waitFor(() => expect(authApi.updateUserProfile).toHaveBeenCalledWith({
+      accepted_privacy_statement: true,
+      accepted_convenience_cookies: true,
+    }));
+    expect(onComplete).toHaveBeenCalled();
+  });
+});

package/tests/OnboardingProvider.test.jsx

@@ -0,0 +1,56 @@
+// @vitest-environment jsdom
+import React from 'react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { cleanup, render, screen, waitFor } from '@testing-library/react';
+
+const onboardingApi = vi.hoisted(() => ({
+  getOnboardingStepConfig: vi.fn(),
+}));
+const notificationsApi = vi.hoisted(() => ({
+  getNotificationPreferences: vi.fn(),
+}));
+
+vi.mock('../src/onboarding/api', () => onboardingApi);
+vi.mock('../src/notifications/api', () => notificationsApi);
+
+import { AuthContext } from '../src/auth/AuthContext';
+import { OnboardingProvider, useOnboarding } from '../src/onboarding/OnboardingProvider';
+
+function Probe() {
+  const onboarding = useOnboarding();
+  return <span data-testid="email-opted-in">{String(onboarding?.ctx.emailOptedIn)}</span>;
+}
+
+function renderProvider() {
+  return render(
+    <AuthContext.Provider value={{ user: { id: 1 } }}>
+      <OnboardingProvider><Probe /></OnboardingProvider>
+    </AuthContext.Provider>,
+  );
+}
+
+describe('OnboardingProvider notification preferences', () => {
+  beforeEach(() => {
+    cleanup();
+    vi.clearAllMocks();
+    onboardingApi.getOnboardingStepConfig.mockResolvedValue([]);
+  });
+
+  it('populates emailOptedIn from notification preferences', async () => {
+    notificationsApi.getNotificationPreferences.mockResolvedValue({ email_opt_in: true });
+
+    renderProvider();
+
+    await waitFor(() => expect(screen.getByTestId('email-opted-in').textContent).toBe('true'));
+    expect(notificationsApi.getNotificationPreferences).toHaveBeenCalledOnce();
+  });
+
+  it('defaults emailOptedIn to false when notification preferences cannot be loaded', async () => {
+    notificationsApi.getNotificationPreferences.mockRejectedValue(new Error('unavailable'));
+
+    renderProvider();
+
+    await waitFor(() => expect(notificationsApi.getNotificationPreferences).toHaveBeenCalledOnce());
+    expect(screen.getByTestId('email-opted-in').textContent).toBe('false');
+  });
+});

package/tests/onboardingDescriptors.test.js

@@ -0,0 +1,69 @@
+import { describe, expect, it } from 'vitest';
+import { UNIVERSAL_STEP_DESCRIPTORS } from '../src/onboarding/OnboardingProvider';
+import { selectActiveSteps } from '../src/onboarding/stepSelection';
+
+const cookieConsentDescriptor = UNIVERSAL_STEP_DESCRIPTORS.find((step) => step.id === 'cookie_consent');
+const browserPushDescriptor = UNIVERSAL_STEP_DESCRIPTORS.find((step) => step.id === 'browser_push');
+
+describe('cookie_consent descriptor condition', () => {
+  it('is active when the user has not accepted the privacy statement, regardless of cookies', () => {
+    expect(cookieConsentDescriptor.condition({
+      user: { accepted_privacy_statement: false, accepted_convenience_cookies: false },
+    })).toBe(true);
+    expect(cookieConsentDescriptor.condition({
+      user: { accepted_privacy_statement: false, accepted_convenience_cookies: true },
+    })).toBe(true);
+  });
+
+  it('is inactive once the privacy statement is accepted, even if cookies were declined', () => {
+    expect(cookieConsentDescriptor.condition({
+      user: { accepted_privacy_statement: true, accepted_convenience_cookies: false },
+    })).toBe(false);
+  });
+
+  it('is inactive with no user', () => {
+    expect(cookieConsentDescriptor.condition({ user: null })).toBe(false);
+  });
+});
+
+describe('browser_push descriptor condition', () => {
+  it('is active when push is supported and either channel remains unconfigured', () => {
+    expect(browserPushDescriptor.condition({
+      pushState: { supported: true, subscribed: false },
+      emailOptedIn: true,
+    })).toBe(true);
+    expect(browserPushDescriptor.condition({
+      pushState: { supported: true, subscribed: true },
+      emailOptedIn: false,
+    })).toBe(true);
+  });
+
+  it('is active when push is unsupported and email notifications are not enabled', () => {
+    expect(browserPushDescriptor.condition({
+      pushState: { supported: false, subscribed: false },
+      emailOptedIn: false,
+    })).toBe(true);
+  });
+
+  it('is inactive when push is unsupported with email notifications enabled or both channels are enabled', () => {
+    expect(browserPushDescriptor.condition({
+      pushState: { supported: false, subscribed: false },
+      emailOptedIn: true,
+    })).toBe(false);
+    expect(browserPushDescriptor.condition({
+      pushState: { supported: true, subscribed: true },
+      emailOptedIn: true,
+    })).toBe(false);
+  });
+
+  it('is excluded after persistent dismissal', () => {
+    const activeSteps = selectActiveSteps(
+      [browserPushDescriptor],
+      { browser_push: true },
+      { pushState: { supported: true, subscribed: false }, emailOptedIn: false },
+      new Set(['browser_push']),
+    );
+
+    expect(activeSteps).toEqual([]);
+  });
+});