nilsjohan/recipe-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(import): implement recipe import functionality with file and URL support

Browse Source 
Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
Nils-Johan Gynther
2026-04-22 21:31:25 +02:00
parent 8ebf119d39
commit 81117fbcb7
11 changed files with 617 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
flutter/lib/core/router/app_router.dart
+9 -1
View File
@@ -19,6 +19,7 @@ import '../../features/inventory/presentation/consume_inventory_screen.dart';
import '../../features/inventory/presentation/consumption_history_screen.dart';
import '../../features/meal_plan/presentation/meal_plan_screen.dart';
import '../../features/pantry/presentation/pantry_screen.dart';
import '../../features/import/presentation/import_screen.dart';
final appRouterProvider = Provider<GoRouter>((ref) {
final authState = ref.watch(authStateProvider);
@@ -66,7 +67,10 @@ final appRouterProvider = Provider<GoRouter>((ref) {
// /recipes/create must be listed before /recipes/:id to avoid conflict.
GoRoute(
path: '/recipes/create',
builder: (context, state) => const CreateRecipeScreen(),
builder: (context, state) {
final initialMarkdown = state.extra as String?;
return CreateRecipeScreen(initialMarkdown: initialMarkdown);
},
),
GoRoute(
path: '/recipes/:id',
@@ -168,6 +172,10 @@ final appRouterProvider = Provider<GoRouter>((ref) {
path: '/baslager',
builder: (context, state) => const PantryScreen(),
),
GoRoute(
path: '/import',
builder: (context, state) => const ImportScreen(),
),
GoRoute(
path: '/profile',
builder: (context, state) => const ProfileScreen(),
flutter/lib/core/ui/app_shell.dart
+6
View File
@@ -39,6 +39,12 @@ class AppShell extends ConsumerWidget {
icon: Icons.storefront_outlined,
label: 'Baslager',
),
_AppDestination(
path: '/import',
title: 'Importera',
icon: Icons.upload_file_outlined,
label: 'Importera',
),
_AppDestination(
path: '/profile',
title: 'Profil',
flutter/lib/features/import/data/import_providers.dart
+7
View File
@@ -0,0 +1,7 @@
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'import_repository.dart';
final importRepositoryProvider = Provider<ImportRepository>(
(_) => ImportRepository(),
);
flutter/lib/features/import/data/import_repository.dart
+115
View File
@@ -0,0 +1,115 @@
import 'dart:convert';
import 'dart:typed_data';
import 'package:http/http.dart' as http;
import '../../../core/api/api_exception.dart';
import '../domain/quick_import_result.dart';
/// Handles communication with the quick-import API endpoint.
///
/// Two modes:
/// • [importFile] — multipart upload (PDF / image bytes, max 10 MB).
/// • [importUrl] — JSON body with `{ input: url }`.
class ImportRepository {
final http.Client _client;
final String _baseUrl;
ImportRepository({http.Client? client})
: _client = client ?? http.Client(),
_baseUrl = const String.fromEnvironment(
'API_BASE_URL',
defaultValue: '/api',
);
/// Upload a file (PDF or image) for recipe extraction.
///
/// [bytes] — raw file bytes from file_picker.
/// [filename] — original filename (used for MIME detection on the server).
/// [token] — JWT bearer token.
Future<QuickImportResult> importFile({
required Uint8List bytes,
required String filename,
String? token,
}) async {
final uri = Uri.parse('$_baseUrl/quick-import');
final request = http.MultipartRequest('POST', uri);
if (token != null) {
request.headers['Authorization'] = 'Bearer $token';
}
request.files.add(
http.MultipartFile.fromBytes('file', bytes, filename: filename),
);
final streamed = await _client.send(request).timeout(
const Duration(seconds: 120),
onTimeout: () => throw ApiException(
type: ApiErrorType.network,
message: 'Importen tog för lång tid. Försök igen.',
),
);
final response = await http.Response.fromStream(streamed);
return QuickImportResult.fromJson(_parseResponse(response));
}
/// Import a recipe from a URL.
Future<QuickImportResult> importUrl({
required String url,
String? token,
}) async {
final uri = Uri.parse('$_baseUrl/quick-import');
final response = await _client
.post(
uri,
headers: {
'Content-Type': 'application/json',
if (token != null) 'Authorization': 'Bearer $token',
},
body: jsonEncode({'input': url}),
)
.timeout(
const Duration(seconds: 120),
onTimeout: () => throw ApiException(
type: ApiErrorType.network,
message: 'Importen tog för lång tid. Försök igen.',
),
);
return QuickImportResult.fromJson(_parseResponse(response));
}
Map<String, dynamic> _parseResponse(http.Response response) {
if (response.statusCode >= 200 && response.statusCode < 300) {
return jsonDecode(response.body) as Map<String, dynamic>;
}
Map<String, dynamic>? body;
try {
body = jsonDecode(response.body) as Map<String, dynamic>;
} catch (_) {}
final message = body?['message'] as String? ??
body?['error'] as String? ??
'Import misslyckades (${response.statusCode}).';
if (response.statusCode == 401) {
throw ApiException(type: ApiErrorType.unauthorized, statusCode: 401);
}
if (response.statusCode == 403) {
throw ApiException(type: ApiErrorType.forbidden, statusCode: 403);
}
if (response.statusCode >= 500) {
throw ApiException(
type: ApiErrorType.server,
statusCode: response.statusCode,
message: message);
}
throw ApiException(
type: ApiErrorType.unknown,
statusCode: response.statusCode,
message: message);
}
}
flutter/lib/features/import/domain/quick_import_result.dart
+19
View File
@@ -0,0 +1,19 @@
/// Result from `POST /api/quick-import`.
class QuickImportResult {
final String markdown;
final String source; // 'ica' | 'pdf' | 'image' | 'other'
final String? imageUrl;
const QuickImportResult({
required this.markdown,
required this.source,
this.imageUrl,
});
factory QuickImportResult.fromJson(Map<String, dynamic> json) =>
QuickImportResult(
markdown: json['markdown'] as String? ?? '',
source: json['source'] as String? ?? 'other',
imageUrl: json['imageUrl'] as String?,
);
}
flutter/lib/features/import/presentation/import_screen.dart
+83
View File
@@ -0,0 +1,83 @@
import 'package:flutter/material.dart';
import 'recipe_import_tab.dart';
/// Main import screen with tabs: Recept | Kvitto.
///
/// Fas 6a: Recept-fliken är implementerad.
/// Fas 6b: Kvitto-fliken läggs till i ett senare steg.
class ImportScreen extends StatefulWidget {
const ImportScreen({super.key});
@override
State<ImportScreen> createState() => _ImportScreenState();
}
class _ImportScreenState extends State<ImportScreen>
with SingleTickerProviderStateMixin {
late final TabController _tabController;
@override
void initState() {
super.initState();
_tabController = TabController(length: 2, vsync: this);
}
@override
void dispose() {
_tabController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Importera'),
bottom: TabBar(
controller: _tabController,
tabs: const [
Tab(icon: Icon(Icons.restaurant_menu_outlined), text: 'Recept'),
Tab(icon: Icon(Icons.receipt_long_outlined), text: 'Kvitto'),
],
),
),
body: TabBarView(
controller: _tabController,
children: [
const RecipeImportTab(),
// Fas 6b — placeholder tills kvitto-flödet är implementerat.
Center(
child: Padding(
padding: const EdgeInsets.all(24),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
Icons.construction_outlined,
size: 48,
color: Theme.of(context).colorScheme.outline,
),
const SizedBox(height: 16),
Text(
'Kvittoimport kommer snart',
style: Theme.of(context).textTheme.titleMedium,
),
const SizedBox(height: 8),
Text(
'Fotografera eller ladda upp ett kvitto — varorna '
'läggs till i ditt inventarie.',
textAlign: TextAlign.center,
style: Theme.of(context).textTheme.bodyMedium?.copyWith(
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
),
],
),
),
),
],
),
);
}
}
flutter/lib/features/import/presentation/recipe_import_tab.dart
+242
View File
@@ -0,0 +1,242 @@
import 'package:file_picker/file_picker.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import '../../../core/api/api_error_mapper.dart';
import '../../auth/data/auth_providers.dart';
import '../data/import_providers.dart';
/// Accepted MIME types / extensions for recipe file import.
const _allowedExtensions = ['pdf', 'png', 'jpg', 'jpeg', 'webp', 'bmp'];
/// Tab for importing a recipe via file upload or URL.
///
/// On success navigates to `/recipes/create` with the parsed markdown
/// passed as GoRouter `extra`.
class RecipeImportTab extends ConsumerStatefulWidget {
const RecipeImportTab({super.key});
@override
ConsumerState<RecipeImportTab> createState() => _RecipeImportTabState();
}
class _RecipeImportTabState extends ConsumerState<RecipeImportTab> {
// Shared state
bool _isLoading = false;
String? _error;
// File mode
PlatformFile? _pickedFile;
// URL mode
_Method _method = _Method.file;
final _urlCtrl = TextEditingController();
@override
void dispose() {
_urlCtrl.dispose();
super.dispose();
}
// ── File picker ──────────────────────────────────────────────────────────
Future<void> _pickFile() async {
final result = await FilePicker.platform.pickFiles(
type: FileType.custom,
allowedExtensions: _allowedExtensions,
withData: true, // needed on Flutter web to get bytes
);
if (result == null || result.files.isEmpty) return;
setState(() {
_pickedFile = result.files.first;
_error = null;
});
}
// ── Submit ───────────────────────────────────────────────────────────────
Future<void> _submit() async {
setState(() {
_isLoading = true;
_error = null;
});
try {
final token = await ref.read(authStateProvider.future);
final repo = ref.read(importRepositoryProvider);
final result = _method == _Method.file
? await repo.importFile(
bytes: _pickedFile!.bytes!,
filename: _pickedFile!.name,
token: token,
)
: await repo.importUrl(
url: _urlCtrl.text.trim(),
token: token,
);
if (!mounted) return;
// Pass markdown as GoRouter extra — CreateRecipeScreen picks it up.
context.push('/recipes/create', extra: result.markdown);
} catch (e) {
if (!mounted) return;
setState(() => _error = mapErrorToUserMessage(e, context));
} finally {
if (mounted) setState(() => _isLoading = false);
}
}
bool get _canSubmit {
if (_isLoading) return false;
if (_method == _Method.file) return _pickedFile?.bytes != null;
return _urlCtrl.text.trim().isNotEmpty;
}
// ── Build ────────────────────────────────────────────────────────────────
@override
Widget build(BuildContext context) {
final theme = Theme.of(context);
return SingleChildScrollView(
padding: const EdgeInsets.all(16),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'Ladda upp en PDF eller bild, eller ange en receptlänk — '
'receptet importeras och öppnas direkt i redigeringsläget.',
style: theme.textTheme.bodyMedium
?.copyWith(color: theme.colorScheme.onSurfaceVariant),
),
const SizedBox(height: 20),
// ── Metodväljare ────────────────────────────────────────────────
SegmentedButton<_Method>(
segments: const [
ButtonSegment(
value: _Method.file,
label: Text('Fil / PDF'),
icon: Icon(Icons.upload_file_outlined),
),
ButtonSegment(
value: _Method.url,
label: Text('Länk'),
icon: Icon(Icons.link),
),
],
selected: {_method},
onSelectionChanged: (s) =>
setState(() => _method = s.first),
),
const SizedBox(height: 24),
// ── Filläge ─────────────────────────────────────────────────────
if (_method == _Method.file) ...[
OutlinedButton.icon(
onPressed: _isLoading ? null : _pickFile,
icon: const Icon(Icons.attach_file),
label: Text(
_pickedFile == null
? 'Välj fil (PDF, PNG, JPG, WEBP, BMP)'
: _pickedFile!.name,
),
),
if (_pickedFile != null) ...[
const SizedBox(height: 8),
Text(
'${(_pickedFile!.size / 1024).round()} KB',
style: theme.textTheme.bodySmall
?.copyWith(color: theme.colorScheme.outline),
),
],
],
// ── URL-läge ────────────────────────────────────────────────────
if (_method == _Method.url) ...[
TextField(
controller: _urlCtrl,
keyboardType: TextInputType.url,
autofocus: true,
enabled: !_isLoading,
decoration: const InputDecoration(
labelText: 'Receptlänk',
hintText: 'https://exempel.se/recept/...',
prefixIcon: Icon(Icons.link),
border: OutlineInputBorder(),
),
onChanged: (_) => setState(() {}),
onSubmitted: (_) {
if (_canSubmit) _submit();
},
),
],
const SizedBox(height: 24),
// ── Laddningsindikator ───────────────────────────────────────────
if (_isLoading) ...[
const LinearProgressIndicator(),
const SizedBox(height: 8),
Text(
'Tolkar receptet — detta kan ta upp till en minut...',
style: theme.textTheme.bodySmall
?.copyWith(color: theme.colorScheme.onSurfaceVariant),
),
const SizedBox(height: 16),
],
// ── Felmeddelande ───────────────────────────────────────────────
if (_error != null) ...[
Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: theme.colorScheme.errorContainer,
borderRadius: BorderRadius.circular(8),
),
child: Row(
children: [
Icon(Icons.error_outline,
color: theme.colorScheme.onErrorContainer, size: 18),
const SizedBox(width: 8),
Expanded(
child: Text(
_error!,
style: theme.textTheme.bodySmall?.copyWith(
color: theme.colorScheme.onErrorContainer),
),
),
],
),
),
const SizedBox(height: 16),
],
// ── Knapp ───────────────────────────────────────────────────────
FilledButton.icon(
onPressed: _canSubmit ? _submit : null,
icon: const Icon(Icons.auto_awesome_outlined),
label: Text(_method == _Method.file
? 'Importera fil'
: 'Importera från länk'),
),
const SizedBox(height: 24),
const Divider(),
const SizedBox(height: 12),
// ── Alternativ ──────────────────────────────────────────────────
TextButton.icon(
onPressed: () => context.push('/recipes/create'),
icon: const Icon(Icons.edit_outlined),
label: const Text('Skriv in recept istället'),
),
],
),
);
}
}
enum _Method { file, url }
flutter/lib/features/inventory/presentation/swipeable_inventory_tile.dart
+47 -7
View File
@@ -7,12 +7,46 @@ import '../../auth/data/auth_providers.dart';
import '../data/inventory_providers.dart';
import '../domain/inventory_item.dart';
/// Returns a sensible step size for quick swipe-adjustments given [unit].
///
/// Examples: "g" → 50, "kg" → 0.1, "ml" → 50, "l" / "dl" → 0.1,
/// everything else (pieces, packages, etc.) → 1.
double _stepForUnit(String unit) {
switch (unit.trim().toLowerCase()) {
case 'g':
case 'gram':
return 50;
case 'kg':
case 'kilo':
case 'kilogram':
return 0.1;
case 'ml':
return 50;
case 'cl':
return 1;
case 'dl':
return 0.5;
case 'l':
case 'liter':
case 'litre':
return 0.1;
default:
return 1;
}
}
/// Formats a step value for display: whole numbers without decimal,
/// fractions with one decimal.
String _fmtStep(double step) =>
step == step.roundToDouble() ? step.toStringAsFixed(0) : step.toStringAsFixed(1);
/// A [ListTile] wrapped in a swipe-to-adjust widget.
///
/// • Swipe **right** (+) → adds 1 unit to [item.quantity] via PATCH.
/// • Swipe **left** (−) → consumes 1 unit via the consume endpoint,
/// preserving consumption history.
/// • Swipe **right** (+) → adds one unit-appropriate step via PATCH.
/// • Swipe **left** (−) → consumes one unit-appropriate step via the
/// consume endpoint, preserving consumption history.
///
/// The step size is determined by the item's unit (e.g. 50 g, 0.1 kg, 1 st).
/// A small swipe-hint icon is shown at the start of the subtitle so users
/// know the gesture is available without any extra instruction.
class SwipeableInventoryTile extends ConsumerStatefulWidget {
@@ -58,6 +92,7 @@ class _SwipeableInventoryTileState
void _snapBack() => setState(() => _drag = 0);
Future<void> _adjust(int direction) async {
final step = _stepForUnit(widget.item.unit);
setState(() => _acting = true);
try {
final token = await ref.read(authStateProvider.future);
@@ -67,16 +102,17 @@ class _SwipeableInventoryTileState
// Increase: direct PATCH with new quantity.
await repo.updateInventoryItem(
widget.item.id,
{'quantity': widget.item.quantity + 1},
{'quantity': widget.item.quantity + step},
token: token,
);
} else {
// Decrease: use consume endpoint so history is preserved.
// Guard against going below zero.
if (widget.item.quantity <= 0) return;
final consume = step > widget.item.quantity ? widget.item.quantity : step;
await repo.consumeInventoryItem(
widget.item.id,
amountUsed: 1,
amountUsed: consume,
token: token,
);
}
@@ -103,6 +139,10 @@ class _SwipeableInventoryTileState
final rightProgress = (_drag / _threshold).clamp(0.0, 1.0);
final leftProgress = (-_drag / _threshold).clamp(0.0, 1.0);
final step = _stepForUnit(widget.item.unit);
final stepLabel = _fmtStep(step);
final unit = widget.item.unit;
return GestureDetector(
onHorizontalDragUpdate: _onUpdate,
onHorizontalDragEnd: _onEnd,
@@ -131,7 +171,7 @@ class _SwipeableInventoryTileState
),
const SizedBox(height: 2),
Text(
'+1',
'+$stepLabel $unit',
style: theme.textTheme.labelSmall?.copyWith(
color: colorScheme.onPrimaryContainer,
fontWeight: FontWeight.bold,
@@ -167,7 +207,7 @@ class _SwipeableInventoryTileState
),
const SizedBox(height: 2),
Text(
'−1',
'−$stepLabel $unit',
style: theme.textTheme.labelSmall?.copyWith(
color: colorScheme.onTertiaryContainer,
fontWeight: FontWeight.bold,
flutter/lib/features/recipes/presentation/create_recipe_screen.dart
+12 -3
View File
@@ -11,7 +11,10 @@ import '../domain/parsed_recipe.dart';
enum _Step { input, review }
class CreateRecipeScreen extends ConsumerStatefulWidget {
const CreateRecipeScreen({super.key});
/// Optional markdown to pre-fill the input field, e.g. from import.
final String? initialMarkdown;
const CreateRecipeScreen({super.key, this.initialMarkdown});
@override
ConsumerState<CreateRecipeScreen> createState() =>
@@ -22,10 +25,16 @@ class _CreateRecipeScreenState extends ConsumerState<CreateRecipeScreen> {
_Step _step = _Step.input;
// Step 1 — markdown input
final _markdownCtrl = TextEditingController();
late final TextEditingController _markdownCtrl;
bool _isParsing = false;
String? _parseError;
@override
void initState() {
super.initState();
_markdownCtrl = TextEditingController(text: widget.initialMarkdown ?? '');
}
// Step 2 — review state
ParsedRecipe? _parsed;
late TextEditingController _nameCtrl;
@@ -39,7 +48,7 @@ class _CreateRecipeScreenState extends ConsumerState<CreateRecipeScreen> {
@override
void dispose() {
_markdownCtrl.dispose();
_markdownCtrl.dispose(); // always non-null after initState
if (_step == _Step.review) {
_nameCtrl.dispose();
_servingsCtrl.dispose();