container background color

app/lib/features/geckoview/features/tabs/presentation/screens/container_draft_suggestions.dart

@@ -84,7 +84,7 @@ class ContainerDraftSuggestionsScreen extends HookConsumerWidget {
                   SizedBox(
                     height: 48,
                     child: SelectableChips(
-                      deleteIcon: false,
+                      enableDelete: false,
                       sortSelectedFirst: false,
                       itemId: (container) => container,
                       itemAvatar: (container) =>

app/lib/features/geckoview/features/tabs/presentation/widgets/container_chips.dart

@@ -26,7 +26,7 @@ import 'package:nullability/nullability.dart';
 import 'package:skeletonizer/skeletonizer.dart';
 import 'package:weblibre/core/logger.dart';
 import 'package:weblibre/core/routing/routes.dart';
-import 'package:weblibre/features/geckoview/features/browser/presentation/controllers/tab_suggestions.dart';
+import 'package:weblibre/features/geckoview/features/browser/presentation/controllers/tab_view_controllers.dart';
 import 'package:weblibre/features/geckoview/features/tabs/data/entities/container_filter.dart';
 import 'package:weblibre/features/geckoview/features/tabs/data/models/container_data.dart';
 import 'package:weblibre/features/geckoview/features/tabs/domain/providers.dart';
@@ -91,16 +91,10 @@ class ContainerChips extends HookConsumerWidget {
             children: [
               Expanded(
                 child: SelectableChips(
-                  deleteIcon: false,
+                  enableDelete: false,
                   itemId: (container) => container.id,
-                  itemAvatar: (container) => Container(
-                    width: 20.0,
-                    height: 20.0,
-                    decoration: BoxDecoration(
-                      color: container.color,
-                      shape: BoxShape.circle,
-                    ),
-                  ),
+                  itemBackgroundColor: (container) =>
+                      container.color.withValues(alpha: 0.5),
                   itemLabel: (container) =>
                       ContainerTitle(container: container),
                   itemBadgeCount: (container) => container.tabCount,

app/lib/features/user/domain/presentation/screens/profile_restore.dart

@@ -3,7 +3,6 @@ import 'dart:io';
 import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:flutter_material_design_icons/flutter_material_design_icons.dart';
-import 'package:go_router/go_router.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:weblibre/core/routing/routes.dart';
 import 'package:weblibre/features/user/domain/services/user_backup.dart';

app/lib/presentation/widgets/selectable_chips.dart

@@ -55,18 +55,21 @@ class _GestureWrapper extends StatelessWidget {
 }
 
 class SelectableChips<T extends S, S, K> extends StatelessWidget {
-  final List<T> availableItems;
+  final Iterable<T> availableItems;
   final List<Widget> prefixListItems;
   final S? selectedItem;
   final int maxCount;
-  final bool deleteIcon;
+  final bool enableDelete;
   final bool sortSelectedFirst;
 
+  final ScrollController? scrollController;
+
   final K Function(S item) itemId;
   final Widget Function(T item) itemLabel;
   final Widget? Function(T item)? itemAvatar;
   final String? Function(T item)? itemTooltip;
   final int? Function(T item)? itemBadgeCount;
+  final Color? Function(T item)? itemBackgroundColor;
 
   final Widget Function(Widget child, S item)? itemWrap;
 
@@ -81,15 +84,17 @@ class SelectableChips<T extends S, S, K> extends StatelessWidget {
     this.itemBadgeCount,
     this.itemWrap,
     this.itemTooltip,
+    this.itemBackgroundColor,
     this.prefixListItems = const [],
     required this.availableItems,
     this.selectedItem,
     this.maxCount = 25,
-    this.deleteIcon = true,
+    this.enableDelete = true,
     this.onSelected,
     this.onDeleted,
     this.onLongPress,
     this.sortSelectedFirst = true,
+    this.scrollController,
     super.key,
   });
 
@@ -110,6 +115,7 @@ class SelectableChips<T extends S, S, K> extends StatelessWidget {
     }
 
     return FadingScroll(
+      controller: scrollController,
       fadingSize: 15,
       builder: (context, controller) {
         return ListView.builder(
@@ -148,7 +154,7 @@ class SelectableChips<T extends S, S, K> extends StatelessWidget {
                         onDeleted?.call(item);
                       }
                     },
-                    onDeleted: deleteIcon
+                    onDeleted: enableDelete
                         ? () {
                             onDeleted?.call(item);
                           }
@@ -156,6 +162,7 @@ class SelectableChips<T extends S, S, K> extends StatelessWidget {
                     label: itemLabel.call(item),
                     avatar: itemAvatar?.call(item),
                     tooltip: itemTooltip?.call(item),
+                    backgroundColor: itemBackgroundColor?.call(item),
                   ),
                 ),
               ),