feat(web): unlock UX — re-derive DEK on page reload
Solves the core usability problem of zero-knowledge encryption: on page reload the in-memory DEK is lost, so the user can't decrypt their data even though their JWT is still valid. Previously they had to close the tab and re-login from scratch. Changes: - Persist wrapped_dek/wrapped_dek_iv in the auth store (zustand persist). Safe: it's AES-GCM ciphertext, useless without the password KEK — the server already stores the same ciphertext. login/register/recover all save the wrapped DEK; logout clears it. - New UnlockPage: minimal password-only form. Re-derives the DEK locally via unlockWithPassword (no API call — the JWT is still valid). Falls back to deriveAuthAndEncKeys for Phase 1 compat accounts. Links to /login and /recover. - ProtectedRoute now checks hasEncKey() after isAuthenticated: authenticated but no in-memory DEK → redirect to /unlock. - /unlock route in App.tsx (public, alongside login/register/recover). Flow: login → browse → reload page → unlock screen → enter password → dashboard loads with decrypted data. No full re-login needed. Verified: npm build clean, 20 tests pass.
This commit is contained in:
parent
38bf0ae8b4
commit
46f413975c
4 changed files with 160 additions and 7 deletions
|
|
@ -1,6 +1,7 @@
|
|||
import React from 'react';
|
||||
import { Navigate } from 'react-router-dom';
|
||||
import { useAuthStore } from '../../store/useStore';
|
||||
import { hasEncKey } from '../../crypto';
|
||||
|
||||
interface ProtectedRouteProps {
|
||||
children: React.ReactNode;
|
||||
|
|
@ -11,11 +12,11 @@ export const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
|
|||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
height: '100vh'
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
height: '100vh'
|
||||
}}>
|
||||
<p>Loading...</p>
|
||||
</div>
|
||||
|
|
@ -26,5 +27,12 @@ export const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
|
|||
return <Navigate to="/login" replace />;
|
||||
}
|
||||
|
||||
// Zero-knowledge: the user is authenticated (JWT valid) but the in-memory
|
||||
// encryption key is gone (page reload). Redirect to the unlock screen to
|
||||
// re-derive it without a full re-login.
|
||||
if (!hasEncKey()) {
|
||||
return <Navigate to="/unlock" replace />;
|
||||
}
|
||||
|
||||
return <>{children}</>;
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue