package com.pixelized.headache.ui.page.calendar

import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.ArrowBack
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.NavigationBarDefaults
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.State
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import androidx.hilt.lifecycle.viewmodel.compose.hiltViewModel
import androidx.lifecycle.compose.collectAsStateWithLifecycle
import com.pixelized.headache.R
import com.pixelized.headache.ui.common.toolbar.Toolbar
import com.pixelized.headache.ui.navigation.main.LocalMainNavigator
import kotlinx.coroutines.launch


@Composable
fun CalendarChooserPage(
    viewModel: CalendarViewModel = hiltViewModel(),
) {
    val navigation = LocalMainNavigator.current
    val scope = rememberCoroutineScope()
    val calendars = viewModel.calendars.collectAsStateWithLifecycle()

    CalendarContent(
        modifier = Modifier.fillMaxSize(),
        calendars = calendars,
        onBack = {
            navigation.popBackstack()
        },
        onCalendar = {
            scope.launch {
                viewModel.toggleCalendar(
                    id = it.id,
                    name = it.name,
                    type = it.type,
                )
            }
        }
    )
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
private fun CalendarContent(
    modifier: Modifier = Modifier,
    calendars: State<List<Any>>,
    onBack: () -> Unit,
    onCalendar: (CalendarItemUio) -> Unit,
) {
    Scaffold(
        modifier = modifier,
        topBar = {
            Toolbar(
                navigationIcon = {
                    IconButton(
                        onClick = onBack,
                    ) {
                        Icon(
                            imageVector = Icons.AutoMirrored.Filled.ArrowBack,
                            contentDescription = null,
                        )
                    }
                },
                title = {
                    Text(
                        text = stringResource(R.string.calendar_chooser_title),
                    )
                },
            )
        },
        content = { paddingValues ->
            LazyColumn(
                modifier = Modifier
                    .padding(paddingValues = paddingValues)
                    .fillMaxSize(),
            ) {
                items(
                    items = calendars.value,
                    contentType = { item ->
                        when (item) {
                            is String -> "title"
                            is CalendarItemUio -> "item"
                            else -> "other"
                        }
                    }
                ) { item ->
                    when (item) {
                        is String -> Text(
                            modifier = Modifier.padding(start = 16.dp, end = 16.dp, top = 16.dp),
                            style = MaterialTheme.typography.labelMedium,
                            text = item
                        )

                        is CalendarItemUio -> CalendarItem(
                            item = item,
                            onItem = onCalendar,
                        )
                    }
                }
            }
        }
    )
}