package io.nexilis.alpha.ui.main

import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.KeyboardDoubleArrowDown
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import androidx.constraintlayout.compose.ConstraintLayout
import androidx.hilt.navigation.compose.hiltViewModel
import androidx.navigation.NavHostController
import androidx.paging.compose.collectAsLazyPagingItems
import androidx.paging.compose.itemKey
import io.nexilis.alpha.ui.components.ContentChat
import io.nexilis.alpha.ui.components.InputChat
import io.nexilis.alpha.ui.components.LeftBubbleChat
import io.nexilis.alpha.ui.components.RightBubbleChat
import io.nexilis.service.data.entities.Buddy
import io.nexilis.service.data.viewmodels.MessageViewModel
import kotlinx.coroutines.launch

@OptIn(ExperimentalLayoutApi::class)
@Composable
fun Chat(
    navController: NavHostController,
    contentPadding: PaddingValues,
    pin: String,
    me: Buddy
) {
    val messageModel: MessageViewModel = hiltViewModel()
    val flow  = remember { messageModel.getOpposite(pin) }
    val lazyPagingItems = flow.collectAsLazyPagingItems()
    val listState = rememberLazyListState()
    val scope = rememberCoroutineScope()
    ConstraintLayout(
        modifier = Modifier
            .fillMaxSize()
            .consumeWindowInsets(contentPadding)
            .imePadding()
            .imeNestedScroll()
    ) {
        val (lazyColumn, fab, input) = createRefs()
        LazyColumn(
            modifier = Modifier
                .fillMaxSize()
                .constrainAs(lazyColumn) {
                    bottom.linkTo(input.top)
                },
            state = listState,
            reverseLayout = true
        ) {
            items(count = lazyPagingItems.itemCount, key = lazyPagingItems.itemKey { it.message_id }) { index ->
                lazyPagingItems[index]?.let { message ->
                    ListItem(modifier = Modifier.fillMaxWidth(), headlineContent = {
                        Row(
                            modifier = Modifier.fillMaxWidth(),
                            horizontalArrangement = if (message.f_pin == me.f_pin) Arrangement.End else Arrangement.Start
                        ) {
                            if (message.f_pin == me.f_pin) {
                                Spacer(modifier = Modifier.weight(0.1f))
                                RightBubbleChat(
                                    modifier = Modifier.weight(weight = 0.9f, fill = false),
                                    message = message,
                                ) {
                                    ContentChat(
//                                        modifier = Modifier.fillMaxWidth(0.7f),
                                        message = message
                                    )
                                }
                            } else {
                                LeftBubbleChat(
                                    modifier = Modifier.weight(weight = 0.9f, fill = false),
                                    message = message
                                ) {
                                    ContentChat(
//                                        modifier = Modifier.fillMaxWidth(0.7f),
                                        message = message
                                    )
                                }
                                Spacer(modifier = Modifier.weight(0.1f))
                            }
                        }
                    }, colors = ListItemDefaults.colors(containerColor = Color.Transparent))
                }
            }
        }
        val showButton by remember {
            derivedStateOf {
                listState.firstVisibleItemIndex > 0
            }
        }
        AnimatedVisibility(visible = showButton, modifier = Modifier.constrainAs(fab) {
            end.linkTo(parent.end)
            bottom.linkTo(input.top)
        }) {
            Button(
                onClick = {
                    scope.launch { listState.scrollToItem(0) }
                },
                modifier = Modifier
                    .padding(end = 16.dp)
                    .size(32.dp),
                shape = CircleShape,
                contentPadding = PaddingValues(0.dp)
            ) {
                Icon(imageVector = Icons.Default.KeyboardDoubleArrowDown, contentDescription = "")
            }
        }
        InputChat(
            modifier = Modifier.constrainAs(input) {
                bottom.linkTo(parent.bottom)
            },
            navController = navController,
            pin = pin,
            me = me
        )
    }
}

