Flutter CircularProgressIndicator() animation is not working inside Riverpod`s ref.watch().when

Question

CircularProgressIndicator Screen Shot

I'm using Riverpod for state-management

CircularProgressIndicator occupies only 4 pixels under any conditions

I tested on a physical device and on an emulator

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_web_lights/providers.dart';

class SearchDevices extends ConsumerStatefulWidget {
  const SearchDevices({Key? key}) : super(key: key);

  @override
  _SearchDevicesState createState() => _SearchDevicesState();
}

class _SearchDevicesState extends ConsumerState<SearchDevices> {
  @override
  Widget build(BuildContext context) {
    final ip = ref.watch(FutureIPsProvider);
    return Scaffold(
      appBar: AppBar(),
      // backgroundColor: Theme.of(context).backgroundColor,
      body: SafeArea(
        child: Column(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            ip.when(
              data: ((data) {
                return ListView.builder(
                  shrinkWrap: true,
                  itemCount: data.length,
                  itemBuilder: (BuildContext context, int index) {
                    return Text(data[index]);
                  },
                );
              }),
              error: (error, stack) {
                return Text('err');
              },
              loading: () => const SizedBox.square(
                dimension: 40,
                child: FittedBox(
                  fit: BoxFit.fill,
                  child: CircularProgressIndicator(),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

FutureIPsProvider

import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_web_lights/services/scan_service.dart';

final FutureIPsProvider = FutureProvider<List<String>>(((ref) async {
  return await ref.watch(IpProvider).Scan();
}));

IpProvider

import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:network_info_plus/network_info_plus.dart';
import 'package:network_tools/network_tools.dart';

final IpProvider = Provider<IPScaner>(
  (ref) => IPScaner(),
);

class IPScaner {
  String ip = "";
  String subnet = "";
  int port = 80;

  Future<List<String>> Scan() async {
    List<String> IPs = [];
    var wifiInfo = NetworkInfo();
    ip = (await wifiInfo.getWifiIP())!;
    subnet = ip.substring(0, ip.lastIndexOf('.'));
    final stream = HostScanner.discover(subnet, firstSubnet: 1, lastSubnet: 50,
        progressCallback: (progress) {
      print('Progress for host discovery : $progress');
    });
    stream.listen((host) {
      print('Found device: ${host}');
      IPs.toList();
      IPs.add(host.ip);
    }, onDone: () {
      print('Scan completed');
    });

    return IPs;
  }
}

dimension: 300

CircularProgressIndicator() works only like this

return Scaffold(
      // backgroundColor: Theme.of(context).backgroundColor,
      body: SafeArea(
        
          child: Column(
            mainAxisSize: MainAxisSize.max,
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
               CircularProgressIndicator()
            ],
          
        ),
      ),
    );

Answer 1

My Provider was causing the issure

stream.listen(
      (host) {
        print('Found device: ${host}');
      },
      onDone: () {
        print('Scan completed');
        isDone = true;
      },
    );
    return IPs;

FIX:

await for (final res in stream) {
      IPs.toList();
      IPs.add(res.ip);
    }
    return IPs;

I know what it was stupid eroor but Huuuge thanks to @Yeasin Sheikh for helping me out