recipe-app/flutter/teknisk_beskrivning_flutter.md

Teknisk Beskrivning - Flutter Frontend

Detta dokument ar teknisk referens for systemadministratorer och programmerare. Mallet ar en sammanhallen teknisk sanning utan duplicerade roadmap- eller anvandarsektioner.

Dokumentstatus (2026-05-03)

• Fokus: arkitektur, drift och kanda gotchas.
• User guide finns i README.md.
• Planering finns i next_steps_flutter.md.

Viktigt om miljo

Anvand inte absoluta Windows-sokvagar i kod eller scripts. Bygg och drift sker pa Linux/Ubuntu i containeriserad miljo.

Senaste tekniska tillagg

• Sessionpersistens i klienten for pagande kvittoimport.
• Forbattrad inferens for antal/forpackning (inklusive uttryck som 2st).
• Tydlig separation i UI mellan AI-kategoriforslag och produktforslag.
• Ingen server-side persistens introducerad for kvittosession.
• Receptskapande: review-steg med redigerbara falt for quantity/unit/note per ingrediens.
• Receptskapande: tydlig varning i UI nar ingen produktmatchning hittas for inkluderad ingrediens.
• Receptskapande: stod for alternativa ingredienser i parse-svar (ex. "ris eller couscous") och visning i granskningsvyn.
• Global kopierbar feltext: copybar error-snackbar + SelectionArea pa appniva for battre felsokning/stod.

Arkitektur

Lager

• Presentation: flutter/lib/features/*/presentation
• State/Application: Riverpod providers/notifiers i flutter/lib/features/*/data
• Data/API: flutter/lib/core/api
• Platform abstraction: token storage i flutter/lib/core/platform

Routing

• GoRouter i flutter/lib/core/router/app_router.dart
• ShellRoute for huvudnavigation
• Fullscreen-routes for skapa/redigera/detalj

Auth

• Login via POST /api/auth/login
• Token-falt: accessToken
• Auth-gate i router med redirect logik
• guardedApiCall() hanterar logout vid 401

Sakerhetsstatus (2026-05-07)

Denna sektion sammanfattar sakerhetsfunktioner som ar implementerade i Flutter-klienten och hur de fungerar tekniskt.

Implementerat i Flutter

• Auth-gating i routing:
  • Router-lagret stoppar navigation till skyddade vyer utan token/session.
  • Om backend returnerar 401 i ett skyddat API-flode hanterar guardedApiCall() detta och triggar logout/omdirigering.
• Token-lagring via plattformsabstraktion:
  • ITokenStorage definierar kontraktet (getToken/saveToken/deleteToken).
  • Web-implementation (WebTokenStorage) lagrar token i SharedPreferences (web: localStorage).
  • Arkitekturen gor att mobil implementation kan bytas till flutter_secure_storage utan att ovrig appkod andras.
• Minimerad klientside-auktorisering:
  • Flutter forlitar sig pa backend som auktoritetskalla for access-kontroll.
  • Klienten skickar bearer-token men gor inte egen resurstagarskapslogik som kan divergera fran serverregler.
• Kontraktsstyrd API-hantering:
  • API-lagret accepterar 2xx pa importanrop och centraliserar felhantering.
  • Minskar risken for ad-hoc felhantering i UI och inkonsekvent beteende vid auth-fel.

Viktig begransning (web)

• Flutter Web kan inte anvanda httpOnly cookies enbart pa klientsidan.
• Nuvarande lagring i localStorage ar en praktisk kompromiss for web och innebar att XSS-hardening pa frontend och strict backend-headers/CSP ar fortsatt viktiga.

API- och kontraktsprinciper

• Flutter foljer backend-kontrakt, ingen lokal speciallogik for matchning.
• 2xx-svar accepteras generellt i importanrop (inte hardkodning till enbart 200).
• Kvittoimport och receptimport ar separata floden med olika svarstyper.

Kvittoimport - tekniska noter

• Granskningsflode med radredigering och destination (inventarie/baslager).
• Produktval stoder tradbaserat kategori -> produkt-flode.
• AI-kategorihint ar endast ett forslag; slutanvandaren validerar i granskningssteget.

Drift och deploy

Bygg och start (Flutter)

docker compose -f compose.yml -f compose.flutter.yml build recipe-flutter
docker compose -f compose.yml -f compose.flutter.yml up -d --no-deps recipe-flutter

Viktiga verifieringar

• Compose merge: docker compose -f compose.yml -f compose.flutter.yml config
• Reachability via proxy/Caddy
• Runtime-loggar for importfloden vid felsokning

Kanda fallgropar

• PDF-mime kan komma som application/octet-stream i Flutter Web.
• Orphan-varning ar normal nar huvudstack och Flutter-stack kors separat.
• Cache/service worker kan visa gammal frontend efter deploy.
• Vid massersattningar i Dart: verifiera parentesbalans i showSnackBar(...)-anrop innan build, annars faller web-kompilering med syntaxfel.

Relaterade dokument

• README.md - anvandarguide.
• next_steps_flutter.md - aktiv planering.
• ../TEKNISK_BESKRIVNING.md - backend/systemovergripande teknik.