I have a ProfileViewModel where I load the user profile when the user lands on the screen. To achieve this, I use stateIn so that the profile is fetched automatically.

Now, I want to modify profileUiState to:

1. Show isLoading = true before calling logoutApi.logout().

2. Call logoutApi.logout().

3. Show isLoading = false and reload the profile data after logout.

Here’s my current ViewModel:

class ProfileViewModel(
    private val userInfoApi: UserInfoApi,
    private val logoutApi: LogoutApi,
) : ViewModel() {

    private val eventChannel = Channel<ProfileUiEvent>()
    val events = eventChannel.receiveAsFlow()

    var profileUiState = flow {
        val result = userInfoApi.getUserInfo()
        emit(
            result.fold(
                onSuccess = {
                    ProfileUiState(userInfo = it, isLoading = false)
                },
                onFailure = {
                    ProfileUiState(errorMessage = it.message, isLoading = false)
                }
            )
        )
    }.stateIn(
        scope = viewModelScope,
        started = SharingStarted.Lazily,
        initialValue = ProfileUiState(isLoading = true)
    )

    fun onAction(action: ProfileUiEvent) {
        viewModelScope.launch {
            eventChannel.send(action)
        }
    }

    fun logoutUser() {
        viewModelScope.launch {
             // update the logic in here for logout
            profileUiState
        }
    }
}

I want to avoid anti-patterns few of them and I read from this blog like :

• Calling getUserInfo() inside init {} of viewmodel.

• Using LaunchedEffect in Compose to trigger an API call.

How can I modify profileUiState properly to handle logout while keeping this approach?

I have a ProfileViewModel where I load the user profile when the user lands on the screen. To achieve this, I use stateIn so that the profile is fetched automatically.

Now, I want to modify profileUiState to:

1. Show isLoading = true before calling logoutApi.logout().

2. Call logoutApi.logout().

3. Show isLoading = false and reload the profile data after logout.

Here’s my current ViewModel:

class ProfileViewModel(
    private val userInfoApi: UserInfoApi,
    private val logoutApi: LogoutApi,
) : ViewModel() {

    private val eventChannel = Channel<ProfileUiEvent>()
    val events = eventChannel.receiveAsFlow()

    var profileUiState = flow {
        val result = userInfoApi.getUserInfo()
        emit(
            result.fold(
                onSuccess = {
                    ProfileUiState(userInfo = it, isLoading = false)
                },
                onFailure = {
                    ProfileUiState(errorMessage = it.message, isLoading = false)
                }
            )
        )
    }.stateIn(
        scope = viewModelScope,
        started = SharingStarted.Lazily,
        initialValue = ProfileUiState(isLoading = true)
    )

    fun onAction(action: ProfileUiEvent) {
        viewModelScope.launch {
            eventChannel.send(action)
        }
    }

    fun logoutUser() {
        viewModelScope.launch {
             // update the logic in here for logout
            profileUiState
        }
    }
}

I want to avoid anti-patterns few of them and I read from this blog like :

• Calling getUserInfo() inside init {} of viewmodel.

• Using LaunchedEffect in Compose to trigger an API call.

How can I modify profileUiState properly to handle logout while keeping this approach?

• android
• kotlin
• android-jetpack-compose
• kotlin-coroutines
• kotlin-flow

• I wanted to make a comment and not to give you an answer but since you have replied I do not want to delete my answer, sorry about the mess – vasberc Commented yesterday

1 Answer 1

stateIn creates a StateFlow and not a MutableStateflow, so I think is impossible to update it's value. Since the state of your screen can be changed you should have a MutableStateflow and update it's value when you need to update the screen state. Since the initial loading of the screen is dependent on the userInfoApi data, why is it not good to call it inside the init of the viewmodel?

------edit------

Example:
class ProfileViewModel(
    private val userInfoApi: UserInfoApi,
    private val logoutApi: LogoutApi,
) : ViewModel() {

    private val eventChannel = Channel<ProfileUiEvent>()
    val events = eventChannel.receiveAsFlow()
    
    private val _state = MutableStateFlow<UiState>(UiState.Loading)
    val state = _state.asStateFlow()

    var userInfoState = flow {
        val result = userInfoApi.getUserInfo()
        emit(
            result.fold(
                onSuccess = {
                    _state.update { UiState.Success }
                    it
                },
                onFailure = {
                    _state.update { UiState.Error(it.message) }
                    null
                }
            )
        )
    }.stateIn(
        scope = viewModelScope,
        started = SharingStarted.Lazily,
        initialValue = null
    )

    fun onAction(action: ProfileUiEvent) {
        viewModelScope.launch {
            eventChannel.send(action)
        }
    }

    fun logoutUser() {
        viewModelScope.launch {
            // update the logic in here for logout
            profileUiState
        }
    }
}

sealed class UiState {
    data object Loading : UiState()
    data object LoggedOut : UiState()
    data class Error(val message: String) : UiState()
    data object Success : UiState()
}

Then in the screen collect the uiState and update it according to the uiState and the userInfoState.

You can also make the Success state data class to hold the userInfo so you will not need to check 2 flows in the screen, and then the collector of the userInfoState will be used only to trigger the api call