feat\!: add index to separator builder (#47)

Author: erickzanardo

example/lib/advanced/advanced_example.dart

@@ -35,7 +35,7 @@ class AdvancedExample extends StatelessWidget {
               hasError: state.error != null,
               hasReachedMax: state.hasReachedMax,
               onFetchData: () => context.read<PeopleCubit>().loadData(),
-              separatorBuilder: (context) => const Divider(),
+              separatorBuilder: (context, _) => const Divider(),
               itemBuilder: (context, index) {
                 return ListTile(
                   dense: true,

example/lib/simple/simple_example.dart

@@ -47,7 +47,11 @@ class SimpleExampleState extends State<SimpleExample> {
         itemCount: _items.length,
         isLoading: _isLoading,
         onFetchData: _fetchData,
-        separatorBuilder: (context) => const Divider(),
+        separatorBuilder: (context, index) {
+          return Divider(
+            color: index.isOdd ? Colors.black : Colors.blue,
+          );
+        },
         itemBuilder: (context, index) {
           return ListTile(
             dense: true,

example/lib/sliver/sliver_example.dart

@@ -53,7 +53,7 @@ class SliverExampleState extends State<SliverExample> {
             itemCount: _items.length,
             isLoading: _isLoading,
             onFetchData: _fetchData,
-            separatorBuilder: (context) => const Divider(),
+            separatorBuilder: (context, _) => const Divider(),
             itemBuilder: (context, index) {
               return ListTile(
                 dense: true,

lib/src/infinite_list.dart

@@ -165,7 +165,7 @@ class InfiniteList extends StatelessWidget {
   ///
   /// Is optional and can be `null`.
   /// {@endtemplate}
-  final WidgetBuilder? separatorBuilder;
+  final IndexedWidgetBuilder? separatorBuilder;
 
   /// {@template item_builder}
   /// The builder used to build a widget for every index of the `itemCount`.

lib/src/sliver_infinite_list.dart

@@ -54,7 +54,7 @@ class SliverInfiniteList extends StatefulWidget {
   final WidgetBuilder? errorBuilder;
 
   /// {@macro separator_builder}
-  final WidgetBuilder? separatorBuilder;
+  final IndexedWidgetBuilder? separatorBuilder;
 
   /// {@macro item_builder}
   final ItemBuilder itemBuilder;
@@ -142,10 +142,10 @@ class _SliverInfiniteListState extends State<SliverInfiniteList> {
               return widget.emptyBuilder!(context);
             }
           } else {
+            final itemIndex = !showSeparator ? index : (index / 2).floor();
             if (showSeparator && index.isOdd) {
-              return widget.separatorBuilder!(context);
+              return widget.separatorBuilder!(context, itemIndex);
             } else {
-              final itemIndex = !showSeparator ? index : (index / 2).floor();
               return widget.itemBuilder(context, itemIndex);
             }
           }

test/infinite_list_test.dart

@@ -169,7 +169,7 @@ void main() {
           InfiniteList(
             itemCount: itemCount,
             onFetchData: emptyCallback,
-            separatorBuilder: (_) {
+            separatorBuilder: (_, __) {
               separatorBuilderCalls++;
               return const Divider();
             },
@@ -181,6 +181,28 @@ void main() {
       },
     );
 
+    testWidgets(
+      'forward the correct indexes to separatorBuilder',
+      (tester) async {
+        const itemCount = 20;
+        final indexes = <int>[];
+
+        await tester.pumpApp(
+          InfiniteList(
+            itemCount: itemCount,
+            onFetchData: emptyCallback,
+            separatorBuilder: (_, index) {
+              indexes.add(index);
+              return const Divider();
+            },
+            itemBuilder: (_, i) => Text('$i'),
+          ),
+        );
+
+        expect(indexes, equals(List.generate(itemCount - 1, (index) => index)));
+      },
+    );
+
     group('with an empty set of items', () {
       testWidgets(
         'renders no list items by default',
@@ -380,7 +402,7 @@ void main() {
               dimension: 40,
               child: ColoredBox(color: colors[i % colors.length]),
             ),
-            separatorBuilder: (_) => const SizedBox.square(
+            separatorBuilder: (_, __) => const SizedBox.square(
               dimension: 10,
               child: ColoredBox(color: Colors.pink),
             ),
@@ -422,7 +444,7 @@ void main() {
               dimension: 40,
               child: ColoredBox(color: colors[i % colors.length]),
             ),
-            separatorBuilder: (_) => const SizedBox.square(
+            separatorBuilder: (_, __) => const SizedBox.square(
               dimension: 10,
               child: ColoredBox(color: Colors.pink),
             ),