Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Add confirmation when trying to leave the new transfer flow #255

Open
wants to merge 5 commits into
base: mail-validation-ui
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ package com.infomaniak.swisstransfer.ui.components

import android.content.res.Configuration
import androidx.compose.foundation.layout.*
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.Icon
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
Expand Down Expand Up @@ -107,6 +108,7 @@ private fun CoreButton(
showIndeterminateProgress,
progress,
onClick,
contentPadding = buttonSize.contentPadding
) {
ButtonTextContent(imageVector, title)
}
Expand All @@ -121,9 +123,9 @@ private fun ButtonTextContent(imageVector: ImageVector?, title: String) {
Text(text = title, style = SwissTransferTheme.typography.bodyMedium)
}

private enum class ButtonSize(val height: Dp) {
LARGE(Dimens.LargeButtonHeight),
SMALL(40.dp),
private enum class ButtonSize(val height: Dp, val contentPadding: PaddingValues) {
LARGE(Dimens.LargeButtonHeight, ButtonDefaults.ContentPadding),
SMALL(40.dp, PaddingValues(horizontal = Margin.Medium)),
tevincent marked this conversation as resolved.
Show resolved Hide resolved
}

@Preview(name = "Light", widthDp = 800)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -31,15 +31,36 @@ import com.infomaniak.swisstransfer.ui.theme.Margin
import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
import com.infomaniak.core2.R as RCore2

object SwissTransferAlertDialogDefaults {
@Composable
fun confirmButton(isEnabled: () -> Boolean = { true }, onClick: () -> Unit) {
SmallButton(
style = ButtonType.TERTIARY,
title = stringResource(R.string.buttonConfirm),
enabled = isEnabled,
onClick = onClick,
)
}

@Composable
fun cancelButton(onClick: () -> Unit) {
SmallButton(
style = ButtonType.TERTIARY,
title = stringResource(RCore2.string.buttonCancel),
onClick = onClick,
)
}
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun SwissTransferAlertDialog(
modifier: Modifier = Modifier,
@StringRes titleRes: Int,
@StringRes descriptionRes: Int,
positiveButton: @Composable () -> Unit,
negativeButton: @Composable () -> Unit,
onDismiss: () -> Unit,
onConfirmation: () -> Unit,
isConfirmButtonEnabled: () -> Boolean = { true },
content: @Composable (ColumnScope.() -> Unit)? = null,
) {
BasicAlertDialog(
Expand All @@ -52,11 +73,10 @@ fun SwissTransferAlertDialog(
BasicAlertDialogContent(
modifier = modifier,
titleRes = titleRes,
positiveButton = positiveButton,
negativeButton = negativeButton,
descriptionRes = descriptionRes,
additionalContent = content,
onDismiss = onDismiss,
onConfirmation = onConfirmation,
isConfirmButtonEnabled = isConfirmButtonEnabled,
)
}
}
Expand All @@ -67,10 +87,9 @@ private fun BasicAlertDialogContent(
modifier: Modifier,
@StringRes titleRes: Int,
@StringRes descriptionRes: Int,
positiveButton: @Composable () -> Unit,
negativeButton: @Composable () -> Unit,
additionalContent: @Composable (ColumnScope.() -> Unit)? = null,
onDismiss: () -> Unit,
onConfirmation: () -> Unit,
isConfirmButtonEnabled: () -> Boolean = { true },
) {
Column(modifier.padding(Margin.Large)) {
TitleAndDescription(titleRes, descriptionRes)
Expand All @@ -79,7 +98,7 @@ private fun BasicAlertDialogContent(
it()
Spacer(Modifier.height(Margin.Mini))
}
ActionButtons(onDismiss, onConfirmation, isConfirmButtonEnabled)
ActionButtons(positiveButton, negativeButton)
}
}

Expand All @@ -98,24 +117,19 @@ private fun TitleAndDescription(titleRes: Int, descriptionRes: Int) {
)
}

@OptIn(ExperimentalLayoutApi::class)
@Composable
private fun ActionButtons(onDismissRequest: () -> Unit, onConfirmation: () -> Unit, isEnabled: () -> Boolean) {
Row(
private fun ActionButtons(
positiveButton: @Composable () -> Unit,
negativeButton: @Composable () -> Unit,
) {
FlowRow(
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.End,
verticalAlignment = Alignment.CenterVertically,
itemVerticalAlignment = Alignment.CenterVertically,
) {
SmallButton(
style = ButtonType.TERTIARY,
title = stringResource(RCore2.string.buttonCancel),
onClick = onDismissRequest,
)
Spacer(Modifier.width(Margin.Micro))
SmallButton(
title = stringResource(R.string.buttonConfirm),
onClick = onConfirmation,
enabled = isEnabled
)
negativeButton()
positiveButton()
}
}

Expand All @@ -127,8 +141,25 @@ private fun PreviewAlertDialog() {
SwissTransferAlertDialog(
titleRes = R.string.settingsOptionPassword,
descriptionRes = R.string.settingsPasswordDescription,
positiveButton = { SwissTransferAlertDialogDefaults.confirmButton { } },
negativeButton = { SwissTransferAlertDialogDefaults.cancelButton { } },
onDismiss = {},
)
}
}
}

@Preview
@Composable
private fun WideButtonsPreview() {
SwissTransferTheme {
Surface {
SwissTransferAlertDialog(
titleRes = R.string.settingsOptionPassword,
descriptionRes = R.string.settingsPasswordDescription,
positiveButton = { SmallButton("A very looong and wide button", onClick = {}, style = ButtonType.TERTIARY) },
negativeButton = { SwissTransferAlertDialogDefaults.cancelButton { } },
onDismiss = {},
onConfirmation = {},
)
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -124,6 +124,12 @@ enum class ButtonType(val buttonColors: @Composable () -> ButtonColors) {
contentColor = SwissTransferTheme.materialColors.onError,
)
}),
ERROR_TEXT({
ButtonDefaults.buttonColors(
containerColor = Color.Transparent,
contentColor = SwissTransferTheme.materialColors.error,
)
}),
}

@PreviewLightAndDark
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,11 @@ import com.infomaniak.swisstransfer.ui.screen.newtransfer.upload.UploadSuccessSc
import com.infomaniak.swisstransfer.ui.screen.newtransfer.validateemail.ValidateUserEmailScreen

@Composable
fun NewTransferNavHost(navController: NavHostController, closeActivity: () -> Unit) {
fun NewTransferNavHost(
navController: NavHostController,
closeActivity: () -> Unit,
closeActivityAndPromptForValidation: () -> Unit,
) {

NavHost(navController, NewTransferNavigation.startDestination) {
composable<ImportFilesDestination> {
Expand All @@ -48,7 +52,7 @@ fun NewTransferNavHost(navController: NavHostController, closeActivity: () -> Un
composable<ValidateUserEmailDestination> {
val args = it.toRoute<ValidateUserEmailDestination>()
ValidateUserEmailScreen(
closeActivity = closeActivity,
closeActivity = closeActivityAndPromptForValidation,
navigateBack = { navController.popBackStack() },
emailToValidate = args.userEmail,
)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,20 +18,60 @@
package com.infomaniak.swisstransfer.ui.screen.newtransfer

import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.runtime.setValue
import androidx.compose.ui.res.stringResource
import androidx.navigation.compose.rememberNavController
import com.infomaniak.swisstransfer.R
import com.infomaniak.swisstransfer.ui.components.ButtonType
import com.infomaniak.swisstransfer.ui.components.SmallButton
import com.infomaniak.swisstransfer.ui.components.SwissTransferAlertDialog
import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows

@Composable
fun NewTransferScreen(closeActivity: () -> Unit) {
val navController = rememberNavController()
NewTransferNavHost(navController, closeActivity)
var displayConfirmationDialog by rememberSaveable { mutableStateOf(false) }

NewTransferNavHost(
navController,
closeActivity = closeActivity,
closeActivityAndPromptForValidation = { displayConfirmationDialog = true },
)

if (displayConfirmationDialog) ConfirmLeavingDialog(onLeave = closeActivity, onCancel = { displayConfirmationDialog = false })
}

@Composable
fun ConfirmLeavingDialog(onLeave: () -> Unit, onCancel: () -> Unit) {
SwissTransferAlertDialog(
titleRes = R.string.newTransferConfirmLeavingDialogTitle,
descriptionRes = R.string.newTransferLeavingDialogDescription,
positiveButton = {
SmallButton(
title = stringResource(R.string.newTransferLeavingDialogPositiveButton),
style = ButtonType.ERROR_TEXT,
onClick = onLeave,
)
},
negativeButton = {
SmallButton(
title = stringResource(R.string.newTransferLeavingDialogNegativeButton),
style = ButtonType.TERTIARY,
onClick = onCancel,
)
},
onDismiss = onCancel,
)
}

@PreviewAllWindows
@Composable
private fun NewTransferPreview() {
private fun Preview() {
SwissTransferTheme {
NewTransferScreen {}
ConfirmLeavingDialog({}, {})
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@
package com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles

import android.net.Uri
import androidx.activity.compose.BackHandler
import androidx.activity.compose.rememberLauncherForActivityResult
import androidx.activity.result.contract.ActivityResultContracts
import androidx.annotation.StringRes
Expand Down Expand Up @@ -97,6 +98,8 @@ fun ImportFilesScreen(

LaunchedEffect(Unit) { importFilesViewModel.initTransferOptionsValues() }

BackHandler { closeActivity() } // Closing the activity like other screens will prompt the user to be sure he wants to leave

val transferOptionsCallbacks = importFilesViewModel.getTransferOptionsCallbacks(
transferOptionsStates = {
buildList {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ import androidx.compose.ui.tooling.preview.Preview
import com.infomaniak.swisstransfer.R
import com.infomaniak.swisstransfer.ui.MatomoSwissTransfer.toFloat
import com.infomaniak.swisstransfer.ui.components.SwissTransferAlertDialog
import com.infomaniak.swisstransfer.ui.components.SwissTransferAlertDialogDefaults
import com.infomaniak.swisstransfer.ui.components.SwissTransferTextField
import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.PasswordTransferOption
import com.infomaniak.swisstransfer.ui.screen.newtransfer.upload.components.WeightOneSpacer
Expand Down Expand Up @@ -72,9 +73,14 @@ fun PasswordOptionAlertDialog(
SwissTransferAlertDialog(
titleRes = R.string.settingsOptionPassword,
descriptionRes = R.string.settingsPasswordDescription,
positiveButton = {
SwissTransferAlertDialogDefaults.confirmButton(
isEnabled = { !isPasswordActivated || isPasswordValid() },
onClick = ::onConfirmButtonClicked,
)
},
negativeButton = { SwissTransferAlertDialogDefaults.cancelButton(onClick = ::onDismiss) },
onDismiss = ::onDismiss,
onConfirmation = ::onConfirmButtonClicked,
isConfirmButtonEnabled = { !isPasswordActivated || isPasswordValid() },
) {
ActivatePasswordSwitch(isChecked = isPasswordActivated, onCheckedChange = { isPasswordActivated = it })
Spacer(Modifier.height(Margin.Medium))
Expand Down
4 changes: 4 additions & 0 deletions app/src/main/res/values-de/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,10 @@
<string name="messageHeader">Nachricht:</string>
<string name="myFilesTitle">Meine Dateien</string>
<string name="networkUnavailable">Auf Netzwerk warten</string>
<string name="newTransferConfirmLeavingDialogTitle">Ups, willst du wirklich abbrechen?</string>
<string name="newTransferLeavingDialogDescription">Dein Transfer ist fast fertig. Bist du sicher, dass du alles rückgängig machen willst?</string>
<string name="newTransferLeavingDialogNegativeButton">Nein, weiter</string>
<string name="newTransferLeavingDialogPositiveButton">Ja, abbrechen</string>
<string name="noFileDescription">Fügt bis zu 50 GB an Dateien hinzu</string>
<string name="noFileTitle">Keine Datei, keine Übertragung!</string>
<string name="noSettingsSelectedDescription">Wählt einen Parameter zur Anzeige aus</string>
Expand Down
4 changes: 4 additions & 0 deletions app/src/main/res/values-es/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,10 @@
<string name="messageHeader">Mensaje:</string>
<string name="myFilesTitle">Mis archivos</string>
<string name="networkUnavailable">Esperando la red</string>
<string name="newTransferConfirmLeavingDialogTitle">Ups, ¿realmente quieres cancelar?</string>
<string name="newTransferLeavingDialogDescription">Tu traslado está casi listo. ¿Estás seguro de que quieres cancelarlo?</string>
<string name="newTransferLeavingDialogNegativeButton">No, continúe</string>
<string name="newTransferLeavingDialogPositiveButton">Sí, cancelar</string>
<string name="noFileDescription">Añade hasta 50 GB de archivos</string>
<string name="noFileTitle">Si no hay archivo, no hay transferencia.</string>
<string name="noSettingsSelectedDescription">Selecciona un parámetro para su visualización</string>
Expand Down
4 changes: 4 additions & 0 deletions app/src/main/res/values-fr/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,10 @@
<string name="messageHeader">Message :</string>
<string name="myFilesTitle">Mes fichiers</string>
<string name="networkUnavailable">En attente de réseau</string>
<string name="newTransferConfirmLeavingDialogTitle">Oups, tu veux vraiment annuler ?</string>
<string name="newTransferLeavingDialogDescription">Ton transfert est presque prêt. Es-tu sûr de vouloir tout annuler ?</string>
<string name="newTransferLeavingDialogNegativeButton">Non, continuer</string>
<string name="newTransferLeavingDialogPositiveButton">Oui, annuler</string>
<string name="noFileDescription">Ajoute jusqu’à 50 Go de fichiers</string>
<string name="noFileTitle">Pas de fichier, pas de transfert !</string>
<string name="noSettingsSelectedDescription">Sélectionne un paramètre pour l’afficher</string>
Expand Down
4 changes: 4 additions & 0 deletions app/src/main/res/values-it/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,10 @@
<string name="messageHeader">Messaggio:</string>
<string name="myFilesTitle">I miei file</string>
<string name="networkUnavailable">In attesa della rete</string>
<string name="newTransferConfirmLeavingDialogTitle">Ops, vuoi davvero cancellarti?</string>
<string name="newTransferLeavingDialogDescription">Il trasferimento è quasi pronto. Sei sicuro di volerlo annullare?</string>
<string name="newTransferLeavingDialogNegativeButton">No, continua</string>
<string name="newTransferLeavingDialogPositiveButton">Sì, annulla</string>
<string name="noFileDescription">Aggiungere fino a 50 GB di file</string>
<string name="noFileTitle">Nessun file, nessun trasferimento!</string>
<string name="noSettingsSelectedDescription">Seleziona un parametro da visualizzare</string>
Expand Down
4 changes: 4 additions & 0 deletions app/src/main/res/values/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,10 @@
<string name="messageHeader">Message:</string>
<string name="myFilesTitle">My files</string>
<string name="networkUnavailable">Waiting for network</string>
<string name="newTransferConfirmLeavingDialogTitle">Oops, do you really want to cancel?</string>
<string name="newTransferLeavingDialogDescription">Your transfer is almost ready. Are you sure you want to cancel it?</string>
<string name="newTransferLeavingDialogNegativeButton">No, continue</string>
<string name="newTransferLeavingDialogPositiveButton">Yes, cancel</string>
<string name="noFileDescription">Add up to 50 GB of files</string>
<string name="noFileTitle">No file, no transfer!</string>
<string name="noSettingsSelectedDescription">Select a parameter to display it</string>
Expand Down
Loading