WIP desktop add eth token to wallet gui

lib/pages/add_wallet_views/select_wallet_for_token_view.dart

@@ -17,7 +17,10 @@ import 'package:stackwallet/utilities/util.dart';
 import 'package:stackwallet/widgets/background.dart';
 import 'package:stackwallet/widgets/conditional_parent.dart';
 import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
+import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart';
+import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart';
 import 'package:stackwallet/widgets/desktop/primary_button.dart';
+import 'package:stackwallet/widgets/eth_wallet_radio.dart';
 import 'package:stackwallet/widgets/rounded_container.dart';
 import 'package:stackwallet/widgets/rounded_white_container.dart';
 import 'package:stackwallet/widgets/wallet_info_row/wallet_info_row.dart';
@@ -159,91 +162,111 @@ class _SelectWalletForTokenViewState
             ),
           ),
         ),
-        child: Column(
+        child: ConditionalParent(
-          crossAxisAlignment: CrossAxisAlignment.stretch,
+          condition: isDesktop,
-          children: [
+          builder: (child) => DesktopScaffold(
-            Text(
+            appBar: const DesktopAppBar(
-              "Select Ethereum wallet",
+              isCompactHeight: false,
-              textAlign: TextAlign.center,
+              leading: AppBarBackButton(),
-              style: STextStyles.pageTitleH1(context),
             ),
-            const SizedBox(
+            body: SizedBox(
-              height: 8,
+              width: 480,
+              child: child,
             ),
-            Text(
+          ),
-              "You are adding an ETH token.",
+          child: Column(
-              textAlign: TextAlign.center,
+            crossAxisAlignment: CrossAxisAlignment.stretch,
-              style: STextStyles.subtitle(context),
+            children: [
-            ),
+              Text(
-            const SizedBox(
+                "Select Ethereum wallet",
-              height: 8,
+                textAlign: TextAlign.center,
-            ),
+                style: STextStyles.pageTitleH1(context),
-            Text(
-              "You must choose an Ethereum wallet in order to use ${widget.entity.name}",
-              textAlign: TextAlign.center,
-              style: STextStyles.subtitle(context),
-            ),
-            const SizedBox(
-              height: 16,
-            ),
-            ethWalletIds.isEmpty
-                ? RoundedWhiteContainer(
-                    child: Text(
-                      _hasEthWallets
-                          ? "All current Ethereum wallets already have ${widget.entity.name}"
-                          : "You do not have any Ethereum wallets",
-                      style: STextStyles.label(context),
-                    ),
-                  )
-                : Expanded(
-                    child: Column(
-                      children: [
-                        RoundedWhiteContainer(
-                          padding: const EdgeInsets.all(8),
-                          child: ListView.separated(
-                            itemCount: ethWalletIds.length,
-                            shrinkWrap: true,
-                            separatorBuilder: (_, __) => const SizedBox(
-                              height: 6,
-                            ),
-                            itemBuilder: (_, index) {
-                              return RoundedContainer(
-                                padding: const EdgeInsets.all(8),
-                                onPressed: () {
-                                  setState(() {
-                                    _selectedWalletId = ethWalletIds[index];
-                                  });
-                                },
-                                color: _selectedWalletId == ethWalletIds[index]
-                                    ? Theme.of(context)
-                                        .extension<StackColors>()!
-                                        .highlight
-                                    : Colors.transparent,
-                                child: WalletInfoRow(
-                                  walletId: ethWalletIds[index],
-                                ),
-                              );
-                            },
-                          ),
-                        ),
-                      ],
-                    ),
-                  ),
-            if (ethWalletIds.isEmpty)
-              const SizedBox(
-                height: 16,
               ),
-            ethWalletIds.isEmpty
+              SizedBox(
-                ? PrimaryButton(
+                height: isDesktop ? 16 : 8,
-                    label: "Add new Ethereum wallet",
+              ),
-                    onPressed: _onAddNewEthWallet,
+              Text(
-                  )
+                "You are adding an ETH token.",
-                : PrimaryButton(
+                textAlign: TextAlign.center,
-                    label: "Continue",
+                style: STextStyles.subtitle(context),
-                    enabled: _selectedWalletId != null,
+              ),
-                    onPressed: _onContinue,
+              const SizedBox(
-                  ),
+                height: 8,
-          ],
+              ),
+              Text(
+                "You must choose an Ethereum wallet in order to use ${widget.entity.name}",
+                textAlign: TextAlign.center,
+                style: STextStyles.subtitle(context),
+              ),
+              SizedBox(
+                height: isDesktop ? 60 : 16,
+              ),
+              ethWalletIds.isEmpty
+                  ? RoundedWhiteContainer(
+                      child: Text(
+                        _hasEthWallets
+                            ? "All current Ethereum wallets already have ${widget.entity.name}"
+                            : "You do not have any Ethereum wallets",
+                        style: STextStyles.label(context),
+                      ),
+                    )
+                  : Expanded(
+                      child: Column(
+                        children: [
+                          RoundedWhiteContainer(
+                            padding: const EdgeInsets.all(8),
+                            child: ListView.separated(
+                              itemCount: ethWalletIds.length,
+                              shrinkWrap: true,
+                              separatorBuilder: (_, __) => SizedBox(
+                                height: isDesktop ? 12 : 6,
+                              ),
+                              itemBuilder: (_, index) {
+                                return RoundedContainer(
+                                  padding: const EdgeInsets.all(8),
+                                  onPressed: () {
+                                    setState(() {
+                                      _selectedWalletId = ethWalletIds[index];
+                                    });
+                                  },
+                                  color: isDesktop
+                                      ? Colors.transparent
+                                      : _selectedWalletId == ethWalletIds[index]
+                                          ? Theme.of(context)
+                                              .extension<StackColors>()!
+                                              .highlight
+                                          : Colors.transparent,
+                                  child: isDesktop
+                                      ? EthWalletRadio(
+                                          walletId: ethWalletIds[index],
+                                          selectedWalletId: _selectedWalletId,
+                                        )
+                                      : WalletInfoRow(
+                                          walletId: ethWalletIds[index],
+                                        ),
+                                );
+                              },
+                            ),
+                          ),
+                        ],
+                      ),
+                    ),
+              if (ethWalletIds.isEmpty)
+                const SizedBox(
+                  height: 16,
+                ),
+              ethWalletIds.isEmpty
+                  ? PrimaryButton(
+                      label: "Add new Ethereum wallet",
+                      onPressed: _onAddNewEthWallet,
+                    )
+                  : PrimaryButton(
+                      label: "Continue",
+                      enabled: _selectedWalletId != null,
+                      onPressed: _onContinue,
+                    ),
+            ],
+          ),
         ),
       ),
     );

lib/widgets/eth_wallet_radio.dart

@@ -0,0 +1,77 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:stackwallet/providers/providers.dart';
+import 'package:stackwallet/utilities/text_styles.dart';
+import 'package:stackwallet/utilities/theme/stack_colors.dart';
+import 'package:stackwallet/widgets/wallet_info_row/sub_widgets/wallet_info_row_balance_future.dart';
+import 'package:stackwallet/widgets/wallet_info_row/sub_widgets/wallet_info_row_coin_icon.dart';
+
+class EthWalletRadio extends ConsumerStatefulWidget {
+  const EthWalletRadio({
+    Key? key,
+    required this.walletId,
+    this.selectedWalletId,
+  }) : super(key: key);
+
+  final String walletId;
+  final String? selectedWalletId;
+
+  @override
+  ConsumerState<EthWalletRadio> createState() => _EthWalletRadioState();
+}
+
+class _EthWalletRadioState extends ConsumerState<EthWalletRadio> {
+  @override
+  Widget build(BuildContext context) {
+    final manager = ref.watch(walletsChangeNotifierProvider
+        .select((value) => value.getManager(widget.walletId)));
+
+    return Padding(
+      padding: EdgeInsets.zero,
+      child: Container(
+        color: Colors.transparent,
+        child: Row(
+          children: [
+            IgnorePointer(
+              child: Radio(
+                value: widget.walletId,
+                groupValue: widget.selectedWalletId,
+                onChanged: (_) {
+                  // do nothing since changing updating the ui is already
+                  // done elsewhere
+                },
+              ),
+            ),
+            const SizedBox(
+              width: 12,
+            ),
+            WalletInfoCoinIcon(
+              coin: manager.coin,
+              size: 40,
+            ),
+            const SizedBox(
+              width: 12,
+            ),
+            Expanded(
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.stretch,
+                children: [
+                  Text(
+                    manager.walletName,
+                    style: STextStyles.desktopTextExtraSmall(context).copyWith(
+                      color:
+                          Theme.of(context).extension<StackColors>()!.textDark,
+                    ),
+                  ),
+                  WalletInfoRowBalance(
+                    walletId: widget.walletId,
+                  ),
+                ],
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/widgets/wallet_info_row/sub_widgets/wallet_info_row_coin_icon.dart

@@ -13,11 +13,13 @@ class WalletInfoCoinIcon extends StatelessWidget {
   const WalletInfoCoinIcon({
     Key? key,
     required this.coin,
+    this.size = 32,
     this.contractAddress,
   }) : super(key: key);
 
   final Coin coin;
   final String? contractAddress;
+  final double size;
 
   @override
   Widget build(BuildContext context) {
@@ -37,6 +39,8 @@ class WalletInfoCoinIcon extends StatelessWidget {
     }
 
     return Container(
+      width: size,
+      height: size,
       decoration: BoxDecoration(
         color: Theme.of(context)
             .extension<StackColors>()!
@@ -47,7 +51,7 @@ class WalletInfoCoinIcon extends StatelessWidget {
         ),
       ),
       child: Padding(
-        padding: const EdgeInsets.all(6),
+        padding: EdgeInsets.all(size / 5),
         child: currency != null && currency.image.isNotEmpty
             ? SvgPicture.network(
                 currency.image,