Add selection count indicator in top bar and refactor

app/src/main/java/fr/free/nrw/commons/customselector/ui/components/CustomSelectorTopBar.kt

@@ -2,8 +2,12 @@ package fr.free.nrw.commons.customselector.ui.components
 
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.automirrored.rounded.KeyboardArrowLeft
+import androidx.compose.material3.CardDefaults
+import androidx.compose.material3.ElevatedCard
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
@@ -14,6 +18,8 @@ import androidx.compose.material3.TopAppBar
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.semantics.contentDescription
+import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.PreviewLightDark
 import androidx.compose.ui.unit.dp
@@ -28,7 +34,9 @@ fun CustomSelectorTopBar(
     onNavigateBack: ()-> Unit,
     modifier: Modifier = Modifier,
     secondaryText: String? = null,
+    selectionCount: Int = 0,
     showNavigationIcon: Boolean = true,
+    showSelectionCount: Boolean = false,
     showAlertIcon: Boolean = false,
     onAlertAction: ()-> Unit = { },
 ) {
@@ -38,7 +46,6 @@ fun CustomSelectorTopBar(
                 Text(
                     text = primaryText,
                     style = MaterialTheme.typography.titleMedium.copy(fontSize = 18.sp),
-                    color = MaterialTheme.colorScheme.primary,
                     maxLines = 1,
                     overflow = TextOverflow.Ellipsis
                 )
@@ -73,6 +80,23 @@ fun CustomSelectorTopBar(
                     )
                 }
             }
+
+            if(showSelectionCount) {
+                ElevatedCard(
+                    colors = CardDefaults.elevatedCardColors(
+                        containerColor = MaterialTheme.colorScheme.primary
+                    ),
+                    shape = CircleShape,
+                    modifier = Modifier.semantics { contentDescription = "$selectionCount Selected" }
+                        .padding(end = 8.dp)
+                ) {
+                    Text(
+                        text = "$selectionCount",
+                        modifier = Modifier.padding(horizontal = 16.dp, vertical = 8.dp),
+                        style = MaterialTheme.typography.labelMedium
+                    )
+                }
+            }
         }
     )
 }
@@ -86,7 +110,8 @@ private fun CustomSelectorTopBarPreview() {
                 primaryText = "My Folder",
                 secondaryText = "10 images",
                 onNavigateBack = { },
-                showAlertIcon = true
+                showAlertIcon = true,
+                selectionCount = 1
             )
         }
     }

app/src/main/java/fr/free/nrw/commons/customselector/ui/components/PartialStorageAccessDialog.kt

@@ -21,11 +21,9 @@ import fr.free.nrw.commons.ui.theme.CommonsTheme
 
 @Composable
 fun PartialStorageAccessDialog(
-    isVisible: Boolean,
+    onManageAction: () -> Unit,
-    onManage: ()-> Unit,
     modifier: Modifier = Modifier
 ) {
-    if(isVisible) {
     Card(
         modifier = modifier,
         colors = CardDefaults.cardColors(
@@ -46,7 +44,7 @@ fun PartialStorageAccessDialog(
                 modifier = Modifier.weight(1f)
             )
             Button(
-                    onClick = onManage,
+                onClick = onManageAction,
                 shape = RoundedCornerShape(8.dp),
                 contentPadding = PaddingValues(horizontal = 16.dp)
             ) {
@@ -55,14 +53,15 @@ fun PartialStorageAccessDialog(
         }
     }
 }
-}
 
 @PreviewLightDark
 @Composable
 fun PartialStorageAccessIndicatorPreview() {
     CommonsTheme {
         Surface {
-            PartialStorageAccessDialog(isVisible = true, onManage = {}, modifier = Modifier
+            PartialStorageAccessDialog(
+                onManageAction = {},
+                modifier = Modifier
                     .padding(8.dp)
                     .fillMaxWidth()
             )