Compose Multiplatform Connectivity Monitor

CMPConnectivityMonitor is a Compose Multiplatform library that provides seamless network connectivity monitoring for Android, iOS, wasmJs and Desktop platforms. It helps you easily detect and respond to changes in network status within your Compose Multiplatform applications.

Features

• Monitors network connectivity status in real-time.
• Supports both Wi-Fi and Cellular network types.
• Provides connectivity status updates via a simple and consistent API.
• Supports iOS, Android, wasmJs and Desktop platforms.

Installation

Add the following dependency to your build.gradle.kts file:

commonMain.dependencies {
    implementation("network.chaintech:compose-connectivity-monitor:1.0.4")
}

⚙️ Customizing the Test URL for Network Checks

By default, the library uses https://connectivitycheck.gstatic.com/generate_204 to check internet connectivity. If this URL is blocked or inaccessible in your region, you can override it with a custom endpoint using:

NetworkReachabilityConfig.configureTestUrl("https://example.com/ping") // Set a custom URL

This will change the URL used by internal network reachability checks across all supported platforms.

Setup

Android

In your AppActivity, initialize the ConnectivityMonitor:

class AppActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        ConnectivityMonitor.initialize(this)
    }
}

Usage

Initialize the Connectivity Monitor

Create an instance of ConnectivityMonitor in your shared code:

val connectivityMonitor = ConnectivityMonitor.instance

Start Monitoring

Start monitoring network connectivity:

connectivityMonitor.startMonitoring()

Stop Monitoring

Stop monitoring network connectivity when it is no longer needed:

connectivityMonitor.stopMonitoring()

Hard Refresh

Perform a hard refresh to recheck the current network status:

connectivityMonitor.refresh()

Observe Connectivity Status

Use a StateFlow to observe the connectivity status:

val connectivityStatus: StateFlow<ConnectivityStatus> = connectivityMonitor.status

You can then use this state in your Compose UI:

@Composable
fun ConnectivityStatusView() {
    val status by connectivityMonitor.status.collectAsState()

    when (status) {
        ConnectivityStatus.CONNECTED,
        ConnectivityStatus.CONNECTED_VIA_CELLULAR,
        ConnectivityStatus.CONNECTED_VIA_WIFI -> {
            // Show connected UI
        }
        ConnectivityStatus.NOT_CONNECTED,
        ConnectivityStatus.CONNECTED_VIA_CELLULAR_WITHOUT_INTERNET,
        ConnectivityStatus.CONNECTED_VIA_WIFI_WITHOUT_INTERNET -> {
            // Show disconnected UI
        }
        ConnectivityStatus.DETERMINING -> {
            // Show loading or determining UI
        }
    }
}

Connectivity Status

The ConnectivityStatus enum provides various states to represent the connectivity status:

• CONNECTED
• CONNECTED_VIA_CELLULAR
• CONNECTED_VIA_CELLULAR_WITHOUT_INTERNET
• CONNECTED_VIA_WIFI
• CONNECTED_VIA_WIFI_WITHOUT_INTERNET
• DETERMINING
• NOT_CONNECTED

Detailed Explanation

For an in-depth guide and detailed explanation, check out our comprehensive Medium Blog Post.