feat: add onboarding flow with visual redesign
Introduce 6-step onboarding screen (Goal → Gender → DOB → Height+Weight → Activity → Calories) with per-step accent colors, hero illustration area (concentric circles + icon), and white card content panel. Backend user entity and service updated to support onboarding fields (goal, activity, height, weight, DOB, dailyCalories). Router guards unauthenticated and onboarding-incomplete users. Profile service and screen updated to expose language and onboarding preferences. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -33,7 +33,7 @@ type UpdateProfileRequest struct {
|
|||||||
Activity *string `json:"activity"`
|
Activity *string `json:"activity"`
|
||||||
Goal *string `json:"goal"`
|
Goal *string `json:"goal"`
|
||||||
Preferences *json.RawMessage `json:"preferences"`
|
Preferences *json.RawMessage `json:"preferences"`
|
||||||
DailyCalories *int `json:"-"` // internal, set by service
|
DailyCalories *int `json:"daily_calories,omitempty"`
|
||||||
}
|
}
|
||||||
|
|
||||||
// HasBodyParams returns true if any body parameter is being updated
|
// HasBodyParams returns true if any body parameter is being updated
|
||||||
|
|||||||
@@ -65,7 +65,12 @@ func (s *Service) UpdateProfile(ctx context.Context, userID string, req UpdatePr
|
|||||||
goal = req.Goal
|
goal = req.Goal
|
||||||
}
|
}
|
||||||
|
|
||||||
calories := CalculateDailyCalories(height, weight, age, gender, activity, goal)
|
var calories *int
|
||||||
|
if req.DailyCalories != nil {
|
||||||
|
calories = req.DailyCalories
|
||||||
|
} else {
|
||||||
|
calories = CalculateDailyCalories(height, weight, age, gender, activity, goal)
|
||||||
|
}
|
||||||
|
|
||||||
var calReq *UpdateProfileRequest
|
var calReq *UpdateProfileRequest
|
||||||
if calories != nil {
|
if calories != nil {
|
||||||
|
|||||||
@@ -6,6 +6,9 @@ import '../auth/auth_provider.dart';
|
|||||||
import '../../features/auth/login_screen.dart';
|
import '../../features/auth/login_screen.dart';
|
||||||
import '../../features/auth/register_screen.dart';
|
import '../../features/auth/register_screen.dart';
|
||||||
import '../../features/home/home_screen.dart';
|
import '../../features/home/home_screen.dart';
|
||||||
|
import '../../features/onboarding/onboarding_screen.dart';
|
||||||
|
import '../../features/profile/profile_provider.dart';
|
||||||
|
import '../../shared/models/user.dart';
|
||||||
import '../../features/products/products_screen.dart';
|
import '../../features/products/products_screen.dart';
|
||||||
import '../../features/products/add_product_screen.dart';
|
import '../../features/products/add_product_screen.dart';
|
||||||
import '../../features/scan/scan_screen.dart';
|
import '../../features/scan/scan_screen.dart';
|
||||||
@@ -22,10 +25,20 @@ import '../../features/products/product_provider.dart';
|
|||||||
import '../../shared/models/recipe.dart';
|
import '../../shared/models/recipe.dart';
|
||||||
import '../../shared/models/saved_recipe.dart';
|
import '../../shared/models/saved_recipe.dart';
|
||||||
|
|
||||||
// Notifies GoRouter when auth state changes without recreating the router.
|
// Notifies GoRouter when auth state or profile state changes.
|
||||||
class _RouterNotifier extends ChangeNotifier {
|
class _RouterNotifier extends ChangeNotifier {
|
||||||
_RouterNotifier(Ref ref) {
|
_RouterNotifier(Ref ref) {
|
||||||
ref.listen<AuthState>(authProvider, (_, __) => notifyListeners());
|
ref.listen<AuthState>(authProvider, (previous, next) {
|
||||||
|
// Reload profile whenever auth transitions to authenticated.
|
||||||
|
// This handles the case where profileProvider did an initial load before
|
||||||
|
// tokens were available (401 → AsyncError) and needs a fresh load after login.
|
||||||
|
if (next.status == AuthStatus.authenticated &&
|
||||||
|
previous?.status != AuthStatus.authenticated) {
|
||||||
|
ref.read(profileProvider.notifier).load();
|
||||||
|
}
|
||||||
|
notifyListeners();
|
||||||
|
});
|
||||||
|
ref.listen<AsyncValue<User>>(profileProvider, (_, __) => notifyListeners());
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -41,11 +54,29 @@ final routerProvider = Provider<GoRouter>((ref) {
|
|||||||
final authState = ref.read(authProvider);
|
final authState = ref.read(authProvider);
|
||||||
final isLoggedIn = authState.status == AuthStatus.authenticated;
|
final isLoggedIn = authState.status == AuthStatus.authenticated;
|
||||||
final isAuthRoute = state.matchedLocation.startsWith('/auth');
|
final isAuthRoute = state.matchedLocation.startsWith('/auth');
|
||||||
|
final isOnboarding = state.matchedLocation.startsWith('/onboarding');
|
||||||
|
|
||||||
// Show splash until the stored-token check completes.
|
// Show splash until the stored-token check completes.
|
||||||
if (authState.status == AuthStatus.unknown) return '/loading';
|
if (authState.status == AuthStatus.unknown) return '/loading';
|
||||||
if (!isLoggedIn && !isAuthRoute) return '/auth/login';
|
if (!isLoggedIn && !isAuthRoute) return '/auth/login';
|
||||||
if (isLoggedIn && isAuthRoute) return '/home';
|
|
||||||
|
if (isLoggedIn) {
|
||||||
|
// Reading profileProvider triggers its lazy initialization (load() in constructor).
|
||||||
|
final profileState = ref.read(profileProvider);
|
||||||
|
// Keep showing splash while profile loads.
|
||||||
|
if (profileState.isLoading) {
|
||||||
|
return state.matchedLocation == '/loading' ? null : '/loading';
|
||||||
|
}
|
||||||
|
final profileUser = profileState.valueOrNull;
|
||||||
|
// If profile failed to load, don't block navigation.
|
||||||
|
if (profileUser == null) return isAuthRoute ? '/home' : null;
|
||||||
|
|
||||||
|
final needsOnboarding = !profileUser.hasCompletedOnboarding;
|
||||||
|
if (isAuthRoute) return needsOnboarding ? '/onboarding' : '/home';
|
||||||
|
if (needsOnboarding && !isOnboarding) return '/onboarding';
|
||||||
|
if (!needsOnboarding && isOnboarding) return '/home';
|
||||||
|
}
|
||||||
|
|
||||||
return null;
|
return null;
|
||||||
},
|
},
|
||||||
routes: [
|
routes: [
|
||||||
@@ -62,6 +93,11 @@ final routerProvider = Provider<GoRouter>((ref) {
|
|||||||
path: '/auth/register',
|
path: '/auth/register',
|
||||||
builder: (_, __) => const RegisterScreen(),
|
builder: (_, __) => const RegisterScreen(),
|
||||||
),
|
),
|
||||||
|
// Onboarding — full-screen, no bottom nav, shown to new users.
|
||||||
|
GoRoute(
|
||||||
|
path: '/onboarding',
|
||||||
|
builder: (_, __) => const OnboardingScreen(),
|
||||||
|
),
|
||||||
// Full-screen recipe detail — shown without the bottom navigation bar.
|
// Full-screen recipe detail — shown without the bottom navigation bar.
|
||||||
GoRoute(
|
GoRoute(
|
||||||
path: '/recipe-detail',
|
path: '/recipe-detail',
|
||||||
|
|||||||
1215
client/lib/features/onboarding/onboarding_screen.dart
Normal file
1215
client/lib/features/onboarding/onboarding_screen.dart
Normal file
File diff suppressed because it is too large
Load Diff
@@ -51,12 +51,12 @@ class ProfileScreen extends ConsumerWidget {
|
|||||||
|
|
||||||
// ── Profile body ──────────────────────────────────────────────
|
// ── Profile body ──────────────────────────────────────────────
|
||||||
|
|
||||||
class _ProfileBody extends StatelessWidget {
|
class _ProfileBody extends ConsumerWidget {
|
||||||
final User user;
|
final User user;
|
||||||
const _ProfileBody({required this.user});
|
const _ProfileBody({required this.user});
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context, WidgetRef ref) {
|
||||||
return ListView(
|
return ListView(
|
||||||
padding: const EdgeInsets.fromLTRB(16, 8, 16, 32),
|
padding: const EdgeInsets.fromLTRB(16, 8, 16, 32),
|
||||||
children: [
|
children: [
|
||||||
|
|||||||
@@ -17,6 +17,7 @@ class UpdateProfileRequest {
|
|||||||
final String? activity;
|
final String? activity;
|
||||||
final String? goal;
|
final String? goal;
|
||||||
final String? language;
|
final String? language;
|
||||||
|
final int? dailyCalories;
|
||||||
|
|
||||||
const UpdateProfileRequest({
|
const UpdateProfileRequest({
|
||||||
this.name,
|
this.name,
|
||||||
@@ -27,6 +28,7 @@ class UpdateProfileRequest {
|
|||||||
this.activity,
|
this.activity,
|
||||||
this.goal,
|
this.goal,
|
||||||
this.language,
|
this.language,
|
||||||
|
this.dailyCalories,
|
||||||
});
|
});
|
||||||
|
|
||||||
Map<String, dynamic> toJson() {
|
Map<String, dynamic> toJson() {
|
||||||
@@ -39,6 +41,7 @@ class UpdateProfileRequest {
|
|||||||
if (activity != null) map['activity'] = activity;
|
if (activity != null) map['activity'] = activity;
|
||||||
if (goal != null) map['goal'] = goal;
|
if (goal != null) map['goal'] = goal;
|
||||||
if (language != null) map['preferences'] = {'language': language};
|
if (language != null) map['preferences'] = {'language': language};
|
||||||
|
if (dailyCalories != null) map['daily_calories'] = dailyCalories;
|
||||||
return map;
|
return map;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -57,5 +57,6 @@ class User {
|
|||||||
}
|
}
|
||||||
|
|
||||||
bool get hasCompletedOnboarding =>
|
bool get hasCompletedOnboarding =>
|
||||||
heightCm != null && weightKg != null && dateOfBirth != null && gender != null;
|
heightCm != null && weightKg != null && dateOfBirth != null &&
|
||||||
|
gender != null && goal != null && activity != null;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -125,10 +125,10 @@ packages:
|
|||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: characters
|
name: characters
|
||||||
sha256: f71061c654a3380576a52b451dd5532377954cf9dbd272a78fc8479606670803
|
sha256: faf38497bda5ead2a8c7615f4f7939df04333478bf32e4173fcb06d428b5716b
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "1.4.0"
|
version: "1.4.1"
|
||||||
checked_yaml:
|
checked_yaml:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
@@ -668,26 +668,26 @@ packages:
|
|||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: matcher
|
name: matcher
|
||||||
sha256: dc58c723c3c24bf8d3e2d3ad3f2f9d7bd9cf43ec6feaa64181775e60190153f2
|
sha256: dc0b7dc7651697ea4ff3e69ef44b0407ea32c487a39fff6a4004fa585e901861
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "0.12.17"
|
version: "0.12.19"
|
||||||
material_color_utilities:
|
material_color_utilities:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: material_color_utilities
|
name: material_color_utilities
|
||||||
sha256: f7142bb1154231d7ea5f96bc7bde4bda2a0945d2806bb11670e30b850d56bdec
|
sha256: "9c337007e82b1889149c82ed242ed1cb24a66044e30979c44912381e9be4c48b"
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "0.11.1"
|
version: "0.13.0"
|
||||||
meta:
|
meta:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: meta
|
name: meta
|
||||||
sha256: e3641ec5d63ebf0d9b41bd43201a66e3fc79a65db5f61fc181f04cd27aab950c
|
sha256: "23f08335362185a5ea2ad3a4e597f1375e78bce8a040df5c600c8d3552ef2394"
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "1.16.0"
|
version: "1.17.0"
|
||||||
mime:
|
mime:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
@@ -993,10 +993,10 @@ packages:
|
|||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: test_api
|
name: test_api
|
||||||
sha256: "522f00f556e73044315fa4585ec3270f1808a4b186c936e612cab0b565ff1e00"
|
sha256: "8161c84903fd860b26bfdefb7963b3f0b68fee7adea0f59ef805ecca346f0c7a"
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "0.7.6"
|
version: "0.7.10"
|
||||||
typed_data:
|
typed_data:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
|
|||||||
Reference in New Issue
Block a user