Hi I’m pretty new to Android and Jetpack Compose so bear with me.

I have a screen with posts and when I click on a post I want to navigate to a separate screen of that post only.

Post data class

@Serializable
data class Post(
    val id: Int,
    val imageUrl: String,
    val postedDate: String,
    // val likes: List<Like> <--- this doens't work
)

Like data class

@Serializable
data class Like(
    val user: User
)

In my MainActivity:

        setContent {
            AppTheme {
                val navController = rememberNavController()
                NavHost(navController = navController, startDestination = FeedScreen) {
                    composable<FeedScreen> {
                        FeedScreen(navController)
                    }
                    composable<Post> { backStackEntry ->
                        val post: Post = backStackEntry.toRoute()
                        PostScreen(post, onGoBack = { navController.popBackStack() })
                    }
                }
            }

And in my feed screen

...
        Column(
            ...
        ) {
            posts.forEach { p ->
                Post(post = p, onClickCard = {
                    navController.navigate(p)
                })
            }
        }

This seems to work pretty well but if I uncomment the likes attribute, the app fails at runtime with

java.lang.IllegalArgumentException: Cannot cast likes of type kotlin.collections.List to a NavType. Make sure to provide custom NavType for this argument.

I’ve been looking around on how to implement a custom NavType for my List but couldn’t find anything. Is there a way to do this?

Since I’m pretty new I’m not sure if this is the way to do this either so I’d also appreciate if you could give me an alternative. Would it be better to just pass the id and retrieve the Post again from the Db/API?