fix: MFA setup completion not updating UI state
Root cause: the MFA status endpoint returned `mfa_enabled` as the JSON key but the TypeScript MfaStatus interface expected `enabled`. At runtime, `mfaStatus.value?.enabled` was always `undefined`, so `isEnabled` was always false — the banner never hid and the method cards never showed "Geconfigureerd". Additionally, the auth store had no way to re-fetch /auth/me after initialization, so `mfaSetupRequired` was never properly refreshed from the backend after MFA setup. Fixes: - Rename `mfa_enabled` → `enabled` in the MFA status endpoint response to match the TypeScript type (and the /auth/me MeResource which already used `enabled`) - Add `refreshUser()` to the auth store for post-initialization re-fetching of /auth/me - Call `refreshUser()` in onSetupCompleted so the store reflects the backend state without a full page reload - Update backend tests to match the renamed response key Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -80,10 +80,13 @@ const backupCodesColor = computed(() => {
|
||||
})
|
||||
|
||||
function onSetupCompleted() {
|
||||
// Refetch MFA status so the method cards update (enabled, method, backup codes)
|
||||
refetchMfaStatus()
|
||||
// Immediately clear the MFA enforcement state so the banner disappears
|
||||
// and the router guard no longer redirects
|
||||
// Immediately clear the enforcement flag so the router guard unblocks navigation
|
||||
authStore.mfaSetupRequired = false
|
||||
// Refresh the full /auth/me response into the store so the flag stays
|
||||
// correct on subsequent navigations (without needing a full page reload)
|
||||
authStore.refreshUser()
|
||||
}
|
||||
|
||||
function onDisabled() {
|
||||
|
||||
Reference in New Issue
Block a user