mjdev-desktop/src/main/kotlin/eu/mjdev/desktop/components/controlcenter/pages/MainSettingsPage.kt

package eu.mjdev.desktop.components.controlcenter.pages

import androidx.compose.foundation.gestures.Orientation
import androidx.compose.foundation.layout.*
import androidx.compose.material.Divider
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Home
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import eu.mjdev.desktop.components.controlcenter.ControlCenterPage
import eu.mjdev.desktop.components.custom.DateTime
import eu.mjdev.desktop.components.custom.PowerBlock
import eu.mjdev.desktop.components.custom.UserAvatar
import eu.mjdev.desktop.extensions.Modifier.rectShadow

@Suppress("FunctionName")
fun MainSettingsPage() = ControlCenterPage(
    icon = Icons.Filled.Home,
    name = "Home"
) {
    Box(
        modifier = Modifier.fillMaxSize()
    ) {
        Column(
            modifier = Modifier
                .fillMaxWidth()
                .align(Alignment.TopCenter)
                .rectShadow(8.dp, Color.Black.copy(alpha = 0.3f))
        ) {
            UserAvatar(
                backgroundColor = backgroundColor,
                avatarSize = 128.dp,
                orientation = Orientation.Vertical,
                onUserAvatarClick = {
                    // todo
                }
            )
            Divider(
                modifier = Modifier.fillMaxWidth().height(2.dp),
                color = Color.Transparent,
                thickness = 2.dp
            )
            DateTime(
                backgroundColor = backgroundColor
            )
        }
        Box(
            modifier = Modifier
                .fillMaxWidth()
                .align(Alignment.BottomCenter)
        ) {
//            FlexibleBottomSheet(
//                onDismissRequest = {},
//                sheetState = rememberFlexibleBottomSheetState(
//                    flexibleSheetSize = FlexibleSheetSize(
//                        fullyExpanded = 0.9f,
//                        intermediatelyExpanded = 0.5f,
//                        slightlyExpanded = 0.15f,
//                    ),
//                    isModal = true,
//                    skipSlightlyExpanded = true,
//                ),
//                containerColor = backgroundColor,
//            ) {
//                Text(
//                    modifier = Modifier
//                        .fillMaxWidth()
//                        .padding(8.dp),
//                    text = "This is Flexible Bottom Sheet",
//                    textAlign = TextAlign.Center,
//                    color = Color.White,
//                )
//            }
            Column(
                modifier = Modifier
                    .fillMaxWidth()
                    .wrapContentHeight()
                    .align(Alignment.BottomCenter)
            ) {
                PowerBlock(
                    backgroundColor = backgroundColor,
                    onPowerButtonClick = {
                        // todo : dialog
                        api.shutdown()
                    }
                )
            }
        }
    }
}