Hi, I am using paging compose 1.0.0-alpha06 and pa...

# compose

[Tuba Kesten]

Hi, I am using paging compose 1.0.0-alpha06 and paging-runtime-ktx 3.0.0-alpha10. The problem is I can load the data perfectly for the first time. But when I take action such as delete message from inbox, I want to refresh data but I couldn't manage to do that. If I move the collectAsLazyPagingItems call in messageInboxScreen function it loads as it is in the first time and of course the data is refreshed. In pagination, the data is not observable like in livedata so I stucked how to manage refresh. Any idea for that ? Is there any example related to pagination data refresh?

[Colton Idle]

@Tuba Kesten do you mind editing your message to put the code block in the thread?

https://kotlinlang.slack.com/archives/CJLTWPH7S/p1612194022136600

[Tuba Kesten]

class MessagesInboxComposableComponent(
    private val messagesViewModel: MessagesInboxPaginatedViewModel,
) : ComposableViewComponent {
    override fun createComposableViews(): ComposableView = {
        val paginatedMessages = messagesViewModel.getMessageInbox(AmbientSessionUser.current.userName!!)
            .collectAsLazyPagingItems()
        MessagesInboxScreen(
            paginatedMessages = paginatedMessages)
    }
}
@Composable
fun MessagesInboxScreen(
    paginatedMessages: LazyPagingItems<Conversation>, messageSendDelete: () -> Unit,
) {
    ...
    Image(
        vectorResource(id = R.drawable.icons_delete),
        contentDescription = "trashIcon",
        modifier = Modifier.clickable(onClick = { messageSendDelete() }) //refresh after this action
    )
    ...

    Messages(paginatedMessages = paginatedMessages)
}

@Composable
private fun Messages(paginatedMessages: LazyPagingItems<Conversation>) {
    LazyColumn {
        if (paginatedMessages.loadState.refresh == LoadState.Loading) {
            item {
                CircularProgressIndicator()
            }
        }
        itemsIndexed(paginatedMessages) { _, item ->
            if (item != null) {
                UserListItem(item = item)
            }
        }
        if (paginatedMessages.loadState.append == LoadState.Loading) {
            item {
                CircularProgressIndicator()
            }
        }
    }
}

[Shakil Karim]

Your not using check above this block of code

itemsIndexed(paginatedMessages) { _, item ->
            if (item != null) {
                UserListItem(item = item)
            }
        }

I think it should have following checks

when (val refreshState = items.loadState.refresh) {
    is LoadState.Loading -> {
        CircularProgressIndicator(modifier = Modifier.align(Alignment.Center))
    }
    is LoadState.Error -> {
        ErrorItem(
                refreshState.error.localizedMessage!!,
                modifier = Modifier.fillMaxSize(),
                onClickRetry = { items.refresh() }
        )
    }
    is LoadState.NotLoading -> {
        Column(modifier = Modifier.fillMaxSize()) {
            LazyColumn(modifier = Modifier.fillMaxSize()) {
                if (items.itemCount > 0) {
                    itemsIndexed(items) { _, item ->
                        item?.let {
                            itemContent(it)
                        }
                    }
                } else {
                    item {
                        Box(modifier = Modifier.fillParentMaxSize()) {
                            ErrorItem(
                                    stringResource(R.string.empty_data),
                                    modifier = Modifier.fillMaxSize(),
                                    onClickRetry = { items.retry() }
                            )
                        }
                    }
                }
            }
        }
    }
}
when (val appendState = items.loadState.append) {
    is LoadState.Loading -> {
        CircularProgressIndicator(
                modifier = Modifier
                        .fillMaxWidth()
                        .wrapContentWidth(Alignment.CenterHorizontally)
                        .align(Alignment.BottomCenter)
        )
    }
    is LoadState.Error -> {
        ErrorItem("appendState.error.localizedMessage!!",
            modifier = Modifier.align(Alignment.BottomCenter)) {
            items.retry()
        }
    }
}