package com.syaroful.agrilinkvocpro.presentation.screen.detail

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.ExperimentalMaterial3Api
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 com.syaroful.agrilinkvocpro.core.utils.extention.getCurrentDate
import com.syaroful.agrilinkvocpro.core.utils.extention.toFormattedString
import com.syaroful.agrilinkvocpro.presentation.screen.detail.component.DetailDhtContent
import com.syaroful.agrilinkvocpro.presentation.screen.detail.component.DetailNpkContent
import org.koin.androidx.compose.koinViewModel
import java.util.Date


@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun DetailScreen(
    sensorId: String,
    modifier: Modifier = Modifier,
    detailViewModel: DetailViewModel = koinViewModel(),
) {
    val date = remember { mutableStateOf(Date().toFormattedString()) }
    LaunchedEffect(sensorId) {
        if (sensorId == "dht") {
            detailViewModel.fetchDhtData(date = date.value, sensor = sensorId)
        } else {
            detailViewModel.fetchNpkData(date = date.value, sensor = sensorId)
        }
    }

    val npkDataState by detailViewModel.npkDataState.collectAsState()
    val dhtDataState by detailViewModel.dhtDataState.collectAsState()

    val currentData = detailViewModel.currentSensorData
    val isRefreshing = remember { mutableStateOf(false) }
    val currentDate = remember { mutableStateOf(getCurrentDate()) }



    Scaffold(
        topBar = { DetailTopBar() }) { innerPadding ->
        PullToRefreshBox(
            isRefreshing = isRefreshing.value, onRefresh = {
                isRefreshing.value = true
                if (sensorId == "dht") {
                    detailViewModel.fetchDhtData(date = date.value, sensor = sensorId)
                } else {
                    detailViewModel.fetchNpkData(date = date.value, sensor = sensorId)
                }
            }) {
            if (sensorId == "dht") DetailDhtContent(
                modifier = Modifier.padding(innerPadding),
                viewModel = detailViewModel,
                dhtDataState = dhtDataState,
                currentData = currentData,
                sensorId = sensorId,
                isRefreshing = isRefreshing,
                date = date,
                currentDate = currentDate
            )
            else DetailNpkContent(
                modifier = Modifier.padding(innerPadding),
                viewModel = detailViewModel,
                npkDataState = npkDataState,
                currentData = currentData,
                sensorId = sensorId,
                isRefreshing = isRefreshing,
                date = date,
                currentDate = currentDate
            )
        }
    }
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun DetailTopBar() {
    TopAppBar(
        title = {
            Column(
                horizontalAlignment = Alignment.CenterHorizontally,
                modifier = Modifier.fillMaxWidth()
            ) {
                Text("Detail Grafik", style = MaterialTheme.typography.titleMedium)
            }
        })
}