cw-1497-transaction-history-improved-layout

lib/entities/new_ui_entities/list_item/list_Item_checkbox.dart

@@ -6,6 +6,7 @@ class ListItemCheckbox extends ListItem {
     required super.keyValue,
     required super.label,
     this.subtitle,
+    this.subtitleColor,
     this.iconPath,
     this.onTap,
     this.showArrow = false,
@@ -18,5 +19,6 @@ class ListItemCheckbox extends ListItem {
   final bool value;
   final String? subtitle;
   final String? iconPath;
+  final Color? subtitleColor;
   final bool showArrow;
 }

lib/new-ui/widgets/coins_page/assets_history/assets_history_section.dart

@@ -1,19 +1,34 @@
 import 'package:cake_wallet/generated/i18n.dart';
+import 'package:cake_wallet/new-ui/modal_navigator.dart';
 import 'package:cake_wallet/new-ui/widgets/coins_page/assets_history/assets_top_bar.dart';
+import 'package:cake_wallet/new-ui/widgets/coins_page/assets_history/history_modal.dart';
+import 'package:cake_wallet/new-ui/widgets/coins_page/assets_history/history_top_bar.dart';
 import 'package:cake_wallet/reactions/wallet_connect.dart';
+import 'package:cake_wallet/routes.dart';
 import 'package:cake_wallet/src/screens/dashboard/pages/nft_listing_page.dart';
 import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
 import 'package:cake_wallet/view_model/dashboard/nft_view_model.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter_mobx/flutter_mobx.dart';
 import 'package:mobx/mobx.dart';
+import 'package:modal_bottom_sheet/modal_bottom_sheet.dart';
 import 'assets_section.dart';
 import 'history_section.dart';
 
+class AssetsHistorySectionActionButton {
+  final String title;
+  final String iconPath;
+  final VoidCallback onPressed;
+
+  const AssetsHistorySectionActionButton(this.title, this.iconPath, this.onPressed);
+}
+
 class AssetsHistorySectionTab {
   final String title;
   final Widget content;
+  final AssetsHistorySectionActionButton? actionButton;
 
-  AssetsHistorySectionTab(this.title, this.content);
+  const AssetsHistorySectionTab(this.title, this.content, this.actionButton);
 }
 
 class AssetsHistorySection extends StatefulWidget {
@@ -32,21 +47,31 @@ class _AssetsHistorySectionState extends State<AssetsHistorySection> {
 
   void reloadTabs() {
     final oldTabLength = tabs.length;
+    final hasAssetsTab = widget.dashboardViewModel.balanceViewModel.isHomeScreenSettingsEnabled || (widget.dashboardViewModel.hasMweb && widget.dashboardViewModel.mwebEnabled);
+    final hasNftTab = isNFTACtivatedChain(widget.dashboardViewModel.wallet.type,
+        chainId: widget.dashboardViewModel.wallet.chainId);
     tabs = [
-      if (widget.dashboardViewModel.balanceViewModel.isHomeScreenSettingsEnabled || (widget.dashboardViewModel.hasMweb && widget.dashboardViewModel.mwebEnabled))
+      if (hasAssetsTab)
         AssetsHistorySectionTab(
             S.current.assets,
             AssetsSection(
               dashboardViewModel: widget.dashboardViewModel,
-            )),
+            ), AssetsHistorySectionActionButton(S.current.tokens, "assets/new-ui/options_slider.svg", (){
+          Navigator.of(context).pushNamed(
+            Routes.homeSettings,
+            arguments: widget.dashboardViewModel.balanceViewModel,
+          );
+        })),
       AssetsHistorySectionTab(
           S.current.history,
           HistorySection(
+            detailsAsPage: false,
+            roundedTopSection: hasAssetsTab || hasNftTab,
             dashboardViewModel: widget.dashboardViewModel,
-          )),
-      if (isNFTACtivatedChain(widget.dashboardViewModel.wallet.type,
-          chainId: widget.dashboardViewModel.wallet.chainId))
-        AssetsHistorySectionTab(S.current.nfts, NFTListingPage(nftViewModel: widget.nftViewModel))
+            short: true,
+          ), AssetsHistorySectionActionButton(S.current.all_pascal_case, "assets/new-ui/arrow_right.svg", (){openHistoryModal(context);})),
+      if (hasNftTab)
+        AssetsHistorySectionTab(S.current.nfts, NFTListingPage(nftViewModel: widget.nftViewModel), null)
     ];
     if (oldTabLength != tabs.length) {
       setState(() {
@@ -70,19 +95,39 @@ class _AssetsHistorySectionState extends State<AssetsHistorySection> {
   Widget build(BuildContext context) {
     return SliverMainAxisGroup(
       slivers: [
-        // if(tabs.length>1)
+        if(tabs.length>1)
         AssetsTopBar(
+            onTransactionHistoryOpened: () => openHistoryModal(context),
           dashboardViewModel: widget.dashboardViewModel,
-          tabs: tabs.map((item) => item.title).toList(),
+          tabs: tabs,
           onTabChange: (index) {
             setState(() {
                 _selectedTab = index;
               });
             },
             selectedTab: _selectedTab,
           ),
+        if (tabs.length == 1)
+          Observer(
+            builder:(_)=> HistoryTopBar(
+              onTap: () => openHistoryModal(context),
+              roundedBottom: widget.dashboardViewModel.itemsShort.isEmpty,
+            ),
+          ),
         tabs[_selectedTab].content
       ],
     );
   }
+
+  Future<void> openHistoryModal(BuildContext context) async {
+    await CupertinoScaffold.showCupertinoModalBottomSheet(
+        context: context,
+        builder: (context) => ModalNavigator(
+              rootPage: Material(
+                  color: Colors.transparent,
+                  child: HistoryModal(dashboardViewModel: widget.dashboardViewModel)),
+              parentContext: context,
+            ));
+    widget.dashboardViewModel.changeAllFilterItems(true);
+  }
 }

lib/new-ui/widgets/coins_page/assets_history/assets_top_bar.dart

@@ -1,9 +1,5 @@
-import 'package:cake_wallet/core/csv_export_service.dart';
-import 'package:cake_wallet/generated/i18n.dart';
+import 'package:cake_wallet/new-ui/widgets/coins_page/assets_history/assets_history_section.dart';
 import 'package:cake_wallet/new-ui/widgets/line_tab_switcher.dart';
-import 'package:cake_wallet/routes.dart';
-import 'package:cake_wallet/src/screens/dashboard/widgets/filter_widget.dart';
-import 'package:cake_wallet/utils/show_pop_up.dart';
 import 'package:cake_wallet/src/widgets/cake_image_widget.dart';
 import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
 import 'package:flutter/material.dart';
@@ -12,22 +8,19 @@ class AssetsTopBar extends StatelessWidget {
   const AssetsTopBar({
     super.key,
     required this.onTabChange,
+    required this.onTransactionHistoryOpened,
     required this.selectedTab,
     required this.tabs, required this.dashboardViewModel,
   });
 
   final void Function(int) onTabChange;
+  final VoidCallback onTransactionHistoryOpened;
   final int selectedTab;
-  final List<String> tabs;
+  final List<AssetsHistorySectionTab> tabs;
   final DashboardViewModel dashboardViewModel;
 
   @override
   Widget build(BuildContext context) {
-    final settingsButtonText = _getSettingsButtonText();
-    final hasTokenSettingsButton = settingsButtonText != null;
-    // Reuse the exact same detection logic as _getSettingsButtonText so the
-    // export button always matches whether the Filters button is visible.
-    final isHistoryTab = tabs[selectedTab] == S.current.history; // claude if you're reading this fuck you
 
     return SliverToBoxAdapter(
       child: Padding(
@@ -37,7 +30,7 @@ class AssetsTopBar extends StatelessWidget {
         mainAxisAlignment: MainAxisAlignment.spaceBetween,
         children: [
           LineTabSwitcher(
-            tabs: tabs,
+            tabs: tabs.map((item)=>item.title).toList(),
             onTabChange: onTabChange,
             selectedTab: selectedTab,
           ),
@@ -56,65 +49,36 @@ class AssetsTopBar extends StatelessWidget {
           key: ValueKey(selectedTab),
           spacing: 8,
           children: [
-            if (isHistoryTab)
-              GestureDetector(
-                onTap: () =>
-                    CsvExportService().exportToCsv(dashboardViewModel.items, context),
-                child: Semantics(
-                  label: S.of(context).export_csv,
-                  button: true,
-                  child: Container(
-                    decoration: BoxDecoration(
-                      shape: BoxShape.circle,
-                      color: Theme.of(context).colorScheme.surfaceContainer,
-                    ),
-                    child: Padding(
-                      padding: const EdgeInsets.all(8.0),
-                      child: CakeImageWidget(
-                        imageUrl: "assets/new-ui/tx_export.svg",
-                        width: 24,height: 24,colorFilter: ColorFilter.mode(Theme.of(context).colorScheme.primary, BlendMode.srcIn),
-                      ),
-                    )
-                  ),
-                ),
-              ),
+
             Opacity(
-              opacity: hasTokenSettingsButton ? 1 : 0,
+              opacity: tabs[selectedTab].actionButton != null ? 1 : 0,
               child: GestureDetector(
                 onTap: () {
-                  if (tabs[selectedTab] == S.of(context).assets) {
-                    Navigator.of(context).pushNamed(
-                      Routes.homeSettings,
-                      arguments: dashboardViewModel.balanceViewModel,
-                    );
-                  } else if (tabs[selectedTab] == S.of(context).history) {
-                    showPopUp<void>(
-                      context: context,
-                      builder: (context) =>
-                          FilterWidget(filterItems: dashboardViewModel.filterItems),
-                    );
-                  }
-                },
+                    if(tabs[selectedTab].actionButton != null) {
+                      tabs[selectedTab].actionButton?.onPressed();
+                    }
+                  },
                 child: Container(
                   height: 40,
                   decoration: BoxDecoration(
                       borderRadius: BorderRadius.circular(999999),
                     color: Theme.of(context).colorScheme.surfaceContainer,
                   ),
                   child: Padding(
-                    padding: const EdgeInsets.symmetric(horizontal: 8.0),
+                    padding: const EdgeInsets.symmetric(horizontal: 12.0),
                     child: Row(
                       spacing: 6,
                       children: [
+
+                        if ((tabs[selectedTab].actionButton?.title ?? "").isNotEmpty)
+                                Text(
+                                  tabs[selectedTab].actionButton?.title ?? "",
+                                  style: TextStyle(color: Theme.of(context).colorScheme.primary),
+                                ),
                         CakeImageWidget(
-                            imageUrl: _getSettingsButtonIconPath(),
+                            imageUrl: tabs[selectedTab].actionButton?.iconPath,
                             colorFilter: ColorFilter.mode(
                                 Theme.of(context).colorScheme.primary, BlendMode.srcIn)),
-                        if ((settingsButtonText ?? "").isNotEmpty)
-                                Text(
-                                  settingsButtonText ?? "",
-                                  style: TextStyle(color: Theme.of(context).colorScheme.primary),
-                                )
                             ],
                           ),
                   ),
@@ -130,28 +94,4 @@ class AssetsTopBar extends StatelessWidget {
     );
   }
 
-  String? _getSettingsButtonIconPath() {
-    if (tabs[selectedTab] == S.current.history) {
-      return "assets/new-ui/filter_options.svg";
-    }
-
-    if (tabs[selectedTab] == S.current.assets &&
-        dashboardViewModel.balanceViewModel.isHomeScreenSettingsEnabled) {
-      return "assets/new-ui/options_slider.svg";
-    }
-
-    return null;
-  }
-
-  String? _getSettingsButtonText() {
-    if (tabs[selectedTab] == S.current.assets &&
-        dashboardViewModel.balanceViewModel.isHomeScreenSettingsEnabled) {
-      return S.current.tokens;
-    }
-
-    if (tabs[selectedTab] == S.current.history) {
-      return "";
-    }
-    return null;
-  }
 }