Update cake phone screens with null safety

This commit is contained in:
OmarHatem 2022-10-24 16:32:20 +02:00
parent b831165aca
commit a22234ad36
4 changed files with 213 additions and 94 deletions

View file

@ -513,7 +513,7 @@ Route<dynamic> createRoute(RouteSettings settings) {
settings: RouteSettings(name: Routes.phoneNumberProduct), settings: RouteSettings(name: Routes.phoneNumberProduct),
builder: (_) => PhoneNumberProductPage( builder: (_) => PhoneNumberProductPage(
getIt.get<PhonePlanViewModel>(), getIt.get<PhonePlanViewModel>(),
phoneNumberService: settings.arguments as PhoneNumberService, phoneNumberService: settings.arguments as PhoneNumberService?,
), ),
); );

View file

@ -10,13 +10,15 @@ import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:flutter_mobx/flutter_mobx.dart';
class AutoRenewSettingsPage extends BasePage { class AutoRenewSettingsPage extends BasePage {
AutoRenewSettingsPage({required this.phoneNumberService, required this.phonePlanViewModel}); AutoRenewSettingsPage(
{required this.phoneNumberService, required this.phonePlanViewModel});
final PhoneNumberService phoneNumberService; final PhoneNumberService phoneNumberService;
final PhonePlanViewModel phonePlanViewModel; final PhonePlanViewModel phonePlanViewModel;
@override @override
Widget body(BuildContext context) => AutoRenewSettingsBody(phoneNumberService, phonePlanViewModel); Widget body(BuildContext context) =>
AutoRenewSettingsBody(phoneNumberService, phonePlanViewModel);
@override @override
Widget middle(BuildContext context) { Widget middle(BuildContext context) {
@ -58,7 +60,10 @@ class AutoRenewSettingsBodyState extends State<AutoRenewSettingsBody> {
style: TextStyle( style: TextStyle(
fontSize: 20, fontSize: 20,
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
color: Theme.of(context).primaryTextTheme.headline6?.decorationColor, color: Theme.of(context)
.primaryTextTheme
.headline6
?.decorationColor,
fontFamily: 'Lato', fontFamily: 'Lato',
), ),
), ),
@ -84,11 +89,13 @@ class AutoRenewSettingsBodyState extends State<AutoRenewSettingsBody> {
.map((e) => PlanCard( .map((e) => PlanCard(
plan: e, plan: e,
onTap: () { onTap: () {
if (widget.phonePlanViewModel.selectedPlan != e) { if (widget.phonePlanViewModel.selectedPlan !=
e) {
widget.phonePlanViewModel.selectedPlan = e; widget.phonePlanViewModel.selectedPlan = e;
} }
}, },
isSelected: widget.phonePlanViewModel.selectedPlan == e, isSelected:
widget.phonePlanViewModel.selectedPlan == e,
)) ))
.toList(), .toList(),
), ),
@ -104,17 +111,23 @@ class AutoRenewSettingsBodyState extends State<AutoRenewSettingsBody> {
CakePhoneSettingsTile( CakePhoneSettingsTile(
title: S.of(context).free_sms_email_forward, title: S.of(context).free_sms_email_forward,
value: Observer(builder: (_) { value: Observer(builder: (_) {
return Text( if (widget.phonePlanViewModel.selectedPlan != null) {
"${widget.phonePlanViewModel.selectedPlan.quantity}, " + return Text(
"${S.of(context).then} " + "${widget.phonePlanViewModel.selectedPlan?.quantity}, " +
"\$${(widget.phonePlanViewModel.rateInCents / 100).toStringAsFixed(2)} " + "${S.of(context).then} " +
"${S.of(context).per_message}", "\$${(widget.phonePlanViewModel.rateInCents / 100).toStringAsFixed(2)} " +
style: TextStyle( "${S.of(context).per_message}",
fontSize: 16, style: TextStyle(
fontWeight: FontWeight.w700, fontSize: 16,
color: Theme.of(context).primaryTextTheme.headline6?.color, fontWeight: FontWeight.w700,
), color: Theme.of(context)
); .primaryTextTheme
.headline6
?.color,
),
);
}
return const SizedBox();
}), }),
), ),
CakePhoneSettingsTile( CakePhoneSettingsTile(
@ -124,7 +137,8 @@ class AutoRenewSettingsBodyState extends State<AutoRenewSettingsBody> {
style: TextStyle( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
color: Theme.of(context).primaryTextTheme.headline6?.color, color:
Theme.of(context).primaryTextTheme.headline6?.color,
), ),
), ),
), ),
@ -137,16 +151,14 @@ class AutoRenewSettingsBodyState extends State<AutoRenewSettingsBody> {
bottomSection: Column( bottomSection: Column(
children: <Widget>[ children: <Widget>[
PrimaryButton( PrimaryButton(
onPressed: () { onPressed: () {},
},
text: "${S.of(context).disable} ${S.of(context).auto_renew}", text: "${S.of(context).disable} ${S.of(context).auto_renew}",
color: Theme.of(context).accentTextTheme.caption?.backgroundColor, color: Theme.of(context).accentTextTheme.caption?.backgroundColor,
textColor: Theme.of(context).primaryTextTheme.headline6?.color, textColor: Theme.of(context).primaryTextTheme.headline6?.color,
), ),
const SizedBox(height: 8), const SizedBox(height: 8),
PrimaryButton( PrimaryButton(
onPressed: () { onPressed: () {},
},
text: "${S.of(context).update} ${S.of(context).auto_renew}", text: "${S.of(context).update} ${S.of(context).auto_renew}",
color: Theme.of(context).accentTextTheme.bodyText1?.color, color: Theme.of(context).accentTextTheme.bodyText1?.color,
textColor: Colors.white, textColor: Colors.white,

View file

@ -31,7 +31,8 @@ class PhoneNumberProductPage extends BasePage {
final PhoneNumberService? phoneNumberService; final PhoneNumberService? phoneNumberService;
@override @override
Widget body(BuildContext context) => PhoneNumberProductBody(phonePlanViewModel, phoneNumberService); Widget body(BuildContext context) =>
PhoneNumberProductBody(phonePlanViewModel, phoneNumberService);
@override @override
Widget middle(BuildContext context) { Widget middle(BuildContext context) {
@ -74,7 +75,10 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
style: TextStyle( style: TextStyle(
fontSize: 20, fontSize: 20,
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
color: Theme.of(context).primaryTextTheme.headline6?.decorationColor, color: Theme.of(context)
.primaryTextTheme
.headline6
?.decorationColor,
fontFamily: 'Lato', fontFamily: 'Lato',
), ),
), ),
@ -102,11 +106,13 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
.map((e) => PlanCard( .map((e) => PlanCard(
plan: e, plan: e,
onTap: () { onTap: () {
if (widget.phonePlanViewModel.selectedPlan != e) { if (widget.phonePlanViewModel.selectedPlan !=
e) {
widget.phonePlanViewModel.selectedPlan = e; widget.phonePlanViewModel.selectedPlan = e;
} }
}, },
isSelected: widget.phonePlanViewModel.selectedPlan == e, isSelected:
widget.phonePlanViewModel.selectedPlan == e,
)) ))
.toList(), .toList(),
), ),
@ -122,17 +128,24 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
CakePhoneSettingsTile( CakePhoneSettingsTile(
title: S.of(context).free_sms_email_forward, title: S.of(context).free_sms_email_forward,
value: Observer(builder: (_) { value: Observer(builder: (_) {
return Text( if (widget.phonePlanViewModel.selectedPlan != null) {
"${widget.phonePlanViewModel.selectedPlan.quantity}, " + return Text(
"${S.of(context).then} " + "${widget.phonePlanViewModel.selectedPlan!.quantity}, " +
"\$${(widget.phonePlanViewModel.rateInCents / 100).toStringAsFixed(2)} " + "${S.of(context).then} " +
"${S.of(context).per_message}", "\$${(widget.phonePlanViewModel.rateInCents / 100).toStringAsFixed(2)} " +
style: TextStyle( "${S.of(context).per_message}",
fontSize: 16, style: TextStyle(
fontWeight: FontWeight.w700, fontSize: 16,
color: Theme.of(context).primaryTextTheme.headline6?.color, fontWeight: FontWeight.w700,
), color: Theme.of(context)
); .primaryTextTheme
.headline6
?.color,
),
);
}
return const SizedBox();
}), }),
), ),
if (widget.phoneNumberService != null) if (widget.phoneNumberService != null)
@ -143,7 +156,10 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
style: TextStyle( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
color: Theme.of(context).primaryTextTheme.headline6?.color, color: Theme.of(context)
.primaryTextTheme
.headline6
?.color,
), ),
), ),
), ),
@ -154,8 +170,8 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
return Row( return Row(
children: [ children: [
Image.asset( Image.asset(
CountryPickerUtils.getFlagImageAssetPath( CountryPickerUtils.getFlagImageAssetPath(widget
widget.phonePlanViewModel.selectedCountry.isoCode), .phonePlanViewModel.selectedCountry.isoCode),
height: 20.0, height: 20.0,
width: 36.0, width: 36.0,
fit: BoxFit.fill, fit: BoxFit.fill,
@ -166,13 +182,18 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
children: [ children: [
Flexible( Flexible(
child: Padding( child: Padding(
padding: const EdgeInsets.only(left: 8, right: 6), padding: const EdgeInsets.only(
left: 8, right: 6),
child: Text( child: Text(
widget.phonePlanViewModel.selectedCountry.name, widget.phonePlanViewModel
.selectedCountry.name,
style: TextStyle( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
color: Theme.of(context).primaryTextTheme.headline6?.color, color: Theme.of(context)
.primaryTextTheme
.headline6
?.color,
), ),
), ),
), ),
@ -182,7 +203,10 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
style: TextStyle( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
color: Theme.of(context).primaryTextTheme.headline6?.color, color: Theme.of(context)
.primaryTextTheme
.headline6
?.color,
), ),
), ),
], ],
@ -190,7 +214,10 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
), ),
Icon( Icon(
Icons.arrow_forward_ios, Icons.arrow_forward_ios,
color: Theme.of(context).primaryTextTheme.headline6?.color, color: Theme.of(context)
.primaryTextTheme
.headline6
?.color,
size: 16, size: 16,
), ),
], ],
@ -205,14 +232,17 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
final Country _country = country as Country; final Country _country = country as Country;
return "${_country.name} (+${_country.phoneCode})"; return "${_country.name} (+${_country.phoneCode})";
}, },
selectedAtIndex: countryList.indexOf(widget.phonePlanViewModel.selectedCountry), selectedAtIndex: countryList.indexOf(
widget.phonePlanViewModel.selectedCountry),
mainAxisAlignment: MainAxisAlignment.start, mainAxisAlignment: MainAxisAlignment.start,
onItemSelected: (Country country) { onItemSelected: (Country country) {
widget.phonePlanViewModel.selectedCountry = country; widget.phonePlanViewModel.selectedCountry =
country;
}, },
images: countryList images: countryList
.map((e) => Image.asset( .map((e) => Image.asset(
CountryPickerUtils.getFlagImageAssetPath(e.isoCode), CountryPickerUtils.getFlagImageAssetPath(
e.isoCode),
height: 20.0, height: 20.0,
width: 36.0, width: 36.0,
fit: BoxFit.fill, fit: BoxFit.fill,
@ -221,13 +251,20 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
.toList(), .toList(),
isSeparated: false, isSeparated: false,
hintText: S.of(context).search_country, hintText: S.of(context).search_country,
matchingCriteria: (dynamic country, String searchText) { matchingCriteria:
(dynamic country, String searchText) {
final Country _country = country as Country; final Country _country = country as Country;
searchText = searchText.toLowerCase(); searchText = searchText.toLowerCase();
return _country.name.toLowerCase().contains(searchText) || return _country.name
.toLowerCase()
.contains(searchText) ||
_country.phoneCode.contains(searchText) || _country.phoneCode.contains(searchText) ||
_country.isoCode.toLowerCase().contains(searchText) || _country.isoCode
_country.iso3Code.toLowerCase().contains(searchText); .toLowerCase()
.contains(searchText) ||
_country.iso3Code
.toLowerCase()
.contains(searchText);
}, },
), ),
); );
@ -240,35 +277,48 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
Text( Text(
S.of(context).additional_sms_messages, S.of(context).additional_sms_messages,
style: TextStyle( style: TextStyle(
color: Theme.of(context).accentTextTheme.subtitle1?.color, color: Theme.of(context)
.accentTextTheme
.subtitle1
?.color,
), ),
), ),
Container( Container(
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(30), borderRadius: BorderRadius.circular(30),
color: Theme.of(context).primaryTextTheme.displayMedium?.decorationColor, color: Theme.of(context)
.primaryTextTheme
.displayMedium
?.decorationColor,
), ),
child: Row( child: Row(
children: [ children: [
GestureDetector( GestureDetector(
onTap: () => widget.phonePlanViewModel.removeAdditionalSms(), onTap: () => widget.phonePlanViewModel
.removeAdditionalSms(),
child: quantityIcon(Icons.remove), child: quantityIcon(Icons.remove),
), ),
Padding( Padding(
padding: const EdgeInsets.symmetric(horizontal: 16), padding:
const EdgeInsets.symmetric(horizontal: 16),
child: Observer(builder: (_) { child: Observer(builder: (_) {
return Text( return Text(
widget.phonePlanViewModel.additionalSms.toString(), widget.phonePlanViewModel.additionalSms
.toString(),
style: TextStyle( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
color: Theme.of(context).primaryTextTheme.headline6?.color, color: Theme.of(context)
.primaryTextTheme
.headline6
?.color,
), ),
); );
}), }),
), ),
GestureDetector( GestureDetector(
onTap: () => widget.phonePlanViewModel.addAdditionalSms(), onTap: () =>
widget.phonePlanViewModel.addAdditionalSms(),
child: quantityIcon(Icons.add), child: quantityIcon(Icons.add),
), ),
], ],
@ -293,7 +343,8 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
text: "\$${widget.phonePlanViewModel.totalPrice}", text: "\$${widget.phonePlanViewModel.totalPrice}",
style: TextStyle( style: TextStyle(
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
color: Theme.of(context).primaryTextTheme.headline6?.color, color:
Theme.of(context).primaryTextTheme.headline6?.color,
), ),
), ),
], ],
@ -313,21 +364,34 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
builder: (dialogContext) { builder: (dialogContext) {
return AlertWithTwoActions( return AlertWithTwoActions(
alertTitle: S.of(context).confirm_payment, alertTitle: S.of(context).confirm_payment,
alertTitleColor: Theme.of(context).primaryTextTheme.headline6?.decorationColor, alertTitleColor: Theme.of(context)
.primaryTextTheme
.headline6
?.decorationColor,
alertContent: S.of(context).confirm_delete_template, alertContent: S.of(context).confirm_delete_template,
contentWidget: Column( contentWidget: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
ReceiptRow( ReceiptRow(
title: S.of(context).amount, value: amountText(widget.phonePlanViewModel.totalPrice)), title: S.of(context).amount,
ReceiptRow(title: "${S.of(context).cake_pay_balance}: ", value: amountText(100)), value: amountText(
widget.phonePlanViewModel.totalPrice)),
ReceiptRow(
title: "${S.of(context).cake_pay_balance}: ",
value: amountText(100)),
], ],
), ),
isDividerExists: true, isDividerExists: true,
rightButtonText: S.of(context).ok, rightButtonText: S.of(context).ok,
leftButtonText: S.of(context).cancel, leftButtonText: S.of(context).cancel,
rightActionButtonColor: Theme.of(context).accentTextTheme.bodyText1?.color, rightActionButtonColor: Theme.of(context)
leftActionButtonColor: Theme.of(context).primaryTextTheme.bodyText1?.backgroundColor, .accentTextTheme
.bodyText1
?.color,
leftActionButtonColor: Theme.of(context)
.primaryTextTheme
.bodyText1
?.backgroundColor,
actionRightButton: () { actionRightButton: () {
Navigator.of(dialogContext).pop(); Navigator.of(dialogContext).pop();
Navigator.pushNamedAndRemoveUntil( Navigator.pushNamedAndRemoveUntil(
@ -336,10 +400,12 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
ModalRoute.withName(Routes.cakePhoneWelcome), ModalRoute.withName(Routes.cakePhoneWelcome),
); );
}, },
actionLeftButton: () => Navigator.of(dialogContext).pop()); actionLeftButton: () =>
Navigator.of(dialogContext).pop());
}); });
}, },
text: "${S.of(context).pay_with} ${S.of(context).cake_pay_balance}", text:
"${S.of(context).pay_with} ${S.of(context).cake_pay_balance}",
color: Theme.of(context).accentTextTheme.caption?.backgroundColor, color: Theme.of(context).accentTextTheme.caption?.backgroundColor,
textColor: Theme.of(context).primaryTextTheme.headline6?.color, textColor: Theme.of(context).primaryTextTheme.headline6?.color,
), ),
@ -351,14 +417,18 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
builder: (dialogContext) { builder: (dialogContext) {
return AlertWithTwoActions( return AlertWithTwoActions(
alertTitle: S.of(context).confirm_sending, alertTitle: S.of(context).confirm_sending,
alertTitleColor: Theme.of(context).primaryTextTheme.headline6?.decorationColor, alertTitleColor: Theme.of(context)
.primaryTextTheme
.headline6
?.decorationColor,
alertContent: S.of(context).confirm_delete_template, alertContent: S.of(context).confirm_delete_template,
contentWidget: Column( contentWidget: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
ReceiptRow( ReceiptRow(
title: S.of(context).amount, title: S.of(context).amount,
value: cryptoAmount(widget.phonePlanViewModel.totalPrice), value: cryptoAmount(
widget.phonePlanViewModel.totalPrice),
), ),
ReceiptRow( ReceiptRow(
title: S.of(context).send_fee, title: S.of(context).send_fee,
@ -366,8 +436,13 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
.get<AppStore>() .get<AppStore>()
.wallet! .wallet!
.calculateEstimatedFee( .calculateEstimatedFee(
getIt.get<AppStore>().settingsStore.priority[getIt.get<AppStore>().wallet!.type]!, getIt
widget.phonePlanViewModel.totalPrice.floor(), .get<AppStore>()
.settingsStore
.priority[
getIt.get<AppStore>().wallet!.type]!,
widget.phonePlanViewModel.totalPrice
.floor(),
) )
.toDouble()), .toDouble()),
), ),
@ -377,7 +452,10 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
style: TextStyle( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: Theme.of(context).primaryTextTheme.headline6?.color, color: Theme.of(context)
.primaryTextTheme
.headline6
?.color,
), ),
), ),
const SizedBox(height: 16), const SizedBox(height: 16),
@ -387,7 +465,10 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
style: TextStyle( style: TextStyle(
fontSize: 10, fontSize: 10,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: Theme.of(context).accentTextTheme.subtitle1?.color, color: Theme.of(context)
.accentTextTheme
.subtitle1
?.color,
), ),
textAlign: TextAlign.center, textAlign: TextAlign.center,
), ),
@ -396,16 +477,24 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
isDividerExists: true, isDividerExists: true,
rightButtonText: S.of(context).ok, rightButtonText: S.of(context).ok,
leftButtonText: S.of(context).cancel, leftButtonText: S.of(context).cancel,
rightActionButtonColor: Theme.of(context).accentTextTheme.bodyText1?.color, rightActionButtonColor: Theme.of(context)
leftActionButtonColor: Theme.of(context).primaryTextTheme.bodyText1?.backgroundColor, .accentTextTheme
.bodyText1
?.color,
leftActionButtonColor: Theme.of(context)
.primaryTextTheme
.bodyText1
?.backgroundColor,
actionRightButton: () { actionRightButton: () {
Navigator.of(dialogContext).pop(); Navigator.of(dialogContext).pop();
showPaymentConfirmationPopup(); showPaymentConfirmationPopup();
}, },
actionLeftButton: () => Navigator.of(dialogContext).pop()); actionLeftButton: () =>
Navigator.of(dialogContext).pop());
}); });
}, },
text: "${S.of(context).pay_with} ${getIt.get<AppStore>().wallet!.currency.toString()}", text:
"${S.of(context).pay_with} ${getIt.get<AppStore>().wallet!.currency.toString()}",
color: Theme.of(context).accentTextTheme.bodyText1?.color, color: Theme.of(context).accentTextTheme.bodyText1?.color,
textColor: Colors.white, textColor: Colors.white,
), ),
@ -504,7 +593,8 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
builder: (dialogContext) { builder: (dialogContext) {
return InfoAlertDialog( return InfoAlertDialog(
alertTitle: S.of(context).awaiting_payment_confirmation, alertTitle: S.of(context).awaiting_payment_confirmation,
alertTitleColor: Theme.of(context).primaryTextTheme.headline6?.decorationColor, alertTitleColor:
Theme.of(context).primaryTextTheme.headline6?.decorationColor,
alertContentPadding: EdgeInsets.zero, alertContentPadding: EdgeInsets.zero,
alertContent: Padding( alertContent: Padding(
padding: const EdgeInsets.only(top: 8, bottom: 32), padding: const EdgeInsets.only(top: 8, bottom: 32),
@ -517,7 +607,8 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
style: TextStyle( style: TextStyle(
fontSize: 16, fontSize: 16,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: Theme.of(context).primaryTextTheme.headline6?.color, color:
Theme.of(context).primaryTextTheme.headline6?.color,
), ),
), ),
), ),
@ -538,7 +629,10 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
style: TextStyle( style: TextStyle(
fontSize: 12, fontSize: 12,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: Theme.of(context).accentTextTheme.subtitle1?.color, color: Theme.of(context)
.accentTextTheme
.subtitle1
?.color,
), ),
), ),
Padding( Padding(
@ -549,7 +643,10 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
style: TextStyle( style: TextStyle(
fontSize: 12, fontSize: 12,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: Theme.of(context).primaryTextTheme.headline6?.color, color: Theme.of(context)
.primaryTextTheme
.headline6
?.color,
), ),
), ),
), ),
@ -558,7 +655,10 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
style: TextStyle( style: TextStyle(
fontSize: 12, fontSize: 12,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: Theme.of(context).accentTextTheme.subtitle1?.color, color: Theme.of(context)
.accentTextTheme
.subtitle1
?.color,
), ),
), ),
Padding( Padding(
@ -569,7 +669,10 @@ class PhoneNumberProductBodyState extends State<PhoneNumberProductBody> {
style: TextStyle( style: TextStyle(
fontSize: 12, fontSize: 12,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
color: Theme.of(context).primaryTextTheme.headline6?.color, color: Theme.of(context)
.primaryTextTheme
.headline6
?.color,
), ),
), ),
), ),

