diff --git a/data/src/main/kotlin/com/alfresco/content/data/payloads/FieldsData.kt b/data/src/main/kotlin/com/alfresco/content/data/payloads/FieldsData.kt index 89668690..e7140720 100644 --- a/data/src/main/kotlin/com/alfresco/content/data/payloads/FieldsData.kt +++ b/data/src/main/kotlin/com/alfresco/content/data/payloads/FieldsData.kt @@ -76,6 +76,7 @@ enum class FieldType { DATETIME, DATE, DROPDOWN, + RADIO_BUTTONS, ; fun value() = name.lowercase() diff --git a/process-app/src/main/kotlin/com/alfresco/content/process/ui/FormDetailScreen.kt b/process-app/src/main/kotlin/com/alfresco/content/process/ui/FormDetailScreen.kt index d2873493..c5db2637 100644 --- a/process-app/src/main/kotlin/com/alfresco/content/process/ui/FormDetailScreen.kt +++ b/process-app/src/main/kotlin/com/alfresco/content/process/ui/FormDetailScreen.kt @@ -26,6 +26,7 @@ import com.alfresco.content.process.ui.components.DateTimeField import com.alfresco.content.process.ui.components.DropdownField import com.alfresco.content.process.ui.components.IntegerInputField import com.alfresco.content.process.ui.components.MultiLineInputField +import com.alfresco.content.process.ui.components.RadioButtonField import com.alfresco.content.process.ui.components.SingleLineInputField @OptIn(ExperimentalComposeUiApi::class) @@ -131,6 +132,20 @@ fun FormDetailScreen(state: FormViewState, viewModel: FormViewModel) { fieldsData = field, ) } + + FieldType.RADIO_BUTTONS.value() -> { + var textFieldValue by remember { mutableStateOf(field.value as? String ?: "") } + var textFieldQuery by remember { mutableStateOf("") } + RadioButtonField( + selectedOption = textFieldValue, + selectedQuery = textFieldQuery, + onSelectedOption = { (newText, newQuery) -> + textFieldValue = newText + textFieldQuery = newQuery + }, + fieldsData = field, + ) + } } } } diff --git a/process-app/src/main/kotlin/com/alfresco/content/process/ui/components/RadioButtonField.kt b/process-app/src/main/kotlin/com/alfresco/content/process/ui/components/RadioButtonField.kt new file mode 100644 index 00000000..644a7bd9 --- /dev/null +++ b/process-app/src/main/kotlin/com/alfresco/content/process/ui/components/RadioButtonField.kt @@ -0,0 +1,87 @@ +package com.alfresco.content.process.ui.components + +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.RadioButton +import androidx.compose.material3.Text +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.text.SpanStyle +import androidx.compose.ui.text.buildAnnotatedString +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.text.withStyle +import androidx.compose.ui.unit.dp +import com.alfresco.content.data.payloads.FieldsData +import com.alfresco.content.process.R +import com.alfresco.content.process.ui.theme.AlfrescoError + +@Composable +fun RadioButtonField( + selectedOption: String = "", + selectedQuery: String = "", + onSelectedOption: (Pair) -> Unit = {}, + fieldsData: FieldsData = FieldsData(), +) { + val labelWithAsterisk = buildAnnotatedString { + append(fieldsData.name) + if (fieldsData.required) { + withStyle(style = SpanStyle(color = AlfrescoError)) { + append(" *") // Adding a red asterisk for mandatory fields + } + } + } + + var showError by remember { mutableStateOf(false) } + + Column( + modifier = Modifier + .fillMaxWidth() + .padding(start = 24.dp), + horizontalAlignment = Alignment.Start, + ) { + Column( + horizontalAlignment = Alignment.Start, + modifier = Modifier + .fillMaxWidth(), + ) { + Text( + text = labelWithAsterisk, + modifier = Modifier.padding(end = 4.dp), + ) + fieldsData.options.forEach { option -> + Row(verticalAlignment = Alignment.CenterVertically) { + RadioButton( + selected = (option.id == selectedQuery), + onClick = { + onSelectedOption(Pair(option.name, option.id)) + }, + ) + Text( + text = option.name, + style = MaterialTheme.typography.bodyMedium, + ) + } + } + } + + if (showError) { + Text( + text = stringResource(R.string.error_required_field), + color = AlfrescoError, + modifier = Modifier + .padding(start = 16.dp, top = 0.dp), // Adjust padding as needed + style = MaterialTheme.typography.titleSmall, + textAlign = TextAlign.Start, + ) + } + } +}