mirror of
https://github.com/cake-tech/cake_wallet.git
synced 2024-11-01 18:07:44 +00:00
468 lines
17 KiB
Dart
468 lines
17 KiB
Dart
import 'dart:ui';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:flutter_mobx/flutter_mobx.dart';
|
|
import 'package:mobx/mobx.dart';
|
|
import 'package:provider/provider.dart';
|
|
import 'package:cake_wallet/palette.dart';
|
|
import 'package:cake_wallet/routes.dart';
|
|
import 'package:cake_wallet/generated/i18n.dart';
|
|
import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
|
|
import 'package:cake_wallet/src/domain/exchange/exchange_provider.dart';
|
|
import 'package:cake_wallet/src/domain/exchange/exchange_provider_description.dart';
|
|
import 'package:cake_wallet/src/domain/exchange/xmrto/xmrto_exchange_provider.dart';
|
|
import 'package:cake_wallet/src/stores/exchange/exchange_trade_state.dart';
|
|
import 'package:cake_wallet/src/stores/exchange/limits_state.dart';
|
|
import 'package:cake_wallet/src/stores/wallet/wallet_store.dart';
|
|
import 'package:cake_wallet/src/stores/exchange/exchange_store.dart';
|
|
import 'package:cake_wallet/src/screens/base_page.dart';
|
|
import 'package:cake_wallet/src/screens/exchange/widgets/exchange_card.dart';
|
|
import 'package:cake_wallet/src/widgets/primary_button.dart';
|
|
import 'package:cake_wallet/src/widgets/picker.dart';
|
|
import 'package:cake_wallet/src/widgets/scollable_with_bottom_section.dart';
|
|
|
|
class ExchangePage extends BasePage {
|
|
@override
|
|
String get title => S.current.exchange;
|
|
|
|
@override
|
|
bool get isModalBackButton => true;
|
|
|
|
final Image arrowBottomPurple =
|
|
Image.asset('assets/images/arrow_bottom_purple_icon.png', height: 8);
|
|
|
|
@override
|
|
Widget middle(BuildContext context) {
|
|
final exchangeStore = Provider.of<ExchangeStore>(context);
|
|
|
|
return FlatButton(
|
|
onPressed: () => _presentProviderPicker(context),
|
|
highlightColor: Colors.transparent,
|
|
splashColor: Colors.transparent,
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: <Widget>[
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
Text(S.of(context).exchange,
|
|
style: TextStyle(
|
|
fontSize: 16.0,
|
|
fontWeight: FontWeight.w400,
|
|
color: Theme.of(context).primaryTextTheme.title.color)),
|
|
SizedBox(width: 5),
|
|
arrowBottomPurple
|
|
]),
|
|
Observer(
|
|
builder: (_) => Text('${exchangeStore.provider.title}',
|
|
style: TextStyle(
|
|
fontSize: 10.0,
|
|
fontWeight: FontWeight.w400,
|
|
color:
|
|
Theme.of(context).primaryTextTheme.headline.color)))
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
@override
|
|
Widget trailing(BuildContext context) {
|
|
final exchangeStore = Provider.of<ExchangeStore>(context);
|
|
|
|
return ButtonTheme(
|
|
minWidth: double.minPositive,
|
|
child: FlatButton(
|
|
padding: EdgeInsets.all(0),
|
|
child: Text(
|
|
S.of(context).clear,
|
|
style: TextStyle(
|
|
color: Theme.of(context).accentTextTheme.caption.color,
|
|
fontWeight: FontWeight.w500,
|
|
fontSize: 16),
|
|
),
|
|
onPressed: () => exchangeStore.reset()),
|
|
);
|
|
}
|
|
|
|
@override
|
|
Widget body(BuildContext context) => ExchangeForm();
|
|
|
|
void _presentProviderPicker(BuildContext context) {
|
|
final exchangeStore = Provider.of<ExchangeStore>(context);
|
|
final items = exchangeStore.providersForCurrentPair();
|
|
final selectedItem = items.indexOf(exchangeStore.provider);
|
|
|
|
showDialog<void>(
|
|
builder: (_) => Picker(
|
|
items: items,
|
|
selectedAtIndex: selectedItem,
|
|
title: S.of(context).change_exchange_provider,
|
|
onItemSelected: (ExchangeProvider provider) =>
|
|
exchangeStore.changeProvider(provider: provider)),
|
|
context: context);
|
|
}
|
|
}
|
|
|
|
class ExchangeForm extends StatefulWidget {
|
|
@override
|
|
State<StatefulWidget> createState() => ExchangeFormState();
|
|
}
|
|
|
|
class ExchangeFormState extends State<ExchangeForm> {
|
|
final depositKey = GlobalKey<ExchangeCardState>();
|
|
final receiveKey = GlobalKey<ExchangeCardState>();
|
|
final _formKey = GlobalKey<FormState>();
|
|
var _isReactionsSet = false;
|
|
|
|
final Image arrowBottomPurple = Image.asset(
|
|
'assets/images/arrow_bottom_purple_icon.png',
|
|
height: 8,
|
|
);
|
|
final Image arrowBottomCakeGreen = Image.asset(
|
|
'assets/images/arrow_bottom_cake_green.png',
|
|
height: 8,
|
|
);
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
final exchangeStore = Provider.of<ExchangeStore>(context);
|
|
final walletStore = Provider.of<WalletStore>(context);
|
|
|
|
final depositWalletName =
|
|
exchangeStore.depositCurrency == CryptoCurrency.xmr
|
|
? walletStore.name
|
|
: null;
|
|
final receiveWalletName =
|
|
exchangeStore.receiveCurrency == CryptoCurrency.xmr
|
|
? walletStore.name
|
|
: null;
|
|
|
|
WidgetsBinding.instance.addPostFrameCallback(
|
|
(_) => _setReactions(context, exchangeStore, walletStore));
|
|
|
|
return Form(
|
|
key: _formKey,
|
|
child: ScrollableWithBottomSection(
|
|
contentPadding: EdgeInsets.only(left: 20, right: 20),
|
|
content: SingleChildScrollView(
|
|
child: Column(
|
|
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
|
children: <Widget>[
|
|
Padding(
|
|
padding: EdgeInsets.only(top: 10, bottom: 20),
|
|
child: Text(
|
|
S.of(context).you_will_send,
|
|
style: TextStyle(
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 18,
|
|
height: 1.1,
|
|
color: Theme.of(context).primaryTextTheme.title.color),
|
|
),
|
|
),
|
|
ExchangeCard(
|
|
key: depositKey,
|
|
initialCurrency: exchangeStore.depositCurrency,
|
|
initialWalletName: depositWalletName,
|
|
initialAddress:
|
|
exchangeStore.depositCurrency == walletStore.type
|
|
? walletStore.address
|
|
: null,
|
|
initialIsAmountEditable: true,
|
|
initialIsAddressEditable: true,
|
|
isAmountEstimated: false,
|
|
currencies: CryptoCurrency.all,
|
|
onCurrencySelected: (currency) =>
|
|
exchangeStore.changeDepositCurrency(currency: currency),
|
|
imageArrow: arrowBottomPurple,
|
|
currencyValueValidator: (value) {
|
|
exchangeStore.validateCryptoCurrency(value);
|
|
return exchangeStore.errorMessage;
|
|
},
|
|
addressTextFieldValidator: (value) {
|
|
exchangeStore.validateAddress(value,
|
|
cryptoCurrency: exchangeStore.depositCurrency);
|
|
return exchangeStore.errorMessage;
|
|
},
|
|
),
|
|
SizedBox(height: 35),
|
|
Padding(
|
|
padding: EdgeInsets.only(bottom: 20),
|
|
child: Text(
|
|
S.of(context).you_will_get,
|
|
style: TextStyle(
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 18,
|
|
height: 1.1,
|
|
color:
|
|
Theme.of(context).primaryTextTheme.title.color),
|
|
)),
|
|
Observer(
|
|
builder: (_) => ExchangeCard(
|
|
key: receiveKey,
|
|
initialCurrency: exchangeStore.receiveCurrency,
|
|
initialWalletName: receiveWalletName,
|
|
initialAddress:
|
|
exchangeStore.receiveCurrency == walletStore.type
|
|
? walletStore.address
|
|
: null,
|
|
initialIsAmountEditable: false,
|
|
initialIsAddressEditable: true,
|
|
isAmountEstimated: true,
|
|
currencies: CryptoCurrency.all,
|
|
onCurrencySelected: (currency) => exchangeStore
|
|
.changeReceiveCurrency(currency: currency),
|
|
imageArrow: arrowBottomCakeGreen,
|
|
currencyValueValidator: (value) {
|
|
exchangeStore.validateCryptoCurrency(value);
|
|
return exchangeStore.errorMessage;
|
|
},
|
|
addressTextFieldValidator: (value) {
|
|
exchangeStore.validateAddress(value,
|
|
cryptoCurrency: exchangeStore.receiveCurrency);
|
|
return exchangeStore.errorMessage;
|
|
},
|
|
)),
|
|
],
|
|
),
|
|
),
|
|
bottomSectionPadding: EdgeInsets.only(top: 35, left: 20, right: 20),
|
|
bottomSection: Column(children: <Widget>[
|
|
Padding(
|
|
padding: EdgeInsets.only(bottom: 15),
|
|
child: Observer(builder: (_) {
|
|
final description =
|
|
exchangeStore.provider is XMRTOExchangeProvider
|
|
? S.of(context).amount_is_guaranteed
|
|
: S.of(context).amount_is_estimate;
|
|
return Center(
|
|
child: Text(
|
|
description,
|
|
style: TextStyle(color: Palette.blueGrey, fontSize: 12),
|
|
),
|
|
);
|
|
}),
|
|
),
|
|
Observer(
|
|
builder: (_) => LoadingPrimaryButton(
|
|
text: S.of(context).exchange,
|
|
onPressed: () {
|
|
if (_formKey.currentState.validate()) {
|
|
exchangeStore.createTrade();
|
|
}
|
|
},
|
|
color: Theme.of(context)
|
|
.primaryTextTheme
|
|
.button
|
|
.backgroundColor,
|
|
textColor: Theme.of(context).primaryTextTheme.button.color,
|
|
isLoading: exchangeStore.tradeState is TradeIsCreating,
|
|
)),
|
|
Observer(builder: (_) {
|
|
final title = exchangeStore.provider.description.title;
|
|
var imageSrc = '';
|
|
|
|
switch (exchangeStore.provider.description) {
|
|
case ExchangeProviderDescription.xmrto:
|
|
imageSrc = 'assets/images/xmr_btc.png';
|
|
break;
|
|
case ExchangeProviderDescription.changeNow:
|
|
imageSrc = 'assets/images/change_now.png';
|
|
break;
|
|
case ExchangeProviderDescription.morphToken:
|
|
imageSrc = 'assets/images/morph_icon.png';
|
|
break;
|
|
}
|
|
|
|
return Padding(
|
|
padding: EdgeInsets.only(top: 20, bottom: 20),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
children: <Widget>[
|
|
Image.asset(imageSrc),
|
|
SizedBox(width: 10),
|
|
Text(
|
|
S.of(context).powered_by(title),
|
|
style: TextStyle(fontSize: 14, color: Palette.powered),
|
|
)
|
|
],
|
|
),
|
|
);
|
|
})
|
|
]),
|
|
));
|
|
}
|
|
|
|
void _setReactions(
|
|
BuildContext context, ExchangeStore store, WalletStore walletStore) {
|
|
if (_isReactionsSet) {
|
|
return;
|
|
}
|
|
|
|
final depositAddressController = depositKey.currentState.addressController;
|
|
final depositAmountController = depositKey.currentState.amountController;
|
|
final receiveAddressController = receiveKey.currentState.addressController;
|
|
final receiveAmountController = receiveKey.currentState.amountController;
|
|
final limitsState = store.limitsState;
|
|
|
|
if (limitsState is LimitsLoadedSuccessfully) {
|
|
final min = limitsState.limits.min != null
|
|
? limitsState.limits.min.toString()
|
|
: null;
|
|
final max = limitsState.limits.max != null
|
|
? limitsState.limits.max.toString()
|
|
: null;
|
|
final key = depositKey;
|
|
key.currentState.changeLimits(min: min, max: max);
|
|
}
|
|
|
|
_onCurrencyChange(store.receiveCurrency, walletStore, receiveKey);
|
|
_onCurrencyChange(store.depositCurrency, walletStore, depositKey);
|
|
|
|
reaction(
|
|
(_) => walletStore.name,
|
|
(String _) => _onWalletNameChange(
|
|
walletStore, store.receiveCurrency, receiveKey));
|
|
|
|
reaction(
|
|
(_) => walletStore.name,
|
|
(String _) => _onWalletNameChange(
|
|
walletStore, store.depositCurrency, depositKey));
|
|
|
|
reaction(
|
|
(_) => store.receiveCurrency,
|
|
(CryptoCurrency currency) =>
|
|
_onCurrencyChange(currency, walletStore, receiveKey));
|
|
|
|
reaction(
|
|
(_) => store.depositCurrency,
|
|
(CryptoCurrency currency) =>
|
|
_onCurrencyChange(currency, walletStore, depositKey));
|
|
|
|
reaction((_) => store.depositAmount, (String amount) {
|
|
if (depositKey.currentState.amountController.text != amount) {
|
|
depositKey.currentState.amountController.text = amount;
|
|
}
|
|
});
|
|
|
|
reaction((_) => store.receiveAmount, (String amount) {
|
|
if (receiveKey.currentState.amountController.text !=
|
|
store.receiveAmount) {
|
|
receiveKey.currentState.amountController.text = amount;
|
|
}
|
|
});
|
|
|
|
reaction((_) => store.provider, (ExchangeProvider provider) {
|
|
receiveKey.currentState.isAddressEditable(isEditable: true);
|
|
receiveKey.currentState.isAmountEditable(isEditable: false);
|
|
depositKey.currentState.isAddressEditable(isEditable: true);
|
|
depositKey.currentState.isAmountEditable(isEditable: true);
|
|
|
|
receiveKey.currentState.changeIsAmountEstimated(true);
|
|
});
|
|
|
|
reaction((_) => store.tradeState, (ExchangeTradeState state) {
|
|
if (state is TradeIsCreatedFailure) {
|
|
WidgetsBinding.instance.addPostFrameCallback((_) {
|
|
showDialog<void>(
|
|
context: context,
|
|
builder: (BuildContext context) {
|
|
return AlertDialog(
|
|
title: Text(S.of(context).error),
|
|
content: Text(state.error),
|
|
actions: <Widget>[
|
|
FlatButton(
|
|
child: Text(S.of(context).ok),
|
|
onPressed: () => Navigator.of(context).pop())
|
|
],
|
|
);
|
|
});
|
|
});
|
|
}
|
|
if (state is TradeIsCreatedSuccessfully) {
|
|
Navigator.of(context)
|
|
.pushNamed(Routes.exchangeConfirm, arguments: state.trade);
|
|
}
|
|
});
|
|
|
|
reaction((_) => store.limitsState, (LimitsState state) {
|
|
String min;
|
|
String max;
|
|
|
|
if (state is LimitsLoadedSuccessfully) {
|
|
min = state.limits.min != null ? state.limits.min.toString() : null;
|
|
max = state.limits.max != null ? state.limits.max.toString() : null;
|
|
}
|
|
|
|
if (state is LimitsLoadedFailure) {
|
|
min = '0';
|
|
max = '0';
|
|
}
|
|
|
|
if (state is LimitsIsLoading) {
|
|
min = '...';
|
|
max = '...';
|
|
}
|
|
|
|
depositKey.currentState.changeLimits(min: min, max: max);
|
|
receiveKey.currentState.changeLimits(min: null, max: null);
|
|
});
|
|
|
|
depositAddressController.addListener(
|
|
() => store.depositAddress = depositAddressController.text);
|
|
|
|
depositAmountController.addListener(() {
|
|
if (depositAmountController.text != store.depositAmount) {
|
|
store.changeDepositAmount(amount: depositAmountController.text);
|
|
}
|
|
});
|
|
|
|
receiveAddressController.addListener(
|
|
() => store.receiveAddress = receiveAddressController.text);
|
|
|
|
receiveAmountController.addListener(() {
|
|
if (receiveAmountController.text != store.receiveAmount) {
|
|
store.changeReceiveAmount(amount: receiveAmountController.text);
|
|
}
|
|
});
|
|
|
|
reaction((_) => walletStore.address, (String address) {
|
|
if (store.depositCurrency == CryptoCurrency.xmr) {
|
|
depositKey.currentState.changeAddress(address: address);
|
|
}
|
|
|
|
if (store.receiveCurrency == CryptoCurrency.xmr) {
|
|
receiveKey.currentState.changeAddress(address: address);
|
|
}
|
|
});
|
|
|
|
_isReactionsSet = true;
|
|
}
|
|
|
|
void _onCurrencyChange(CryptoCurrency currency, WalletStore walletStore,
|
|
GlobalKey<ExchangeCardState> key) {
|
|
final isCurrentTypeWallet = currency == walletStore.type;
|
|
|
|
key.currentState.changeSelectedCurrency(currency);
|
|
key.currentState
|
|
.changeWalletName(isCurrentTypeWallet ? walletStore.name : null);
|
|
|
|
key.currentState
|
|
.changeAddress(address: isCurrentTypeWallet ? walletStore.address : '');
|
|
|
|
key.currentState.changeAmount(amount: '');
|
|
}
|
|
|
|
void _onWalletNameChange(WalletStore walletStore, CryptoCurrency currency,
|
|
GlobalKey<ExchangeCardState> key) {
|
|
final isCurrentTypeWallet = currency == walletStore.type;
|
|
|
|
if (isCurrentTypeWallet) {
|
|
key.currentState.changeWalletName(walletStore.name);
|
|
key.currentState.addressController.text = walletStore.address;
|
|
} else if (key.currentState.addressController.text == walletStore.address) {
|
|
key.currentState.changeWalletName(null);
|
|
key.currentState.addressController.text = null;
|
|
}
|
|
}
|
|
}
|