CWA-212 | created currency picker and provider picker; moved template tile to widgets directory; created exchange template page

lib/src/screens/exchange/exchange_page.dart

@@ -19,9 +19,9 @@ 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';
 import 'package:cake_wallet/src/widgets/top_panel.dart';
+import 'package:cake_wallet/src/screens/exchange/widgets/provider_picker.dart';
 
 class ExchangePage extends BasePage {
   @override
@@ -102,7 +102,7 @@ class ExchangePage extends BasePage {
     final selectedItem = items.indexOf(exchangeStore.provider);
 
     showDialog<void>(
-        builder: (_) => Picker(
+        builder: (_) => ProviderPicker(
             items: items,
             selectedAtIndex: selectedItem,
             title: S.of(context).change_exchange_provider,
@@ -184,6 +184,7 @@ class ExchangeFormState extends State<ExchangeForm> {
                                     exchangeStore.changeDepositCurrency(currency: currency),
                                 imageArrow: arrowBottomPurple,
                                 currencyButtonColor: PaletteDark.walletCardSubAddressField,
+                                addressButtonsColor: PaletteDark.menuList,
                                 currencyValueValidator: (value) {
                                   exchangeStore.validateCryptoCurrency(value);
                                   return exchangeStore.errorMessage;

lib/src/screens/exchange/exchange_template_page.dart

@@ -0,0 +1,104 @@
+import 'dart:ui';
+import 'package:dotted_border/dotted_border.dart';
+import 'package:flutter/cupertino.dart';
+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/scollable_with_bottom_section.dart';
+import 'package:cake_wallet/src/widgets/top_panel.dart';
+import 'package:cake_wallet/src/screens/exchange/widgets/provider_picker.dart';
+
+class ExchangeTemplatePage extends BasePage {
+  @override
+  String get title => 'New template';
+
+  @override
+  Color get backgroundColor => PaletteDark.walletCardSubAddressField;
+
+  final Image arrowBottom =
+  Image.asset('assets/images/arrow_bottom_purple_icon.png', color: Colors.white, height: 8);
+
+  @override
+  Widget trailing(BuildContext context) {
+    final exchangeStore = Provider.of<ExchangeStore>(context);
+
+    return FlatButton(
+        onPressed: () => _presentProviderPicker(context),
+        highlightColor: Colors.transparent,
+        splashColor: Colors.transparent,
+        child: Row(
+          mainAxisSize: MainAxisSize.min,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: <Widget>[
+            Column(
+              crossAxisAlignment: CrossAxisAlignment.center,
+              mainAxisSize: MainAxisSize.min,
+              children: <Widget>[
+                Text(S.of(context).exchange,
+                    style: TextStyle(
+                        fontSize: 16.0,
+                        fontWeight: FontWeight.w400,
+                        color: Colors.white)),
+                Observer(
+                    builder: (_) => Text('${exchangeStore.provider.title}',
+                        style: TextStyle(
+                            fontSize: 10.0,
+                            fontWeight: FontWeight.w400,
+                            color:PaletteDark.walletCardText)))
+              ],
+            ),
+            SizedBox(width: 5),
+            Padding(
+              padding: EdgeInsets.only(top: 8),
+              child: arrowBottom,
+            )
+          ],
+        )
+    );
+  }
+
+  void _presentProviderPicker(BuildContext context) {
+    final exchangeStore = Provider.of<ExchangeStore>(context);
+    final items = exchangeStore.providersForCurrentPair();
+    final selectedItem = items.indexOf(exchangeStore.provider);
+
+    showDialog<void>(
+        builder: (_) => ProviderPicker(
+            items: items,
+            selectedAtIndex: selectedItem,
+            title: S.of(context).change_exchange_provider,
+            onItemSelected: (ExchangeProvider provider) =>
+                exchangeStore.changeProvider(provider: provider)),
+        context: context);
+  }
+
+  @override
+  Widget body(BuildContext context) => ExchangeTemplateForm();
+}
+
+class ExchangeTemplateForm extends StatefulWidget{
+  @override
+  ExchangeTemplateFormState createState() => ExchangeTemplateFormState();
+}
+
+class ExchangeTemplateFormState extends State<ExchangeTemplateForm> {
+  @override
+  Widget build(BuildContext context) {
+    return Container();
+  }
+}

lib/src/screens/exchange/widgets/currency_picker.dart

@@ -0,0 +1,119 @@
+import 'dart:ui';
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:cake_wallet/palette.dart';
+import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
+
+class CurrencyPicker extends StatelessWidget {
+  CurrencyPicker({
+    @required this.selectedAtIndex,
+    @required this.items,
+    @required this.title,
+    @required this.onItemSelected,
+  });
+
+  final int selectedAtIndex;
+  final List<CryptoCurrency> items;
+  final String title;
+  final Function(CryptoCurrency) onItemSelected;
+
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(
+      onTap: () => Navigator.of(context).pop(),
+      child: Container(
+        color: Colors.transparent,
+        child: BackdropFilter(
+          filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
+          child: Container(
+            decoration: BoxDecoration(color: PaletteDark.historyPanel.withOpacity(0.75)),
+            child: Center(
+              child: Column(
+                mainAxisSize: MainAxisSize.min,
+                children: <Widget>[
+                  Container(
+                    padding: EdgeInsets.only(left: 24, right: 24),
+                    child: Text(
+                      title,
+                      textAlign: TextAlign.center,
+                      style: TextStyle(
+                          fontSize: 18,
+                          fontWeight: FontWeight.bold,
+                          decoration: TextDecoration.none,
+                          color: Colors.white
+                      ),
+                    ),
+                  ),
+                  Padding(
+                    padding: EdgeInsets.only(top: 24),
+                    child: GestureDetector(
+                      onTap: () => null,
+                      child: ClipRRect(
+                        borderRadius: BorderRadius.all(Radius.circular(14)),
+                        child: Container(
+                          height: 400,
+                          width: 300,
+                          color: PaletteDark.walletCardSubAddressField,
+                          child: GridView.count(
+                              shrinkWrap: true,
+                              crossAxisCount: 3,
+                              childAspectRatio: 1.25,
+                              physics: const NeverScrollableScrollPhysics(),
+                              crossAxisSpacing: 1,
+                              mainAxisSpacing: 1,
+                              children: List.generate(15, (index) {
+
+                                if (index == 14) {
+                                  return Container(
+                                    color: PaletteDark.menuList,
+                                  );
+                                }
+
+                                final item = items[index];
+                                final isItemSelected = index == selectedAtIndex;
+
+                                final color = isItemSelected
+                                    ? PaletteDark.historyPanel
+                                    : PaletteDark.menuList;
+                                final textColor = isItemSelected
+                                    ? Colors.blue
+                                    : Colors.white;
+
+                                return GestureDetector(
+                                  onTap: () {
+                                    if (onItemSelected == null) {
+                                      return;
+                                    }
+                                    Navigator.of(context).pop();
+                                    onItemSelected(item);
+                                  },
+                                  child: Container(
+                                    color: color,
+                                    child: Center(
+                                      child: Text(
+                                        item.toString(),
+                                        style: TextStyle(
+                                            fontSize: 18,
+                                            fontWeight: FontWeight.bold,
+                                            decoration: TextDecoration.none,
+                                            color: textColor
+                                        ),
+                                      ),
+                                    ),
+                                  ),
+                                );
+                              })
+                          ),
+                        ),
+                      ),
+                    ),
+                  )
+                ],
+              ),
+            )
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/src/screens/exchange/widgets/exchange_card.dart

@@ -3,9 +3,9 @@ import 'package:flutter/material.dart';
 import 'package:cake_wallet/palette.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/src/domain/common/crypto_currency.dart';
-import 'package:cake_wallet/src/widgets/picker.dart';
 import 'package:cake_wallet/src/widgets/address_text_field.dart';
 import 'package:cake_wallet/src/widgets/base_text_form_field.dart';
+import 'package:cake_wallet/src/screens/exchange/widgets/currency_picker.dart';
 
 class ExchangeCard extends StatefulWidget {
   ExchangeCard(
@@ -21,6 +21,7 @@ class ExchangeCard extends StatefulWidget {
       this.onCurrencySelected,
       this.imageArrow,
       this.currencyButtonColor = Colors.transparent,
+      this.addressButtonsColor = PaletteDark.walletCardSubAddressField,
       this.currencyValueValidator,
       this.addressTextFieldValidator})
       : super(key: key);
@@ -36,6 +37,7 @@ class ExchangeCard extends StatefulWidget {
   final bool isAmountEstimated;
   final Image imageArrow;
   final Color currencyButtonColor;
+  final Color addressButtonsColor;
   final FormFieldValidator<String> currencyValueValidator;
   final FormFieldValidator<String> addressTextFieldValidator;
 
@@ -216,6 +218,7 @@ class ExchangeCardState extends State<ExchangeCard> {
             ]
             : [],
             isBorderExist: false,
+            buttonColor: widget.addressButtonsColor,
             validator: widget.addressTextFieldValidator,
           ),
         )
@@ -352,9 +355,9 @@ class ExchangeCardState extends State<ExchangeCard> {
 
   void _presentPicker(BuildContext context) {
     showDialog<void>(
-        builder: (_) => Picker(
+        builder: (_) => CurrencyPicker(
-            items: widget.currencies,
             selectedAtIndex: widget.currencies.indexOf(_selectedCurrency),
+            items: widget.currencies,
             title: S.of(context).change_currency,
             onItemSelected: (CryptoCurrency item) =>
             widget.onCurrencySelected != null

lib/src/screens/exchange/widgets/provider_picker.dart

@@ -0,0 +1,111 @@
+import 'dart:ui';
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:cake_wallet/palette.dart';
+import 'package:cake_wallet/src/domain/exchange/exchange_provider.dart';
+
+class ProviderPicker extends StatelessWidget {
+  ProviderPicker({
+    @required this.selectedAtIndex,
+    @required this.items,
+    @required this.title,
+    @required this.onItemSelected,
+  });
+
+  final int selectedAtIndex;
+  final List<ExchangeProvider> items;
+  final String title;
+  final Function(ExchangeProvider) onItemSelected;
+
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(
+      onTap: () => Navigator.of(context).pop(),
+      child: Container(
+        color: Colors.transparent,
+        child: BackdropFilter(
+          filter: ImageFilter.blur(sigmaX: 3.0, sigmaY: 3.0),
+          child: Container(
+              decoration: BoxDecoration(color: PaletteDark.historyPanel.withOpacity(0.75)),
+              child: Center(
+                child: Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: <Widget>[
+                    Container(
+                      padding: EdgeInsets.only(left: 24, right: 24),
+                      child: Text(
+                        title,
+                        textAlign: TextAlign.center,
+                        style: TextStyle(
+                            fontSize: 18,
+                            fontWeight: FontWeight.bold,
+                            decoration: TextDecoration.none,
+                            color: Colors.white
+                        ),
+                      ),
+                    ),
+                    Padding(
+                      padding: EdgeInsets.only(left: 24, right: 24, top: 24),
+                      child: GestureDetector(
+                        onTap: () => null,
+                        child: ClipRRect(
+                          borderRadius: BorderRadius.all(Radius.circular(14)),
+                          child: Container(
+                            height: 233,
+                            color: PaletteDark.menuList,
+                            child: ListView.separated(
+                              separatorBuilder: (context, index) => Divider(
+                                color: PaletteDark.mainBackgroundColor,
+                                height: 1,
+                              ),
+                              itemCount: items == null ? 0 : items.length,
+                              itemBuilder: (context, index) {
+                                final item = items[index];
+                                final isItemSelected = index == selectedAtIndex;
+
+                                final color = isItemSelected
+                                    ? PaletteDark.menuHeader
+                                    : Colors.transparent;
+                                final textColor = isItemSelected
+                                    ? Colors.blue
+                                    : Colors.white;
+
+                                return GestureDetector(
+                                  onTap: () {
+                                    if (onItemSelected == null) {
+                                      return;
+                                    }
+                                    Navigator.of(context).pop();
+                                    onItemSelected(item);
+                                  },
+                                  child: Container(
+                                    height: 77,
+                                    padding: EdgeInsets.only(left: 24, right: 24),
+                                    alignment: Alignment.center,
+                                    color: color,
+                                    child: Text(
+                                      item.toString(),
+                                      style: TextStyle(
+                                        fontSize: 18,
+                                        fontWeight: FontWeight.bold,
+                                        color: textColor,
+                                        decoration: TextDecoration.none,
+                                      ),
+                                    ),
+                                  ),
+                                );
+                              },
+                            )
+                          ),
+                        ),
+                      ),
+                    )
+                  ],
+                ),
+              )
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/src/screens/send/send_page.dart

@@ -27,7 +27,7 @@ import 'package:cake_wallet/src/widgets/alert_with_one_action.dart';
 import 'package:cake_wallet/src/widgets/alert_with_two_actions.dart';
 import 'package:cake_wallet/src/screens/send/widgets/confirm_sending_alert.dart';
 import 'package:cake_wallet/src/screens/send/widgets/sending_alert.dart';
-import 'package:cake_wallet/src/screens/send/widgets/template_tile.dart';
+import 'package:cake_wallet/src/widgets/template_tile.dart';
 import 'package:cake_wallet/src/stores/send_template/send_template_store.dart';
 
 class SendPage extends BasePage {
@@ -394,9 +394,9 @@ class SendFormState extends State<SendForm> {
                         final template = sendTemplateStore.templates[index];
 
                         return TemplateTile(
-                            name: template.name,
+                            to: template.name,
                             amount: template.amount,
-                            cryptoCurrency: template.cryptoCurrency,
+                            from: template.cryptoCurrency,
                             onTap: () {
                               _addressController.text = template.address;
                               _cryptoAmountController.text = template.amount;

lib/src/widgets/address_text_field.dart

@@ -20,6 +20,7 @@ class AddressTextField extends StatelessWidget {
       this.onURIScanned,
       this.focusNode,
       this.isBorderExist = true,
+      this.buttonColor = PaletteDark.walletCardSubAddressField,
       this.validator});
 
   static const prefixIconWidth = 34.0;
@@ -33,6 +34,7 @@ class AddressTextField extends StatelessWidget {
   final List<AddressTextFieldOption> options;
   final FormFieldValidator<String> validator;
   final bool isBorderExist;
+  final Color buttonColor;
   FocusNode focusNode;
 
   @override
@@ -64,7 +66,7 @@ class AddressTextField extends StatelessWidget {
                       child: Container(
                           padding: EdgeInsets.all(8),
                           decoration: BoxDecoration(
-                              color: PaletteDark.walletCardSubAddressField,
+                              color: buttonColor,
                               borderRadius:
                                   BorderRadius.all(Radius.circular(6))),
                           child: Image.asset('assets/images/qr_code_icon.png')),
@@ -82,7 +84,7 @@ class AddressTextField extends StatelessWidget {
                       child: Container(
                           padding: EdgeInsets.all(8),
                           decoration: BoxDecoration(
-                              color: PaletteDark.walletCardSubAddressField,
+                              color: buttonColor,
                               borderRadius:
                                   BorderRadius.all(Radius.circular(6))),
                           child: Image.asset(
@@ -101,7 +103,7 @@ class AddressTextField extends StatelessWidget {
                       child: Container(
                           padding: EdgeInsets.all(8),
                           decoration: BoxDecoration(
-                              color: PaletteDark.walletCardSubAddressField,
+                              color: buttonColor,
                               borderRadius:
                                   BorderRadius.all(Radius.circular(6))),
                           child: Image.asset(

lib/src/widgets/template_tile.dart

@@ -3,15 +3,15 @@ import 'package:cake_wallet/palette.dart';
 
 class TemplateTile extends StatelessWidget {
   TemplateTile({
-    @required this.name,
+    @required this.to,
     @required this.amount,
-    @required this.cryptoCurrency,
+    @required this.from,
     @required this.onTap
   });
 
-  final String name;
+  final String to;
   final String amount;
-  final String cryptoCurrency;
+  final String from;
   final VoidCallback onTap;
 
   final toIcon = Image.asset('assets/images/to_icon.png');
@@ -44,7 +44,7 @@ class TemplateTile extends StatelessWidget {
               Padding(
                 padding: EdgeInsets.only(left: 5),
                 child: Text(
-                  cryptoCurrency,
+                  from,
                   style: TextStyle(
                       fontSize: 16,
                       fontWeight: FontWeight.w600,
@@ -59,7 +59,7 @@ class TemplateTile extends StatelessWidget {
               Padding(
                 padding: EdgeInsets.only(left: 5),
                 child: Text(
-                  name,
+                  to,
                   style: TextStyle(
                       fontSize: 16,
                       fontWeight: FontWeight.w600,