Hello during our implementation we notice a bug on...

# compose

[Marcin Mazurek]

Hello during our implementation we notice a bug on

Scaffold(
    bottomBar = ...

When one of BottomNavigationItem's Layout contains NavHost it's crash when you select this BottomNavigationItem once and then the same item second time

[Marcin Mazurek]

java.lang.IllegalStateException: pending composition has not been applied
        at androidx.compose.runtime.CompositionImpl.drainPendingModificationsForCompositionLocked(Composition.kt:443)
        at androidx.compose.runtime.CompositionImpl.composeContent(Composition.kt:475)
        at androidx.compose.runtime.Recomposer.composeInitial$runtime_release(Recomposer.kt:726)
        at androidx.compose.runtime.ComposerImpl$CompositionContextImpl.composeInitial$runtime_release(Composer.kt:2974)
        at androidx.compose.runtime.CompositionImpl.setContent(Composition.kt:432)
        at androidx.compose.ui.layout.SubcomposeLayoutState.subcomposeInto(SubcomposeLayout.kt:258)
        at androidx.compose.ui.layout.SubcomposeLayoutState.access$subcomposeInto(SubcomposeLayout.kt:145)
        at androidx.compose.ui.layout.SubcomposeLayoutState$subcompose$2.invoke(SubcomposeLayout.kt:233)
        at androidx.compose.ui.layout.SubcomposeLayoutState$subcompose$2.invoke(SubcomposeLayout.kt:230)
        at androidx.compose.runtime.snapshots.SnapshotStateObserver.withNoObservations(SnapshotStateObserver.kt:137)
        at androidx.compose.ui.node.OwnerSnapshotObserver.withNoSnapshotReadObservation$ui_release(OwnerSnapshotObserver.kt:49)
        at androidx.compose.ui.node.LayoutNode.withNoSnapshotReadObservation$ui_release(LayoutNode.kt:1076)

[Marcin Mazurek]

Example code

sealed class Screen(val route: String, @StringRes val resourceId: Int) {
    object Profile : Screen("profile", R.string.app_name)
    object FriendsList : Screen("friendslist", R.string.app_name)
}

@Composable
fun MenuLayout() {
    val items = listOf(
        Screen.Profile,
        Screen.FriendsList,
    )
    val navController = rememberNavController()
    Scaffold(
        bottomBar = {
            BottomNavigation {
                val navBackStackEntry by navController.currentBackStackEntryAsState()
                val currentDestination = navBackStackEntry?.destination
                items.forEach { screen ->
                    BottomNavigationItem(
                        icon = { Icon(Icons.Filled.Favorite, contentDescription = null) },
                        label = { Text(stringResource(screen.resourceId)) },
                        selected = currentDestination?.hierarchy?.any { it.route == screen.route } == true,
                        onClick = {
                            navController.navigate(screen.route) {
                                // Pop up to the start destination of the graph to
                                // avoid building up a large stack of destinations
                                // on the back stack as users select items
                                popUpTo(navController.graph.findStartDestination().id) {
                                    saveState = true
                                }
                                // Avoid multiple copies of the same destination when
                                // reselecting the same item
                                launchSingleTop = true
                                // Restore state when reselecting a previously selected item
                                restoreState = true
                            }
                        }
                    )
                }
            }
        }
    ) { innerPadding ->
        NavHost(navController, startDestination = Screen.Profile.route) {
            composable(Screen.Profile.route) { Feature(NavigationDirections.browse) }
            composable(Screen.FriendsList.route) { Feature(NavigationDirections.browse) }
        }

    }
}

@Composable
fun Feature(navigationCommand: NavigationCommand) {
    val navController = rememberNavController()
    NavHost(
        navController,
        startDestination = navigationCommand.destination
    ) {
        composableCommand(NavigationDirections.browse) {
            Layout()
        }

        composableCommand(NavigationDirections.subCategories()) {
            Layout()
        }
    }
}

@Composable
fun Layout(){
    Text("test")
}

[jossiwolf]

I'm not sure where that bug comes from (sounds like something worth filing) but what you will want to use one NavHost with multiple back stacks instead, this is supported since Nav 2.4.0-alpha01