View file

@ -8,41 +8,45 @@ part 'phone_plan_view_model.g.dart';
class PhonePlanViewModel = PhonePlanViewModelBase with _$PhonePlanViewModel; class PhonePlanViewModel = PhonePlanViewModelBase with _$PhonePlanViewModel;
abstract class PhonePlanViewModelBase with Store { abstract class PhonePlanViewModelBase with Store {
PhonePlanViewModelBase({this.selectedPlan}) : this.additionalSms = 0 { PhonePlanViewModelBase({this.selectedPlan})
: this.additionalSms = 0,
this.rateInCents = 0,
this.selectedCountry =
countryList.firstWhere((element) => element.iso3Code == "USA"),
this.servicePlans = ObservableList<ServicePlan>.of([]) {
rateInCents = 20; // TODO: get from api rateInCents = 20; // TODO: get from api
servicePlans = [ servicePlans = ObservableList<ServicePlan>.of([
ServicePlan(id: "1", duration: 1, price: 20, quantity: 30), ServicePlan(id: "1", duration: 1, price: 20, quantity: 30),
ServicePlan(id: "2", duration: 3, price: 10, quantity: 60), ServicePlan(id: "2", duration: 3, price: 10, quantity: 60),
ServicePlan(id: "3", duration: 6, price: 9, quantity: 120), ServicePlan(id: "3", duration: 6, price: 9, quantity: 120),
ServicePlan(id: "4", duration: 12, price: 5, quantity: 200), ServicePlan(id: "4", duration: 12, price: 5, quantity: 200),
ServicePlan(id: "5", duration: 24, price: 2, quantity: 400), ServicePlan(id: "5", duration: 24, price: 2, quantity: 400),
]; ]);
// TODO: servicePlans = _getServicesFromApi // TODO: servicePlans = _getServicesFromApi
selectedPlan ??= servicePlans!.first; selectedPlan ??= servicePlans.first;
selectedCountry = countryList.firstWhere((element) => element.iso3Code == "USA");
} }
@observable @observable
ServicePlan? selectedPlan; ServicePlan? selectedPlan;
@observable @observable
Country? selectedCountry; Country selectedCountry;
@observable @observable
List<ServicePlan>? servicePlans; ObservableList<ServicePlan> servicePlans;
@observable @observable
int additionalSms; int additionalSms;
@observable @observable
int? rateInCents; int rateInCents;
@computed @computed
double get totalPrice => (selectedPlan?.price ?? 0) double get totalPrice =>
+ (additionalSms * ((rateInCents ?? 0) / 100)).toDouble(); (selectedPlan?.price ?? 0) +
(additionalSms * (rateInCents / 100)).toDouble();
@action @action
void addAdditionalSms() => additionalSms++; void addAdditionalSms() => additionalSms++;