From 7798ed39a06912425fc6c97bfbb6a6d021f1ed04 Mon Sep 17 00:00:00 2001
From: ryleedavis <rylee@cypherstack.com>
Date: Fri, 11 Nov 2022 15:58:47 -0700
Subject: [PATCH] desktop address book with no contacts

---
 assets/svg/plus-circle.svg                    | 12 +++
 .../desktop_address_book.dart                 | 84 ++++++++++++++++++-
 lib/utilities/assets.dart                     |  1 +
 pubspec.yaml                                  |  1 +
 4 files changed, 95 insertions(+), 3 deletions(-)
 create mode 100644 assets/svg/plus-circle.svg

diff --git a/assets/svg/plus-circle.svg b/assets/svg/plus-circle.svg
new file mode 100644
index 000000000..e673b9b0e
--- /dev/null
+++ b/assets/svg/plus-circle.svg
@@ -0,0 +1,12 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_5370_82626)">
+<path d="M9.99935 18.3337C14.6017 18.3337 18.3327 14.6027 18.3327 10.0003C18.3327 5.39795 14.6017 1.66699 9.99935 1.66699C5.39698 1.66699 1.66602 5.39795 1.66602 10.0003C1.66602 14.6027 5.39698 18.3337 9.99935 18.3337Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M10 6.66699V13.3337" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6.66602 10H13.3327" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_5370_82626">
+<rect width="20" height="20" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/lib/pages_desktop_specific/home/address_book_view/desktop_address_book.dart b/lib/pages_desktop_specific/home/address_book_view/desktop_address_book.dart
index 3622fcf1e..dd38b98a8 100644
--- a/lib/pages_desktop_specific/home/address_book_view/desktop_address_book.dart
+++ b/lib/pages_desktop_specific/home/address_book_view/desktop_address_book.dart
@@ -1,12 +1,15 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:flutter_svg/svg.dart';
+import 'package:stackwallet/models/contact.dart';
 import 'package:stackwallet/providers/global/wallets_provider.dart';
 import 'package:stackwallet/utilities/assets.dart';
 import 'package:stackwallet/utilities/constants.dart';
 import 'package:stackwallet/utilities/text_styles.dart';
+import 'package:stackwallet/utilities/theme/stack_colors.dart';
 import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart';
 import 'package:stackwallet/widgets/icon_widgets/x_icon.dart';
+import 'package:stackwallet/widgets/rounded_white_container.dart';
 import 'package:stackwallet/widgets/stack_text_field.dart';
 import 'package:stackwallet/widgets/textfield_icon_button.dart';
 
@@ -24,6 +27,11 @@ class _DesktopAddressBook extends ConsumerState<DesktopAddressBook> {
 
   late final FocusNode _searchFocusNode;
 
+  List<Contact>? _cache;
+  List<Contact>? _cacheFav;
+
+  late bool hasContacts = false;
+
   String filter = "";
 
   @override
@@ -49,6 +57,7 @@ class _DesktopAddressBook extends ConsumerState<DesktopAddressBook> {
 
     return Column(
       mainAxisSize: MainAxisSize.min,
+      crossAxisAlignment: CrossAxisAlignment.start,
       children: [
         DesktopAppBar(
           isCompactHeight: true,
@@ -127,12 +136,81 @@ class _DesktopAddressBook extends ConsumerState<DesktopAddressBook> {
                   ),
                 ),
               ),
+              const SizedBox(width: 20),
+              TextButton(
+                style: Theme.of(context)
+                    .extension<StackColors>()!
+                    .getDesktopMenuButtonColorSelected(context),
+                onPressed: () {},
+                child: SizedBox(
+                  width: 200,
+                  height: 56,
+                  child: Row(
+                    mainAxisAlignment: MainAxisAlignment.center,
+                    children: [
+                      Padding(
+                        padding: const EdgeInsets.symmetric(horizontal: 10),
+                        child: SvgPicture.asset(Assets.svg.filter),
+                      ),
+                      Text(
+                        "Filter",
+                        style: STextStyles.desktopTextExtraExtraSmall(context)
+                            .copyWith(
+                          color: Theme.of(context)
+                              .extension<StackColors>()!
+                              .textDark,
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+              ),
+              const SizedBox(width: 20),
+              TextButton(
+                style: Theme.of(context)
+                    .extension<StackColors>()!
+                    .getPrimaryEnabledButtonColor(context),
+                onPressed: () {},
+                child: SizedBox(
+                  width: 200,
+                  height: 56,
+                  child: Row(
+                    mainAxisAlignment: MainAxisAlignment.center,
+                    children: [
+                      Padding(
+                        padding: const EdgeInsets.symmetric(horizontal: 10),
+                        child: SvgPicture.asset(Assets.svg.circlePlus),
+                      ),
+                      Text(
+                        "Add new",
+                        style: STextStyles.desktopTextExtraExtraSmall(context)
+                            .copyWith(
+                          color: Theme.of(context)
+                              .extension<StackColors>()!
+                              .popupBG,
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+              ),
             ],
           ),
         ),
-        // Expanded(
-        //   child: hasWallets ? const MyWallets() : const EmptyWallets(),
-        // ),
+        Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 26),
+          child: SizedBox(
+            width: 489,
+            child: RoundedWhiteContainer(
+              child: Center(
+                child: Text(
+                  "Your contacts will appear here",
+                  style: STextStyles.itemSubtitle(context),
+                ),
+              ),
+            ),
+          ),
+        ),
       ],
     );
   }
diff --git a/lib/utilities/assets.dart b/lib/utilities/assets.dart
index f853a00d8..e76a17c12 100644
--- a/lib/utilities/assets.dart
+++ b/lib/utilities/assets.dart
@@ -59,6 +59,7 @@ class _SVG {
   String txExchangeFailed(BuildContext context) =>
       "assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-exchange-icon-failed.svg";
 
+  String get circlePlus => "assets/svg/plus-circle.svg";
   String get framedGear => "assets/svg/framed-gear.svg";
   String get framedAddressBook => "assets/svg/framed-address-book.svg";
   String get themeLight => "assets/svg/light/light-mode.svg";
diff --git a/pubspec.yaml b/pubspec.yaml
index 8b03cd57e..fd1c8a9b5 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -314,6 +314,7 @@ flutter:
     - assets/svg/exit-desktop.svg
     - assets/svg/keys.svg
     - assets/svg/arrow-down.svg
+    - assets/svg/plus-circle.svg
     # coin icons
     - assets/svg/coin_icons/Bitcoin.svg
     - assets/svg/coin_icons/Litecoin.svg