extract date picker to separate file

lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/restore_options_view.dart

@@ -11,9 +11,7 @@
 import 'package:dropdown_button2/dropdown_button2.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
-import 'package:flutter_rounded_date_picker/flutter_rounded_date_picker.dart';
 import 'package:flutter_svg/svg.dart';
-import 'package:google_fonts/google_fonts.dart';
 import 'package:stackwallet/pages/add_wallet_views/create_or_restore_wallet_view/sub_widgets/coin_image.dart';
 import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/mobile_mnemonic_length_selector.dart';
 import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/restore_options_view/sub_widgets/restore_from_date_picker.dart';
@@ -24,7 +22,6 @@ import 'package:stackwallet/pages/add_wallet_views/restore_wallet_view/sub_widge
 import 'package:stackwallet/pages_desktop_specific/my_stack_view/exit_to_my_stack_button.dart';
 import 'package:stackwallet/providers/ui/verify_recovery_phrase/mnemonic_word_count_state_provider.dart';
 import 'package:stackwallet/themes/stack_colors.dart';
-import 'package:stackwallet/themes/theme_providers.dart';
 import 'package:stackwallet/utilities/assets.dart';
 import 'package:stackwallet/utilities/constants.dart';
 import 'package:stackwallet/utilities/enums/coin_enum.dart';
@@ -33,6 +30,7 @@ import 'package:stackwallet/utilities/text_styles.dart';
 import 'package:stackwallet/utilities/util.dart';
 import 'package:stackwallet/widgets/conditional_parent.dart';
 import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
+import 'package:stackwallet/widgets/date_picker/date_picker.dart';
 import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart';
 import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart';
 import 'package:stackwallet/widgets/expandable.dart';
@@ -42,10 +40,10 @@ import 'package:tuple/tuple.dart';
 
 class RestoreOptionsView extends ConsumerStatefulWidget {
   const RestoreOptionsView({
-    Key? key,
+    super.key,
     required this.walletName,
     required this.coin,
-  }) : super(key: key);
+  });
 
   static const routeName = "/restoreOptions";
 
