I have the following setup.

I have a screen with a list of items (PlantsScreen). When clicking on an item from the list I will be navigated to another screen (AddEditPlantScreen). After editing and saving the item and navigating back to the listScreen, I want to show the updated list of items. But the list is not displaying the updated list but the list before the edit of the item.

In order to have a single source of truth, I am fetching the data from a node.js Back-End and then saving it to the local repository (Room). I think I need to refresh the state in the ViewModel to fetch the updated list from my repository.

I know I can use a Job to do this, but it throws me an error. Is this the correct approach when returning a Flow?

If yes, how can I achieve this. If not, what alternative approach do I have?

plantsListViewModel.kt

private val _state = mutableStateOf<PlantsState>(PlantsState())
val state: State<PlantsState> = _state

init {
  getPlants(true, "")
}
private fun getPlants(fetchFromBackend: Boolean, query: String) {
  viewModelScope.launch {
    plantRepository.getPlants(fetchFromBackend, query)
      .collect { result ->
        when (result) {
          is Resource.Success -> {
            result.data?.let { plants ->
              _state.value = state.value.copy(
                plants = plants,
              )
            }
          }
        }
      }
  }
}

Here is my repository where I fetch the items in the list from.

// plantsRepository.kt
override suspend fun getPlants(
  fetchFromBackend: Boolean,
  query: String
): Flow<Resource<List<Plant>>> {
  return flow {
    emit(Resource.Loading(true))
    val localPlants = dao.searchPlants(query)
    emit(
      Resource.Success(
        data = localPlants.map { it.toPlant() },
      )
    )
    val isDbEmpty = localPlants.isEmpty() && query.isBlank()
    val shouldLoadFromCache = !isDbEmpty && !fetchFromBackend
    if (shouldLoadFromCache) {
      emit(Resource.Loading(false))
      return@flow
    }
    val response = plantApi.getPlants().plants
    dao.clearPlants()
    dao.insertPlants(
      response.map { it.toPlantEntity() }
    )
    emit(Resource.Success(
      data = dao.searchPlants("").map { it.toPlant() }
    ))
    emit(Resource.Loading(false))
  }
}

The full code for reference can be found here: https://gitlab.com/fiehra/plants

Thank you!

CodePudding user response：

You actually have two sources of truth: One is the room database, the other the _state object in the view model.

To reduce this to a single source of truth you need to move the collection of the flow to the compose function where the data is needed. You will do this using the extension function StateFlow.collectAsStateWithLifecycle() from the artifact androidx.lifecycle:lifecycle-runtime-compose. This will automatically subscribe and unsubscribe the flow when your composable enters and leaves the composition.

Since you want the business logic to stay in the view model you have to apply it before the flow is collected. The idea is to only transform the flow in the view model:

class PlantsViewModel {
    private var fetchFromBackend: Boolean by mutableStateOf(true)
    private var query: String by mutableStateOf("")

    @OptIn(ExperimentalCoroutinesApi::class)
    val state: StateFlow<PlantsState> =
        snapshotFlow { fetchFromBackend to query }
            .flatMapLatest { plantRepository.getPlants(it.first, it.second) }
            .mapLatest(PlantsState::of)
            .stateIn(
                scope = viewModelScope,
                started = SharingStarted.WhileSubscribed(5_000),
                initialValue = PlantsState.Loading,
            )
            
    // ...
}

If you want other values for fetchFromBackend and query you just need to update the variables; the flow will automatically recalculate the state object. It can be as simple as just calling something like this:

fun requestPlant(fetchFromBackend: Boolean, query: String) {
    this.fetchFromBackend = fetchFromBackend
    this.query = query
}

The logic to create a PlantsState from a result can then be done somewhere else in the view model. Replace your PlantsViewModel.getPlants() with this and place it at file level outside of the PlantsViewModel class:

private fun PlantsState.Companion.of(result: Resource<List<Plant>>): PlantsState = when (result) {
    is Resource.Success -> {
        result.data?.let { plants ->
            PlantsState.Success(
                plants = plants,
            )
        } ?: TODO("handle case where result.data is null")
    }
    is Resource.Error -> {
        PlantsState.Error("an error occurred")
    }
    is Resource.Loading -> {
        PlantsState.Loading
    }
}

With the PlantsState class replaced by this:

sealed interface PlantsState {
    object Loading : PlantsState

    data class Success(
        val plants: List<Plant> = emptyList(),
        val plantOrder: PlantOrder = PlantOrder.Name(OrderType.Descending),
        val isOrderSectionVisible: Boolean = false,
    ) : PlantsState

    data class Error(
        val error: String,
    ) : PlantsState

    companion object
}

Then, wherever you need the state (in PlantsScreen f.e.), you can get a state object with

val state by viewModel.state.collectAsStateWithLifecycle()

Thanks to kotlin flows state will always contain the most current data from the room database, and thanks to the compose magic your composables will always update when anything in the state object updates, so that you really only have one single source of truth.

Additionally:

• PlantRepository.getPlants() should not be marked as a suspend function because it just creates a flow and won't block; long running data retrieval will be done in the collector.
• You will need to manually import androidx.compose.runtime.getValue and the androidx.compose.runtime.setValue for some of the delegates to work.

CodePudding user response：

After @Leviathan was able to point me in the right direction i refactored my code by changing the return types of my repository functions, implementing use cases and returning a Flow<List<Plant>> instead of Flow<Resource<List<Plant>>> for simplicity purposes.

Further removed the suspend marker of the functions in the PlantDao.kt and PlantRepository.kt as pointed out by Leviathan.

// PlantRepositoryImplementation.kt
override fun getPlants(
  fetchFromBackend: Boolean,
  query: String
): Flow<List<Plant>> {
  return flow {
    if (fetchFromBackend) {
      val response = plantApi.getPlants().plants
      dao.clearPlants()
      dao.insertPlants(
        response.map { it.toPlantEntity() }
      )
      val localPlants = dao.searchPlants(query)
      localPlants.collect { plants ->
        emit(plants.map { it.toPlant() })
        return@collect
      }
    } else {
      val localPlants = dao.searchPlants(query)
      localPlants.collect { plants ->
        emit(plants.map { it.toPlant() })
        return@collect
      }
    }
  }
}

I started using a Job and GetPlants usecase in my viewModel like this:

// PlantsViewModel.kt
private fun getPlants(plantOrder: PlantOrder, fetchFromBackend: Boolean, query: String) {
  getPlantsJob?.cancel()
  getPlantsJob = plantUseCases.getPlants(plantOrder, fetchFromBackend, query)
    .onEach { plants ->
      _state.value = state.value.copy(
        plants = plants,
        plantOrder = plantOrder
      )
    }.launchIn(viewModelScope)

I also had to remove the suspend in the PlantDao.kt

// PlantDao.kt
fun searchPlants(query: String): Flow<List<PlantEntity>>

This is the code for my GetPlants usecase:

// GetPlantsUsecase.kt
class GetPlants
  (
  private val repository: PlantRepository,
) {
  operator fun invoke(
    plantOrder: PlantOrder = PlantOrder.Name(OrderType.Descending),
    fetchFromBackend: Boolean,
    query: String
  ): Flow<List<Plant>> {
    return repository.getPlants(fetchFromBackend, query).map { plants ->
      when (plantOrder.orderType) {
        is OrderType.Ascending -> {
          // logic for sorting
          }
        }
        is OrderType.Descending -> {
          // logic for sorting
          }
        }
      }
    }
  }