Added progress indicator for group editing (#875)

* Added progress indicator for group editing

* Max size on AndroidView and remove background, add semantics

* More update

* Reuse LoadingDialog

* Comment

app/src/main/java/org/thoughtcrime/securesms/groups/GroupManagerV2Impl.kt

@@ -264,6 +264,9 @@ class GroupManagerV2Impl @Inject constructor(
             subAccountTokens = subAccountTokens
         )
 
+        // Before we send the invitation, we need to make sure the configs are pushed
+        configFactory.waitUntilGroupConfigsPushed(group)
+
         // Call the API
         try {
             val swarmNode = SnodeAPI.getSingleTargetSnode(group.hexString).await()

app/src/main/java/org/thoughtcrime/securesms/groups/compose/EditGroupScreen.kt

@@ -28,6 +28,7 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment.Companion.CenterHorizontally
 import androidx.compose.ui.Alignment.Companion.CenterVertically
+import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource
@@ -53,9 +54,10 @@ import org.thoughtcrime.securesms.groups.getLabel
 import org.thoughtcrime.securesms.ui.AlertDialog
 import org.thoughtcrime.securesms.ui.DialogButtonModel
 import org.thoughtcrime.securesms.ui.GetString
-import org.thoughtcrime.securesms.ui.components.BackAppBar
+import org.thoughtcrime.securesms.ui.LoadingDialog
 import org.thoughtcrime.securesms.ui.components.ActionSheet
 import org.thoughtcrime.securesms.ui.components.ActionSheetItemData
+import org.thoughtcrime.securesms.ui.components.BackAppBar
 import org.thoughtcrime.securesms.ui.components.PrimaryOutlineButton
 import org.thoughtcrime.securesms.ui.components.SessionOutlinedTextField
 import org.thoughtcrime.securesms.ui.components.annotatedStringResource
@@ -99,6 +101,7 @@ fun EditGroupScreen(
                 onMemberClicked = viewModel::onMemberClicked,
                 hideActionSheet = viewModel::hideActionBottomSheet,
                 clickedMember = viewModel.clickedMember.collectAsState().value,
+                showLoading = viewModel.inProgress.collectAsState().value,
             )
         }
 
@@ -119,7 +122,7 @@ fun EditGroupScreen(
 @Serializable
 private object RouteEditGroup
 
-@OptIn(ExperimentalMaterial3Api::class)
+@OptIn(ExperimentalMaterial3Api::class, ExperimentalComposeUiApi::class)
 @Composable
 fun EditGroup(
     onBack: () -> Unit,
@@ -141,6 +144,7 @@ fun EditGroup(
     members: List<GroupMemberState>,
     showAddMembers: Boolean,
     showingError: String?,
+    showLoading: Boolean,
     onErrorDismissed: () -> Unit,
 ) {
     val (showingConfirmRemovingMember, setShowingConfirmRemovingMember) = remember {
@@ -157,8 +161,8 @@ fun EditGroup(
             )
         }
     ) { paddingValues ->
+        Box {
             Column(modifier = Modifier.padding(paddingValues)) {
-
                 GroupMinimumVersionBanner()
 
                 // Group name title
@@ -167,7 +171,8 @@ fun EditGroup(
                         GroupNameContainer {
                             IconButton(
                                 modifier = Modifier.size(LocalDimensions.current.spacing),
-                            onClick = onEditNameCancelClicked) {
+                                onClick = onEditNameCancelClicked
+                            ) {
                                 Icon(
                                     painter = painterResource(R.drawable.ic_x),
                                     contentDescription = stringResource(R.string.AccessibilityId_cancel),
@@ -176,7 +181,8 @@ fun EditGroup(
                             }
 
                             SessionOutlinedTextField(
-                            modifier = Modifier.widthIn(
+                                modifier = Modifier
+                                    .widthIn(
                                         min = LocalDimensions.current.mediumSpacing,
                                         max = maxNameWidth
                                     )
@@ -193,7 +199,8 @@ fun EditGroup(
 
                             IconButton(
                                 modifier = Modifier.size(LocalDimensions.current.spacing),
-                            onClick = onEditNameConfirmed) {
+                                onClick = onEditNameConfirmed
+                            ) {
                                 Icon(
                                     painter = painterResource(R.drawable.check),
                                     contentDescription = stringResource(R.string.AccessibilityId_confirm),
@@ -210,7 +217,8 @@ fun EditGroup(
                                 text = groupName,
                                 style = LocalType.current.h4,
                                 textAlign = TextAlign.Center,
-                            modifier = Modifier.widthIn(max = maxNameWidth)
+                                modifier = Modifier
+                                    .widthIn(max = maxNameWidth)
                                     .padding(vertical = LocalDimensions.current.smallSpacing),
                             )
 
@@ -270,6 +278,7 @@ fun EditGroup(
                 }
             }
         }
+    }
 
     if (clickedMember != null) {
         MemberActionSheet(
@@ -305,6 +314,10 @@ fun EditGroup(
         )
     }
 
+    if (showLoading) {
+        LoadingDialog()
+    }
+
     val context = LocalContext.current
 
     LaunchedEffect(showingError) {
@@ -515,7 +528,8 @@ private fun EditGroupPreview3() {
             onErrorDismissed = {},
             onMemberClicked = {},
             hideActionSheet = {},
-            clickedMember = null
+            clickedMember = null,
+            showLoading = true,
         )
     }
 }
@@ -589,7 +603,8 @@ private fun EditGroupPreview() {
             onErrorDismissed = {},
             onMemberClicked = {},
             hideActionSheet = {},
-            clickedMember = null
+            clickedMember = null,
+            showLoading = false,
         )
     }
 }
@@ -655,7 +670,8 @@ private fun EditGroupEditNamePreview() {
             onErrorDismissed = {},
             onMemberClicked = {},
             hideActionSheet = {},
-            clickedMember = null
+            clickedMember = null,
+            showLoading = false,
         )
     }
 }

app/src/main/java/org/thoughtcrime/securesms/ui/AlertDialog.kt

@@ -128,7 +128,8 @@ fun AlertDialog(
                                 text = it,
                                 textAlign = TextAlign.Center,
                                 style = LocalType.current.h7,
-                                modifier = Modifier.padding(bottom = LocalDimensions.current.xxsSpacing)
+                                modifier = Modifier
+                                    .padding(bottom = LocalDimensions.current.xxsSpacing)
                                     .qaTag(stringResource(R.string.AccessibilityId_modalTitle))
                             )
                         }
@@ -281,6 +282,17 @@ fun LoadingDialog(
         modifier = modifier,
         onDismissRequest = {},
         content = {
+            if (title.isNullOrBlank()) {
+                Box {
+                    CircularProgressIndicator(
+                        modifier = Modifier.align(Alignment.Center),
+                        //TODO: Leave this as hardcoded color for now as the dialog background (scrim)
+                        // always seems to be dark. Can can revisit later when we have more control over
+                        // the scrim color.
+                        color = Color.White
+                    )
+                }
+            } else {
                 DialogBg {
                     Column(
                         modifier = Modifier
@@ -293,10 +305,10 @@ fun LoadingDialog(
 
                         Spacer(modifier = Modifier.height(LocalDimensions.current.spacing))
 
-                    title?.let {
                         Text(
-                            it,
+                            title,
-                            modifier = Modifier.align(Alignment.CenterHorizontally)
+                            modifier = Modifier
+                                .align(Alignment.CenterHorizontally)
                                 .qaTag(stringResource(R.string.AccessibilityId_modalTitle)),
                             style = LocalType.current.large
                         )