-
Notifications
You must be signed in to change notification settings - Fork 15
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Implement avatar and cover zoom on profile details screen (#234)
* Implement MediaItemScreen to render given media_url * Update advanceUntilIdleAndDelay to delay on current dispatcher * Run PR workflow on "macos-latest" --------- Co-authored-by: Aleksandar Ilic <[email protected]>
- Loading branch information
1 parent
7224ff0
commit 33b0a10
Showing
14 changed files
with
377 additions
and
15 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
21 changes: 21 additions & 0 deletions
21
app/src/main/kotlin/net/primal/android/media/MediaItemContract.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
package net.primal.android.media | ||
|
||
interface MediaItemContract { | ||
data class UiState( | ||
val mediaUrl: String, | ||
val error: MediaItemError? = null, | ||
) { | ||
sealed class MediaItemError { | ||
data class FailedToSaveMedia(val cause: Throwable) : MediaItemError() | ||
} | ||
} | ||
|
||
sealed class UiEvent { | ||
data object SaveMedia : UiEvent() | ||
data object DismissError : UiEvent() | ||
} | ||
|
||
sealed class SideEffect { | ||
data object MediaSaved : SideEffect() | ||
} | ||
} |
184 changes: 184 additions & 0 deletions
184
app/src/main/kotlin/net/primal/android/media/MediaItemScreen.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,184 @@ | ||
package net.primal.android.media | ||
|
||
import android.widget.Toast | ||
import androidx.compose.animation.AnimatedVisibilityScope | ||
import androidx.compose.animation.ExperimentalSharedTransitionApi | ||
import androidx.compose.animation.SharedTransitionScope | ||
import androidx.compose.foundation.layout.Box | ||
import androidx.compose.foundation.layout.fillMaxSize | ||
import androidx.compose.foundation.layout.padding | ||
import androidx.compose.material3.CenterAlignedTopAppBar | ||
import androidx.compose.material3.ExperimentalMaterial3Api | ||
import androidx.compose.material3.Scaffold | ||
import androidx.compose.material3.SnackbarHost | ||
import androidx.compose.material3.SnackbarHostState | ||
import androidx.compose.material3.TopAppBarDefaults | ||
import androidx.compose.runtime.Composable | ||
import androidx.compose.runtime.LaunchedEffect | ||
import androidx.compose.runtime.collectAsState | ||
import androidx.compose.runtime.getValue | ||
import androidx.compose.runtime.mutableStateOf | ||
import androidx.compose.runtime.remember | ||
import androidx.compose.runtime.rememberCoroutineScope | ||
import androidx.compose.runtime.setValue | ||
import androidx.compose.ui.Alignment | ||
import androidx.compose.ui.Modifier | ||
import androidx.compose.ui.platform.LocalContext | ||
import androidx.compose.ui.res.stringResource | ||
import coil.imageLoader | ||
import coil.request.ErrorResult | ||
import coil.request.ImageRequest | ||
import coil.request.SuccessResult | ||
import kotlinx.coroutines.launch | ||
import me.saket.telephoto.zoomable.ZoomSpec | ||
import me.saket.telephoto.zoomable.coil.ZoomableAsyncImage | ||
import me.saket.telephoto.zoomable.rememberZoomableImageState | ||
import me.saket.telephoto.zoomable.rememberZoomableState | ||
import net.primal.android.R | ||
import net.primal.android.attachments.gallery.GalleryDropdownMenu | ||
import net.primal.android.core.compose.AppBarIcon | ||
import net.primal.android.core.compose.SnackbarErrorHandler | ||
import net.primal.android.core.compose.icons.PrimalIcons | ||
import net.primal.android.core.compose.icons.primaliconpack.ArrowBack | ||
import net.primal.android.theme.AppTheme | ||
|
||
@OptIn(ExperimentalMaterial3Api::class) | ||
@ExperimentalSharedTransitionApi | ||
@Composable | ||
fun MediaItemScreen( | ||
viewModel: MediaItemViewModel, | ||
onClose: () -> Unit, | ||
sharedTransitionScope: SharedTransitionScope, | ||
animatedVisibilityScope: AnimatedVisibilityScope, | ||
) { | ||
val uiState = viewModel.state.collectAsState() | ||
|
||
val uiScope = rememberCoroutineScope() | ||
val context = LocalContext.current | ||
LaunchedEffect(viewModel) { | ||
viewModel.effects.collect { | ||
when (it) { | ||
MediaItemContract.SideEffect.MediaSaved -> uiScope.launch { | ||
Toast.makeText(context, context.getString(R.string.media_item_saved), Toast.LENGTH_SHORT).show() | ||
} | ||
} | ||
} | ||
} | ||
|
||
MediaItemScreen( | ||
state = uiState.value, | ||
onClose = onClose, | ||
eventPublisher = viewModel::setEvent, | ||
sharedTransitionScope = sharedTransitionScope, | ||
animatedVisibilityScope = animatedVisibilityScope, | ||
) | ||
} | ||
|
||
@ExperimentalMaterial3Api | ||
@ExperimentalSharedTransitionApi | ||
@Composable | ||
private fun MediaItemScreen( | ||
state: MediaItemContract.UiState, | ||
eventPublisher: (MediaItemContract.UiEvent) -> Unit, | ||
onClose: () -> Unit, | ||
sharedTransitionScope: SharedTransitionScope, | ||
animatedVisibilityScope: AnimatedVisibilityScope, | ||
) { | ||
val snackbarHostState = remember { SnackbarHostState() } | ||
SnackbarErrorHandler( | ||
error = state.error, | ||
snackbarHostState = snackbarHostState, | ||
errorMessageResolver = { | ||
when (it) { | ||
is MediaItemContract.UiState.MediaItemError.FailedToSaveMedia -> | ||
stringResource(id = R.string.media_item_error_on_save_message) | ||
} | ||
}, | ||
actionLabel = stringResource(id = R.string.media_item_error_on_save_try_again), | ||
onErrorDismiss = { eventPublisher(MediaItemContract.UiEvent.DismissError) }, | ||
onActionPerformed = { eventPublisher(MediaItemContract.UiEvent.SaveMedia) }, | ||
) | ||
val containerColor = AppTheme.colorScheme.surface.copy(alpha = 0.21f) | ||
|
||
Scaffold( | ||
contentColor = AppTheme.colorScheme.background, | ||
topBar = { | ||
CenterAlignedTopAppBar( | ||
title = {}, | ||
navigationIcon = { | ||
AppBarIcon( | ||
icon = PrimalIcons.ArrowBack, | ||
onClick = onClose, | ||
appBarIconContentDescription = stringResource(id = R.string.accessibility_back_button), | ||
) | ||
}, | ||
colors = TopAppBarDefaults.centerAlignedTopAppBarColors( | ||
containerColor = containerColor, | ||
scrolledContainerColor = containerColor, | ||
), | ||
actions = { | ||
GalleryDropdownMenu( | ||
onSaveClick = { eventPublisher(MediaItemContract.UiEvent.SaveMedia) }, | ||
) | ||
}, | ||
) | ||
}, | ||
snackbarHost = { | ||
SnackbarHost(hostState = snackbarHostState) | ||
}, | ||
) { | ||
with(sharedTransitionScope) { | ||
MediaItemContent( | ||
modifier = Modifier.padding(it), | ||
mediaUrl = state.mediaUrl, | ||
animatedVisibilityScope = animatedVisibilityScope, | ||
) | ||
} | ||
} | ||
} | ||
|
||
@ExperimentalSharedTransitionApi | ||
@Composable | ||
fun SharedTransitionScope.MediaItemContent( | ||
modifier: Modifier = Modifier, | ||
mediaUrl: String, | ||
animatedVisibilityScope: AnimatedVisibilityScope, | ||
) { | ||
val zoomSpec = ZoomSpec(maxZoomFactor = 15f) | ||
|
||
var error by remember { mutableStateOf<ErrorResult?>(null) } | ||
val loadingImageListener = remember { | ||
object : ImageRequest.Listener { | ||
override fun onSuccess(request: ImageRequest, result: SuccessResult) { | ||
error = null | ||
} | ||
|
||
override fun onError(request: ImageRequest, result: ErrorResult) { | ||
error = result | ||
} | ||
} | ||
} | ||
val imageLoader = LocalContext.current.imageLoader | ||
|
||
Box( | ||
modifier = modifier.fillMaxSize(), | ||
contentAlignment = Alignment.Center, | ||
) { | ||
ZoomableAsyncImage( | ||
modifier = Modifier | ||
.sharedElement( | ||
state = rememberSharedContentState(key = "mediaItem"), | ||
animatedVisibilityScope = animatedVisibilityScope, | ||
) | ||
.fillMaxSize(), | ||
state = rememberZoomableImageState(rememberZoomableState(zoomSpec = zoomSpec)), | ||
imageLoader = imageLoader, | ||
model = ImageRequest.Builder(LocalContext.current) | ||
.data(mediaUrl) | ||
.listener(loadingImageListener) | ||
.crossfade(durationMillis = 300) | ||
.build(), | ||
contentDescription = null, | ||
) | ||
} | ||
} |
76 changes: 76 additions & 0 deletions
76
app/src/main/kotlin/net/primal/android/media/MediaItemViewModel.kt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,76 @@ | ||
package net.primal.android.media | ||
|
||
import androidx.lifecycle.SavedStateHandle | ||
import androidx.lifecycle.ViewModel | ||
import androidx.lifecycle.viewModelScope | ||
import dagger.hilt.android.lifecycle.HiltViewModel | ||
import javax.inject.Inject | ||
import kotlinx.coroutines.channels.Channel | ||
import kotlinx.coroutines.flow.MutableSharedFlow | ||
import kotlinx.coroutines.flow.MutableStateFlow | ||
import kotlinx.coroutines.flow.asStateFlow | ||
import kotlinx.coroutines.flow.getAndUpdate | ||
import kotlinx.coroutines.flow.receiveAsFlow | ||
import kotlinx.coroutines.launch | ||
import kotlinx.coroutines.withContext | ||
import net.primal.android.core.coroutines.CoroutineDispatcherProvider | ||
import net.primal.android.core.files.MediaDownloader | ||
import net.primal.android.core.files.error.UnableToSaveContent | ||
import net.primal.android.core.files.error.UnsuccessfulFileDownload | ||
import net.primal.android.media.MediaItemContract.SideEffect | ||
import net.primal.android.media.MediaItemContract.UiEvent | ||
import net.primal.android.media.MediaItemContract.UiState | ||
import net.primal.android.navigation.asUrlDecodedNonNullable | ||
import net.primal.android.navigation.mediaUrlOrThrow | ||
import timber.log.Timber | ||
|
||
@HiltViewModel | ||
class MediaItemViewModel @Inject constructor( | ||
savedStateHandle: SavedStateHandle, | ||
private val dispatcherProvider: CoroutineDispatcherProvider, | ||
private val mediaDownloader: MediaDownloader, | ||
) : ViewModel() { | ||
|
||
private val mediaUrl = savedStateHandle.mediaUrlOrThrow.asUrlDecodedNonNullable() | ||
|
||
private val _state = MutableStateFlow(UiState(mediaUrl = mediaUrl)) | ||
val state = _state.asStateFlow() | ||
private fun setState(reducer: UiState.() -> UiState) = _state.getAndUpdate { it.reducer() } | ||
|
||
private val events: MutableSharedFlow<UiEvent> = MutableSharedFlow() | ||
fun setEvent(event: UiEvent) = viewModelScope.launch { events.emit(event) } | ||
|
||
private val _effects = Channel<SideEffect>() | ||
val effects = _effects.receiveAsFlow() | ||
private fun setEffect(effect: SideEffect) = viewModelScope.launch { _effects.send(effect) } | ||
|
||
init { | ||
observeEvents() | ||
} | ||
|
||
private fun observeEvents() = | ||
viewModelScope.launch { | ||
events.collect { | ||
when (it) { | ||
UiEvent.DismissError -> setState { copy(error = null) } | ||
UiEvent.SaveMedia -> saveMedia() | ||
} | ||
} | ||
} | ||
|
||
private fun saveMedia() = | ||
viewModelScope.launch { | ||
withContext(dispatcherProvider.io()) { | ||
try { | ||
mediaDownloader.downloadToMediaGallery(url = state.value.mediaUrl) | ||
setEffect(SideEffect.MediaSaved) | ||
} catch (error: UnsuccessfulFileDownload) { | ||
Timber.w(error) | ||
setState { copy(error = UiState.MediaItemError.FailedToSaveMedia(error)) } | ||
} catch (error: UnableToSaveContent) { | ||
Timber.w(error) | ||
setState { copy(error = UiState.MediaItemError.FailedToSaveMedia(error)) } | ||
} | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.