feat(provider-ux): add provider card enter/exit animation

flixclusiveorg · Oct 1, 2024 · 27bf98a · 27bf98a
1 parent 834c2e7
commit 27bf98a
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/...rc/main/kotlin/com/flixclusive/core/ui/mobile/component/provider/InstalledProviderCard.kt b/...rc/main/kotlin/com/flixclusive/core/ui/mobile/component/provider/InstalledProviderCard.kt
@@ -29,6 +29,7 @@ import com.flixclusive.model.provider.Status
 
 @Composable
 fun InstalledProviderCard(
+    modifier: Modifier = Modifier,
     providerData: ProviderData,
     enabled: Boolean,
     isDraggable: Boolean,
@@ -51,7 +52,7 @@ fun InstalledProviderCard(
     val cardColor = MaterialTheme.colorScheme.surfaceColorAtElevation(elevation)
 
     Box(
-        modifier = Modifier
+        modifier = modifier
             .graphicsLayer { translationY = if (!isDraggable) 0F else displacementOffset ?: 0f }
             .fillMaxWidth(),
         contentAlignment = Alignment.Center

diff --git a/.../provider-list/src/main/kotlin/com/flixclusive/feature/mobile/provider/ProvidersScreen.kt b/.../provider-list/src/main/kotlin/com/flixclusive/feature/mobile/provider/ProvidersScreen.kt
@@ -73,8 +73,8 @@ import com.flixclusive.model.provider.Status
 import com.ramcosta.composedestinations.annotation.Destination
 import kotlinx.coroutines.Job
 import kotlinx.coroutines.launch
-import com.flixclusive.core.ui.common.R as UiCommonR
 import com.flixclusive.core.locale.R as LocaleR
+import com.flixclusive.core.ui.common.R as UiCommonR
 
 private val FabButtonSize = 56.dp
 private fun Context.getHelpGuideTexts()
@@ -257,7 +257,10 @@ internal fun ProvidersScreen(
                             }
                         }
 
-                        itemsIndexed(items = filteredProviders ?: viewModel.providerDataList) { index, providerData ->
+                        itemsIndexed(
+                            items = filteredProviders ?: viewModel.providerDataList,
+                            key = { _, item -> item.id }
+                        ) { index, providerData ->
                             val displacementOffset =
                                 // +1 since there's a header
                                 if (index + 1 == dragDropListState.getCurrentIndexOfDraggedListItem()) {
@@ -269,6 +272,7 @@ internal fun ProvidersScreen(
                                 && (providerSettings.getOrNull(index)?.isDisabled?.not() ?: true)
 
                             InstalledProviderCard(
+                                modifier = Modifier.animateItem(),
                                 providerData = providerData,
                                 enabled = isEnabled,
                                 isDraggable = !searchExpanded.value,