Caching Firebase Storage image using Glide in Jetpack Compose

[Vedant0-0]

THIS IS NOT AN ISSUE I JUST NEED SOME HELP

This is my UI

@OptIn(ExperimentalMaterial3Api::class, ExperimentalGlideComposeApi::class)
@Composable
fun ProfileScreen(
    navigate: (String) -> Unit,
    viewModel: ProfileViewModel = hiltViewModel()
) {
    // code

    val result by viewModel.profilePicUrl.collectAsState()

    // code

    Column(
        modifier = Modifier
            .fillMaxSize()
            .padding(16.dp),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        GlideImage(
            model = result,
            contentDescription = null,
            modifier = Modifier
                .size(170.dp, 170.dp)
                .clip(CircleShape)
                .clickable {
                    showBottomSheet = true
                },
        ) { image ->
            image
                .fitCenter()
                .circleCrop()
                .diskCacheStrategy(DiskCacheStrategy.ALL)
                .placeholder(R.drawable.profilepic)
        }

        // button

    }

    // some more code
}

ViewModel

@HiltViewModel
class ProfileViewModel @Inject constructor(
    // dependencies
) : ViewModel() {
    private val _profilePicUrl = MutableStateFlow("")
    val profilePicUrl: StateFlow<String> = _profilePicUrl

    init {
        viewModelScope.launch {
            _profilePicUrl.value = getUserData("profileImage").toString()
        }
    }

    fun updateProfilePic(bitmap: Bitmap) {
        viewModelScope.launch {
            uploadImageToFirebase(bitmap)
        }
    }

    private suspend fun getUserData(fieldName: String): Any? {
        return withContext(Dispatchers.IO) {
            try {
                userRepository.getCurrentUserData(fieldName)
            } catch (_: Exception) {
                null
            }
        }
    }

    private suspend fun saveUserData(fieldName: String, data: Any): Boolean {
        return userRepository.saveUserData(fieldName, data)
    }

    private suspend fun uploadImageToFirebase(imageUri: Bitmap) {
        userRepository.uploadImageToFirebaseStorage(imageUri)
        _profilePicUrl.emit(getUserData("profileImage").toString())
    }

    fun removeProfilePicture() {
        // code
    }

    private fun getRandomDefaultImage(): String {
        val randomImages = arrayOf(
            // 2 links
        )

        return randomImages.random()
    }
}

ApplicationClass

@HiltAndroidApp
class MelonFeedApp : Application() {
    override fun onCreate() {
        super.onCreate()
        Glide.with(this)
            .applyDefaultRequestOptions(RequestOptions().diskCacheStrategy(DiskCacheStrategy.ALL))
    }
}

Here, I want that when the user has no internet then also his profile picture loads in the app from cache. For caching I'm using Glide but it doesn't work as expected. The image doesn't load when there's no internet. The image does load if there is internet.

Maybe the issue is that when there's no internet, the app tries to get the image from db, but it can't get it so the value of _profilePicUrl remains empty and so I get a warning

Load failed for [] with dimensions [468x468] class com.bumptech.glide.load.engine.GlideException: Failed to load resource

[Vedant0-0]

Please help anyonee