Design kit: add destructive dialog action

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/components/dialogs/ConfirmationDialog.kt

@@ -38,6 +38,7 @@ fun ConfirmationDialog(
     title: String? = null,
     submitText: String = stringResource(id = CommonStrings.action_ok),
     cancelText: String = stringResource(id = CommonStrings.action_cancel),
+    destructiveSubmit: Boolean = false,
     thirdButtonText: String? = null,
     onCancelClicked: () -> Unit = onDismiss,
     onThirdButtonClicked: () -> Unit = {},
@@ -49,6 +50,7 @@ fun ConfirmationDialog(
             submitText = submitText,
             cancelText = cancelText,
             thirdButtonText = thirdButtonText,
+            destructiveSubmit = destructiveSubmit,
             onSubmitClicked = onSubmitClicked,
             onCancelClicked = onCancelClicked,
             onThirdButtonClicked = onThirdButtonClicked,
@@ -67,6 +69,7 @@ private fun ConfirmationDialogContent(
     title: String? = null,
     thirdButtonText: String? = null,
     onThirdButtonClicked: () -> Unit = {},
+    destructiveSubmit: Boolean = false,
     icon: @Composable (() -> Unit)? = null,
 ) {
     SimpleAlertDialogContent(
@@ -79,6 +82,7 @@ private fun ConfirmationDialogContent(
         onCancelClicked = onCancelClicked,
         thirdButtonText = thirdButtonText,
         onThirdButtonClicked = onThirdButtonClicked,
+        destructiveSubmit = destructiveSubmit,
         icon = icon,
     )
 }

libraries/designsystem/src/main/kotlin/io/element/android/libraries/designsystem/theme/components/AlertDialogContent.kt

@@ -57,6 +57,7 @@ internal fun SimpleAlertDialogContent(
     title: String? = null,
     subtitle: @Composable (() -> Unit)? = null,
     submitText: String? = null,
+    destructiveSubmit: Boolean = false,
     onSubmitClicked: () -> Unit = {},
     thirdButtonText: String? = null,
     onThirdButtonClicked: () -> Unit = {},
@@ -76,6 +77,7 @@ internal fun SimpleAlertDialogContent(
         title = title,
         subtitle = subtitle,
         submitText = submitText,
+        destructiveSubmit = destructiveSubmit,
         onSubmitClicked = onSubmitClicked,
         thirdButtonText = thirdButtonText,
         onThirdButtonClicked = onThirdButtonClicked,
@@ -92,6 +94,7 @@ internal fun SimpleAlertDialogContent(
     title: String? = null,
     subtitle: @Composable (() -> Unit)? = null,
     submitText: String? = null,
+    destructiveSubmit: Boolean = false,
     onSubmitClicked: () -> Unit = {},
     thirdButtonText: String? = null,
     onThirdButtonClicked: () -> Unit = {},
@@ -126,6 +129,7 @@ internal fun SimpleAlertDialogContent(
                         enabled = enabled,
                         size = ButtonSize.Medium,
                         onClick = onSubmitClicked,
+                        destructive = destructiveSubmit,
                     )
                 }
             }
@@ -345,8 +349,10 @@ private fun AlertDialogFlowRow(
                 val arrangement = Arrangement.End
                 val mainAxisPositions = IntArray(childrenMainAxisSizes.size) { 0 }
                 with(arrangement) {
-                    arrange(mainAxisLayoutSize, childrenMainAxisSizes,
+                    arrange(
-                        layoutDirection, mainAxisPositions)
+                        mainAxisLayoutSize, childrenMainAxisSizes,
+                        layoutDirection, mainAxisPositions
+                    )
                 }
                 placeables.forEachIndexed { j, placeable ->
                     placeable.place(
@@ -385,22 +391,22 @@ internal object DialogContentDefaults {
     val containerColor: Color
         @Composable
         @ReadOnlyComposable
-        get()= ElementTheme.colors.bgCanvasDefault
+        get() = ElementTheme.colors.bgCanvasDefault
 
     val textContentColor: Color
         @Composable
         @ReadOnlyComposable
-        get()= ElementTheme.materialColors.onSurfaceVariant
+        get() = ElementTheme.materialColors.onSurfaceVariant
 
     val titleContentColor: Color
         @Composable
         @ReadOnlyComposable
-        get()= ElementTheme.materialColors.onSurface
+        get() = ElementTheme.materialColors.onSurface
 
     val iconContentColor: Color
         @Composable
         @ReadOnlyComposable
-        get()= ElementTheme.materialColors.primary
+        get() = ElementTheme.materialColors.primary
 }
 
 // Paddings for each of the dialog's parts. Taken from M3 source code.
@@ -462,3 +468,21 @@ internal fun DialogWithOnlyMessageAndOkButtonPreview() {
         }
     }
 }
+
+@Preview(group = PreviewGroup.Dialogs, name = "Dialog with destructive button")
+@Composable
+@Suppress("MaxLineLength")
+internal fun DialogWithDestructiveButtonPreview() {
+    ElementThemedPreview(showBackground = false) {
+        DialogPreview {
+            SimpleAlertDialogContent(
+                title = "Dialog Title",
+                content = "A dialog with a destructive action",
+                cancelText = "Cancel",
+                submitText = "Delete",
+                destructiveSubmit = true,
+                onCancelClicked = {},
+            )
+        }
+    }
+}