package com.suno.android.ui.bottom_sheets.comments import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.WindowInsets 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.statusBarsPadding import androidx.compose.foundation.layout.systemBars import androidx.compose.foundation.layout.windowInsetsPadding import androidx.compose.material3.ModalBottomSheet import androidx.compose.material3.SheetState import androidx.compose.material3.Text import androidx.compose.material3.rememberModalBottomSheetState 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.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.res.stringResource import androidx.compose.ui.unit.dp import com.suno.android.common_ui.R import com.suno.android.common_ui.components.buttons.SunoMediumButton import com.suno.android.common_ui.components.list_items.RadioListItem import com.suno.android.common_ui.components.omni.CircleIconButton import com.suno.android.common_ui.theme.ExtendedTheme import com.suno.android.common_res.R as CommonResR @Composable fun ReportCommentBottomSheet( onDismiss: () -> Unit, onReport: (reportOption: String) -> Unit, sheetState: SheetState = rememberModalBottomSheetState(true), ) { ModalBottomSheet( onDismissRequest = { onDismiss() }, sheetState = sheetState, dragHandle = null, modifier = Modifier.statusBarsPadding(), ) { Column( modifier = Modifier.fillMaxSize(), verticalArrangement = Arrangement.SpaceBetween, ) { Box( modifier = Modifier .fillMaxWidth() .height(96.dp), ) { Text( modifier = Modifier.align(Alignment.Center), text = stringResource(CommonResR.string.report_comment), style = ExtendedTheme.typography.introCopy, ) CircleIconButton( modifier = Modifier .align(Alignment.CenterEnd) .padding(24.dp), vectorDrawableResId = R.drawable.close, contentDescription = stringResource(CommonResR.string.close), onClick = onDismiss, ) } val reportOptions = listOf( stringResource(CommonResR.string.spam), stringResource(CommonResR.string.inappropriate_adult_content), stringResource(CommonResR.string.self_promotion), stringResource(CommonResR.string.intellectual_property), ) var selectedOption by remember { mutableStateOf(null) } Column { reportOptions.forEach { option -> RadioListItem( text = option, isSelected = selectedOption == option, onClick = { selectedOption = option }, ) } } Spacer(modifier = Modifier.weight(1f)) Row( modifier = Modifier .fillMaxWidth() .windowInsetsPadding(WindowInsets.systemBars) .padding(vertical = 16.dp), ) { SunoMediumButton( text = stringResource(CommonResR.string.report), onClick = { selectedOption?.let { onReport(it) } onDismiss() }, modifier = Modifier .fillMaxWidth() .padding(horizontal = 24.dp), enabled = selectedOption != null, ) } } } }