add a mini player progress bar and drag-to-expand

app/src/main/kotlin/com/subtracks/ui/playback/MiniPlayer.kt

@@ -2,11 +2,15 @@ package com.subtracks.ui.playback
 
 import androidx.compose.foundation.basicMarquee
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.gestures.Orientation
+import androidx.compose.foundation.gestures.draggable
+import androidx.compose.foundation.gestures.rememberDraggableState
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
@@ -18,15 +22,20 @@ import androidx.compose.material.icons.rounded.SkipNext
 import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
+import androidx.compose.material3.LinearProgressIndicator
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableFloatStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.lerp
+import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.unit.dp
 import com.subtracks.data.model.CoverArtRef
 import com.subtracks.playback.PlaybackState
@@ -34,6 +43,8 @@ import com.subtracks.ui.components.CoverArt
 import com.subtracks.ui.theme.ArtworkColors
 import com.subtracks.ui.theme.ArtworkTheme
 
+private val EXPAND_DRAG = 48.dp
+
 @Composable
 fun MiniPlayer(
     state: PlaybackState,
@@ -45,6 +56,10 @@ fun MiniPlayer(
     modifier: Modifier = Modifier,
 ) {
     val item = state.item ?: return
+    val expandThresholdPx = with(LocalDensity.current) { EXPAND_DRAG.toPx() }
+    var dragUpPx by remember { mutableFloatStateOf(0f) }
+    val progress = if (state.durationMs > 0) (state.positionMs.toFloat() / state.durationMs).coerceIn(0f, 1f) else 0f
+
     ArtworkTheme(artwork) {
         Surface(
             color =
@@ -52,12 +67,34 @@ fun MiniPlayer(
                     ?: MaterialTheme.colorScheme.surfaceContainerHigh,
             contentColor = MaterialTheme.colorScheme.onSurface,
             modifier =
-                modifier.fillMaxWidth().clickable(
+                modifier
+                    .fillMaxWidth()
+                    .draggable(
+                        orientation = Orientation.Vertical,
+                        onDragStarted = { dragUpPx = 0f },
+                        state =
+                            rememberDraggableState { delta ->
+                                dragUpPx = (dragUpPx - delta).coerceAtLeast(0f)
+                                if (dragUpPx >= expandThresholdPx) {
+                                    dragUpPx = 0f
+                                    onExpand()
+                                }
+                            },
+                    ).clickable(
                         interactionSource = remember { MutableInteractionSource() },
                         indication = null,
                         onClick = onExpand,
                     ),
         ) {
+            Column {
+                LinearProgressIndicator(
+                    progress = { progress },
+                    modifier = Modifier.fillMaxWidth().height(2.dp),
+                    color = MaterialTheme.colorScheme.primary,
+                    trackColor = MaterialTheme.colorScheme.primary.copy(alpha = 0.24f),
+                    gapSize = 0.dp,
+                    drawStopIndicator = {},
+                )
                 Row(
                     modifier =
                         Modifier
@@ -117,4 +154,5 @@ fun MiniPlayer(
                 }
             }
         }
+    }
 }