Added debounce and removed transaction type from query results

alvesluc · Oct 21, 2022 · 35dc551 · 35dc551
1 parent f22e411
commit 35dc551
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 85 deletions.
diff --git a/lib/src/features/home/models/transaction.dart b/lib/src/features/home/models/transaction.dart
@@ -61,6 +61,6 @@ class TransactionModel {
   }
 
   String toQuery() {
-    return '($description ${value.toCurrency()} $category ${type.name} ${DateFormat('dd/MM/y').format(entryDate)})'.toLowerCase();
+    return '($description ${value.toCurrency()} $category ${DateFormat('dd/MM/y').format(entryDate)})'.toLowerCase();
   }
 }
diff --git a/lib/src/features/home/widgets/search_transactions.dart b/lib/src/features/home/widgets/search_transactions.dart
@@ -1,10 +1,9 @@
+import 'dart:async';
+
 import 'package:flutter/material.dart';
-import 'package:phosphor_flutter/phosphor_flutter.dart';
 import 'package:provider/provider.dart';
 
 import '../../../providers/transactions_provider.dart';
-import '../../../shared/colors.dart';
-import '../../../shared/extensions.dart';
 import '../../../shared/widgets/default_textfield.dart';
 
 class SearchTransactions extends StatefulWidget {
@@ -15,13 +14,20 @@ class SearchTransactions extends StatefulWidget {
 }
 
 class _SearchTransactionsState extends State<SearchTransactions> {
-  String query = '';
+  Timer? _debounce;
 
-  void _onChanged(String text) => query = text;
+  _onSearchChanged(String query) {
+    if (_debounce?.isActive ?? false) _debounce?.cancel();
+    _debounce = Timer(const Duration(milliseconds: 300), () {
+      final transactionsStore = context.read<TransactionsStore>();
+      transactionsStore.searchTransaction(query);
+    });
+  }
 
-  void _onSearch(BuildContext context) {
-    final transactionStore = context.read<TransactionsStore>();
-    transactionStore.searchTransaction(query);
+  @override
+  void dispose() {
+    _debounce?.cancel();
+    super.dispose();
   }
 
   @override
@@ -35,82 +41,9 @@ class _SearchTransactionsState extends State<SearchTransactions> {
               constraints: const BoxConstraints(maxWidth: 1168),
               padding: const EdgeInsets.symmetric(horizontal: 24),
               transform: Matrix4.translationValues(0.0, -12.0, 0.0),
-              child: Row(
-                mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                children: [
-                  Expanded(
-                    child: DefaultTextField(
-                      hint: 'Busque por uma transação',
-                      onChanged: _onChanged,
-                    ),
-                  ),
-                  const SizedBox(width: 8),
-                  SizedBox(
-                    height: double.maxFinite,
-                    child: Builder(
-                      builder: (_) {
-                        if (constraints.isDesktop) {
-                          return OutlinedButton(
-                            onPressed: () => _onSearch(context),
-                            style: OutlinedButton.styleFrom(
-                              backgroundColor: Colors.transparent,
-                              padding: const EdgeInsets.symmetric(
-                                vertical: 16,
-                                horizontal: 32,
-                              ),
-                              side: const BorderSide(
-                                width: 1,
-                                color: AppColors.greenLight,
-                              ),
-                              shape: const RoundedRectangleBorder(
-                                borderRadius:
-                                    BorderRadius.all(Radius.circular(6.0)),
-                              ),
-                            ),
-                            child: Row(
-                              children: const [
-                                Icon(
-                                  PhosphorIcons.magnifyingGlassBold,
-                                  color: AppColors.greenLight,
-                                  size: 20,
-                                ),
-                                SizedBox(width: 12),
-                                Text(
-                                  'Buscar',
-                                  style: TextStyle(
-                                    fontSize: 16,
-                                    fontWeight: FontWeight.bold,
-                                    color: AppColors.greenLight,
-                                  ),
-                                )
-                              ],
-                            ),
-                          );
-                        }
-                        return OutlinedButton(
-                          onPressed: () => _onSearch(context),
-                          style: OutlinedButton.styleFrom(
-                            backgroundColor: Colors.transparent,
-                            minimumSize: const Size(0, 0),
-                            side: const BorderSide(
-                              width: 1,
-                              color: AppColors.greenLight,
-                            ),
-                            shape: const RoundedRectangleBorder(
-                              borderRadius:
-                                  BorderRadius.all(Radius.circular(6.0)),
-                            ),
-                          ),
-                          child: const Icon(
-                            PhosphorIcons.magnifyingGlassBold,
-                            color: AppColors.greenLight,
-                            size: 20,
-                          ),
-                        );
-                      },
-                    ),
-                  ),
-                ],
+              child: DefaultTextField(
+                hint: 'Busque por uma transação',
+                onChanged: _onSearchChanged,
               ),
             );
           },