refactor(ui): Migrated deprecated components

This commit migrates the UI components that has been deprecated in the latest versions of Material 3: - Replaced `Divider` with `HorizontalDivider`. - Updated `ExposedDropdownMenuBox` to use `MenuAnchorType`. - Added `progress` lambda to `CircularProgressIndicator`. - Updated `HorizontalPagerIndicator` syntax. - Added animation to `DialogCheckBoxItem`. - Updated `LinearProgressIndicator` syntax. - Replaced `AlertDialog` with `BasicAlertDialog`. - Replaced `ClickableText` with `Text` and `AnnotatedString` with links. --- - HorizontalPagerIndicator has to be updated
JunkFood02 · Aug 12, 2024 · 38be352 · 38be352
1 parent b0c7174
commit 38be352
Show file tree

Hide file tree

Showing 9 changed files with 60 additions and 41 deletions.
diff --git a/app/src/main/java/com/junkfood/seal/ui/component/Dialogs.kt b/app/src/main/java/com/junkfood/seal/ui/component/Dialogs.kt
@@ -273,7 +273,7 @@ fun SealDialogVariant(
     tonalElevation: Dp = AlertDialogDefaults.TonalElevation,
     properties: DialogProperties = DialogProperties()
 ) {
-    AlertDialog(
+    BasicAlertDialog(
         onDismissRequest = onDismissRequest,
         modifier = modifier,
         properties = properties

diff --git a/app/src/main/java/com/junkfood/seal/ui/component/DownloadQueueItem.kt b/app/src/main/java/com/junkfood/seal/ui/component/DownloadQueueItem.kt
@@ -273,12 +273,13 @@ fun CustomCommandTaskItem(
                                 )
                             else
                                 CircularProgressIndicator(
+                                    progress = { animatedProgress },
                                     modifier = Modifier
                                         .padding(8.dp)
                                         .size(24.dp),
+                                    color = accentColor,
                                     strokeWidth = 5.dp,
-                                    progress = animatedProgress,
-                                    color = accentColor
+                                    trackColor = ProgressIndicatorDefaults.circularDeterminateTrackColor,
                                 )
                         }
 

diff --git a/app/src/main/java/com/junkfood/seal/ui/page/command/TaskLogPage.kt b/app/src/main/java/com/junkfood/seal/ui/page/command/TaskLogPage.kt
@@ -24,6 +24,7 @@ import androidx.compose.material3.AssistChipDefaults
 import androidx.compose.material3.Divider
 import androidx.compose.material3.ElevatedAssistChip
 import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
@@ -84,7 +85,7 @@ fun TaskLogPage(onNavigateBack: () -> Unit, taskHashCode: Int) {
                     .navigationBarsPadding(),
                 verticalArrangement = Arrangement.Center
             ) {
-                Divider(modifier = Modifier.fillMaxWidth())
+                HorizontalDivider(modifier = Modifier.fillMaxWidth())
                 Row(
                     Modifier
                         .fillMaxWidth()

diff --git a/app/src/main/java/com/junkfood/seal/ui/page/download/PlaylistSelectionPage.kt b/app/src/main/java/com/junkfood/seal/ui/page/download/PlaylistSelectionPage.kt
@@ -15,10 +15,9 @@ import androidx.compose.foundation.selection.selectable
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.automirrored.outlined.PlaylistAdd
 import androidx.compose.material.icons.outlined.Close
-import androidx.compose.material.icons.outlined.PlaylistAdd
 import androidx.compose.material3.Checkbox
-import androidx.compose.material3.Divider
 import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.HorizontalDivider
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
@@ -117,7 +116,7 @@ fun PlaylistSelectionPage(onNavigateBack: () -> Unit = {}) {
                     .navigationBarsPadding(),
                 verticalArrangement = Arrangement.Center
             ) {
-                Divider(modifier = Modifier.fillMaxWidth())
+                HorizontalDivider(modifier = Modifier.fillMaxWidth())
                 Row(verticalAlignment = Alignment.CenterVertically) {
                     Row(
                         modifier = Modifier.selectable(selected = selectedItems.size == playlistCount && selectedItems.size != 0,

diff --git a/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/DownloadPageV2.kt b/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/DownloadPageV2.kt
@@ -322,7 +322,7 @@ fun InputUrl(
                     .clip(MaterialTheme.shapes.large),
             )
             else LinearProgressIndicator(
-                progress = progressAnimationValue,
+                progress = { progressAnimationValue },
                 modifier = Modifier
                     .weight(0.75f)
                     .clip(MaterialTheme.shapes.large),
@@ -599,8 +599,8 @@ fun VideoCardV2(
                 modifier = Modifier.fillMaxWidth(),
             )
             else LinearProgressIndicator(
+                progress = { progressAnimationValue / 100f },
                 modifier = Modifier.fillMaxWidth(),
-                progress = progressAnimationValue / 100f,
             )
         }
     }

diff --git a/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/FormatPage.kt b/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/FormatPage.kt
@@ -2,6 +2,8 @@ package com.junkfood.seal.ui.page.downloadv2
 
 import android.content.Intent
 import androidx.compose.animation.AnimatedVisibility
+import androidx.compose.animation.core.Spring
+import androidx.compose.animation.core.VisibilityThreshold
 import androidx.compose.animation.core.spring
 import androidx.compose.animation.fadeOut
 import androidx.compose.foundation.ExperimentalFoundationApi
@@ -35,7 +37,6 @@ import androidx.compose.material.icons.outlined.Delete
 import androidx.compose.material.icons.outlined.Edit
 import androidx.compose.material.icons.outlined.FileDownload
 import androidx.compose.material.icons.outlined.Subtitles
-import androidx.compose.material.icons.rounded.Download
 import androidx.compose.material3.AlertDialog
 import androidx.compose.material3.Button
 import androidx.compose.material3.ExperimentalMaterial3Api
@@ -73,6 +74,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.semantics.clearAndSetSemantics
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import com.junkfood.seal.Downloader
@@ -108,9 +110,9 @@ import com.junkfood.seal.util.VIDEO_CLIP
 import com.junkfood.seal.util.VideoClip
 import com.junkfood.seal.util.VideoInfo
 import com.junkfood.seal.util.toHttpsUrl
+import kotlinx.coroutines.delay
 import kotlin.math.min
 import kotlin.math.roundToInt
-import kotlinx.coroutines.delay
 
 private const val TAG = "FormatPage"
 
@@ -882,7 +884,13 @@ private fun SubtitleSelectionDialog(
                     for ((code, formats) in suggestedSubtitlesFiltered) {
                         item(key = code) {
                             DialogCheckBoxItem(
-                                modifier = Modifier.animateItemPlacement(),
+                                modifier = Modifier.animateItem(
+                                    fadeInSpec = null, fadeOutSpec = null,
+                                    placementSpec = spring(
+                                        stiffness = Spring.StiffnessMediumLow,
+                                        visibilityThreshold = IntOffset.VisibilityThreshold
+                                    )
+                                ),
                                 checked = selectedSubtitles.contains(code),
                                 onClick = {
                                     if (selectedSubtitles.contains(code)) {
@@ -906,7 +914,14 @@ private fun SubtitleSelectionDialog(
                         for ((code, formats) in autoCaptionsFiltered) {
                             item(key = code) {
                                 DialogCheckBoxItem(
-                                    modifier = Modifier.animateItemPlacement(),
+                                    modifier = Modifier.animateItem(
+                                        fadeInSpec = null,
+                                        fadeOutSpec = null,
+                                        placementSpec = spring(
+                                            stiffness = Spring.StiffnessMediumLow,
+                                            visibilityThreshold = IntOffset.VisibilityThreshold
+                                        )
+                                    ),
                                     checked = selectedSubtitles.contains(code),
                                     onClick = {
                                         if (selectedSubtitles.contains(code)) {

diff --git a/app/src/main/java/com/junkfood/seal/ui/page/settings/about/AboutPage.kt b/app/src/main/java/com/junkfood/seal/ui/page/settings/about/AboutPage.kt
@@ -1,13 +1,12 @@
 package com.junkfood.seal.ui.page.settings.about
 
+import android.util.Log
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.LazyColumn
-import androidx.compose.foundation.text.ClickableText
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.automirrored.outlined.ContactSupport
 import androidx.compose.material.icons.outlined.AutoAwesome
-import androidx.compose.material.icons.outlined.ContactSupport
 import androidx.compose.material.icons.outlined.Description
 import androidx.compose.material.icons.outlined.Info
 import androidx.compose.material.icons.outlined.NewReleases
@@ -39,11 +38,13 @@ import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.text.ExperimentalTextApi
+import androidx.compose.ui.text.LinkAnnotation
 import androidx.compose.ui.text.SpanStyle
-import androidx.compose.ui.text.UrlAnnotation
+import androidx.compose.ui.text.TextLinkStyles
 import androidx.compose.ui.text.buildAnnotatedString
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.text.style.TextDecoration
+import androidx.compose.ui.text.withLink
 import androidx.compose.ui.tooling.preview.Preview
 import com.junkfood.seal.App
 import com.junkfood.seal.App.Companion.packageInfo
@@ -200,7 +201,6 @@ fun AboutPage(
     })
 }
 
-@OptIn(ExperimentalTextApi::class)
 @Composable
 @Preview
 fun AutoUpdateUnavailableDialog(onDismissRequest: () -> Unit = {}) {
@@ -213,22 +213,27 @@ fun AutoUpdateUnavailableDialog(onDismissRequest: () -> Unit = {}) {
     )
 
     val annotatedString = buildAnnotatedString {
-        append(text)
+        append(text.substring(0, text.indexOf(hyperLinkText)))
         val startIndex = text.indexOf(hyperLinkText)
         val endIndex = startIndex + hyperLinkText.length
-        addUrlAnnotation(
-            UrlAnnotation("https://github.com/JunkFood02/Seal/releases/latest"),
-            start = startIndex,
-            end = endIndex
-        )
-        addStyle(
-            SpanStyle(
-                color = MaterialTheme.colorScheme.tertiary,
-                textDecoration = TextDecoration.Underline,
-            ), start = startIndex,
-            end = endIndex
-        )
 
+        withLink(
+            LinkAnnotation.Clickable(
+                tag = "Link to the latest app release in GitHub",
+                styles = TextLinkStyles(
+                    SpanStyle(
+                        color = MaterialTheme.colorScheme.tertiary,
+                        textDecoration = TextDecoration.Underline,
+                    )
+                ),
+                linkInteractionListener = { _ ->
+                    uriHandler.openUri("https://github.com/JunkFood02/Seal/releases/latest")
+                    hapticFeedback.performHapticFeedback(HapticFeedbackType.LongPress)
+                }
+            )
+        ) {
+            append(text.substring(startIndex, endIndex))
+        }
     }
     AlertDialog(
         onDismissRequest = onDismissRequest,
@@ -245,16 +250,11 @@ fun AutoUpdateUnavailableDialog(onDismissRequest: () -> Unit = {}) {
             )
         },
         text = {
-            ClickableText(
+            Text(
                 text = annotatedString,
-                onClick = { index ->
-                    annotatedString.getUrlAnnotations(index, index).firstOrNull()?.let {
-                        hapticFeedback.performHapticFeedback(HapticFeedbackType.LongPress)
-                        uriHandler.openUri(it.item.url)
-                    }
-                },
                 style = MaterialTheme.typography.bodyMedium.copy(MaterialTheme.colorScheme.onSurfaceVariant)
             )
-        })
+        }
+    )
 }
 
diff --git a/app/src/main/java/com/junkfood/seal/ui/page/settings/appearance/AppearancePreferences.kt b/app/src/main/java/com/junkfood/seal/ui/page/settings/appearance/AppearancePreferences.kt
@@ -183,7 +183,8 @@ fun AppearancePreferences(
                     }
                 }
 
-                HorizontalPagerIndicator(pagerState = pagerState,
+                HorizontalPagerIndicator(
+                    pagerState = pagerState,
                     pageCount = pageCount,
                     modifier = Modifier
                         .clearAndSetSemantics { }

diff --git a/app/src/main/java/com/junkfood/seal/ui/page/settings/general/GeneralDownloadPreferences.kt b/app/src/main/java/com/junkfood/seal/ui/page/settings/general/GeneralDownloadPreferences.kt
@@ -47,6 +47,7 @@ import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.LargeTopAppBar
 import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.MenuAnchorType
 import androidx.compose.material3.OutlinedTextField
 import androidx.compose.material3.RadioButton
 import androidx.compose.material3.Scaffold
@@ -456,7 +457,7 @@ fun GeneralDownloadPreferences(
             title = { Text(text = stringResource(id = R.string.update)) },
             icon = { Icon(Icons.Outlined.SyncAlt, null) },
             text = {
-                LazyColumn() {
+                LazyColumn {
                     item {
                         Text(
                             text = stringResource(id = R.string.update_channel),
@@ -500,6 +501,7 @@ fun GeneralDownloadPreferences(
                     }
                     item {
                         var expanded by remember { mutableStateOf(false) }
+                        val type = MenuAnchorType.PrimaryNotEditable
 
                         ExposedDropdownMenuBox(
                             modifier = Modifier.padding(horizontal = 20.dp),
@@ -513,7 +515,7 @@ fun GeneralDownloadPreferences(
                                 readOnly = true,
                                 modifier = Modifier
                                     .fillMaxWidth()
-                                    .menuAnchor(),
+                                    .menuAnchor(type = type, enabled = true),
                                 colors = ExposedDropdownMenuDefaults.outlinedTextFieldColors(),
                                 trailingIcon = {
                                     ExposedDropdownMenuDefaults.TrailingIcon(expanded = expanded)