feat: Categorize recent items TomBursch#149

Add categories for recent items, make recent category titles smaller and italic to visually separate them from original categories.
rmax1024 · Feb 22, 2024 · 489133e · 489133e
1 parent 89f87d1
commit 489133e
Show file tree

Hide file tree

Showing 2 changed files with 57 additions and 13 deletions.
diff --git a/kitchenowl/lib/pages/household_page/shoppinglist.dart b/kitchenowl/lib/pages/household_page/shoppinglist.dart
@@ -255,6 +255,10 @@ class _ShoppinglistPageState extends State<ShoppinglistPage> {
                             shoppingList: state.selectedShoppinglist,
                             onRefresh: cubit.refresh,
                             isLoading: state is LoadingShoppinglistCubitState,
+                            splitByCategories: !(state.sorting !=
+                                  ShoppinglistSorting.category ||
+                                  state is LoadingShoppinglistCubitState &&
+                                      state.listItems.isEmpty),
                           ),
                       ],
                     );

diff --git a/kitchenowl/lib/widgets/home_page/sliver_category_item_grid_list.dart b/kitchenowl/lib/widgets/home_page/sliver_category_item_grid_list.dart
@@ -20,6 +20,8 @@ class SliverCategoryItemGridList<T extends Item> extends StatefulWidget {
   final bool isLoading;
   final bool? allRaised;
   final Widget Function(T)? extraOption;
+  final bool isSubTitle;
+  final bool splitByCategories;
 
   const SliverCategoryItemGridList({
     super.key,
@@ -35,6 +37,8 @@ class SliverCategoryItemGridList<T extends Item> extends StatefulWidget {
     this.isLoading = false,
     this.allRaised,
     this.extraOption,
+    this.isSubTitle = false,
+    this.splitByCategories = false,
   });
 
   @override
@@ -48,6 +52,53 @@ class _SliverCategoryItemGridListState<T extends Item>
 
   @override
   Widget build(BuildContext context) {
+    TextStyle? titleTextStyle = Theme.of(context).textTheme.titleLarge;
+    if (widget.isSubTitle)
+      titleTextStyle = titleTextStyle?.apply(fontStyle: FontStyle.italic, fontWeightDelta: -1);
+
+    List<Widget> list = [];
+    final categoryLength = widget.categories?.length ?? 0;
+
+    if (widget.splitByCategories) {
+      for (int i = 0; i < categoryLength + 1; i++) {
+        Category? category = i < categoryLength
+            ? widget.categories![i]
+            : null;
+        final List<T> items = widget.items
+            .where((e) => e.category == category)
+            .toList();
+        if (items.isEmpty) continue;
+
+        list.add(SliverCategoryItemGridList(
+          name: category?.name ??
+              AppLocalizations.of(context)!.uncategorized,
+          items: items,
+          categories: widget.categories,
+          shoppingList: widget.shoppingList,
+          selected: widget.selected,
+          isLoading: widget.isLoading,
+          onRefresh: widget.onRefresh,
+          onPressed: widget.onPressed,
+          isSubTitle: true,
+          allRaised: widget.allRaised,
+          extraOption: widget.extraOption,
+        ));
+      }
+    }
+    else
+      list.add(SliverItemGridList<T>(
+        onRefresh: widget.onRefresh,
+        onPressed: widget.onPressed,
+        onLongPressed: widget.onLongPressed,
+        items: widget.items,
+        categories: widget.categories,
+        shoppingList: widget.shoppingList,
+        selected: widget.selected,
+        isLoading: widget.isLoading,
+        allRaised: widget.allRaised,
+        extraOption: widget.extraOption,
+      ));
+
     return SliverMainAxisGroup(
       slivers: [
         SliverToBoxAdapter(
@@ -64,7 +115,7 @@ class _SliverCategoryItemGridListState<T extends Item>
                   Expanded(
                     child: Text(
                       widget.name,
-                      style: Theme.of(context).textTheme.titleLarge,
+                      style: titleTextStyle,
                     ),
                   ),
                   IconButton(
@@ -86,18 +137,7 @@ class _SliverCategoryItemGridListState<T extends Item>
           duration: widget.animationDuration,
           child: !isExpanded
               ? const SliverToBoxAdapter(child: SizedBox())
-              : SliverItemGridList<T>(
-                  onRefresh: widget.onRefresh,
-                  onPressed: widget.onPressed,
-                  onLongPressed: widget.onLongPressed,
-                  items: widget.items,
-                  categories: widget.categories,
-                  shoppingList: widget.shoppingList,
-                  selected: widget.selected,
-                  isLoading: widget.isLoading,
-                  allRaised: widget.allRaised,
-                  extraOption: widget.extraOption,
-                ),
+              : MultiSliver(children: list),
         ),
       ],
     );