Navigation 3 bug POC

gistfile1.txt

@Serializable
object Home

@Serializable
data class DetailScreenData(val data: String)

@Composable
fun Navigation3POC() {
    val backStack = remember { mutableStateListOf<Any>(Home) }
    NavDisplay(
        backStack = backStack,
        onBack = { backStack.removeLastOrNull() },
        entryProvider = { key ->
            when (key) {
                is Home -> NavEntry(key) {
                    Column(modifier = Modifier.padding(top = 50.dp)) {
                        Button(
                            onClick = { backStack.add(DetailScreenData("1234")) },
                        ) {
                            Text("1234", fontSize = 20.sp)
                        }
                        Button(onClick = { backStack.add(DetailScreenData("5678")) }) {
                            Text("5678", fontSize = 20.sp)
                        }
                    }
                }

                is DetailScreenData -> NavEntry(key) {
                    DetailScreenComposable(key.data)
                }

                else -> error("Unknown route: $key")
            }
        }
    )
}

@Serializable
data class DetailScreen(val data: String)

@Composable
fun NavigationPOC() {
    val navController = rememberNavController()

    NavHost(navController = navController, startDestination = Home) {
        composable<Home> {
            Column(modifier = Modifier.padding(top = 50.dp)) {
                Button(
                    onClick = { navController.navigate(DetailScreen("1234")) },
                ) {
                    Text("1234", fontSize = 20.sp)
                }
                Button(onClick = { navController.navigate(DetailScreen("5678")) }) {
                    Text("5678", fontSize = 20.sp)
                }
            }
        }
        composable<DetailScreen> { backStackEntry ->
            val detailScreen: DetailScreen = backStackEntry.toRoute()
            DetailScreenComposable(detailScreen.data)
        }
    }
}

@Composable
fun DetailScreenComposable(
    data: String,
    viewModel: TestViewModel = viewModel()
) {
    LaunchedEffect(data) {
        viewModel.screenLaunched(data)
    }

    val percentage by viewModel.data
    Text(text = percentage ?: "Loading...", modifier = Modifier.padding(top = 50.dp), fontSize = 20.sp)
}

class TestViewModel : ViewModel() {
    // null represents loading
    val data: MutableState<String?> = mutableStateOf(null)

    fun screenLaunched(newData: String) {
        viewModelScope.launch {
            delay(750) // simulate network / DB delay
            data.value = newData
        }
    }
}