Searchable materials

lib/core/widgets/search_page.dart

@@ -0,0 +1,39 @@
+import 'package:flutter/material.dart';
+
+class SearchPage extends StatefulWidget {
+  final Widget Function(BuildContext, String) builder;
+
+  SearchPage({@required this.builder});
+
+  @override
+  _SearchPageState createState() => _SearchPageState();
+}
+
+class _SearchPageState extends State<SearchPage> {
+  String _search = "";
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: <Widget>[
+        Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 20.0, vertical: 10.0),
+          child: TextFormField(
+            decoration: InputDecoration(
+              hintText: "Item to search for",
+              labelText: "Search",
+              contentPadding: EdgeInsets.symmetric(horizontal: 8.0, vertical: 4.0),
+              focusColor: Theme.of(context).accentColor
+            ),
+            onChanged: (String value) {
+              setState(() => _search = value );
+            },
+          ),
+        ),
+        Expanded(
+          child: widget.builder(context, _search)
+        )
+      ]
+    );
+  }
+}

lib/features/bank/pages/generic_bank.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:guildwars2_companion/core/widgets/accent.dart';
 import 'package:guildwars2_companion/core/widgets/appbar.dart';
+import 'package:guildwars2_companion/core/widgets/search_page.dart';
 import 'package:guildwars2_companion/features/error/widgets/error.dart';
 import 'package:guildwars2_companion/core/widgets/list_view.dart';
 import 'package:guildwars2_companion/features/bank/bloc/bank_bloc.dart';
@@ -71,15 +72,32 @@ class _BankListView extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    return SearchPage(builder: buildBankList);
+  }
+
+  CompanionListView buildBankList(BuildContext context, String search) {
     return CompanionListView(
       children: Iterable
         .generate((inventory.length / 30).ceil())
         .map((index) {
           List<InventoryItem> bankTab = inventory
             .skip(index * 30)
             .take(30)
+            .where((i) {
+              if (search.isEmpty) {
+                return true;
+              }
+
+              return i.itemInfo != null 
+                     && i.itemInfo.name != null
+                     && i.itemInfo.name.toLowerCase().contains(search.toLowerCase());
+            })
             .toList();
 
+          if (bankTab.isEmpty) {
+            return Container();
+          }
+
           return Padding(
             padding: EdgeInsets.symmetric(horizontal: 8.0, vertical: 4.0),
             child: Column(

lib/features/bank/pages/material.dart

@@ -2,14 +2,21 @@ import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:guildwars2_companion/core/widgets/accent.dart';
 import 'package:guildwars2_companion/core/widgets/appbar.dart';
+import 'package:guildwars2_companion/core/widgets/search_page.dart';
 import 'package:guildwars2_companion/features/error/widgets/error.dart';
 import 'package:guildwars2_companion/core/widgets/list_view.dart';
 import 'package:guildwars2_companion/features/bank/bloc/bank_bloc.dart';
 import 'package:guildwars2_companion/features/bank/models/material_category.dart';
 import 'package:guildwars2_companion/features/item/enums/item_section.dart';
 import 'package:guildwars2_companion/features/item/widgets/item_box.dart';
 
-class MaterialBankPage extends StatelessWidget {
+
+class MaterialBankPage extends StatefulWidget {
+  @override
+  _MaterialBankPageState createState() => _MaterialBankPageState();
+}
+
+class _MaterialBankPageState extends State<MaterialBankPage> {
   @override
   Widget build(BuildContext context) {
     return CompanionAccent(
@@ -39,11 +46,7 @@ class MaterialBankPage extends StatelessWidget {
                   BlocProvider.of<BankBloc>(context).add(LoadBankEvent());
                   await Future.delayed(Duration(milliseconds: 200), () {});
                 },
-                child: CompanionListView(
-                  children: state.materialCategories
-                    .map((c) => _MaterialCategoryCard(category: c))
-                    .toList(),
-                ),
+                child: SearchPage(builder: (context, search) { return buildCategories(state, search); })
               );
             }
 
@@ -55,15 +58,39 @@ class MaterialBankPage extends StatelessWidget {
       ),
     );
   }
+
+  CompanionListView buildCategories(LoadedBankState state, String search) {
+    return CompanionListView(
+      children: state.materialCategories
+        .map((c) => _MaterialCategoryCard(category: c, search: search))
+        .toList(),
+    );
+  }
 }
 
 class _MaterialCategoryCard extends StatelessWidget {
   final MaterialCategory category;
+  String search;
 
-  _MaterialCategoryCard({@required this.category});
+  _MaterialCategoryCard({@required this.category, @required this.search});
 
   @override
   Widget build(BuildContext context) {
+    var items = category.materials
+      .where((i) => i.itemInfo.name.toLowerCase().contains(search.toLowerCase()))
+      .map((i) => ItemBox(
+        item: i.itemInfo,
+        quantity: i.count,
+        hero: '${i.id} ${category.materials.indexOf(i)}',
+        includeMargin: false,
+        section: ItemSection.MATERIAL,
+      ))
+      .toList();
+
+    if (items.isEmpty) {
+      return Container();
+    }
+
     return Padding(
       padding: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 4.0),
       child: Column(
@@ -82,15 +109,7 @@ class _MaterialCategoryCard extends StatelessWidget {
               alignment: WrapAlignment.center,
               spacing: 4.0,
               runSpacing: 4.0,
-              children: category.materials
-                .map((i) => ItemBox(
-                  item: i.itemInfo,
-                  quantity: i.count,
-                  hero: '${i.id} ${category.materials.indexOf(i)}',
-                  includeMargin: false,
-                  section: ItemSection.MATERIAL,
-                ))
-                .toList(),
+              children: items,
             ),
           ),
         ],