package com.pixelized.desktop.lwa.ui.screen.campaign.player.detail.sheet.item

import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Stable
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
import com.pixelized.desktop.lwa.ui.composable.decoratedBox.DecoratedBox
import com.pixelized.desktop.lwa.ui.composable.tooltip.BasicTooltipLayout
import com.pixelized.desktop.lwa.ui.composable.tooltip.BasicTooltipUio
import com.pixelized.desktop.lwa.ui.overlay.roll.RollAction
import com.pixelized.desktop.lwa.ui.theme.lwa

@Stable
data class CharacterDetailSheetCharacteristicUio(
    val value: String,
    val label: String,
    val tooltips: BasicTooltipUio,
    val roll: RollAction.Uio,
)

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun CharacterDetailSheetCharacteristic(
    modifier: Modifier = Modifier,
    paddingValues: PaddingValues = remember { PaddingValues(all = 8.dp) },
    characteristic: CharacterDetailSheetCharacteristicUio,
    onClick: () -> Unit,
) {
    BasicTooltipLayout(
        tooltip = characteristic.tooltips,
        content = {
            DecoratedBox(
                modifier = Modifier
                    .clickable(onClick = onClick)
                    .then(other = modifier),
                padding = paddingValues,
            ) {
                Text(
                    modifier = Modifier.align(alignment = Alignment.TopCenter),
                    style = MaterialTheme.typography.caption,
                    overflow = TextOverflow.Ellipsis,
                    maxLines = 1,
                    text = characteristic.label,
                )
                Text(
                    modifier = Modifier.align(alignment = Alignment.Center),
                    style = MaterialTheme.lwa.typography.characterSheet.characteristic,
                    overflow = TextOverflow.Ellipsis,
                    maxLines = 1,
                    color = MaterialTheme.colors.primary,
                    text = characteristic.value
                )
            }
        },
    )
}