dev first commit

This commit is contained in:
Leon Bösche
2026-01-08 19:32:43 +01:00
parent d73e2766ab
commit 6b0fbbd855
4 changed files with 314 additions and 141 deletions

View File

@@ -4,6 +4,7 @@ import '../session/session_event.dart';
import 'auth_event.dart'; import 'auth_event.dart';
import 'auth_state.dart'; import 'auth_state.dart';
import '../../services/api_client.dart'; import '../../services/api_client.dart';
import '../../models/api_error.dart';
class AuthBloc extends Bloc<AuthEvent, AuthState> { class AuthBloc extends Bloc<AuthEvent, AuthState> {
final ApiClient apiClient; final ApiClient apiClient;
@@ -51,7 +52,8 @@ class AuthBloc extends Bloc<AuthEvent, AuthState> {
// Trigger registration challenge request // Trigger registration challenge request
add(RegistrationChallengeRequested(userId: userId)); add(RegistrationChallengeRequested(userId: userId));
} catch (e) { } catch (e) {
emit(AuthFailure(e.toString())); final errorMessage = _extractErrorMessage(e);
emit(AuthFailure(errorMessage));
} }
} }
@@ -76,7 +78,8 @@ class AuthBloc extends Bloc<AuthEvent, AuthState> {
), ),
); );
} catch (e) { } catch (e) {
emit(AuthFailure(e.toString())); final errorMessage = _extractErrorMessage(e);
emit(AuthFailure(errorMessage));
} }
} }
@@ -113,7 +116,8 @@ class AuthBloc extends Bloc<AuthEvent, AuthState> {
), ),
); );
} catch (e) { } catch (e) {
emit(AuthFailure(e.toString())); final errorMessage = _extractErrorMessage(e);
emit(AuthFailure(errorMessage));
} }
} }
@@ -125,7 +129,8 @@ class AuthBloc extends Bloc<AuthEvent, AuthState> {
try { try {
add(AuthenticationChallengeRequested(username: event.username)); add(AuthenticationChallengeRequested(username: event.username));
} catch (e) { } catch (e) {
emit(AuthFailure(e.toString())); final errorMessage = _extractErrorMessage(e);
emit(AuthFailure(errorMessage));
} }
} }
@@ -153,7 +158,8 @@ class AuthBloc extends Bloc<AuthEvent, AuthState> {
), ),
); );
} catch (e) { } catch (e) {
emit(AuthFailure(e.toString())); final errorMessage = _extractErrorMessage(e);
emit(AuthFailure(errorMessage));
} }
} }
@@ -190,7 +196,8 @@ class AuthBloc extends Bloc<AuthEvent, AuthState> {
), ),
); );
} catch (e) { } catch (e) {
emit(AuthFailure(e.toString())); final errorMessage = _extractErrorMessage(e);
emit(AuthFailure(errorMessage));
} }
} }
@@ -229,10 +236,18 @@ class AuthBloc extends Bloc<AuthEvent, AuthState> {
), ),
); );
} catch (e) { } catch (e) {
emit(AuthFailure('Login failed: ${e.toString()}')); final errorMessage = _extractErrorMessage(e);
emit(AuthFailure(errorMessage));
} }
} }
String _extractErrorMessage(dynamic error) {
if (error is ApiError) {
return error.message;
}
return error.toString();
}
Future<void> _onCheckAuthRequested( Future<void> _onCheckAuthRequested(
CheckAuthRequested event, CheckAuthRequested event,
Emitter<AuthState> emit, Emitter<AuthState> emit,

View File

@@ -7,8 +7,6 @@ import 'blocs/activity/activity_bloc.dart';
import 'services/api_client.dart'; import 'services/api_client.dart';
import 'services/activity_api.dart'; import 'services/activity_api.dart';
import 'pages/home_page.dart'; import 'pages/home_page.dart';
import 'pages/login_form.dart';
import 'pages/signup_form.dart';
import 'pages/file_explorer.dart'; import 'pages/file_explorer.dart';
import 'pages/document_viewer.dart'; import 'pages/document_viewer.dart';
import 'pages/editor_page.dart'; import 'pages/editor_page.dart';
@@ -17,9 +15,6 @@ import 'theme/app_theme.dart';
final GoRouter _router = GoRouter( final GoRouter _router = GoRouter(
routes: [ routes: [
GoRoute(path: '/', builder: (context, state) => const HomePage()), GoRoute(path: '/', builder: (context, state) => const HomePage()),
GoRoute(path: '/login', builder: (context, state) => const LoginForm()),
GoRoute(path: '/signup', builder: (context, state) => const SignupForm()),
GoRoute( GoRoute(
path: '/viewer/:orgId/:fileId', path: '/viewer/:orgId/:fileId',
builder: (context, state) => DocumentViewer( builder: (context, state) => DocumentViewer(

View File

@@ -23,6 +23,7 @@ class HomePage extends StatefulWidget {
class _HomePageState extends State<HomePage> with TickerProviderStateMixin { class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
late String _selectedTab = 'Drive'; late String _selectedTab = 'Drive';
late AnimationController _animationController; late AnimationController _animationController;
bool _isSignupMode = false;
@override @override
void initState() { void initState() {
@@ -39,6 +40,16 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
super.dispose(); super.dispose();
} }
void _setSignupMode(bool isSignup) {
if (_isSignupMode && !isSignup) {
Future.delayed(const Duration(milliseconds: 200), () {
if (mounted) setState(() => _isSignupMode = isSignup);
});
} else {
setState(() => _isSignupMode = isSignup);
}
}
void _showCreateOrgDialog(BuildContext context) { void _showCreateOrgDialog(BuildContext context) {
final controller = TextEditingController(); final controller = TextEditingController();
showDialog( showDialog(
@@ -250,7 +261,7 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
: 340, : 340,
height: isLoggedIn height: isLoggedIn
? MediaQuery.of(context).size.height * 0.9 ? MediaQuery.of(context).size.height * 0.9
: 280, : (_isSignupMode ? 400 : 280),
child: ClipRRect( child: ClipRRect(
borderRadius: BorderRadius.circular(16), borderRadius: BorderRadius.circular(16),
child: BackdropFilter( child: BackdropFilter(
@@ -309,7 +320,9 @@ class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
}, },
), ),
) )
: const LoginForm(), : LoginForm(
onSignupModeChanged: _setSignupMode,
),
), ),
// Top-left radial glow - primary accent light // Top-left radial glow - primary accent light
AnimatedPositioned( AnimatedPositioned(

View File

@@ -11,7 +11,9 @@ import '../theme/app_theme.dart';
import '../theme/modern_glass_button.dart'; import '../theme/modern_glass_button.dart';
class LoginForm extends StatefulWidget { class LoginForm extends StatefulWidget {
const LoginForm({super.key}); final ValueChanged<bool>? onSignupModeChanged;
const LoginForm({super.key, this.onSignupModeChanged});
@override @override
State<LoginForm> createState() => _LoginFormState(); State<LoginForm> createState() => _LoginFormState();
@@ -20,12 +22,15 @@ class LoginForm extends StatefulWidget {
class _LoginFormState extends State<LoginForm> { class _LoginFormState extends State<LoginForm> {
final _usernameController = TextEditingController(); final _usernameController = TextEditingController();
final _passwordController = TextEditingController(); final _passwordController = TextEditingController();
final _displayNameController = TextEditingController();
bool _usePasskey = true; bool _usePasskey = true;
bool _isSignup = false;
@override @override
void dispose() { void dispose() {
_usernameController.dispose(); _usernameController.dispose();
_passwordController.dispose(); _passwordController.dispose();
_displayNameController.dispose();
super.dispose(); super.dispose();
} }
@@ -40,8 +45,6 @@ class _LoginFormState extends State<LoginForm> {
AuthenticationChallengeReceived state, AuthenticationChallengeReceived state,
) async { ) async {
try { try {
// Simulate WebAuthn authentication by generating fake assertion data
// In a real implementation, this would call native WebAuthn APIs
final credentialId = state.credentialIds.isNotEmpty final credentialId = state.credentialIds.isNotEmpty
? state.credentialIds.first ? state.credentialIds.first
: _generateRandomHex(64); : _generateRandomHex(64);
@@ -68,6 +71,48 @@ class _LoginFormState extends State<LoginForm> {
} }
} }
Future<void> _handleRegistration(
BuildContext context,
RegistrationChallengeReceived state,
) async {
try {
final credentialId = _generateRandomHex(64);
final publicKey = _generateRandomHex(91);
if (context.mounted) {
context.read<AuthBloc>().add(
RegistrationResponseSubmitted(
userId: state.userId,
challenge: state.challenge,
credentialId: credentialId,
publicKey: publicKey,
clientDataJSON:
'{"type":"webauthn.create","challenge":"${state.challenge}","origin":"https://b0esche.cloud"}',
attestationObject: _generateRandomHex(128),
),
);
}
} catch (e) {
if (context.mounted) {
ScaffoldMessenger.of(
context,
).showSnackBar(SnackBar(content: Text('Registration failed: $e')));
}
}
}
void _resetForm() {
_usernameController.clear();
_passwordController.clear();
_displayNameController.clear();
_usePasskey = true;
}
void _setSignupMode(bool isSignup) {
setState(() => _isSignup = isSignup);
widget.onSignupModeChanged?.call(isSignup);
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return BlocListener<AuthBloc, AuthState>( return BlocListener<AuthBloc, AuthState>(
@@ -78,8 +123,9 @@ class _LoginFormState extends State<LoginForm> {
).showSnackBar(SnackBar(content: Text(state.error))); ).showSnackBar(SnackBar(content: Text(state.error)));
} else if (state is AuthenticationChallengeReceived) { } else if (state is AuthenticationChallengeReceived) {
_handleAuthentication(context, state); _handleAuthentication(context, state);
} else if (state is RegistrationChallengeReceived) {
_handleRegistration(context, state);
} else if (state is AuthAuthenticated) { } else if (state is AuthAuthenticated) {
// Start session
context.read<SessionBloc>().add(SessionStarted(state.token)); context.read<SessionBloc>().add(SessionStarted(state.token));
context.go('/'); context.go('/');
} }
@@ -87,45 +133,25 @@ class _LoginFormState extends State<LoginForm> {
child: Center( child: Center(
child: Padding( child: Padding(
padding: const EdgeInsets.all(16.0), padding: const EdgeInsets.all(16.0),
child: SingleChildScrollView( child: AnimatedSwitcher(
child: Column( duration: const Duration(milliseconds: 400),
mainAxisSize: MainAxisSize.min, transitionBuilder: (child, animation) {
crossAxisAlignment: CrossAxisAlignment.center, return FadeTransition(opacity: animation, child: child);
children: [ },
const Text( child: SingleChildScrollView(
'sign in', key: ValueKey<bool>(_isSignup),
style: TextStyle(fontSize: 24, color: AppTheme.primaryText), child: Column(
), mainAxisSize: MainAxisSize.min,
const SizedBox(height: 24), crossAxisAlignment: CrossAxisAlignment.center,
Container( children: [
decoration: BoxDecoration( Text(
color: AppTheme.primaryBackground.withValues(alpha: 0.5), _isSignup ? 'create account' : 'sign in',
borderRadius: BorderRadius.circular(16), style: const TextStyle(
border: Border.all( fontSize: 24,
color: AppTheme.accentColor.withValues(alpha: 0.3), color: AppTheme.primaryText,
), ),
), ),
child: TextField( const SizedBox(height: 24),
controller: _usernameController,
textInputAction: TextInputAction.done,
keyboardType: TextInputType.text,
cursorColor: AppTheme.accentColor,
decoration: InputDecoration(
hintText: 'username',
hintStyle: TextStyle(color: AppTheme.secondaryText),
contentPadding: const EdgeInsets.all(12),
border: InputBorder.none,
prefixIcon: Icon(
Icons.person_outline,
color: AppTheme.primaryText,
size: 20,
),
),
style: const TextStyle(color: AppTheme.primaryText),
),
),
const SizedBox(height: 16),
if (!_usePasskey)
Container( Container(
decoration: BoxDecoration( decoration: BoxDecoration(
color: AppTheme.primaryBackground.withValues(alpha: 0.5), color: AppTheme.primaryBackground.withValues(alpha: 0.5),
@@ -135,18 +161,17 @@ class _LoginFormState extends State<LoginForm> {
), ),
), ),
child: TextField( child: TextField(
controller: _passwordController, controller: _usernameController,
textInputAction: TextInputAction.done, textInputAction: TextInputAction.next,
keyboardType: TextInputType.visiblePassword, keyboardType: TextInputType.text,
obscureText: true,
cursorColor: AppTheme.accentColor, cursorColor: AppTheme.accentColor,
decoration: InputDecoration( decoration: InputDecoration(
hintText: 'password', hintText: 'username',
hintStyle: TextStyle(color: AppTheme.secondaryText), hintStyle: TextStyle(color: AppTheme.secondaryText),
contentPadding: const EdgeInsets.all(12), contentPadding: const EdgeInsets.all(12),
border: InputBorder.none, border: InputBorder.none,
prefixIcon: Icon( prefixIcon: Icon(
Icons.lock_outline, Icons.person_outline,
color: AppTheme.primaryText, color: AppTheme.primaryText,
size: 20, size: 20,
), ),
@@ -154,90 +179,215 @@ class _LoginFormState extends State<LoginForm> {
style: const TextStyle(color: AppTheme.primaryText), style: const TextStyle(color: AppTheme.primaryText),
), ),
), ),
if (!_usePasskey) const SizedBox(height: 16), const SizedBox(height: 16),
SizedBox( if (!_isSignup && _usePasskey)
width: 150, const SizedBox.shrink()
child: BlocBuilder<AuthBloc, AuthState>( else
builder: (context, state) { Container(
return ModernGlassButton( decoration: BoxDecoration(
isLoading: state is AuthLoading, color: AppTheme.primaryBackground.withValues(
onPressed: () { alpha: 0.5,
if (_usernameController.text.isEmpty) { ),
ScaffoldMessenger.of(context).showSnackBar( borderRadius: BorderRadius.circular(16),
const SnackBar( border: Border.all(
content: Text('Username is required'), color: AppTheme.accentColor.withValues(alpha: 0.3),
), ),
); ),
return; child: TextField(
} controller: _passwordController,
if (!_usePasskey && textInputAction: TextInputAction.next,
_passwordController.text.isEmpty) { keyboardType: TextInputType.visiblePassword,
ScaffoldMessenger.of(context).showSnackBar( obscureText: true,
const SnackBar( cursorColor: AppTheme.accentColor,
content: Text('Password is required'), decoration: InputDecoration(
), hintText: 'password',
); hintStyle: TextStyle(color: AppTheme.secondaryText),
return; contentPadding: const EdgeInsets.all(12),
} border: InputBorder.none,
if (_usePasskey) { prefixIcon: Icon(
context.read<AuthBloc>().add( Icons.lock_outline,
LoginRequested( color: AppTheme.primaryText,
username: _usernameController.text, size: 20,
), ),
); ),
} else { style: const TextStyle(color: AppTheme.primaryText),
context.read<AuthBloc>().add( ),
PasswordLoginRequested( ),
username: _usernameController.text, if (!_isSignup && _usePasskey)
password: _passwordController.text, const SizedBox.shrink()
), else
); const SizedBox(height: 16),
} if (_isSignup)
}, Container(
child: const Text('sign in'), decoration: BoxDecoration(
); color: AppTheme.primaryBackground.withValues(
}, alpha: 0.5,
),
borderRadius: BorderRadius.circular(16),
border: Border.all(
color: AppTheme.accentColor.withValues(alpha: 0.3),
),
),
child: TextField(
controller: _displayNameController,
textInputAction: TextInputAction.done,
keyboardType: TextInputType.text,
cursorColor: AppTheme.accentColor,
decoration: InputDecoration(
hintText: 'display name (optional)',
hintStyle: TextStyle(color: AppTheme.secondaryText),
contentPadding: const EdgeInsets.all(12),
border: InputBorder.none,
prefixIcon: Icon(
Icons.badge_outlined,
color: AppTheme.primaryText,
size: 20,
),
),
style: const TextStyle(color: AppTheme.primaryText),
),
)
else
const SizedBox.shrink(),
if (_isSignup)
const SizedBox(height: 16)
else
const SizedBox.shrink(),
SizedBox(
width: 150,
child: BlocBuilder<AuthBloc, AuthState>(
builder: (context, state) {
return ModernGlassButton(
isLoading: state is AuthLoading,
onPressed: () {
if (_usernameController.text.isEmpty) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Username is required'),
),
);
return;
}
if (_isSignup) {
if (_passwordController.text.isEmpty) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Password is required'),
),
);
return;
}
context.read<AuthBloc>().add(
SignupStarted(
username: _usernameController.text,
email: _usernameController.text,
displayName: _displayNameController.text,
password: _passwordController.text,
),
);
} else {
if (_usePasskey) {
context.read<AuthBloc>().add(
LoginRequested(
username: _usernameController.text,
),
);
} else {
if (_passwordController.text.isEmpty) {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('Password is required'),
),
);
return;
}
context.read<AuthBloc>().add(
PasswordLoginRequested(
username: _usernameController.text,
password: _passwordController.text,
),
);
}
}
},
child: Text(_isSignup ? 'create' : 'sign in'),
);
},
),
), ),
), const SizedBox(height: 16),
const SizedBox(height: 16), if (_isSignup)
Row( Row(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
GestureDetector( Text(
onTap: () => setState(() => _usePasskey = !_usePasskey), 'already have an account?',
child: Text( style: TextStyle(color: AppTheme.secondaryText),
_usePasskey ? 'use password' : 'use passkey',
style: TextStyle(
color: AppTheme.accentColor,
decoration: TextDecoration.underline,
fontSize: 12,
), ),
), const SizedBox(width: 8),
), GestureDetector(
], onTap: () {
), _resetForm();
const SizedBox(height: 16), _setSignupMode(false);
Row( },
mainAxisAlignment: MainAxisAlignment.center, child: Text(
children: [ 'sign in',
Text( style: TextStyle(
'don\'t have an account?', color: AppTheme.accentColor,
style: TextStyle(color: AppTheme.secondaryText), decoration: TextDecoration.underline,
), ),
const SizedBox(width: 8), ),
GestureDetector(
onTap: () => context.go('/signup'),
child: Text(
'create one',
style: TextStyle(
color: AppTheme.accentColor,
decoration: TextDecoration.underline,
), ),
), ],
)
else
Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
GestureDetector(
onTap: () =>
setState(() => _usePasskey = !_usePasskey),
child: Text(
_usePasskey ? 'use password' : 'use passkey',
style: TextStyle(
color: AppTheme.accentColor,
decoration: TextDecoration.underline,
fontSize: 12,
),
),
),
],
),
const SizedBox(height: 16),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'don\'t have an account?',
style: TextStyle(color: AppTheme.secondaryText),
),
const SizedBox(width: 8),
GestureDetector(
onTap: () {
_resetForm();
_setSignupMode(true);
},
child: Text(
'create one',
style: TextStyle(
color: AppTheme.accentColor,
decoration: TextDecoration.underline,
),
),
),
],
),
],
), ),
], ],
), ),
],
), ),
), ),
), ),