Flutter colorScheme reverting to default after wrapping widget with Consumer

while taking a course on Flutter I ran into and issue where wrapping the IconButton with a consumer causes it to change colors from my theme to default blue. I assume it's because the context passed into the builder is different. What's the correct way of using the Consumer to retain the theme?

Here's the class with the Consumer:

class ProductItem extends StatelessWidget {
  const ProductItem({super.key});

  @override
  Widget build(BuildContext context) {
    final product = Provider.of<Product>(context, listen: false);

    return ClipRRect(
      borderRadius: BorderRadius.circular(10),
      child: GridTile(
        footer: GridTileBar(
          backgroundColor: Colors.black87,
          leading: Consumer<Product>(
            builder: (context, value, _) => IconButton(
              icon: Icon(
                value.isFavorite ? Icons.favorite : Icons.favorite_border,
              ),
              color: Theme.of(context).colorScheme.secondary,
              onPressed: () => product.toggleFavorite(),
            ),
          ),
          title: Text(
            product.title,
            textAlign: TextAlign.center,
          ),
          trailing: IconButton(
            icon: const Icon(Icons.shopping_cart),
            color: Theme.of(context).colorScheme.secondary,
            onPressed: () {},
          ),
        ),
        child: GestureDetector(
          onTap: () {
            Navigator.of(context).pushNamed(
              ProductDetailScreen.routeName,
              arguments: product.id,
            );
          },
          child: Image.network(
            product.imageUrl,
            fit: BoxFit.cover,
          ),
        ),
      ),
    );
  }
}

and here is the theme:

theme: ThemeData(
          colorScheme: ColorScheme.fromSwatch(
            primarySwatch: Colors.purple,
            accentColor: Colors.deepOrange,
          ),
          fontFamily: 'Lato',
        ),

Okay, I figured it out myself. The issue is that the context passed as an argument inside the Consumer builder method is a different context than the passed into the build method of ProductItem and overrides it inside the scope of Consumer.

To fix it all you need to do is rename the variable passed into the builder function (e.g. replace it with an underscore)

leading: Consumer<Product>(
  //also had to change child argument to two underscores to avoid name conflict
  builder: (_, value, __) => IconButton(
    icon: Icon(
      value.isFavorite ? Icons.favorite : Icons.favorite_border,
    ),
    color: Theme.of(context).colorScheme.secondary,
    onPressed: () => product.toggleFavorite(),
  ),
),