Network

FLEX NetworkFeature provides network connectivity management for your Flutter apps. It monitors network status changes, provides real-time connectivity updates, and enables developers to build robust offline-capable commerce experiences.

Overview

The NetworkFeature consists of:

• ConnectivityManager: Core service for monitoring network connectivity
• NetworkStatus: Enumeration of possible network states
• Stream-based Updates: Real-time connectivity change notifications
• Connection Type Detection: Identifies WiFi, mobile, ethernet, and offline states

Configuration

Basic Setup

Configure the NetworkFeature in your main.dart:

await FlexCore.initialize([
  NetworkFeature(),
  // Other features...
]);

Network Status Types

The system recognizes three network states:

enum NetworkStatus {
  online,   // Device has active internet connectivity
  offline,  // Device has no internet connectivity
  unknown,  // Connectivity state cannot be determined
}

Basic Usage

Getting the ConnectivityManager

final connectivityManager = FlexCore.container.get<ConnectivityManager>();

// Check current status
final isOnline = connectivityManager.isOnline;
final isOffline = connectivityManager.isOffline;
final currentStatus = connectivityManager.currentStatus;

// Get detailed connection types
final connectionTypes = await connectivityManager.getConnectionTypes();

Listening to Network Changes

class NetworkAwareService {
  final ConnectivityManager _connectivityManager;
  late StreamSubscription<NetworkStatus> _networkSubscription;

  NetworkAwareService(this._connectivityManager);

  void initialize() {
    _networkSubscription = _connectivityManager.statusStream.listen(
      (status) {
        switch (status) {
          case NetworkStatus.online:
            _handleOnline();
            break;
          case NetworkStatus.offline:
            _handleOffline();
            break;
          case NetworkStatus.unknown:
            _handleUnknown();
            break;
        }
      },
    );
  }

  void _handleOnline() {
    print('🟢 Network is online');
    // Sync pending data, resume API calls, etc.
  }

  void _handleOffline() {
    print('🔴 Network is offline');
    // Cache data, queue operations, show offline UI
  }

  void _handleUnknown() {
    print('⚪ Network status unknown');
    // Handle uncertainty, maybe retry detection
  }

  void dispose() {
    _networkSubscription.cancel();
  }
}

UI Integration

Network Status Widget

class NetworkStatusWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final connectivityManager = FlexCore.container.get<ConnectivityManager>();

    return StreamBuilder<NetworkStatus>(
      stream: connectivityManager.statusStream,
      initialData: connectivityManager.currentStatus,
      builder: (context, snapshot) {
        final status = snapshot.data ?? NetworkStatus.unknown;

        return Container(
          padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
          color: _getStatusColor(status),
          child: Row(
            mainAxisSize: MainAxisSize.min,
            children: [
              Icon(_getStatusIcon(status), size: 16, color: Colors.white),
              const SizedBox(width: 8),
              Text(
                _getStatusText(status),
                style: const TextStyle(color: Colors.white, fontSize: 12),
              ),
            ],
          ),
        );
      },
    );
  }

  Color _getStatusColor(NetworkStatus status) {
    switch (status) {
      case NetworkStatus.online:
        return Colors.green;
      case NetworkStatus.offline:
        return Colors.red;
      case NetworkStatus.unknown:
        return Colors.orange;
    }
  }

  IconData _getStatusIcon(NetworkStatus status) {
    switch (status) {
      case NetworkStatus.online:
        return Icons.wifi;
      case NetworkStatus.offline:
        return Icons.wifi_off;
      case NetworkStatus.unknown:
        return Icons.help_outline;
    }
  }

  String _getStatusText(NetworkStatus status) {
    switch (status) {
      case NetworkStatus.online:
        return 'Online';
      case NetworkStatus.offline:
        return 'Offline';
      case NetworkStatus.unknown:
        return 'Connection Unknown';
    }
  }
}

Offline Banner

class OfflineBanner extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final connectivityManager = FlexCore.container.get<ConnectivityManager>();

    return StreamBuilder<NetworkStatus>(
      stream: connectivityManager.statusStream,
      initialData: connectivityManager.currentStatus,
      builder: (context, snapshot) {
        final isOffline = snapshot.data == NetworkStatus.offline;

        return AnimatedContainer(
          duration: const Duration(milliseconds: 300),
          height: isOffline ? 40 : 0,
          child: isOffline
              ? Container(
                  color: Colors.red,
                  child: const Center(
                    child: Text(
                      'You\'re currently offline',
                      style: TextStyle(color: Colors.white),
                    ),
                  ),
                )
              : const SizedBox.shrink(),
        );
      },
    );
  }
}