Showing Paginated Data

LazyColumnWithLoading<T>

LazyColumnWithLoading Composable: A Reusable Component for Paginated Data

Purpose:

The LazyColumnWithLoading composable is a reusable component designed to efficiently handle paginated data within a LazyColumn. It automatically manages loading states, error handling, and data rendering.

Parameters:

• remoteData: A RemoteData<T> object representing the paginated data.

• modifier: A Modifier to apply to the surface.

• itemView: A composable function that takes an item and returns the content to be displayed.

Functionality:

1. Loading State:

   • Checks if remoteData is None (initial state or loading).

   • If None, displays a loading view.

2. Error State:

   • Checks if remoteData is Some(Left(ErrMessage)).

   • If Left, displays an error view.

3. Content State:

   • Checks if remoteData is Some(Right(Page<T>)).

   • If Right, renders the paginated data using a LazyColumn.

Key Features:

• Automatic Loading: Handles loading states and displays a loading indicator while data is being fetched.

• Error Handling: Displays an error message if an error occurs during data fetching.

• Pagination: Efficiently renders paginated data using a LazyColumn.

• Customizable: Allows you to customize the loading and error views.

Example Usage:

Kotlin

LazyColumnWithLoading(
    remoteData = todoViewModel.todos.collectAsState().value,
    itemView = { todo -> TodoItemView(todo) }
)

Additional Notes:

• The RemoteData type is used to represent the data, which includes the paginated data and potential errors.

• The LazyColumn is used to efficiently render the paginated content, avoiding unnecessary rendering of off-screen items.

• You can customize the loading and error views by providing your own composables to the LazyColumnWithLoading component.

By using LazyColumnWithLoading, you can simplify the process of handling paginated data in your KMM applications and provide a better user experience.