package com.example.todokotlin.ui

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Add
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.FloatingActionButton
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBar
import androidx.compose.material3.TopAppBarDefaults
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Modifier
import androidx.lifecycle.compose.collectAsStateWithLifecycle
import com.example.todokotlin.TodoViewModel
import com.example.todokotlin.data.Todo

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun TodoApp(viewModel: TodoViewModel) {
    val uiState by viewModel.uiState.collectAsStateWithLifecycle()

    var showAddDialog by remember { mutableStateOf(false) }
    var editingTodo by remember { mutableStateOf<Todo?>(null) }

    Scaffold(
        topBar = {
            TopAppBar(
                title = {
                    Text("Todos \u2013 Kotlin Android")
                },
                colors = TopAppBarDefaults.topAppBarColors(
                    containerColor = MaterialTheme.colorScheme.primary,
                    titleContentColor = MaterialTheme.colorScheme.onPrimary
                )
            )
        },
        floatingActionButton = {
            FloatingActionButton(
                onClick = { showAddDialog = true },
                containerColor = MaterialTheme.colorScheme.primary
            ) {
                Icon(
                    imageVector = Icons.Default.Add,
                    contentDescription = "Add Todo",
                    tint = MaterialTheme.colorScheme.onPrimary
                )
            }
        }
    ) { innerPadding ->
        Column(modifier = Modifier.padding(innerPadding)) {
            FilterBar(
                currentFilter = uiState.filter,
                allCount = uiState.allCount,
                activeCount = uiState.activeCount,
                doneCount = uiState.doneCount,
                onFilterChange = { viewModel.setFilter(it) }
            )

            if (uiState.todos.isEmpty()) {
                EmptyState()
            } else {
                TodoList(
                    todos = uiState.todos,
                    onToggle = { viewModel.toggleCompleted(it) },
                    onTap = { editingTodo = it },
                    onDelete = { viewModel.deleteTodo(it) }
                )
            }
        }
    }

    if (showAddDialog) {
        TodoFormDialog(
            onDismiss = { showAddDialog = false },
            onSave = { title, category, priority ->
                viewModel.addTodo(title, category, priority)
                showAddDialog = false
            }
        )
    }

    editingTodo?.let { todo ->
        TodoFormDialog(
            todo = todo,
            onDismiss = { editingTodo = null },
            onSave = { title, category, priority ->
                viewModel.updateTodo(
                    todo.copy(
                        title = title,
                        category = category,
                        priority = priority
                    )
                )
                editingTodo = null
            }
        )
    }
}
