Create Bottom navigation with Jetpack Compose

ComposeNavigation.kt

@Composable
fun MainScreen() {
    val navController = rememberNavController()
    Scaffold(
        bottomBar = { BottomNav(navController) }
    ) {
        Navigation(navController = navController)
    }
}


@OptIn(ExperimentalMaterialApi::class)
@Composable
fun BottomNav(navController: NavController) {
    val items = NavigationItem.values()
    BottomNavigation {
        val navBackStackEntry = navController.currentBackStackEntry
        val currentRouteId = navBackStackEntry?.destination?.route
        items.forEach { item ->
            BottomNavigationItem(
                icon = { NavItemIcon(item) },
                label = { Text(stringResource(id = item.title)) },
                selected = currentRouteId == item.routeID,
                onClick = {
                    navController.navigate(item.routeID)
                }
            )
        }
    }
}

@OptIn(ExperimentalMaterialApi::class)
@Composable
fun NavItemIcon(item: NavigationItem) {
    if (item.count == 0) {
        Icon(
            painter = painterResource(id = item.icon),
            contentDescription = stringResource(id = item.title)
        )
    } else {
        BadgeBox(badgeContent = { Text(item.count.toString()) }) {
            Icon(
                painter = painterResource(id = item.icon),
                contentDescription = stringResource(id = item.title)
            )
        }
    }
}