[feat] add network request logging and its list UI (#74)

* add network request logging and its list UI
* add configure method in DebugOverlay for customization

Author: Manabu-GT

build.gradle.kts

@@ -11,6 +11,8 @@ plugins {
   alias(libs.plugins.androidLibrary) apply false
   alias(libs.plugins.kotlin.android) apply false
   alias(libs.plugins.kotlin.compose) apply false
+  alias(libs.plugins.hilt.android) apply false
+  alias(libs.plugins.ksp) apply false
   alias(libs.plugins.dexcount) apply false
   alias(libs.plugins.mavenPublish) apply false
   alias(libs.plugins.detekt) apply false

debugoverlay-core/src/main/kotlin/com/ms/square/debugoverlay/DebugOverlay.kt

@@ -3,6 +3,7 @@ package com.ms.square.debugoverlay
 import android.app.Application
 import androidx.annotation.MainThread
 import androidx.annotation.RestrictTo
+import com.ms.square.debugoverlay.internal.Logger
 import com.ms.square.debugoverlay.internal.OverlayViewManager
 import com.ms.square.debugoverlay.internal.data.DebugOverlayDataRepository
 import com.ms.square.debugoverlay.internal.util.checkMainThread
@@ -13,16 +14,24 @@ import kotlinx.coroutines.SupervisorJob
 
 /**
  * Internal entry point for DebugOverlay auto-installers.
- * This is called automatically on app startup by either:
+ * [DebugOverlay.install] is called automatically on app startup by either:
  * - DebugOverlayInstaller (ContentProvider) in the default debugoverlay artifact
  * - DebugOverlayStartupInitializer (AndroidX Startup) in the debugoverlay-androidx-startup artifact
  *
- * **Not intended for use by application code.** There is no supported way to manually control
- * the overlay lifecycle in v2.x.
+ * ** [DebugOverlay.install] is Not intended for use by application code.**
+ * There is no supported way to manually control the overlay lifecycle in v2.x.
  */
-@RestrictTo(RestrictTo.Scope.LIBRARY_GROUP)
 public object DebugOverlay {
 
+  private var config: Config = Config()
+    set(newConfig) {
+      if (field != newConfig) {
+        field = newConfig
+        _overlayDataRepository?.setNetworkTracker(newConfig.networkRequestTracker)
+          ?: Logger.d("Config updated before install, will apply during install")
+      }
+    }
+
   private var _overlayDataRepository: DebugOverlayDataRepository? = null
 
   private var overlayScope: CoroutineScope? = null
@@ -36,6 +45,7 @@ public object DebugOverlay {
   internal val overlayDataRepository: DebugOverlayDataRepository
     get() = _overlayDataRepository ?: error("DebugOverlayDataRepository not initialized")
 
+  @RestrictTo(RestrictTo.Scope.LIBRARY_GROUP)
   @MainThread
   public fun install(application: Application) {
     if (!isMainProcess(application)) {
@@ -46,8 +56,52 @@ public object DebugOverlay {
     check(!isInstalled) { "DebugOverlay already installed" }
 
     overlayScope = CoroutineScope(SupervisorJob() + Dispatchers.Default).also {
-      _overlayDataRepository = DebugOverlayDataRepository(it)
+      _overlayDataRepository = DebugOverlayDataRepository(it).apply {
+        setNetworkTracker(config.networkRequestTracker)
+      }
       overlayViewManager = OverlayViewManager(application, it)
     }
   }
+
+  /**
+   * Configures DebugOverlay settings. Must be called on the main thread.
+   *
+   * Auto-installation happens via ContentProvider before [Application.onCreate].
+   * Call this function in [Application.onCreate] after dependency injection to
+   * configure network tracking or other features.
+   *
+   * Example with Hilt:
+   * ```kotlin
+   * @HiltAndroidApp
+   * class MyApp : Application() {
+   *   @Inject lateinit var networkInterceptor: DebugOverlayNetworkInterceptor
+   *
+   *   override fun onCreate() {
+   *     super.onCreate()
+   *     DebugOverlay.configure {
+   *       copy(networkRequestTracker = networkInterceptor)
+   *     }
+   *   }
+   * }
+   * ```
+   *
+   * @param block Configuration builder that receives current [Config] and returns new [Config]
+   * @throws IllegalStateException if called from non-main thread
+   */
+  @MainThread
+  public fun configure(block: Config.() -> Config) {
+    checkMainThread()
+    config = config.block()
+  }
+
+  /**
+   * DebugOverlay configuration.
+   *
+   * @property networkRequestTracker Tracks HTTP requests for display in Network tab.
+   *   Default is [NoOpNetworkRequestTracker] which disables network tracking.
+   *   Use DebugOverlayNetworkInterceptor from debugoverlay-extension-okhttp for OkHttp integration.
+   *
+   * @see configure
+   */
+  public data class Config(val networkRequestTracker: NetworkRequestTracker = NoOpNetworkRequestTracker)
 }

debugoverlay-core/src/main/kotlin/com/ms/square/debugoverlay/NetworkRequestTracker.kt

@@ -0,0 +1,43 @@
+package com.ms.square.debugoverlay
+
+import com.ms.square.debugoverlay.model.NetworkRequest
+import kotlinx.coroutines.flow.Flow
+import kotlinx.coroutines.flow.flowOf
+
+/**
+ * Interface for tracking network requests.
+ *
+ * This abstraction allows the debug panel to work with any HTTP client
+ * (OkHttp, Ktor, Retrofit, custom clients) without being tied to a specific implementation.
+ *
+ * Usage:
+ * ```kotlin
+ * // Implement for your HTTP client
+ * class MyNetworkTracker : NetworkRequestTracker {
+ *     private val _requests = MutableStateFlow<List<NetworkRequest>>(emptyList())
+ *     override val requests: Flow<List<NetworkRequest>> = _requests.asStateFlow()
+ * }
+ *
+ * // Use in DebugOverlay
+ *  DebugOverlay.config =
+ *       DebugOverlay.config.copy(networkRequestTracker = debugOverlayNetworkInterceptor)
+ * ```
+ */
+public interface NetworkRequestTracker {
+
+  /**
+   * Flow of network request logs, with newest log at the end.
+   *
+   * Implementations should:
+   * - Emit a new list whenever a request completes
+   * - Limit stored requests (e.g., last 100)
+   */
+  public val requests: Flow<List<NetworkRequest>>
+}
+
+/**
+ * No-op implementation for when tracking is disabled.
+ */
+public object NoOpNetworkRequestTracker : NetworkRequestTracker {
+  override val requests: Flow<List<NetworkRequest>> = flowOf(emptyList())
+}

debugoverlay-core/src/main/kotlin/com/ms/square/debugoverlay/internal/data/DebugOverlayDataRepository.kt

@@ -1,16 +1,23 @@
 package com.ms.square.debugoverlay.internal.data
 
+import com.ms.square.debugoverlay.NetworkRequestTracker
+import com.ms.square.debugoverlay.NoOpNetworkRequestTracker
 import com.ms.square.debugoverlay.internal.data.model.LogcatEntry
 import com.ms.square.debugoverlay.internal.data.model.NetworkStats
 import com.ms.square.debugoverlay.internal.data.source.LogcatDataSource
 import com.ms.square.debugoverlay.internal.data.source.NetStatsDataSource
+import com.ms.square.debugoverlay.model.NetworkRequest
 import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.ExperimentalCoroutinesApi
 import kotlinx.coroutines.awaitCancellation
 import kotlinx.coroutines.flow.Flow
+import kotlinx.coroutines.flow.MutableStateFlow
+import kotlinx.coroutines.flow.flatMapLatest
 import kotlinx.coroutines.launch
 
 internal class DebugOverlayDataRepository(scope: CoroutineScope) {
 
+  private val currentNetworkRequestTracker = MutableStateFlow<NetworkRequestTracker>(NoOpNetworkRequestTracker)
   private val logcatDataSource = LogcatDataSource(scope)
   private val netStatsDataSource = NetStatsDataSource(scope)
 
@@ -29,4 +36,12 @@ internal class DebugOverlayDataRepository(scope: CoroutineScope) {
 
   val logs: Flow<List<LogcatEntry>> = logcatDataSource.logs
   val netStats: Flow<NetworkStats> = netStatsDataSource.stats
+
+  @OptIn(ExperimentalCoroutinesApi::class)
+  val networkRequests: Flow<List<NetworkRequest>> = currentNetworkRequestTracker
+    .flatMapLatest { tracker -> tracker.requests }
+
+  fun setNetworkTracker(tracker: NetworkRequestTracker) {
+    currentNetworkRequestTracker.value = tracker
+  }
 }

debugoverlay-core/src/main/kotlin/com/ms/square/debugoverlay/internal/data/model/NetworkStats.kt

@@ -6,6 +6,9 @@ package com.ms.square.debugoverlay.internal.data.model
 internal data class NetworkStats(
   val totalDownloaded: Long, // Total bytes downloaded
   val totalUploaded: Long, // Total bytes uploaded
+  val totalRequests: Int? = null, // Total number of requests
+  val errorCount: Int? = null, // Requests with 4xx/5xx status
+  val avgDuration: Long? = null, // Average duration in ms
 ) {
   companion object {
     val INITIAL_VALUE: NetworkStats = NetworkStats(0, 0)

debugoverlay-core/src/main/kotlin/com/ms/square/debugoverlay/internal/ui/LogEntryDetailBottomSheet.kt

@@ -133,6 +133,7 @@ private fun DetailHeader(onDismiss: () -> Unit, modifier: Modifier = Modifier) {
 
 @Composable
 private fun DetailMetadataRow(logEntry: LogcatEntry, modifier: Modifier = Modifier) {
+  val levelColor = logEntry.level.toColor()
   Row(
     modifier = modifier
       .fillMaxWidth()
@@ -148,13 +149,13 @@ private fun DetailMetadataRow(logEntry: LogcatEntry, modifier: Modifier = Modifi
       )
       Surface(
         shape = RoundedCornerShape(12.dp),
-        color = logEntry.level.toColor().copy(alpha = 0.2f)
+        color = levelColor.copy(alpha = 0.2f)
       ) {
         Text(
           text = logEntry.level.name,
           style = MaterialTheme.typography.labelMedium,
           fontWeight = FontWeight.Bold,
-          color = logEntry.level.toColor(),
+          color = levelColor,
           modifier = Modifier.padding(horizontal = 12.dp, vertical = 4.dp)
         )
       }
@@ -171,7 +172,7 @@ private fun DetailMetadataRow(logEntry: LogcatEntry, modifier: Modifier = Modifi
         text = logEntry.tag,
         style = MaterialTheme.typography.bodyMedium,
         fontFamily = FontFamily.Monospace,
-        color = logEntry.level.toColor(),
+        color = levelColor,
         fontWeight = FontWeight.SemiBold
       )
     }

debugoverlay-core/src/main/kotlin/com/ms/square/debugoverlay/internal/ui/LogcatTabContent.kt

@@ -25,16 +25,11 @@ import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ArrowDownward
-import androidx.compose.material.icons.filled.Clear
-import androidx.compose.material.icons.filled.Search
 import androidx.compose.material3.FloatingActionButton
 import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.OutlinedTextField
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
-import androidx.compose.material3.TextFieldDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
@@ -154,6 +149,7 @@ private fun LogcatFilterBar(
 ) {
   Column(modifier = modifier.fillMaxWidth()) {
     SearchField(
+      searchPlaceholder = stringResource(R.string.debugoverlay_search_logs),
       searchQuery = searchQuery,
       onSearchQueryChanged = onSearchQueryChanged
     )
@@ -402,46 +398,3 @@ private fun FilterChip(
     )
   }
 }
-
-@Composable
-private fun SearchField(searchQuery: String, onSearchQueryChanged: (String) -> Unit, modifier: Modifier = Modifier) {
-  OutlinedTextField(
-    value = searchQuery,
-    onValueChange = onSearchQueryChanged,
-    modifier = modifier
-      .fillMaxWidth()
-      .padding(horizontal = 16.dp, vertical = 8.dp),
-    placeholder = {
-      Text(
-        text = stringResource(R.string.debugoverlay_search_logs),
-        style = MaterialTheme.typography.bodyMedium
-      )
-    },
-    leadingIcon = {
-      Icon(
-        imageVector = Icons.Default.Search,
-        contentDescription = null,
-        tint = MaterialTheme.colorScheme.onSurfaceVariant
-      )
-    },
-    trailingIcon = {
-      if (searchQuery.isNotEmpty()) {
-        IconButton(onClick = { onSearchQueryChanged("") }) {
-          Icon(
-            imageVector = Icons.Default.Clear,
-            contentDescription = stringResource(R.string.debugoverlay_clear_search),
-            tint = MaterialTheme.colorScheme.onSurfaceVariant
-          )
-        }
-      }
-    },
-    singleLine = true,
-    shape = RoundedCornerShape(12.dp),
-    colors = TextFieldDefaults.colors(
-      focusedContainerColor = MaterialTheme.colorScheme.surfaceContainerHighest,
-      unfocusedContainerColor = MaterialTheme.colorScheme.surfaceContainerHighest,
-      focusedIndicatorColor = Color.Transparent,
-      unfocusedIndicatorColor = Color.Transparent
-    )
-  )
-}