Initial Flutter scaffold: Riverpod + GoRouter + Dio

This commit is contained in:
2026-01-27 13:20:01 +00:00
commit c8ac4ec8bc
18 changed files with 2728 additions and 0 deletions

View File

@@ -0,0 +1,346 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import 'package:intl/intl.dart';
import '../../../shared/services/api_client.dart';
final clientDetailProvider = FutureProvider.autoDispose
.family<Map<String, dynamic>, String>((ref, id) async {
final apiClient = ref.watch(apiClientProvider);
return apiClient.getClient(id);
});
class ClientDetailScreen extends ConsumerWidget {
final String clientId;
const ClientDetailScreen({super.key, required this.clientId});
@override
Widget build(BuildContext context, WidgetRef ref) {
final clientAsync = ref.watch(clientDetailProvider(clientId));
return Scaffold(
appBar: AppBar(
actions: [
IconButton(
icon: const Icon(Icons.edit),
onPressed: () => context.go('/clients/$clientId/edit'),
),
PopupMenuButton(
itemBuilder: (context) => [
const PopupMenuItem(
value: 'email',
child: ListTile(
leading: Icon(Icons.email),
title: Text('Generate Email'),
contentPadding: EdgeInsets.zero,
),
),
const PopupMenuItem(
value: 'contacted',
child: ListTile(
leading: Icon(Icons.check_circle),
title: Text('Mark Contacted'),
contentPadding: EdgeInsets.zero,
),
),
const PopupMenuItem(
value: 'delete',
child: ListTile(
leading: Icon(Icons.delete, color: Colors.red),
title: Text('Delete', style: TextStyle(color: Colors.red)),
contentPadding: EdgeInsets.zero,
),
),
],
onSelected: (value) async {
switch (value) {
case 'email':
context.go('/emails/compose?clientId=$clientId');
break;
case 'contacted':
await ref.read(apiClientProvider).markClientContacted(clientId);
ref.invalidate(clientDetailProvider(clientId));
break;
case 'delete':
final confirm = await showDialog<bool>(
context: context,
builder: (context) => AlertDialog(
title: const Text('Delete Client'),
content: const Text('Are you sure you want to delete this client?'),
actions: [
TextButton(
onPressed: () => Navigator.pop(context, false),
child: const Text('Cancel'),
),
TextButton(
onPressed: () => Navigator.pop(context, true),
style: TextButton.styleFrom(foregroundColor: Colors.red),
child: const Text('Delete'),
),
],
),
);
if (confirm == true) {
await ref.read(apiClientProvider).deleteClient(clientId);
if (context.mounted) {
context.go('/');
}
}
break;
}
},
),
],
),
body: clientAsync.when(
data: (client) => _ClientDetailContent(client: client),
loading: () => const Center(child: CircularProgressIndicator()),
error: (error, stack) => Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.error_outline, size: 64, color: Colors.red.shade300),
const SizedBox(height: 16),
const Text('Failed to load client'),
TextButton(
onPressed: () => ref.invalidate(clientDetailProvider(clientId)),
child: const Text('Retry'),
),
],
),
),
),
);
}
}
class _ClientDetailContent extends StatelessWidget {
final Map<String, dynamic> client;
const _ClientDetailContent({required this.client});
@override
Widget build(BuildContext context) {
final name = '${client['firstName']} ${client['lastName']}';
final dateFormat = DateFormat.yMMMd();
return SingleChildScrollView(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Header
Center(
child: Column(
children: [
CircleAvatar(
radius: 48,
backgroundColor: Theme.of(context).colorScheme.primaryContainer,
child: Text(
'${client['firstName'][0]}${client['lastName'][0]}',
style: TextStyle(
fontSize: 32,
color: Theme.of(context).colorScheme.onPrimaryContainer,
fontWeight: FontWeight.bold,
),
),
),
const SizedBox(height: 16),
Text(
name,
style: Theme.of(context).textTheme.headlineSmall?.copyWith(
fontWeight: FontWeight.bold,
),
),
if (client['company'] != null) ...[
const SizedBox(height: 4),
Text(
'${client['role'] ?? ''} ${client['role'] != null && client['company'] != null ? 'at ' : ''}${client['company'] ?? ''}'.trim(),
style: Theme.of(context).textTheme.bodyLarge?.copyWith(
color: Colors.grey,
),
),
],
],
),
),
const SizedBox(height: 32),
// Contact info
_Section(
title: 'Contact',
children: [
if (client['email'] != null)
_InfoRow(icon: Icons.email, label: 'Email', value: client['email']),
if (client['phone'] != null)
_InfoRow(icon: Icons.phone, label: 'Phone', value: client['phone']),
if (client['city'] != null || client['state'] != null)
_InfoRow(
icon: Icons.location_on,
label: 'Location',
value: [client['city'], client['state']].where((e) => e != null).join(', '),
),
],
),
// Personal info
if (client['birthday'] != null || client['anniversary'] != null ||
(client['interests'] as List?)?.isNotEmpty == true)
_Section(
title: 'Personal',
children: [
if (client['birthday'] != null)
_InfoRow(
icon: Icons.cake,
label: 'Birthday',
value: dateFormat.format(DateTime.parse(client['birthday'])),
),
if (client['anniversary'] != null)
_InfoRow(
icon: Icons.favorite,
label: 'Anniversary',
value: dateFormat.format(DateTime.parse(client['anniversary'])),
),
if ((client['interests'] as List?)?.isNotEmpty == true) ...[
const SizedBox(height: 8),
Text(
'Interests',
style: Theme.of(context).textTheme.labelLarge?.copyWith(
color: Colors.grey,
),
),
const SizedBox(height: 8),
Wrap(
spacing: 8,
runSpacing: 8,
children: (client['interests'] as List).cast<String>().map((interest) =>
Chip(label: Text(interest)),
).toList(),
),
],
],
),
// Family
if (client['family'] != null &&
(client['family']['spouse'] != null ||
(client['family']['children'] as List?)?.isNotEmpty == true))
_Section(
title: 'Family',
children: [
if (client['family']['spouse'] != null)
_InfoRow(
icon: Icons.person,
label: 'Spouse',
value: client['family']['spouse'],
),
if ((client['family']['children'] as List?)?.isNotEmpty == true)
_InfoRow(
icon: Icons.child_care,
label: 'Children',
value: (client['family']['children'] as List).join(', '),
),
],
),
// Notes
if (client['notes'] != null && client['notes'].toString().isNotEmpty)
_Section(
title: 'Notes',
children: [
Text(client['notes']),
],
),
// Tags
if ((client['tags'] as List?)?.isNotEmpty == true)
_Section(
title: 'Tags',
children: [
Wrap(
spacing: 8,
runSpacing: 8,
children: (client['tags'] as List).cast<String>().map((tag) =>
Chip(
label: Text(tag),
backgroundColor: Theme.of(context).colorScheme.secondaryContainer,
),
).toList(),
),
],
),
// Last contacted
if (client['lastContactedAt'] != null)
Padding(
padding: const EdgeInsets.only(top: 16),
child: Text(
'Last contacted: ${dateFormat.format(DateTime.parse(client['lastContactedAt']))}',
style: Theme.of(context).textTheme.bodySmall?.copyWith(
color: Colors.grey,
),
),
),
],
),
);
}
}
class _Section extends StatelessWidget {
final String title;
final List<Widget> children;
const _Section({required this.title, required this.children});
@override
Widget build(BuildContext context) {
if (children.isEmpty) return const SizedBox.shrink();
return Padding(
padding: const EdgeInsets.only(bottom: 24),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 12),
...children,
],
),
);
}
}
class _InfoRow extends StatelessWidget {
final IconData icon;
final String label;
final String value;
const _InfoRow({
required this.icon,
required this.label,
required this.value,
});
@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 4),
child: Row(
children: [
Icon(icon, size: 20, color: Colors.grey),
const SizedBox(width: 12),
Expanded(
child: Text(value),
),
],
),
);
}
}

