feat(02-02): create room providers, form screen, icon picker, and router routes
- Add Riverpod providers (roomWithStatsList, RoomActions) connecting to RoomsDao - Create RoomFormScreen with name field, icon picker preview, create/edit modes - Create IconPickerSheet bottom sheet with curated Material Icons grid - Add nested GoRouter routes: /rooms/new, /rooms/:roomId, /rooms/:roomId/edit - Add placeholder TaskListScreen and TaskFormScreen for Plan 03 routes - Add 11 new German localization keys for room management UI - Add flutter_reorderable_grid_view dependency Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
207
lib/features/rooms/presentation/room_form_screen.dart
Normal file
207
lib/features/rooms/presentation/room_form_screen.dart
Normal file
@@ -0,0 +1,207 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
|
||||
import 'package:household_keeper/core/providers/database_provider.dart';
|
||||
import 'package:household_keeper/features/rooms/domain/room_icons.dart';
|
||||
import 'package:household_keeper/features/rooms/presentation/icon_picker_sheet.dart';
|
||||
import 'package:household_keeper/features/rooms/presentation/room_providers.dart';
|
||||
import 'package:household_keeper/l10n/app_localizations.dart';
|
||||
|
||||
/// Full-screen form for creating and editing rooms.
|
||||
///
|
||||
/// Pass [roomId] to edit an existing room, or leave null to create a new one.
|
||||
class RoomFormScreen extends ConsumerStatefulWidget {
|
||||
const RoomFormScreen({super.key, this.roomId});
|
||||
|
||||
final int? roomId;
|
||||
|
||||
bool get isEditing => roomId != null;
|
||||
|
||||
@override
|
||||
ConsumerState<RoomFormScreen> createState() => _RoomFormScreenState();
|
||||
}
|
||||
|
||||
class _RoomFormScreenState extends ConsumerState<RoomFormScreen> {
|
||||
final _formKey = GlobalKey<FormState>();
|
||||
final _nameController = TextEditingController();
|
||||
String _selectedIconName = curatedRoomIcons.first.name;
|
||||
bool _isLoading = false;
|
||||
bool _isSaving = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
if (widget.isEditing) {
|
||||
_loadRoom();
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> _loadRoom() async {
|
||||
setState(() => _isLoading = true);
|
||||
try {
|
||||
final db = ref.read(appDatabaseProvider);
|
||||
final room = await db.roomsDao.getRoomById(widget.roomId!);
|
||||
_nameController.text = room.name;
|
||||
setState(() {
|
||||
_selectedIconName = room.iconName;
|
||||
_isLoading = false;
|
||||
});
|
||||
} catch (e) {
|
||||
if (mounted) {
|
||||
setState(() => _isLoading = false);
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(content: Text('Fehler beim Laden: $e')),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> _save() async {
|
||||
if (!_formKey.currentState!.validate()) return;
|
||||
setState(() => _isSaving = true);
|
||||
|
||||
try {
|
||||
final actions = ref.read(roomActionsProvider.notifier);
|
||||
if (widget.isEditing) {
|
||||
final db = ref.read(appDatabaseProvider);
|
||||
final existing = await db.roomsDao.getRoomById(widget.roomId!);
|
||||
await actions.updateRoom(existing.copyWith(
|
||||
name: _nameController.text.trim(),
|
||||
iconName: _selectedIconName,
|
||||
));
|
||||
} else {
|
||||
await actions.createRoom(
|
||||
_nameController.text.trim(),
|
||||
_selectedIconName,
|
||||
);
|
||||
}
|
||||
if (mounted) context.pop();
|
||||
} catch (e) {
|
||||
if (mounted) {
|
||||
setState(() => _isSaving = false);
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(content: Text('Fehler beim Speichern: $e')),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_nameController.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final l10n = AppLocalizations.of(context);
|
||||
final theme = Theme.of(context);
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
title: Text(
|
||||
widget.isEditing ? l10n.roomFormEditTitle : l10n.roomFormCreateTitle,
|
||||
),
|
||||
actions: [
|
||||
IconButton(
|
||||
onPressed: _isSaving ? null : _save,
|
||||
icon: _isSaving
|
||||
? const SizedBox(
|
||||
width: 20,
|
||||
height: 20,
|
||||
child: CircularProgressIndicator(strokeWidth: 2),
|
||||
)
|
||||
: const Icon(Icons.check),
|
||||
),
|
||||
],
|
||||
),
|
||||
body: _isLoading
|
||||
? const Center(child: CircularProgressIndicator())
|
||||
: Form(
|
||||
key: _formKey,
|
||||
child: ListView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
children: [
|
||||
// Room name field
|
||||
TextFormField(
|
||||
controller: _nameController,
|
||||
autofocus: !widget.isEditing,
|
||||
textCapitalization: TextCapitalization.sentences,
|
||||
decoration: InputDecoration(
|
||||
labelText: l10n.roomFormNameLabel,
|
||||
hintText: l10n.roomFormNameHint,
|
||||
border: const OutlineInputBorder(),
|
||||
),
|
||||
validator: (value) {
|
||||
if (value == null || value.trim().isEmpty) {
|
||||
return l10n.roomFormNameRequired;
|
||||
}
|
||||
if (value.trim().length > 100) {
|
||||
return 'Maximal 100 Zeichen';
|
||||
}
|
||||
return null;
|
||||
},
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
// Icon picker preview
|
||||
Text(
|
||||
l10n.roomFormIconLabel,
|
||||
style: theme.textTheme.titleSmall,
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
InkWell(
|
||||
onTap: () async {
|
||||
final selected = await showIconPickerSheet(
|
||||
context: context,
|
||||
selectedIconName: _selectedIconName,
|
||||
);
|
||||
if (selected != null) {
|
||||
setState(() => _selectedIconName = selected);
|
||||
}
|
||||
},
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: theme.colorScheme.surfaceContainerLow,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(
|
||||
color: theme.colorScheme.outline.withValues(alpha: 0.3),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: theme.colorScheme.primaryContainer,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
),
|
||||
child: Icon(
|
||||
mapIconName(_selectedIconName),
|
||||
size: 28,
|
||||
color: theme.colorScheme.onPrimaryContainer,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
Expanded(
|
||||
child: Text(
|
||||
l10n.roomFormIconLabel,
|
||||
style: theme.textTheme.bodyLarge,
|
||||
),
|
||||
),
|
||||
Icon(
|
||||
Icons.chevron_right,
|
||||
color: theme.colorScheme.onSurfaceVariant,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user