auto_refresh_on_reconnect #

A lightweight Flutter package that automatically refreshes widgets when internet connection is restored — without requiring developers to manually manage network listeners or rebuild the UI.

Demo #

Demo

Automatic refresh when internet connection is restored

Features #

✅ Automatic refresh on internet reconnection
✅ Real internet verification (not just WiFi connection)
✅ Debounced reconnection events to prevent rapid re-triggers
✅ Custom offline UI support
✅ State-management agnostic (works with Provider, Bloc, Riverpod, etc.)
✅ Builder-based API for data fetching
✅ Fully null-safe and tested

Installation #

Add this to your pubspec.yaml:

dependencies:
  auto_refresh_on_reconnect: ^0.1.0

Then run:

flutter pub get

Usage #

Basic Usage #

Wrap your widget with AutoRefreshOnReconnect and provide an onRefresh callback:

import 'package:auto_refresh_on_reconnect/auto_refresh_on_reconnect.dart';

AutoRefreshOnReconnect(
  onRefresh: () async {
    // Your refresh logic here
    await fetchProducts();
  },
  child: ProductListView(),
)

With Offline UI #

Display a custom widget when the device is offline:

AutoRefreshOnReconnect(
  onRefresh: () async {
    await fetchProducts();
  },
  offlineBuilder: (context) => Center(
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Icon(Icons.wifi_off, size: 64),
        SizedBox(height: 16),
        Text('No Internet Connection'),
      ],
    ),
  ),
  child: ProductListView(),
)

Custom Debounce Duration #

Adjust the debounce duration to control how quickly the refresh triggers after reconnection:

AutoRefreshOnReconnect(
  debounceDuration: Duration(seconds: 5), // Wait 5 seconds before refreshing
  onRefresh: () async {
    await fetchProducts();
  },
  child: ProductListView(),
)

Builder API #

Use the builder-based API for automatic data fetching and display:

AutoRefreshOnReconnectBuilder<List<Product>>(
  futureBuilder: () => fetchProducts(),
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting) {
      return Center(child: CircularProgressIndicator());
    }
    
    if (snapshot.hasError) {
      return Center(child: Text('Error: ${snapshot.error}'));
    }
    
    if (snapshot.hasData) {
      return ProductList(products: snapshot.data!);
    }
    
    return Center(child: Text('No data'));
  },
  offlineBuilder: (context) => Center(
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Icon(Icons.wifi_off, size: 64),
        SizedBox(height: 16),
        Text('Offline - will refresh when reconnected'),
      ],
    ),
  ),
)

Additional Information #

Platform Support #

✅ Android
✅ iOS
✅ Web
✅ macOS
✅ Windows
✅ Linux

How It Works #

Connectivity Monitoring: Uses connectivity_plus to monitor network state changes
Real Internet Verification: Performs HTTP HEAD requests to verify actual internet access
Debouncing: Prevents rapid successive refresh calls during unstable connections
Automatic Refresh: Triggers your callback when connection is restored after being offline

Contributing #

Contributions are welcome! Please feel free to submit a Pull Request.

License #

This project is licensed under the MIT License - see the LICENSE file for details.

Customization Options #

Custom Connectivity Service #

For testing or custom network check implementations, you can provide your own ConnectivityService:

class CustomConnectivityService extends ConnectivityService {
  @override
  Future<bool> hasInternetAccess() async {
    // Your custom internet check logic
    return true;
  }
}

AutoRefreshOnReconnect(
  connectivityService: CustomConnectivityService(),
  onRefresh: () async {
    await fetchData();
  },
  child: MyWidget(),
)

Custom Check URL #

Change the URL used for internet verification:

final service = ConnectivityService(
  checkUrl: 'https://example.com',
  timeout: Duration(seconds: 5),
);

AutoRefreshOnReconnect(
  connectivityService: service,
  onRefresh: () async {
    await fetchData();
  },
  child: MyWidget(),
)

Platform-Specific Behavior #

Web Platform #

On web platforms, the package handles CORS (Cross-Origin Resource Sharing) restrictions gracefully:

The package relies more on the connectivity status from connectivity_plus
HTTP HEAD requests may fail due to CORS, so the package assumes online status when connectivity is detected
To test offline behavior on web:
- Use Chrome DevTools → Network tab → Toggle "Offline"
- Or disable your network connection

Mobile & Desktop Platforms #

On mobile (iOS/Android) and desktop (macOS/Windows/Linux) platforms:

The package performs actual HTTP HEAD requests to verify internet access
This provides more accurate connectivity detection
Default check URL is https://www.google.com (customizable)

API Reference #