gecko/lib/screens/myWallets/wallets_home.dart

// ignore_for_file: use_build_context_synchronously

import 'package:easy_localization/easy_localization.dart';
import 'package:gecko/globals.dart';
import 'package:gecko/models/chest_data.dart';
import 'package:gecko/models/widgets_keys.dart';
import 'package:gecko/providers/my_wallets.dart';
import 'package:gecko/models/wallet_data.dart';
import 'package:flutter/material.dart';
import 'package:gecko/providers/substrate_sdk.dart';
import 'package:gecko/widgets/bottom_app_bar.dart';
import 'package:gecko/widgets/buttons/add_new_derivation_button.dart';
import 'package:gecko/widgets/buttons/chest_options_buttons.dart';
import 'package:gecko/widgets/commons/offline_info.dart';
import 'package:gecko/widgets/drag_tule_action.dart';
import 'package:gecko/widgets/drag_wallets_info.dart';
import 'package:gecko/widgets/wallet_tile.dart';
import 'package:gecko/widgets/wallet_tile_membre.dart';
import 'package:provider/provider.dart';
import 'package:tutorial_coach_mark/tutorial_coach_mark.dart';

class WalletsHome extends StatefulWidget {
  const WalletsHome({Key? key}) : super(key: key);

  @override
  State<WalletsHome> createState() => _WalletsHomeState();
}

class _WalletsHomeState extends State<WalletsHome> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    final myWalletProvider =
        Provider.of<MyWalletsProvider>(context, listen: false);

    final currentChestNumber = myWalletProvider.getCurrentChest();
    final ChestData currentChest = chestBox.get(currentChestNumber)!;

    return WillPopScope(
      onWillPop: () {
        Navigator.popUntil(
          context,
          ModalRoute.withName('/'),
        );
        return Future<bool>.value(true);
      },
      child: Scaffold(
        backgroundColor: backgroundColor,
        appBar: AppBar(
          elevation: 1,
          toolbarHeight: 60 * ratio,
          leading: IconButton(
              icon: const Icon(Icons.arrow_back, color: Colors.black),
              onPressed: () {
                Navigator.popUntil(
                  context,
                  ModalRoute.withName('/'),
                );
              }),
          title: Row(
            children: [
              Image.asset(
                'assets/chests/${currentChest.imageName}',
                height: 32,
              ),
              const SizedBox(width: 17),
              Text(currentChest.name!,
                  style: TextStyle(color: Colors.grey[850])),
            ],
          ),
          backgroundColor: const Color(0xffFFD58D),
        ),
        bottomNavigationBar:
            Consumer<MyWalletsProvider>(builder: (context, _, __) {
          return myWalletProvider.lastFlyBy == null
              ? const GeckoBottomAppBar(
                  actualRoute: 'safeHome',
                )
              : DragWalletsInfo(
                  lastFlyBy: myWalletProvider.lastFlyBy!,
                  dragAddress: myWalletProvider.dragAddress!,
                );
        }),
        body: FutureBuilder(
            future: myWalletProvider.readAllWallets(currentChestNumber),
            builder: (context, snapshot) {
              if (snapshot.connectionState != ConnectionState.done ||
                  snapshot.hasError) {
                return const Center(
                  child: SizedBox(
                    height: 50,
                    width: 50,
                    child: CircularProgressIndicator(
                      color: orangeC,
                      strokeWidth: 3,
                    ),
                  ),
                );
              }
              return SafeArea(
                child: Stack(children: [
                  myWalletsTiles(context, currentChestNumber),
                  const OfflineInfo(),
                ]),
              );
            }),
      ),
    );
  }

  Widget myWalletsTiles(BuildContext context, int currentChestNumber) {
    final myWalletProvider = Provider.of<MyWalletsProvider>(context);
    final bool isWalletsExists = myWalletProvider.checkIfWalletExist();

    if (!isWalletsExists) {
      return const Text('');
    }

    if (myWalletProvider.listWallets.isEmpty) {
      return const Expanded(
          child: Column(children: <Widget>[
        Center(
            child: Text(
          'Veuillez générer votre premier portefeuille',
          style: TextStyle(fontSize: 17, fontWeight: FontWeight.w500),
        )),
      ]));
    }

    // Get wallet list and sort by derivation number
    List<WalletData> listWallets = myWalletProvider.listWallets;
    listWallets.sort((p1, p2) {
      return Comparable.compare(p1.number!, p2.number!);
    });

    // Get first wallet with identity
    final idtyWallet = listWallets.firstWhere(
      (w) => w.hasIdentity(),
      orElse: () => WalletData(address: ''),
    );

    List<WalletData> listWalletsWithoutIdty = listWallets.toList();
    listWalletsWithoutIdty.removeWhere((w) => w.address == idtyWallet.address);

    final screenWidth = MediaQuery.of(context).size.width;
    int nTule;

    if (screenWidth >= 900) {
      nTule = 4;
    } else if (screenWidth >= 650) {
      nTule = 3;
    } else {
      nTule = 2;
    }

    final tutorialCoachMark = TutorialCoachMark(
      targets: [
        TargetFocus(
          identify: "drag_and_drop",
          keyTarget: keyDragAndDrop,
          contents: [
            TargetContent(
                child: Column(
              children: [
                Image.asset('assets/drag-and-drop.png', height: 140),
                const SizedBox(height: 15),
                Text(
                  'explainDraggableWallet'.tr(),
                  textAlign: TextAlign.center,
                  style: const TextStyle(
                      fontSize: 22, fontWeight: FontWeight.w500),
                ),
              ],
            ))
          ],
          alignSkip: Alignment.bottomRight,
          enableOverlayTab: true,
        ),
      ],
      colorShadow: orangeC,
      textSkip: "skip".tr(),
      paddingFocus: 10,
      opacityShadow: 0.8,
    );

    // configBox.delete('showDraggableTutorial');
    final bool showDraggableTutorial =
        configBox.get('showDraggableTutorial') ?? true;

    if (listWallets.length > 1 && showDraggableTutorial) {
      tutorialCoachMark.show(context: context);
      configBox.put('showDraggableTutorial', false);
    }

    return CustomScrollView(slivers: <Widget>[
      const SliverToBoxAdapter(child: SizedBox(height: 20)),
      if (idtyWallet.address != '')
        SliverToBoxAdapter(
          child: DragTuleAction(
            wallet: idtyWallet,
            child: WalletTileMembre(repository: idtyWallet),
          ),
        ),
      SliverGrid.count(
          key: keyListWallets,
          crossAxisCount: nTule,
          childAspectRatio: 1,
          crossAxisSpacing: 0,
          mainAxisSpacing: 0,
          children: <Widget>[
            for (WalletData repository in listWalletsWithoutIdty)
              DragTuleAction(
                wallet: repository,
                child: WalletTile(repository: repository),
              ),
            Consumer<SubstrateSdk>(builder: (context, sub, _) {
              return sub.nodeConnected &&
                      myWalletProvider.listWallets.length < maxWalletsInSafe
                  ? const AddNewDerivationButton()
                  : const Text('');
            }),
          ]),
      const SliverToBoxAdapter(child: ChestOptionsButtons()),
    ]);
  }
}