package com.example.lectionsupabase.view.mainActivity.components

import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.gestures.snapping.SnapPosition
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box

import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
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.painterResource
import androidx.compose.ui.unit.dp
import androidx.navigation.NavHostController
import com.example.lectionsupabase.R

@Composable
fun Panel(navHost: NavHostController) {
    val icons = listOf(
        R.drawable.rest, // Restaurants
        R.drawable.micro, // Concerts
        R.drawable.films, // Movies
        R.drawable.cartina, // Exhibitions
        R.drawable.bench,  // Benches
        R.drawable.plus
    )

    // Размеры и отступы
    val iconSize = 20.dp // Уменьшенный размер иконок
    val padding = 0.dp // Уменьшенные отступы
    val panelHeight = 40.dp // Уменьшенная высота панели
    val panelWidth = 310.dp // Уменьшенная ширина панели
    val bottomPadding = 14.dp // Отступ снизу

    Box(
        modifier = Modifier
            .fillMaxWidth() // Занимаем всю доступную площадь
            .padding(bottom = bottomPadding) // Добавляем отступ снизу
            .background(Color.Transparent) // Прозрачный фон для Box
    ) {
        Box(
            modifier = Modifier
                .width(panelWidth) // Задаем фиксированную ширину панели
                .height(panelHeight) // Задаем фиксированную высоту панели
                .align(Alignment.BottomCenter) // Центрируем панель в нижней части экрана
                .background(Color.White, shape = RoundedCornerShape(30.dp)) // Более закругленная панель
                .border(0.5.dp, Color.LightGray, shape = RoundedCornerShape(30.dp)) // Серый обвод
        ) {
            Row(
                modifier = Modifier
                    .fillMaxSize() // Занимаем всю площадь панели
                    .padding(horizontal = padding),
                horizontalArrangement = Arrangement.SpaceAround, // Центрируем иконки
                verticalAlignment = Alignment.CenterVertically // Центрируем иконки по вертикали
            ) {
                icons.forEachIndexed { index, icon ->
                    IconButton(
                        onClick = {
                            val screen = when (index) {
                                0 -> "Restaurants"
                                1 -> "Concerts"
                                2 -> "Cinema"
                                3 -> "Exhibition"
                                4 -> "Benchs"
                                5 -> "Insert"
                                else -> ""
                            }
                            navHost.navigate(screen) // Переход на экран
                        },
                        modifier = Modifier.padding(horizontal = 2.dp) // Равные отступы между иконками
                    ) {
                        Icon(
                            painter = painterResource(id = icon),
                            contentDescription = null,
                            modifier = Modifier.size(iconSize),
                            tint = if (navHost.currentDestination?.route == when (index) {
                                    0 -> "Restaurants"
                                    1 -> "Concerts"
                                    2 -> "Cinema"
                                    3 -> "Exhibition"
                                    4 -> "Benchs"
                                    5 -> "Insert"
                                    else -> ""
                                }) Color(0xFF72C3F1) else Color.Gray // Цвет иконок
                        )
                    }
                }
            }
        }
    }
}