@@ -68,7 +66,6 @@ class _RestoreOptionsViewState extends ConsumerState<RestoreOptionsView> {
 
   final bool _nextEnabled = true;
   DateTime _restoreFromDate = DateTime.fromMillisecondsSinceEpoch(0);
-  late final Color baseColor;
   bool hidePassword = true;
   bool _expandedAdavnced = false;
 
@@ -77,7 +74,6 @@ class _RestoreOptionsViewState extends ConsumerState<RestoreOptionsView> {
 
   @override
   void initState() {
-    baseColor = ref.read(themeProvider.state).state.textSubtitle2;
     walletName = widget.walletName;
     coin = widget.coin;
     isDesktop = Util.isDesktop;
@@ -99,52 +95,6 @@ class _RestoreOptionsViewState extends ConsumerState<RestoreOptionsView> {
     super.dispose();
   }
 
-  MaterialRoundedDatePickerStyle _buildDatePickerStyle() {
-    return MaterialRoundedDatePickerStyle(
-      paddingMonthHeader: const EdgeInsets.only(top: 11),
-      colorArrowNext: Theme.of(context).extension<StackColors>()!.textSubtitle1,
-      colorArrowPrevious:
-          Theme.of(context).extension<StackColors>()!.textSubtitle1,
-      textStyleButtonNegative: STextStyles.datePicker600(context).copyWith(
-        color: baseColor,
-      ),
-      textStyleButtonPositive: STextStyles.datePicker600(context).copyWith(
-        color: baseColor,
-      ),
-      textStyleCurrentDayOnCalendar: STextStyles.datePicker400(context),
-      textStyleDayHeader: STextStyles.datePicker600(context),
-      textStyleDayOnCalendar: STextStyles.datePicker400(context).copyWith(
-        color: baseColor,
-      ),
-      textStyleDayOnCalendarDisabled:
-          STextStyles.datePicker400(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textSubtitle3,
-      ),
-      textStyleDayOnCalendarSelected:
-          STextStyles.datePicker400(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.popupBG,
-      ),
-      textStyleMonthYearHeader: STextStyles.datePicker600(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textSubtitle1,
-      ),
-      textStyleYearButton: STextStyles.datePicker600(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textWhite,
-      ),
-      textStyleButtonAction: GoogleFonts.inter(),
-    );
-  }
-
-  MaterialRoundedYearPickerStyle _buildYearPickerStyle() {
-    return MaterialRoundedYearPickerStyle(
-      textStyleYear: STextStyles.datePicker600(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textSubtitle2,
-      ),
-      textStyleYearSelected: STextStyles.datePicker600(context).copyWith(
-        fontSize: 18,
-      ),
-    );
-  }
-
   Future<void> nextPressed() async {
     if (!isDesktop) {
       // hide keyboard if has focus
@@ -169,67 +119,23 @@ class _RestoreOptionsViewState extends ConsumerState<RestoreOptionsView> {
   }
 
   Future<void> chooseDate() async {
-    final height = MediaQuery.of(context).size.height;
-    final fetchedColor =
-        Theme.of(context).extension<StackColors>()!.accentColorDark;
     // check and hide keyboard
     if (FocusScope.of(context).hasFocus) {
       FocusScope.of(context).unfocus();
       await Future<void>.delayed(const Duration(milliseconds: 125));
     }
 
-    final date = await showRoundedDatePicker(
+    if (mounted) {
-      context: context,
+      final date = await showSWDatePicker(context);
-      initialDate: DateTime.now(),
+      if (date != null) {
-      height: height / 3.0,
+        _restoreFromDate = date;
-      theme: ThemeData(
+        _dateController.text = Format.formatDate(date);
-        primarySwatch: Util.createMaterialColor(fetchedColor),
+      }
-      ),
-      //TODO pick a better initial date
-      // 2007 chosen as that is just before bitcoin launched
-      firstDate: DateTime(2007),
-      lastDate: DateTime.now(),
-      borderRadius: Constants.size.circularBorderRadius * 2,
-
-      textPositiveButton: "SELECT",
-
-      styleDatePicker: _buildDatePickerStyle(),
-      styleYearPicker: _buildYearPickerStyle(),
-    );
-    if (date != null) {
-      _restoreFromDate = date;
-      _dateController.text = Format.formatDate(date);
     }
   }
 
   Future<void> chooseDesktopDate() async {
-    final height = MediaQuery.of(context).size.height;
+    final date = await showSWDatePicker(context);
-    final fetchedColor =
-        Theme.of(context).extension<StackColors>()!.accentColorDark;
-    // check and hide keyboard
-    if (FocusScope.of(context).hasFocus) {
-      FocusScope.of(context).unfocus();
-      await Future<void>.delayed(const Duration(milliseconds: 125));
-    }
-
-    final date = await showRoundedDatePicker(
-      context: context,
-      initialDate: DateTime.now(),
-      height: height / 3.0,
-      theme: ThemeData(
-        primarySwatch: Util.createMaterialColor(fetchedColor),
-      ),
-      //TODO pick a better initial date
-      // 2007 chosen as that is just before bitcoin launched
-      firstDate: DateTime(2007),
-      lastDate: DateTime.now(),
-      borderRadius: Constants.size.circularBorderRadius * 2,
-
-      textPositiveButton: "SELECT",
-
-      styleDatePicker: _buildDatePickerStyle(),
-      styleYearPicker: _buildYearPickerStyle(),
-    );
     if (date != null) {
       _restoreFromDate = date;
       _dateController.text = Format.formatDate(date);

lib/pages/ordinals/ordinals_filter_view.dart

@@ -10,7 +10,6 @@
 
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
-import 'package:flutter_rounded_date_picker/flutter_rounded_date_picker.dart';
 import 'package:flutter_svg/svg.dart';
 import 'package:stackwallet/themes/stack_colors.dart';
 import 'package:stackwallet/themes/theme_providers.dart';
@@ -21,6 +20,7 @@ import 'package:stackwallet/utilities/text_styles.dart';
 import 'package:stackwallet/utilities/util.dart';
 import 'package:stackwallet/widgets/background.dart';
 import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
+import 'package:stackwallet/widgets/date_picker/date_picker.dart';
 import 'package:stackwallet/widgets/desktop/desktop_dialog.dart';
 import 'package:stackwallet/widgets/desktop/desktop_dialog_close_button.dart';
 import 'package:stackwallet/widgets/desktop/primary_button.dart';
@@ -69,8 +69,8 @@ final ordinalFilterProvider = StateProvider<OrdinalFilter?>((_) => null);
 
 class OrdinalsFilterView extends ConsumerStatefulWidget {
   const OrdinalsFilterView({
-    Key? key,
+    super.key,
-  }) : super(key: key);
+  });
 
   static const String routeName = "/ordinalsFilterView";
 
@@ -146,56 +146,6 @@ class _OrdinalsFilterViewState extends ConsumerState<OrdinalsFilterView> {
   DateTime? _selectedFromDate = DateTime(2007);
   DateTime? _selectedToDate = DateTime.now();
 
-  MaterialRoundedDatePickerStyle _buildDatePickerStyle() {
-    return MaterialRoundedDatePickerStyle(
-      backgroundPicker: Theme.of(context).extension<StackColors>()!.popupBG,
-      // backgroundHeader: Theme.of(context).extension<StackColors>()!.textSubtitle2,
-      paddingMonthHeader: const EdgeInsets.only(top: 11),
-      colorArrowNext: Theme.of(context).extension<StackColors>()!.textSubtitle1,
-      colorArrowPrevious:
-          Theme.of(context).extension<StackColors>()!.textSubtitle1,
-      textStyleButtonNegative: STextStyles.datePicker600(context).copyWith(
-        color: baseColor,
-      ),
-      textStyleButtonPositive: STextStyles.datePicker600(context).copyWith(
-        color: baseColor,
-      ),
-      textStyleCurrentDayOnCalendar: STextStyles.datePicker400(context),
-      textStyleDayHeader: STextStyles.datePicker600(context),
-      textStyleDayOnCalendar: STextStyles.datePicker400(context).copyWith(
-        color: baseColor,
-      ),
-      textStyleDayOnCalendarDisabled:
-          STextStyles.datePicker400(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textSubtitle3,
-      ),
-      textStyleDayOnCalendarSelected:
-          STextStyles.datePicker400(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textWhite,
-      ),
-      textStyleMonthYearHeader: STextStyles.datePicker600(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textSubtitle1,
-      ),
-      textStyleYearButton: STextStyles.datePicker600(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textWhite,
-      ),
-      // textStyleButtonAction: GoogleFonts.inter(),
-    );
-  }
-
-  MaterialRoundedYearPickerStyle _buildYearPickerStyle() {
-    return MaterialRoundedYearPickerStyle(
-      backgroundPicker: Theme.of(context).extension<StackColors>()!.popupBG,
-      textStyleYear: STextStyles.datePicker600(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textSubtitle2,
-        fontSize: 16,
-      ),
-      textStyleYearSelected: STextStyles.datePicker600(context).copyWith(
-        fontSize: 18,
-      ),
-    );
-  }
-
   Widget _buildDateRangePicker() {
     const middleSeparatorPadding = 2.0;
     const middleSeparatorWidth = 12.0;
@@ -216,9 +166,6 @@ class _OrdinalsFilterViewState extends ConsumerState<OrdinalsFilterView> {
           child: GestureDetector(
             key: const Key("OrdinalsViewFromDatePickerKey"),
             onTap: () async {
-              final color =
-                  Theme.of(context).extension<StackColors>()!.accentColorDark;
-              final height = MediaQuery.of(context).size.height;
               // check and hide keyboard
               if (FocusScope.of(context).hasFocus) {
                 FocusScope.of(context).unfocus();
@@ -226,28 +173,7 @@ class _OrdinalsFilterViewState extends ConsumerState<OrdinalsFilterView> {
               }
 
               if (mounted) {
-                final date = await showRoundedDatePicker(
+                final date = await showSWDatePicker(context);
-                  // This doesn't change statusbar color...
-                  // background: CFColors.starryNight.withOpacity(0.8),
-                  context: context,
-                  initialDate: DateTime.now(),
-                  height: height * 0.5,
-                  theme: ThemeData(
-                    primarySwatch: Util.createMaterialColor(
-                      color,
-                    ),
-                  ),
-                  //TODO pick a better initial date
-                  // 2007 chosen as that is just before bitcoin launched
-                  firstDate: DateTime(2007),
-                  lastDate: DateTime.now(),
-                  borderRadius: Constants.size.circularBorderRadius * 2,
-
-                  textPositiveButton: "SELECT",
-
-                  styleDatePicker: _buildDatePickerStyle(),
-                  styleYearPicker: _buildYearPickerStyle(),
-                );
                 if (date != null) {
                   _selectedFromDate = date;
 
@@ -330,9 +256,6 @@ class _OrdinalsFilterViewState extends ConsumerState<OrdinalsFilterView> {
           child: GestureDetector(
             key: const Key("OrdinalsViewToDatePickerKey"),
             onTap: () async {
-              final color =
-                  Theme.of(context).extension<StackColors>()!.accentColorDark;
-              final height = MediaQuery.of(context).size.height;
               // check and hide keyboard
               if (FocusScope.of(context).hasFocus) {
                 FocusScope.of(context).unfocus();
@@ -340,28 +263,7 @@ class _OrdinalsFilterViewState extends ConsumerState<OrdinalsFilterView> {
               }
 
               if (mounted) {
-                final date = await showRoundedDatePicker(
+                final date = await showSWDatePicker(context);
-                  // This doesn't change statusbar color...
-                  // background: CFColors.starryNight.withOpacity(0.8),
-                  context: context,
-                  height: height * 0.5,
-                  theme: ThemeData(
-                    primarySwatch: Util.createMaterialColor(
-                      color,
-                    ),
-                  ),
-                  //TODO pick a better initial date
-                  // 2007 chosen as that is just before bitcoin launched
-                  initialDate: DateTime.now(),
-                  firstDate: DateTime(2007),
-                  lastDate: DateTime.now(),
-                  borderRadius: Constants.size.circularBorderRadius * 2,
-
-                  textPositiveButton: "SELECT",
-
-                  styleDatePicker: _buildDatePickerStyle(),
-                  styleYearPicker: _buildYearPickerStyle(),
-                );
                 if (date != null) {
                   _selectedToDate = date;
 
@@ -467,7 +369,7 @@ class _OrdinalsFilterViewState extends ConsumerState<OrdinalsFilterView> {
                   FocusScope.of(context).unfocus();
                   await Future<void>.delayed(const Duration(milliseconds: 75));
                 }
-                if (mounted) {
+                if (context.mounted) {
                   Navigator.of(context).pop();
                 }
               },
@@ -840,7 +742,7 @@ class _OrdinalsFilterViewState extends ConsumerState<OrdinalsFilterView> {
                       );
                     }
                   }
-                  if (mounted) {
+                  if (context.mounted) {
                     Navigator.of(context).pop();
                   }
                 },

lib/pages/wallet_view/transaction_views/transaction_search_filter_view.dart

@@ -11,7 +11,6 @@
 import 'package:decimal/decimal.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
-import 'package:flutter_rounded_date_picker/flutter_rounded_date_picker.dart';
 import 'package:flutter_svg/svg.dart';
 import 'package:stackwallet/models/transaction_filter.dart';
 import 'package:stackwallet/providers/global/locale_provider.dart';
@@ -29,6 +28,7 @@ import 'package:stackwallet/utilities/text_styles.dart';
 import 'package:stackwallet/utilities/util.dart';
 import 'package:stackwallet/widgets/background.dart';
 import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart';
+import 'package:stackwallet/widgets/date_picker/date_picker.dart';
 import 'package:stackwallet/widgets/desktop/desktop_dialog.dart';
 import 'package:stackwallet/widgets/desktop/desktop_dialog_close_button.dart';
 import 'package:stackwallet/widgets/desktop/primary_button.dart';
@@ -40,9 +40,9 @@ import 'package:stackwallet/widgets/textfield_icon_button.dart';
 
 class TransactionSearchFilterView extends ConsumerStatefulWidget {
   const TransactionSearchFilterView({
-    Key? key,
+    super.key,
     required this.coin,
-  }) : super(key: key);
+  });
 
   static const String routeName = "/transactionSearchFilter";
 
@@ -137,56 +137,6 @@ class _TransactionSearchViewState
   DateTime? _selectedFromDate = DateTime(2007);
   DateTime? _selectedToDate = DateTime.now();
 
-  MaterialRoundedDatePickerStyle _buildDatePickerStyle() {
-    return MaterialRoundedDatePickerStyle(
-      backgroundPicker: Theme.of(context).extension<StackColors>()!.popupBG,
-      // backgroundHeader: Theme.of(context).extension<StackColors>()!.textSubtitle2,
-      paddingMonthHeader: const EdgeInsets.only(top: 11),
-      colorArrowNext: Theme.of(context).extension<StackColors>()!.textSubtitle1,
-      colorArrowPrevious:
-          Theme.of(context).extension<StackColors>()!.textSubtitle1,
-      textStyleButtonNegative: STextStyles.datePicker600(context).copyWith(
-        color: baseColor,
-      ),
-      textStyleButtonPositive: STextStyles.datePicker600(context).copyWith(
-        color: baseColor,
-      ),
-      textStyleCurrentDayOnCalendar: STextStyles.datePicker400(context),
-      textStyleDayHeader: STextStyles.datePicker600(context),
-      textStyleDayOnCalendar: STextStyles.datePicker400(context).copyWith(
-        color: baseColor,
-      ),
-      textStyleDayOnCalendarDisabled:
-          STextStyles.datePicker400(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textSubtitle3,
-      ),
-      textStyleDayOnCalendarSelected:
-          STextStyles.datePicker400(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textWhite,
-      ),
-      textStyleMonthYearHeader: STextStyles.datePicker600(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textSubtitle1,
-      ),
-      textStyleYearButton: STextStyles.datePicker600(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textWhite,
-      ),
-      // textStyleButtonAction: GoogleFonts.inter(),
-    );
-  }
-
-  MaterialRoundedYearPickerStyle _buildYearPickerStyle() {
-    return MaterialRoundedYearPickerStyle(
-      backgroundPicker: Theme.of(context).extension<StackColors>()!.popupBG,
-      textStyleYear: STextStyles.datePicker600(context).copyWith(
-        color: Theme.of(context).extension<StackColors>()!.textSubtitle2,
-        fontSize: 16,
-      ),
-      textStyleYearSelected: STextStyles.datePicker600(context).copyWith(
-        fontSize: 18,
-      ),
-    );
-  }
-
   Widget _buildDateRangePicker() {
     const middleSeparatorPadding = 2.0;
     const middleSeparatorWidth = 12.0;
@@ -207,58 +157,36 @@ class _TransactionSearchViewState
           child: GestureDetector(
             key: const Key("transactionSearchViewFromDatePickerKey"),
             onTap: () async {
-              final color =
-                  Theme.of(context).extension<StackColors>()!.accentColorDark;
-              final height = MediaQuery.of(context).size.height;
               // check and hide keyboard
               if (FocusScope.of(context).hasFocus) {
                 FocusScope.of(context).unfocus();
                 await Future<void>.delayed(const Duration(milliseconds: 125));
               }
 
-              final date = await showRoundedDatePicker(
+              if (mounted) {
-                // This doesn't change statusbar color...
+                final date = await showSWDatePicker(context);
-                // background: CFColors.starryNight.withOpacity(0.8),
+                if (date != null) {
-                context: context,
+                  _selectedFromDate = date;
-                initialDate: DateTime.now(),
-                height: height * 0.5,
-                theme: ThemeData(
-                  primarySwatch: Util.createMaterialColor(
-                    color,
-                  ),
-                ),
-                //TODO pick a better initial date
-                // 2007 chosen as that is just before bitcoin launched
-                firstDate: DateTime(2007),
-                lastDate: DateTime.now(),
-                borderRadius: Constants.size.circularBorderRadius * 2,
 
-                textPositiveButton: "SELECT",
+                  // flag to adjust date so from date is always before to date
-
+                  final flag = _selectedToDate != null &&
-                styleDatePicker: _buildDatePickerStyle(),
+                      !_selectedFromDate!.isBefore(_selectedToDate!);
-                styleYearPicker: _buildYearPickerStyle(),
-              );
-              if (date != null) {
-                _selectedFromDate = date;
-
-                // flag to adjust date so from date is always before to date
-                final flag = _selectedToDate != null &&
-                    !_selectedFromDate!.isBefore(_selectedToDate!);
-                if (flag) {
-                  _selectedToDate = DateTime.fromMillisecondsSinceEpoch(
-                      _selectedFromDate!.millisecondsSinceEpoch);
-                }
-
-                setState(() {
                   if (flag) {
-                    _toDateString = _selectedToDate == null
+                    _selectedToDate = DateTime.fromMillisecondsSinceEpoch(
-                        ? ""
+                        _selectedFromDate!.millisecondsSinceEpoch);
-                        : Format.formatDate(_selectedToDate!);
                   }
-                  _fromDateString = _selectedFromDate == null
+
-                      ? ""
+                  setState(() {
-                      : Format.formatDate(_selectedFromDate!);
+                    if (flag) {
-                });
+                      _toDateString = _selectedToDate == null
+                          ? ""
+                          : Format.formatDate(_selectedToDate!);
+                    }
+                    _fromDateString = _selectedFromDate == null
+                        ? ""
+                        : Format.formatDate(_selectedFromDate!);
+                  });
+                }
               }
             },
             child: Container(
@@ -319,58 +247,36 @@ class _TransactionSearchViewState
           child: GestureDetector(
             key: const Key("transactionSearchViewToDatePickerKey"),
             onTap: () async {
-              final color =
-                  Theme.of(context).extension<StackColors>()!.accentColorDark;
-              final height = MediaQuery.of(context).size.height;
               // check and hide keyboard
               if (FocusScope.of(context).hasFocus) {
                 FocusScope.of(context).unfocus();
                 await Future<void>.delayed(const Duration(milliseconds: 125));
               }
 
-              final date = await showRoundedDatePicker(
+              if (mounted) {
-                // This doesn't change statusbar color...
+                final date = await showSWDatePicker(context);
-                // background: CFColors.starryNight.withOpacity(0.8),
+                if (date != null) {
-                context: context,
+                  _selectedToDate = date;
-                height: height * 0.5,
-                theme: ThemeData(
-                  primarySwatch: Util.createMaterialColor(
-                    color,
-                  ),
-                ),
-                //TODO pick a better initial date
-                // 2007 chosen as that is just before bitcoin launched
-                initialDate: DateTime.now(),
-                firstDate: DateTime(2007),
-                lastDate: DateTime.now(),
-                borderRadius: Constants.size.circularBorderRadius * 2,
 
-                textPositiveButton: "SELECT",
+                  // flag to adjust date so from date is always before to date
-
+                  final flag = _selectedFromDate != null &&
-                styleDatePicker: _buildDatePickerStyle(),
+                      !_selectedToDate!.isAfter(_selectedFromDate!);
-                styleYearPicker: _buildYearPickerStyle(),
-              );
-              if (date != null) {
-                _selectedToDate = date;
-
-                // flag to adjust date so from date is always before to date
-                final flag = _selectedFromDate != null &&
-                    !_selectedToDate!.isAfter(_selectedFromDate!);
-                if (flag) {
-                  _selectedFromDate = DateTime.fromMillisecondsSinceEpoch(
-                      _selectedToDate!.millisecondsSinceEpoch);
-                }
-
-                setState(() {
                   if (flag) {
-                    _fromDateString = _selectedFromDate == null
+                    _selectedFromDate = DateTime.fromMillisecondsSinceEpoch(
-                        ? ""
+                        _selectedToDate!.millisecondsSinceEpoch);
-                        : Format.formatDate(_selectedFromDate!);
                   }
-                  _toDateString = _selectedToDate == null
+
-                      ? ""
+                  setState(() {
-                      : Format.formatDate(_selectedToDate!);
+                    if (flag) {
-                });
+                      _fromDateString = _selectedFromDate == null
+                          ? ""
+                          : Format.formatDate(_selectedFromDate!);
+                    }
+                    _toDateString = _selectedToDate == null
+                        ? ""
+                        : Format.formatDate(_selectedToDate!);
+                  });
+                }
               }
             },
             child: Container(
@@ -454,7 +360,7 @@ class _TransactionSearchViewState
                   FocusScope.of(context).unfocus();
                   await Future<void>.delayed(const Duration(milliseconds: 75));
                 }
-                if (mounted) {
+                if (context.mounted) {
                   Navigator.of(context).pop();
                 }
               },
@@ -908,7 +814,7 @@ class _TransactionSearchViewState
                       );
                     }
                   }
-                  if (mounted) {
+                  if (context.mounted) {
                     Navigator.of(context).pop();
                   }
                 },

lib/widgets/date_picker/date_picker.dart

@@ -0,0 +1,78 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_rounded_date_picker/flutter_rounded_date_picker.dart';
+import 'package:google_fonts/google_fonts.dart';
+import 'package:stackwallet/themes/stack_colors.dart';
+import 'package:stackwallet/utilities/constants.dart';
+import 'package:stackwallet/utilities/text_styles.dart';
+import 'package:stackwallet/utilities/util.dart';
+
+Future<DateTime?> showSWDatePicker(BuildContext context) async {
+  final date = await showRoundedDatePicker(
+    context: context,
+    initialDate: DateTime.now(),
+    height: MediaQuery.of(context).size.height / 3.0,
+    theme: ThemeData(
+      primarySwatch: Util.createMaterialColor(
+          Theme.of(context).extension<StackColors>()!.accentColorDark),
+    ),
+    //TODO pick a better initial date
+    // 2007 chosen as that is just before bitcoin launched
+    firstDate: DateTime(2007),
+    lastDate: DateTime.now(),
+    borderRadius: Constants.size.circularBorderRadius * 2,
+
+    textPositiveButton: "SELECT",
+
+    styleDatePicker: _buildDatePickerStyle(context),
+    styleYearPicker: _buildYearPickerStyle(context),
+  );
+  return date;
+}
+
+MaterialRoundedDatePickerStyle _buildDatePickerStyle(BuildContext context) {
+  final baseColor = Theme.of(context).extension<StackColors>()!.textSubtitle2;
+  return MaterialRoundedDatePickerStyle(
+    backgroundPicker: Theme.of(context).extension<StackColors>()!.popupBG,
+    paddingMonthHeader: const EdgeInsets.only(top: 11),
+    colorArrowNext: Theme.of(context).extension<StackColors>()!.textSubtitle1,
+    colorArrowPrevious:
+        Theme.of(context).extension<StackColors>()!.textSubtitle1,
+    textStyleButtonNegative: STextStyles.datePicker600(context).copyWith(
+      color: baseColor,
+    ),
+    textStyleButtonPositive: STextStyles.datePicker600(context).copyWith(
+      color: baseColor,
+    ),
+    textStyleCurrentDayOnCalendar: STextStyles.datePicker400(context),
+    textStyleDayHeader: STextStyles.datePicker600(context),
+    textStyleDayOnCalendar: STextStyles.datePicker400(context).copyWith(
+      color: baseColor,
+    ),
+    textStyleDayOnCalendarDisabled: STextStyles.datePicker400(context).copyWith(
+      color: Theme.of(context).extension<StackColors>()!.textSubtitle3,
+    ),
+    textStyleDayOnCalendarSelected: STextStyles.datePicker400(context).copyWith(
+      color: Theme.of(context).extension<StackColors>()!.textWhite,
+    ),
+    textStyleMonthYearHeader: STextStyles.datePicker600(context).copyWith(
+      color: Theme.of(context).extension<StackColors>()!.textSubtitle1,
+    ),
+    textStyleYearButton: STextStyles.datePicker600(context).copyWith(
+      color: Theme.of(context).extension<StackColors>()!.textWhite,
+    ),
+    textStyleButtonAction: GoogleFonts.inter(),
+  );
+}
+
+MaterialRoundedYearPickerStyle _buildYearPickerStyle(BuildContext context) {
+  return MaterialRoundedYearPickerStyle(
+    backgroundPicker: Theme.of(context).extension<StackColors>()!.popupBG,
+    textStyleYear: STextStyles.datePicker600(context).copyWith(
+      color: Theme.of(context).extension<StackColors>()!.textSubtitle2,
+      fontSize: 16,
+    ),
+    textStyleYearSelected: STextStyles.datePicker600(context).copyWith(
+      fontSize: 18,
+    ),
+  );
+}