diff --git a/lib/presentation/common/core/widgets/upload_file.dart b/lib/presentation/common/core/widgets/upload_file.dart index c73311c4..bb871346 100644 --- a/lib/presentation/common/core/widgets/upload_file.dart +++ b/lib/presentation/common/core/widgets/upload_file.dart @@ -4,6 +4,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_gen/gen_l10n/app_localizations.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:image_picker/image_picker.dart'; +import '../utils/ui_utils.dart'; import '../utils/color_utils.dart'; @@ -15,13 +16,18 @@ class UploadFileWidget extends HookConsumerWidget { /// The function to call after we chose the picture final Function callbackFunc; + final bool isUploading; + final _picker = ImagePicker(); /// Creates a [UploadFileWidget] widget. /// /// The [image] is the image to display. UploadFileWidget( - {super.key, required this.image, required this.callbackFunc}); + {super.key, + required this.image, + required this.callbackFunc, + required this.isUploading}); @override Widget build(BuildContext context, WidgetRef ref) { @@ -33,10 +39,14 @@ class UploadFileWidget extends HookConsumerWidget { width: 200, height: 200, color: ColorUtils.greyLight, - child: image != null - ? Image.memory(image!, fit: BoxFit.cover) - : Text( - AppLocalizations.of(context)!.profile_picture_select_please), + child: isUploading + ? Center( + child: UIUtils.loader, + ) + : image != null + ? Image.memory(image!, fit: BoxFit.cover) + : Text(AppLocalizations.of(context)! + .profile_picture_select_please), ), ), ElevatedButton( diff --git a/lib/presentation/settings/screens/edit_profile_screen.dart b/lib/presentation/settings/screens/edit_profile_screen.dart index df138f03..76c1e5d2 100644 --- a/lib/presentation/settings/screens/edit_profile_screen.dart +++ b/lib/presentation/settings/screens/edit_profile_screen.dart @@ -86,6 +86,8 @@ class EditProfileScreen extends HookConsumerWidget { const SizedBox(height: 10), UploadFileWidget( image: profilePicture, + isUploading: + state.isUploading, callbackFunc: provider .chooseNewProfilePicture), // Firstname TextFormField diff --git a/lib/presentation/settings/view_model/edit_profile_view_model.dart b/lib/presentation/settings/view_model/edit_profile_view_model.dart index 01129d3c..4df3808d 100644 --- a/lib/presentation/settings/view_model/edit_profile_view_model.dart +++ b/lib/presentation/settings/view_model/edit_profile_view_model.dart @@ -42,6 +42,7 @@ class EditProfileViewModel extends StateNotifier { } Future chooseNewProfilePicture(Uint8List image) async { + state = state.copyWith(isUploading: true); ref .read(userRepositoryProvider) .uploadProfilePicture(image) @@ -52,6 +53,7 @@ class EditProfileViewModel extends StateNotifier { .watch(profilePictureViewModelProvider(currentUser.id).notifier) .editProfilePicture(image); } + state = state.copyWith(isUploading: false); }); } diff --git a/lib/presentation/settings/view_model/state/edit_profile_state.dart b/lib/presentation/settings/view_model/state/edit_profile_state.dart index 07e65d10..431f7fd3 100644 --- a/lib/presentation/settings/view_model/state/edit_profile_state.dart +++ b/lib/presentation/settings/view_model/state/edit_profile_state.dart @@ -7,6 +7,7 @@ class EditProfileState { final Uint8List? profilePicture; final bool isEditing; final bool errorOnRequest; + final bool isUploading; /// Creates a new instance of [EditProfileState]. const EditProfileState( @@ -14,7 +15,8 @@ class EditProfileState { required this.lastname, required this.profilePicture, required this.isEditing, - required this.errorOnRequest}); + required this.errorOnRequest, + required this.isUploading}); /// Creates the initial state for the edit profile screen. factory EditProfileState.initial() { @@ -23,7 +25,8 @@ class EditProfileState { lastname: '', profilePicture: null, isEditing: false, - errorOnRequest: false); + errorOnRequest: false, + isUploading: false); } /// Creates a copy of this state object with the specified changes. @@ -32,12 +35,14 @@ class EditProfileState { String? lastname, Uint8List? profilePicture, bool? isEditing, - bool? errorOnRequest}) { + bool? errorOnRequest, + bool? isUploading}) { return EditProfileState( firstname: firstname ?? this.firstname, lastname: lastname ?? this.lastname, profilePicture: profilePicture ?? this.profilePicture, isEditing: isEditing ?? this.isEditing, - errorOnRequest: errorOnRequest ?? this.errorOnRequest); + errorOnRequest: errorOnRequest ?? this.errorOnRequest, + isUploading: isUploading ?? this.isUploading); } }