View File

@@ -0,0 +1,339 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import '../../../shared/services/api_client.dart';
import 'clients_screen.dart';
import 'client_detail_screen.dart';
class ClientFormScreen extends ConsumerStatefulWidget {
final String? clientId;
const ClientFormScreen({super.key, this.clientId});
@override
ConsumerState<ClientFormScreen> createState() => _ClientFormScreenState();
}
class _ClientFormScreenState extends ConsumerState<ClientFormScreen> {
final _formKey = GlobalKey<FormState>();
bool _isLoading = false;
bool _isInitialized = false;
// Form controllers
final _firstNameController = TextEditingController();
final _lastNameController = TextEditingController();
final _emailController = TextEditingController();
final _phoneController = TextEditingController();
final _companyController = TextEditingController();
final _roleController = TextEditingController();
final _industryController = TextEditingController();
final _notesController = TextEditingController();
final _interestsController = TextEditingController();
final _tagsController = TextEditingController();
DateTime? _birthday;
DateTime? _anniversary;
bool get isEditing => widget.clientId != null;
@override
void dispose() {
_firstNameController.dispose();
_lastNameController.dispose();
_emailController.dispose();
_phoneController.dispose();
_companyController.dispose();
_roleController.dispose();
_industryController.dispose();
_notesController.dispose();
_interestsController.dispose();
_tagsController.dispose();
super.dispose();
}
void _initializeFromClient(Map<String, dynamic> client) {
if (_isInitialized) return;
_isInitialized = true;
_firstNameController.text = client['firstName'] ?? '';
_lastNameController.text = client['lastName'] ?? '';
_emailController.text = client['email'] ?? '';
_phoneController.text = client['phone'] ?? '';
_companyController.text = client['company'] ?? '';
_roleController.text = client['role'] ?? '';
_industryController.text = client['industry'] ?? '';
_notesController.text = client['notes'] ?? '';
_interestsController.text = (client['interests'] as List?)?.join(', ') ?? '';
_tagsController.text = (client['tags'] as List?)?.join(', ') ?? '';
if (client['birthday'] != null) {
_birthday = DateTime.tryParse(client['birthday']);
}
if (client['anniversary'] != null) {
_anniversary = DateTime.tryParse(client['anniversary']);
}
}
Future<void> _handleSubmit() async {
if (!_formKey.currentState!.validate()) return;
setState(() => _isLoading = true);
try {
final data = {
'firstName': _firstNameController.text.trim(),
'lastName': _lastNameController.text.trim(),
if (_emailController.text.isNotEmpty) 'email': _emailController.text.trim(),
if (_phoneController.text.isNotEmpty) 'phone': _phoneController.text.trim(),
if (_companyController.text.isNotEmpty) 'company': _companyController.text.trim(),
if (_roleController.text.isNotEmpty) 'role': _roleController.text.trim(),
if (_industryController.text.isNotEmpty) 'industry': _industryController.text.trim(),
if (_notesController.text.isNotEmpty) 'notes': _notesController.text.trim(),
if (_interestsController.text.isNotEmpty)
'interests': _interestsController.text.split(',').map((e) => e.trim()).where((e) => e.isNotEmpty).toList(),
if (_tagsController.text.isNotEmpty)
'tags': _tagsController.text.split(',').map((e) => e.trim()).where((e) => e.isNotEmpty).toList(),
if (_birthday != null) 'birthday': _birthday!.toIso8601String(),
if (_anniversary != null) 'anniversary': _anniversary!.toIso8601String(),
};
final apiClient = ref.read(apiClientProvider);
if (isEditing) {
await apiClient.updateClient(widget.clientId!, data);
ref.invalidate(clientDetailProvider(widget.clientId!));
} else {
final client = await apiClient.createClient(data);
widget.clientId ?? client['id'];
}
ref.invalidate(clientsProvider(null));
if (mounted) {
context.go(isEditing ? '/clients/${widget.clientId}' : '/');
}
} catch (e) {
if (mounted) {
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(content: Text('Failed to save: $e')),
);
}
} finally {
if (mounted) {
setState(() => _isLoading = false);
}
}
}
Future<void> _selectDate(BuildContext context, bool isBirthday) async {
final initialDate = isBirthday ? _birthday : _anniversary;
final picked = await showDatePicker(
context: context,
initialDate: initialDate ?? DateTime.now(),
firstDate: DateTime(1900),
lastDate: DateTime.now().add(const Duration(days: 365)),
);
if (picked != null) {
setState(() {
if (isBirthday) {
_birthday = picked;
} else {
_anniversary = picked;
}
});
}
}
@override
Widget build(BuildContext context) {
// Load existing client data if editing
if (isEditing) {
final clientAsync = ref.watch(clientDetailProvider(widget.clientId!));
return clientAsync.when(
data: (client) {
_initializeFromClient(client);
return _buildForm(context);
},
loading: () => Scaffold(
appBar: AppBar(title: const Text('Edit Client')),
body: const Center(child: CircularProgressIndicator()),
),
error: (e, s) => Scaffold(
appBar: AppBar(title: const Text('Edit Client')),
body: Center(child: Text('Error: $e')),
),
);
}
return _buildForm(context);
}
Widget _buildForm(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(isEditing ? 'Edit Client' : 'New Client'),
actions: [
TextButton(
onPressed: _isLoading ? null : _handleSubmit,
child: _isLoading
? const SizedBox(
width: 20,
height: 20,
child: CircularProgressIndicator(strokeWidth: 2),
)
: const Text('Save'),
),
],
),
body: Form(
key: _formKey,
child: ListView(
padding: const EdgeInsets.all(16),
children: [
// Basic info
Text(
'Basic Information',
style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 16),
Row(
children: [
Expanded(
child: TextFormField(
controller: _firstNameController,
decoration: const InputDecoration(labelText: 'First Name *'),
validator: (v) => v?.isEmpty == true ? 'Required' : null,
),
),
const SizedBox(width: 16),
Expanded(
child: TextFormField(
controller: _lastNameController,
decoration: const InputDecoration(labelText: 'Last Name *'),
validator: (v) => v?.isEmpty == true ? 'Required' : null,
),
),
],
),
const SizedBox(height: 16),
TextFormField(
controller: _emailController,
decoration: const InputDecoration(labelText: 'Email'),
keyboardType: TextInputType.emailAddress,
),
const SizedBox(height: 16),
TextFormField(
controller: _phoneController,
decoration: const InputDecoration(labelText: 'Phone'),
keyboardType: TextInputType.phone,
),
const SizedBox(height: 32),
Text(
'Professional',
style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 16),
TextFormField(
controller: _companyController,
decoration: const InputDecoration(labelText: 'Company'),
),
const SizedBox(height: 16),
TextFormField(
controller: _roleController,
decoration: const InputDecoration(labelText: 'Role'),
),
const SizedBox(height: 16),
TextFormField(
controller: _industryController,
decoration: const InputDecoration(labelText: 'Industry'),
),
const SizedBox(height: 32),
Text(
'Personal',
style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 16),
Row(
children: [
Expanded(
child: InkWell(
onTap: () => _selectDate(context, true),
child: InputDecorator(
decoration: const InputDecoration(labelText: 'Birthday'),
child: Text(
_birthday != null
? '${_birthday!.month}/${_birthday!.day}/${_birthday!.year}'
: 'Select date',
style: TextStyle(
color: _birthday != null ? null : Colors.grey,
),
),
),
),
),
const SizedBox(width: 16),
Expanded(
child: InkWell(
onTap: () => _selectDate(context, false),
child: InputDecorator(
decoration: const InputDecoration(labelText: 'Anniversary'),
child: Text(
_anniversary != null
? '${_anniversary!.month}/${_anniversary!.day}/${_anniversary!.year}'
: 'Select date',
style: TextStyle(
color: _anniversary != null ? null : Colors.grey,
),
),
),
),
),
],
),
const SizedBox(height: 16),
TextFormField(
controller: _interestsController,
decoration: const InputDecoration(
labelText: 'Interests',
hintText: 'Golf, Wine, Travel (comma separated)',
),
),
const SizedBox(height: 32),
Text(
'Notes & Tags',
style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
),
const SizedBox(height: 16),
TextFormField(
controller: _notesController,
decoration: const InputDecoration(labelText: 'Notes'),
maxLines: 4,
),
const SizedBox(height: 16),
TextFormField(
controller: _tagsController,
decoration: const InputDecoration(
labelText: 'Tags',
hintText: 'VIP, Referral Source (comma separated)',
),
),
const SizedBox(height: 32),
],
),
),
);
}
}

