package com.example.uitugasakhir.ui_manual

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.example.app.ui.theme.Inria_Regular
import com.example.app.ui.theme.Poppins_Bold
import com.example.app.ui.theme.Poppins_Medium
import com.example.uitugasakhir.R
import com.example.uitugasakhir.model.RiwayatItem

@Composable
fun RiwayatSection(riwayatList: List<RiwayatItem>) {

    Column {

        Text(
            text = stringResource(R.string.history),
            fontSize = 15.sp,
            fontFamily = Inria_Regular,
            fontWeight = FontWeight.Medium,
            color = Color.Black,
            modifier = Modifier.padding(horizontal = 28.dp)
        )

        Spacer(modifier = Modifier.height(5.dp))

        Text(
            text = stringResource(R.string.manual_watering_activity_log),
            fontSize = 12.sp,
            fontFamily = Inria_Regular,
            fontWeight = FontWeight.Normal,
            color = Color.Gray,
            modifier = Modifier.padding(horizontal = 28.dp)
        )

        Spacer(modifier = Modifier.height(15.dp))

        Card(
            modifier = Modifier
                .padding(horizontal = 25.dp)
                .padding(bottom = 25.dp)
                .size(width = 333.dp, height = 214.dp),
            shape = RoundedCornerShape(24.dp),
            colors = CardDefaults.cardColors(
                containerColor = Color(0xFFEDEDED)
            ),
            elevation = CardDefaults.cardElevation(4.dp)
        ) {

            LazyColumn(
                modifier = Modifier
                    .fillMaxSize()
                    .padding(vertical = 8.dp)
            ) {

                items(riwayatList) { item ->

                    val bgColor = when (item.status) {
                        "Berjalan" -> Color(0xFFD6F5DD)
                        "Selesai" -> Color(0xFFFFE0E0)
                        "Monitoring" -> Color(0xFFFFF3CD)
                        "Delay" -> Color(0xFFE3F2FD)
                        else -> Color.LightGray
                    }

                    val textColor = when (item.status) {
                        "Berjalan" -> Color(0xFF2E7D32)
                        "Selesai" -> Color.Red
                        "Monitoring" -> Color(0xFFB8860B)
                        "Delay" -> Color(0xFF1565C0)
                        else -> Color.DarkGray
                    }

                    Row(
                        modifier = Modifier
                            .fillMaxWidth()
                            .padding(horizontal = 16.dp, vertical = 12.dp),
                        horizontalArrangement = Arrangement.SpaceBetween,
                        verticalAlignment = Alignment.CenterVertically
                    ) {

                        Column(modifier = Modifier.weight(1f)) {

                            Text(
                                text = "${item.waktu} • ${item.mode}",
                                fontSize = 13.sp,
                                fontFamily = Poppins_Bold,
                                color = Color.Black.copy(alpha = 0.8f)
                            )

                            Spacer(modifier = Modifier.height(2.dp))

                            Text(
                                text = item.aksi,
                                fontSize = 13.sp,
                                fontFamily = Poppins_Bold,
                                color = Color.Black.copy(alpha = 0.8f)
                            )

                            Spacer(modifier = Modifier.height(4.dp))

                            Text(
                                text = "${item.keterangan} | Jeda: ${item.jeda} menit",
                                fontSize = 11.sp,
                                fontFamily = Poppins_Medium,
                                color = Color.Gray
                            )
                        }

                        Box(
                            modifier = Modifier
                                .background(bgColor, RoundedCornerShape(12.dp))
                                .padding(horizontal = 10.dp, vertical = 5.dp)
                        ) {
                            Text(
                                text = item.status,
                                fontSize = 10.sp,
                                fontFamily = Poppins_Medium,
                                color = textColor
                            )
                        }
                    }

                    HorizontalDivider(
                        thickness = 0.8.dp,
                        color = Color.Gray.copy(alpha = 0.3f)
                    )
                }
            }
        }
    }
}