Hi all, I have a strange behavior in my KMP/CMP ap...

# multiplatform

[Greg Rami]

Hi all,
I have a strange behavior in my KMP/CMP app. I'm using Voyager for navigation and have the following code:

data object FeedScreen : Screen {
    @Composable
    override fun Content() {
        val screenModel: FeedScreenModel = getScreenModel()
        val navigator = LocalNavigator.currentOrThrow

        val feedItems = screenModel.feedItems.collectAsState()

        LazyColumn(modifier = Modifier.fillMaxSize()) {
            items(feedItems.value) { feedItem ->
                FeedItem(
                    feedItem,
                    onItemClick = { navigator.push(FeedItemScreen(feedItem)) },
                    onLikeClick = { screenModel.onLikeClick(feedItem) },
                )
            }
        }
    }
}

and my FeedItemScreen:

data class FeedItemScreen(val feedItem: FeedItem) : Screen {
    @Composable
    override fun Content() {
        val screenModel: FeedItemScreenModel = getScreenModel()
        screenModel.setFeedItem(feedItem)

        val observableFeedItem = screenModel.feedItem.collectAsState()
        FeedItem(
            observableFeedItem.value!!,
            onItemClick = {},
            onLikeClick = { screenModel.onLikeClick() },
        )
    }
}

FeedItem is a @Composable fun that has an image with like button and count
my issue is that I tap the item on the Feed, it opens the Detail view FeedItemScreen, when I tap the like button in FeedItemScreen , both the FeedItem from FeedItemScreen and the FeedItem from FeedScreen LazyColumn get recomposed 😕
Resulting in my like status being reverted in FeedItemScreen since it's using the recomposition of FeedItem in which the feedItem like status has not been updated yet

Any idea why this is happening? I thought calling the composable function FeedItem() would create separate unrelated composable objects