View File

@@ -0,0 +1,250 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import '../../../shared/services/api_client.dart';
import '../../../shared/providers/auth_provider.dart';
final clientsProvider = FutureProvider.autoDispose
.family<List<Map<String, dynamic>>, String?>((ref, search) async {
final apiClient = ref.watch(apiClientProvider);
return apiClient.getClients(search: search);
});
class ClientsScreen extends ConsumerStatefulWidget {
const ClientsScreen({super.key});
@override
ConsumerState<ClientsScreen> createState() => _ClientsScreenState();
}
class _ClientsScreenState extends ConsumerState<ClientsScreen> {
final _searchController = TextEditingController();
String? _searchQuery;
@override
void dispose() {
_searchController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
final clientsAsync = ref.watch(clientsProvider(_searchQuery));
return Scaffold(
appBar: AppBar(
title: const Text('Clients'),
actions: [
IconButton(
icon: const Icon(Icons.logout),
onPressed: () async {
await ref.read(authStateProvider.notifier).signOut();
},
),
],
),
body: Column(
children: [
// Search bar
Padding(
padding: const EdgeInsets.all(16),
child: TextField(
controller: _searchController,
decoration: InputDecoration(
hintText: 'Search clients...',
prefixIcon: const Icon(Icons.search),
suffixIcon: _searchQuery != null
? IconButton(
icon: const Icon(Icons.clear),
onPressed: () {
_searchController.clear();
setState(() {
_searchQuery = null;
});
},
)
: null,
),
onSubmitted: (value) {
setState(() {
_searchQuery = value.isEmpty ? null : value;
});
},
),
),
// Client list
Expanded(
child: clientsAsync.when(
data: (clients) {
if (clients.isEmpty) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.people_outline,
size: 64,
color: Colors.grey.shade400,
),
const SizedBox(height: 16),
Text(
_searchQuery != null
? 'No clients found'
: 'No clients yet',
style: Theme.of(context).textTheme.titleMedium?.copyWith(
color: Colors.grey,
),
),
const SizedBox(height: 8),
if (_searchQuery == null)
FilledButton.icon(
onPressed: () => context.go('/clients/new'),
icon: const Icon(Icons.add),
label: const Text('Add Client'),
),
],
),
);
}
return RefreshIndicator(
onRefresh: () async {
ref.invalidate(clientsProvider(_searchQuery));
},
child: ListView.builder(
padding: const EdgeInsets.symmetric(horizontal: 16),
itemCount: clients.length,
itemBuilder: (context, index) {
final client = clients[index];
return _ClientCard(client: client);
},
),
);
},
loading: () => const Center(
child: CircularProgressIndicator(),
),
error: (error, stack) => Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Icons.error_outline,
size: 64,
color: Colors.red.shade300,
),
const SizedBox(height: 16),
Text(
'Failed to load clients',
style: Theme.of(context).textTheme.titleMedium,
),
const SizedBox(height: 8),
TextButton(
onPressed: () {
ref.invalidate(clientsProvider(_searchQuery));
},
child: const Text('Retry'),
),
],
),
),
),
),
],
),
floatingActionButton: FloatingActionButton(
onPressed: () => context.go('/clients/new'),
child: const Icon(Icons.add),
),
);
}
}
class _ClientCard extends StatelessWidget {
final Map<String, dynamic> client;
const _ClientCard({required this.client});
@override
Widget build(BuildContext context) {
final name = '${client['firstName']} ${client['lastName']}';
final company = client['company'] as String?;
final tags = (client['tags'] as List?)?.cast<String>() ?? [];
return Card(
margin: const EdgeInsets.only(bottom: 12),
child: InkWell(
onTap: () => context.go('/clients/${client['id']}'),
borderRadius: BorderRadius.circular(12),
child: Padding(
padding: const EdgeInsets.all(16),
child: Row(
children: [
CircleAvatar(
backgroundColor: Theme.of(context).colorScheme.primaryContainer,
child: Text(
'${client['firstName'][0]}${client['lastName'][0]}',
style: TextStyle(
color: Theme.of(context).colorScheme.onPrimaryContainer,
fontWeight: FontWeight.bold,
),
),
),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
name,
style: Theme.of(context).textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.w600,
),
),
if (company != null && company.isNotEmpty) ...[
const SizedBox(height: 2),
Text(
company,
style: Theme.of(context).textTheme.bodyMedium?.copyWith(
color: Colors.grey,
),
),
],
if (tags.isNotEmpty) ...[
const SizedBox(height: 8),
Wrap(
spacing: 4,
runSpacing: 4,
children: tags.take(3).map((tag) => Container(
padding: const EdgeInsets.symmetric(
horizontal: 8,
vertical: 2,
),
decoration: BoxDecoration(
color: Theme.of(context).colorScheme.secondaryContainer,
borderRadius: BorderRadius.circular(12),
),
child: Text(
tag,
style: Theme.of(context).textTheme.labelSmall?.copyWith(
color: Theme.of(context).colorScheme.onSecondaryContainer,
),
),
)).toList(),
),
],
],
),
),
Icon(
Icons.chevron_right,
color: Colors.grey.shade400,
),
],
),
),
),
);
}
}