diff --git a/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/Buttons.kt b/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/Buttons.kt new file mode 100644 index 000000000..3b7f44a88 --- /dev/null +++ b/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/Buttons.kt @@ -0,0 +1,87 @@ +package fr.free.nrw.commons.customselector.ui.components + +import androidx.compose.foundation.BorderStroke +import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material3.Button +import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.OutlinedButton +import androidx.compose.material3.Surface +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Shape +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.tooling.preview.PreviewLightDark +import androidx.compose.ui.unit.dp +import fr.free.nrw.commons.ui.theme.CommonsTheme + +@Composable +fun PrimaryButton( + text: String, + onClick: ()-> Unit, + modifier: Modifier = Modifier, + shape: Shape = RoundedCornerShape(12.dp), +) { + Button( + onClick = onClick, + modifier = modifier, + shape = shape, + contentPadding = PaddingValues(horizontal = 24.dp, vertical = 4.dp) + ) { + Text( + text = text, + textAlign = TextAlign.Center + ) + } +} + +@Composable +fun SecondaryButton( + text: String, + onClick: ()-> Unit, + modifier: Modifier = Modifier, + shape: Shape = RoundedCornerShape(12.dp), +) { + OutlinedButton( + onClick = onClick, + modifier = modifier, + border = BorderStroke(1.dp, color = MaterialTheme.colorScheme.primary), + shape = shape, + contentPadding = PaddingValues(horizontal = 24.dp, vertical = 4.dp) + ) { + Text( + text = text, + textAlign = TextAlign.Center + ) + } +} + +@PreviewLightDark +@Composable +private fun PrimaryButtonPreview() { + CommonsTheme { + Surface { + PrimaryButton( + text = "Primary Button", + onClick = { }, + modifier = Modifier.padding(16.dp) + ) + } + } +} + +@PreviewLightDark +@Composable +private fun SecondaryButtonPreview() { + CommonsTheme { + Surface { + SecondaryButton( + text = "Secondary Button", + onClick = { }, + modifier = Modifier.padding(16.dp) + ) + } + } +} \ No newline at end of file diff --git a/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/CustomSelectorBottomBar.kt b/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/CustomSelectorBottomBar.kt new file mode 100644 index 000000000..0a673d01d --- /dev/null +++ b/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/CustomSelectorBottomBar.kt @@ -0,0 +1,48 @@ +package fr.free.nrw.commons.customselector.ui.components + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.IntrinsicSize +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Surface +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.tooling.preview.PreviewLightDark +import androidx.compose.ui.unit.dp +import fr.free.nrw.commons.ui.theme.CommonsTheme + +@Composable +fun CustomSelectorBottomBar(modifier: Modifier = Modifier) { + Row( + modifier = modifier, + horizontalArrangement = Arrangement.spacedBy(16.dp) + ) { + SecondaryButton( + text = "Mark as\nnot for upload".uppercase(), + onClick = { /*TODO*/ }, + modifier = Modifier.weight(1f) + ) + + PrimaryButton( + text = "Upload".uppercase(), + onClick = { /*TODO*/ }, + modifier = Modifier.weight(1f) + .height(IntrinsicSize.Max) + ) + } +} + +@PreviewLightDark +@Composable +private fun CustomSelectorBottomBarPreview() { + CommonsTheme { + Surface(tonalElevation = 3.dp) { + CustomSelectorBottomBar( + modifier = Modifier.padding(horizontal = 16.dp, vertical = 8.dp) + .fillMaxWidth() + ) + } + } +} \ No newline at end of file diff --git a/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/CustomSelectorTopBar.kt b/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/CustomSelectorTopBar.kt new file mode 100644 index 000000000..098a2fffa --- /dev/null +++ b/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/CustomSelectorTopBar.kt @@ -0,0 +1,90 @@ +package fr.free.nrw.commons.customselector.ui.components + +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.automirrored.rounded.KeyboardArrowLeft +import androidx.compose.material3.ExperimentalMaterial3Api +import androidx.compose.material3.Icon +import androidx.compose.material3.IconButton +import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.Surface +import androidx.compose.material3.Text +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.text.style.TextOverflow +import androidx.compose.ui.tooling.preview.PreviewLightDark +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import fr.free.nrw.commons.R +import fr.free.nrw.commons.ui.theme.CommonsTheme + +@OptIn(ExperimentalMaterial3Api::class) +@Composable +fun CustomSelectorTopBar( + primaryText: String, + onNavigateBack: ()-> Unit, + modifier: Modifier = Modifier, + secondaryText: String? = null, + showAlertIcon: Boolean = false, + onAlertAction: ()-> Unit = { }, +) { + TopAppBar( + title = { + Column { + Text( + text = primaryText, + style = MaterialTheme.typography.titleMedium.copy(fontSize = 20.sp), + color = MaterialTheme.colorScheme.primary, + maxLines = 1, + overflow = TextOverflow.Ellipsis + ) + secondaryText?.let { + Text( + text = it, + style = MaterialTheme.typography.labelLarge, + color = MaterialTheme.colorScheme.onSurfaceVariant + ) + } + } + }, + modifier = modifier, + navigationIcon = { + IconButton(onClick = onNavigateBack) { + Icon( + imageVector = Icons.AutoMirrored.Rounded.KeyboardArrowLeft, + contentDescription = "Navigate Back", + modifier = Modifier.fillMaxSize() + ) + } + }, + actions = { + if(showAlertIcon) { + IconButton(onClick = onAlertAction) { + Icon( + painter = painterResource(R.drawable.ic_error_red_24dp), + contentDescription = null, + tint = MaterialTheme.colorScheme.error + ) + } + } + } + ) +} + +@PreviewLightDark +@Composable +private fun CustomSelectorTopBarPreview() { + CommonsTheme { + Surface(tonalElevation = 1.dp) { + CustomSelectorTopBar( + primaryText = "My Folder", + secondaryText = "10 images", + onNavigateBack = { }, + showAlertIcon = true + ) + } + } +} \ No newline at end of file diff --git a/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/PartialStorageAccessDialog.kt b/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/PartialStorageAccessDialog.kt new file mode 100644 index 000000000..1fdec49a8 --- /dev/null +++ b/app/src/main/java/fr/free/nrw/commons/customselector/ui/components/PartialStorageAccessDialog.kt @@ -0,0 +1,71 @@ +package fr.free.nrw.commons.customselector.ui.components + +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material3.Button +import androidx.compose.material3.Card +import androidx.compose.material3.CardDefaults +import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.Surface +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.tooling.preview.PreviewLightDark +import androidx.compose.ui.unit.dp +import fr.free.nrw.commons.ui.theme.CommonsTheme + +@Composable +fun PartialStorageAccessDialog( + isVisible: Boolean, + onManage: ()-> Unit, + modifier: Modifier = Modifier +) { + if(isVisible) { + Card( + modifier = modifier, + colors = CardDefaults.cardColors( + containerColor = MaterialTheme.colorScheme.secondaryContainer + ), + shape = RoundedCornerShape(12.dp) + ) { + Row( + modifier = Modifier + .padding(vertical = 8.dp, horizontal = 16.dp) + .fillMaxWidth(), + horizontalArrangement = Arrangement.spacedBy(4.dp), + verticalAlignment = Alignment.CenterVertically + ) { + Text( + text = "You've given access to a selected number of photos", + style = MaterialTheme.typography.bodyMedium, + modifier = Modifier.weight(1f) + ) + Button( + onClick = onManage, + shape = RoundedCornerShape(8.dp), + contentPadding = PaddingValues(horizontal = 16.dp) + ) { + Text(text = "Manage", style = MaterialTheme.typography.labelMedium) + } + } + } + } +} + +@PreviewLightDark +@Composable +fun PartialStorageAccessIndicatorPreview() { + CommonsTheme { + Surface { + PartialStorageAccessDialog(isVisible = true, onManage = {}, modifier = Modifier + .padding(8.dp) + .fillMaxWidth() + ) + } + } +} \ No newline at end of file