package com.syaroful.agrilinkvocpro.control_feature.presentation.control

import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.ArrowBack
import androidx.compose.material.icons.filled.Info
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.material3.pulltorefresh.PullToRefreshBox
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import com.syaroful.agrilinkvocpro.control_feature.R
import com.syaroful.agrilinkvocpro.control_feature.core.components.ControlCard
import com.syaroful.agrilinkvocpro.control_feature.core.components.DisableControlCard
import com.syaroful.agrilinkvocpro.control_feature.core.state.ControlState
import com.syaroful.agrilinkvocpro.control_feature.data.model.ActuatorType
import com.syaroful.agrilinkvocpro.core.placeholder.shimmerEffect

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun ControlActuatorScreen(
    viewModel: ControlViewModel
) {
    val allActuators by viewModel.allActuatorState.collectAsState()
    val waterValveStatus by viewModel.waterValveStatus.collectAsState()
    val nutritionValveStatus by viewModel.nutritionValveStatus.collectAsState()
    val pumpStatus by viewModel.pumpStatus.collectAsState()
    val isLoading by viewModel.isLoading.collectAsState()

    val isRefreshing = remember { mutableStateOf(false) }


    LaunchedEffect(Unit) {
        viewModel.getActuatorStatus()
    }
    Scaffold(
        topBar = {
            TopAppBar(
                title = {
                    Column(
                        horizontalAlignment = Alignment.CenterHorizontally,
                        modifier = Modifier.fillMaxWidth()
                    ) {
                        Text("Control Actuator", style = MaterialTheme.typography.titleMedium)
                    }
                },
                navigationIcon = {
                    IconButton(onClick = { }) {
                        Icon(Icons.AutoMirrored.Filled.ArrowBack, contentDescription = "Back")
                    }
                },
                actions = {
                    IconButton(onClick = { }) {
                        Icon(Icons.Filled.Info, contentDescription = "History")
                    }
                }
            )
        }
    ) { innerPadding ->
        PullToRefreshBox(
            isRefreshing = isRefreshing.value,
            onRefresh = {
                isRefreshing.value = true
                viewModel.getActuatorStatus()
            }
        ) {
            Column(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(innerPadding)
                    .padding(16.dp)
                    .verticalScroll(rememberScrollState()),
                verticalArrangement = Arrangement.spacedBy(16.dp)
            ) {
                Text("Daftar Actuator", style = MaterialTheme.typography.titleMedium)


                //            ControlGrid(
                //                iconRes = R.drawable.ic_valve,
                //                items = List(4) { index -> "Bet ${index + 1}" }
                //            )
                when (allActuators) {
                    is ControlState.Loading -> {
                        isRefreshing.value = false
                        Box(
                            modifier = Modifier
                                .fillMaxWidth()
                                .height(96.dp)
                                .shimmerEffect()
                        )
                    }

                    is ControlState.Error -> {
                        isRefreshing.value = false
                        DisableControlCard(
                            label = "Control Failed!",
                            isOn = false,
                        )
                    }

                    ControlState.Idle -> {
                        isRefreshing.value = false
                    }

                    is ControlState.Success<*> -> {
                        isRefreshing.value = false
                        ControlCard(
                            iconRes = R.drawable.ic_valve,
                            label = "Water Valve",
                            isOn = waterValveStatus,
                            isLoading = isLoading,
                            onToggle = { viewModel.controlActuator(ActuatorType.WATER, !waterValveStatus) }
                        )
                        ControlCard(
                            iconRes = R.drawable.ic_leaf,
                            label = "Nutrient Valve",
                            isOn = nutritionValveStatus,
                            isLoading = isLoading,
                            onToggle = { viewModel.controlActuator(ActuatorType.NUTRIENT, !nutritionValveStatus) }
                        )
                        ControlCard(
                            iconRes = R.drawable.ic_valve,
                            label = "Pump",
                            isOn = pumpStatus,
                            isLoading = isLoading,
                            onToggle = { viewModel.controlActuator(ActuatorType.PUMP, !pumpStatus) }
                        )
                    }
                }



            }
        }
    }
}
