Flutter - app localization using intl translations for messages inside Cubit/ Bloc - flutter

Question

I am working on a multilingual app in Flutter.
I had no problem with implementing the localized strings in widgets/ screens following the official docs: https://flutter.dev/docs/development/accessibility-and-localization/internationalization.
But ... my app does a lot of calls to an API which are handled behind the scenes by appropriate Cubits and Repositories. For these calls and other deeper logic I would like to provide status messages in appropriate languages (e.g. for snackbars). The problem I face is that I cannot access localized strings inside the Cubits to provide messages to the state. Even if I try to pass the context to the Cubit it does not see them.
Anyone have an idea please? I would prefer following the official approach and not having to totally refactor the app ...
Thanks in anticipation!

Answer 1

Somebody helped me with this.
The solution is simple(ish).
You have to pass appLocalizations themselves into the Cubits. Here is my main.dart:
runApp(
MaterialApp(
localizationsDelegates: [
AppLocalizations.delegate,
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
GlobalCupertinoLocalizations.delegate,
],
supportedLocales: [
const Locale('en', ''),
const Locale('pl', ''),
],
title: 'MySuperApp',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.orange,
accentColor: Colors.deepOrangeAccent,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
initialRoute: '/',
routes: {
UserAuthScreen.routeName: (context) => const UserAuthScreen(),
HomePage.routeName: (context) => HomePage(),
...
},
builder: (context, child) {
final appLocalizations = AppLocalizations.of(context); //IMPORTANT
return MultiBlocProvider(
providers: [
BlocProvider<ConstantsCubit>(
lazy: true,
create: (context) => ConstantsCubit(
constantsRepository: ConstantsRepository(),
),
),
BlocProvider<UserAuthCubit>(
lazy: true,
create: (context) => UserAuthCubit(
localizations: appLocalizations, //THIS IS WHERE THE MAGIC HAPPENS
repository: UserAuthRepository(),
),
),
BlocProvider<DoerInfoCubit>(
lazy: true,
create: (context) => DoerInfoCubit(
doerInfoRepository: DoerInfoRepository(),
userAuthCubit: BlocProvider.of<UserAuthCubit>(context),
)),
...
],
child: child,
);
},
home:
BlocBuilder<UserAuthCubit, UserAuthState>(builder: (context, state) {
if (state is UserAuthLogged) {
return HomePage();
} else {
return const UserAuthScreen();
}
}),
),
);
The UserAuthCubit declaration looks like this:
class UserAuthCubit extends Cubit<UserAuthState> {
final UserAuthRepository repository;
final AppLocalizations localizations; //THIS IS WHERE THE MAGIC HAPPENS
UserAuthCubit({
#required this.repository,
#required this.localizations,
}) : super(const UserAuthInitial()) {
getUserAuthState();
}
IMPORTANT - to make sure the solutions works - AppLocalizatons have to be declared before the Cubits in the main.dart.
ALSO - the app adopts new localizations in the widgets straight away after language change. However with this setup I was not able to achieve this for Cubits. They need a restart of the app. In real life scenario this should not be a problem ... I guess.

Answer 2

It's easy to do with the easy_localization package. The only downside is code generation to be done on every string change. Otherwise it doesn't need a context to get a string, like so:
LocaleKeys.app_title.tr()
Check out the whole tutorial on how to setup and use EasyLocalization.