package com.optix.android.ui.components

import androidx.compose.animation.core.*
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import com.optix.android.ui.theme.*

@Composable
fun ProgressBar(
    current: Int,
    total: Int,
    label: String = "PROGRESS",
    color: Color = T.accent,
) {
    val fraction = if (total > 0) current.toFloat() / total else 0f
    val animFraction by animateFloatAsState(fraction, tween(300), label = "p")

    Column(modifier = Modifier.fillMaxWidth()) {
        Row(
            modifier = Modifier.fillMaxWidth(),
            horizontalArrangement = Arrangement.SpaceBetween
        ) {
            Text(label, color = color, style = MaterialTheme.typography.labelSmall)
            Text("$current / $total", color = T.onSurfaceMid, style = MaterialTheme.typography.labelSmall)
        }
        Spacer(Modifier.height(4.dp))
        Box(
            Modifier
                .fillMaxWidth()
                .height(4.dp)
                .background(T.border.copy(alpha = 0.2f), RoundedCornerShape(2.dp))
        ) {
            Box(
                Modifier
                    .fillMaxWidth(animFraction)
                    .fillMaxHeight()
                    .background(
                        Brush.horizontalGradient(listOf(color.copy(alpha = 0.6f), color)),
                        RoundedCornerShape(2.dp)
                    )
            )
        }
    }
}
