From f8eda66dd8f64865b47d180f2cf30a3dd9a5a3c5 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Wed, 16 Oct 2024 11:29:43 +0200 Subject: [PATCH 01/27] feat: Add UploadSuccessEmail screen --- .../ui/components/EmailAddressChip.kt | 44 +++++++++ .../ui/navigation/NavigationDestination.kt | 1 - .../screen/newtransfer/NewTransferNavHost.kt | 5 +- .../upload/UploadSuccessEmailScreen.kt | 91 +++++++++++++++++++ .../newtransfer/upload/UploadSuccessScreen.kt | 25 ++++- .../swisstransfer/ui/theme/ColorDark.kt | 2 + .../swisstransfer/ui/theme/ColorLight.kt | 2 + .../swisstransfer/ui/theme/Theme.kt | 2 + 8 files changed, 167 insertions(+), 5 deletions(-) create mode 100644 app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt create mode 100644 app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt new file mode 100644 index 000000000..5f0422b2f --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt @@ -0,0 +1,44 @@ +/* + * Infomaniak SwissTransfer - Android + * Copyright (C) 2024 Infomaniak Network SA + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ +package com.infomaniak.swisstransfer.ui.components + +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import com.infomaniak.swisstransfer.ui.theme.CustomShapes +import com.infomaniak.swisstransfer.ui.theme.Margin +import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme + +@Composable +fun EmailAddressChip(text: String) { + Box( + modifier = Modifier + .clip(CustomShapes.Rounded) + .background(SwissTransferTheme.colors.emailAddressChipColor) + .padding(horizontal = Margin.Small), + ) { + Text( + color = SwissTransferTheme.colors.onEmailAddressChipColor, + text = text, + ) + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/navigation/NavigationDestination.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/navigation/NavigationDestination.kt index ff8a8df5c..c012dd957 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/navigation/NavigationDestination.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/navigation/NavigationDestination.kt @@ -59,7 +59,6 @@ sealed class NewTransferNavigation : NavigationDestination() { data object TransferOptionsDestination : NewTransferNavigation() @Serializable data object ValidateUserEmailDestination : NewTransferNavigation() - @Serializable data object UploadProgressDestination : NewTransferNavigation() @Serializable diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt index 767b06aba..88fd3dfef 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt @@ -26,6 +26,7 @@ import com.infomaniak.swisstransfer.ui.navigation.NewTransferNavigation.* import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.ImportFilesScreen import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.TransferOptionsScreen import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.ValidateUserEmailScreen +import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.components.TransferType import com.infomaniak.swisstransfer.ui.screen.newtransfer.upload.UploadProgressScreen import com.infomaniak.swisstransfer.ui.screen.newtransfer.upload.UploadSuccessScreen @@ -48,7 +49,9 @@ fun NewTransferNavHost(navController: NavHostController, closeActivity: () -> Un UploadProgressScreen() } composable { - UploadSuccessScreen() + UploadSuccessScreen( + transferType = TransferType.MAIL, // TODO: Use correct TransferType instead of hard-coded value. + ) } } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt new file mode 100644 index 000000000..4b1a175cf --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -0,0 +1,91 @@ +/* + * Infomaniak SwissTransfer - Android + * Copyright (C) 2024 Infomaniak Network SA + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ +package com.infomaniak.swisstransfer.ui.screen.newtransfer.upload + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.* +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.res.stringResource +import androidx.compose.ui.text.style.TextAlign +import com.infomaniak.swisstransfer.R +import com.infomaniak.swisstransfer.ui.components.BottomStickyButtonScaffold +import com.infomaniak.swisstransfer.ui.components.BrandTopAppBar +import com.infomaniak.swisstransfer.ui.components.EmailAddressChip +import com.infomaniak.swisstransfer.ui.components.LargeButton +import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus +import com.infomaniak.swisstransfer.ui.images.illus.uploadSuccessEmail.UploadSuccessEmail +import com.infomaniak.swisstransfer.ui.theme.Dimens +import com.infomaniak.swisstransfer.ui.theme.Margin +import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme +import com.infomaniak.swisstransfer.ui.utils.PreviewSmallWindow + +@Composable +fun UploadSuccessEmailScreen() { + BottomStickyButtonScaffold( + topBar = { BrandTopAppBar() }, + bottomButton = { + LargeButton( + modifier = it, + titleRes = R.string.buttonFinished, + onClick = { /* TODO */ }, + ) + }, + content = { + Column( + modifier = Modifier.fillMaxSize(), + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.Center, + ) { + Image( + imageVector = AppIllus.UploadSuccessEmail.image(), + contentDescription = null, + ) + Text( + text = stringResource(R.string.uploadSuccessEmailTitle), + style = SwissTransferTheme.typography.h1, + color = SwissTransferTheme.colors.primaryTextColor, + modifier = Modifier.padding(top = Margin.XXLarge, start = Margin.Medium, end = Margin.Medium) + ) + Text( + text = stringResource(R.string.uploadSuccessEmailDescription), + style = SwissTransferTheme.typography.bodyRegular, + textAlign = TextAlign.Center, + color = SwissTransferTheme.colors.secondaryTextColor, + modifier = Modifier + .padding(Margin.Medium) + .widthIn(max = Dimens.DescriptionWidth), + ) + EmailAddressChip("test.test@ik.me") // TODO: Use correct email instead of hard-coded value. + } + }, + ) +} + +@PreviewSmallWindow +@Composable +private fun UploadSuccessEmailScreenPreview() { + SwissTransferTheme { + Surface { + UploadSuccessEmailScreen() + } + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt index a8446ccc0..167df44e0 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt @@ -17,10 +17,29 @@ */ package com.infomaniak.swisstransfer.ui.screen.newtransfer.upload -import androidx.compose.material3.Text +import androidx.compose.material3.Surface import androidx.compose.runtime.Composable +import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.components.TransferType +import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme +import com.infomaniak.swisstransfer.ui.utils.PreviewLargeWindow +import com.infomaniak.swisstransfer.ui.utils.PreviewSmallWindow @Composable -fun UploadSuccessScreen() { - Text("UploadSuccessScreen") +fun UploadSuccessScreen(transferType: TransferType) { + if (transferType == TransferType.MAIL) { + UploadSuccessEmailScreen() + } else { + // UploadSuccessQrScreen(transferType) + } +} + +@PreviewSmallWindow +@PreviewLargeWindow +@Composable +private fun UploadSuccessScreenPreview() { + SwissTransferTheme { + Surface { + UploadSuccessScreen(TransferType.MAIL) + } + } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt index 915997981..f70c4f673 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt @@ -84,4 +84,6 @@ val CustomDarkColorScheme = CustomColorScheme( transferTypeQrOnContainer = Color(green_main), transferTypeProximityContainer = Color(specific3), transferTypeProximityOnContainer = Color(specific4), + emailAddressChipColor = Color(green_dark), + onEmailAddressChipColor = Color(green_main), ) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt index 0834bb1cd..c1e6cff5c 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt @@ -85,4 +85,6 @@ val CustomLightColorScheme = CustomColorScheme( transferTypeQrOnContainer = Color(green_main), transferTypeProximityContainer = Color(specific3), transferTypeProximityOnContainer = Color(specific4), + emailAddressChipColor = Color(green_contrast), + onEmailAddressChipColor = Color(green_dark), ) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt index 812a05d62..36cac9cbb 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt @@ -81,6 +81,8 @@ data class CustomColorScheme( val transferTypeQrOnContainer: Color = Color.Unspecified, val transferTypeProximityContainer: Color = Color.Unspecified, val transferTypeProximityOnContainer: Color = Color.Unspecified, + val emailAddressChipColor: Color = Color.Unspecified, + val onEmailAddressChipColor: Color = Color.Unspecified, ) private val Shapes = Shapes( From 8026477c7b53da797d48f8a1ab785d1f674be2c2 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Wed, 16 Oct 2024 11:30:17 +0200 Subject: [PATCH 02/27] feat: Add UploadSuccessQr screen --- .../swisstransfer/ui/components/QrCode.kt | 46 +++++++ .../screen/newtransfer/NewTransferNavHost.kt | 2 +- .../upload/UploadSuccessQrScreen.kt | 116 ++++++++++++++++++ .../newtransfer/upload/UploadSuccessScreen.kt | 2 +- .../swisstransfer/ui/theme/ColorDark.kt | 3 + .../swisstransfer/ui/theme/ColorLight.kt | 2 + .../swisstransfer/ui/theme/Theme.kt | 2 + 7 files changed, 171 insertions(+), 2 deletions(-) create mode 100644 app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt create mode 100644 app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt new file mode 100644 index 000000000..38fc2d7be --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt @@ -0,0 +1,46 @@ +/* + * Infomaniak SwissTransfer - Android + * Copyright (C) 2024 Infomaniak Network SA + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ +package com.infomaniak.swisstransfer.ui.components + +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.size +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.unit.dp +import com.infomaniak.swisstransfer.ui.theme.CustomShapes +import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme + +@Composable +fun QrCode() { // TODO: Add parameter containing the QR code value, and use it. + Box( + modifier = Modifier + .size(180.dp) + .clip(CustomShapes.small) + .background(SwissTransferTheme.colors.qrCodeBackground), + contentAlignment = Alignment.Center, + ) { + Box( + modifier = Modifier + .size(160.dp) + .background(SwissTransferTheme.colors.qrCodeColor), // TODO: Use this color to tint the QR code. + ) + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt index 88fd3dfef..4774f9323 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt @@ -50,7 +50,7 @@ fun NewTransferNavHost(navController: NavHostController, closeActivity: () -> Un } composable { UploadSuccessScreen( - transferType = TransferType.MAIL, // TODO: Use correct TransferType instead of hard-coded value. + transferType = TransferType.LINK, // TODO: Use correct TransferType instead of hard-coded value. ) } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt new file mode 100644 index 000000000..7e9e84721 --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt @@ -0,0 +1,116 @@ +/* + * Infomaniak SwissTransfer - Android + * Copyright (C) 2024 Infomaniak Network SA + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ +package com.infomaniak.swisstransfer.ui.screen.newtransfer.upload + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.* +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.draw.alpha +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.style.TextAlign +import com.infomaniak.swisstransfer.R +import com.infomaniak.swisstransfer.ui.components.* +import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus +import com.infomaniak.swisstransfer.ui.images.illus.uploadSuccessQr.UploadSuccessQr +import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.components.TransferType +import com.infomaniak.swisstransfer.ui.theme.Dimens +import com.infomaniak.swisstransfer.ui.theme.Margin +import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme +import com.infomaniak.swisstransfer.ui.utils.PreviewSmallWindow + +@Composable +fun UploadSuccessQrScreen(transferType: TransferType) { + + val uploadSuccessTitle = if (transferType == TransferType.QR_CODE) { + R.string.uploadSuccessQrTitle + } else { + R.string.uploadSuccessLinkTitle + } + + BottomStickyButtonScaffold( + topBar = { BrandTopAppBar() }, + topButton = { + LargeButton( + modifier = it, + style = ButtonType.PRIMARY, + titleRes = R.string.buttonShare, + onClick = { /* TODO */ }, + ) + }, + bottomButton = { + LargeButton( + modifier = it, + style = ButtonType.SECONDARY, + titleRes = R.string.buttonFinished, + onClick = { /* TODO */ }, + ) + }, + content = { + Column( + modifier = Modifier.fillMaxSize(), + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.Center, + ) { + Image( + imageVector = AppIllus.UploadSuccessQr.image(), + contentDescription = null, + ) + Text( + text = stringResource(uploadSuccessTitle), + style = SwissTransferTheme.typography.h1, + color = SwissTransferTheme.colors.primaryTextColor, + modifier = Modifier.padding(Margin.XLarge) + ) + QrCode() + Text( + text = stringResource(R.string.uploadSuccessLinkDescription), + style = SwissTransferTheme.typography.bodyRegular, + textAlign = TextAlign.Center, + color = SwissTransferTheme.colors.secondaryTextColor, + modifier = Modifier + .alpha(if (transferType == TransferType.QR_CODE) 0.0f else 1.0f) + .padding(top = Margin.XXLarge, start = Margin.Medium, end = Margin.Medium) + .widthIn(max = Dimens.DescriptionWidth), + ) + // TODO: What do we want to do with this button placement? + LargeButton( + modifier = Modifier + .fillMaxSize() + .padding(Margin.Medium), + style = ButtonType.SECONDARY, + titleRes = R.string.buttonCopyLink, + onClick = { /* TODO */ }, + ) + } + }, + ) +} + +@PreviewSmallWindow +@Composable +private fun UploadSuccessQrScreenPreview() { + SwissTransferTheme { + Surface { + UploadSuccessQrScreen(transferType = TransferType.QR_CODE) + } + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt index 167df44e0..a951e3d26 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt @@ -29,7 +29,7 @@ fun UploadSuccessScreen(transferType: TransferType) { if (transferType == TransferType.MAIL) { UploadSuccessEmailScreen() } else { - // UploadSuccessQrScreen(transferType) + UploadSuccessQrScreen(transferType) } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt index f70c4f673..828ecdd05 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorDark.kt @@ -29,6 +29,7 @@ private const val dark1 = 0xFF152123 private const val dark2 = 0xFF2B383B private const val dark3 = 0xFF3C4F52 private const val shark = 0xFF9F9F9F +private const val polar_bear = 0xFFF5F5F5 private const val rabbit = 0xFFF1F1F1 private const val specific1 = 0xFF124426 @@ -86,4 +87,6 @@ val CustomDarkColorScheme = CustomColorScheme( transferTypeProximityOnContainer = Color(specific4), emailAddressChipColor = Color(green_dark), onEmailAddressChipColor = Color(green_main), + qrCodeBackground = Color(polar_bear), + qrCodeColor = Color(green_dark), ) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt index c1e6cff5c..7bcefbb40 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/ColorLight.kt @@ -87,4 +87,6 @@ val CustomLightColorScheme = CustomColorScheme( transferTypeProximityOnContainer = Color(specific4), emailAddressChipColor = Color(green_contrast), onEmailAddressChipColor = Color(green_dark), + qrCodeBackground = Color(polar_bear), + qrCodeColor = Color(green_dark), ) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt index 36cac9cbb..245b2d9a6 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/theme/Theme.kt @@ -83,6 +83,8 @@ data class CustomColorScheme( val transferTypeProximityOnContainer: Color = Color.Unspecified, val emailAddressChipColor: Color = Color.Unspecified, val onEmailAddressChipColor: Color = Color.Unspecified, + val qrCodeBackground: Color = Color.Unspecified, + val qrCodeColor: Color = Color.Unspecified, ) private val Shapes = Shapes( From e752bf11963ae2396632df6d729d3f074c230407 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Thu, 17 Oct 2024 14:19:00 +0200 Subject: [PATCH 03/27] feat: Use `@PreviewAllWindows` --- .../screen/newtransfer/upload/UploadSuccessEmailScreen.kt | 4 ++-- .../ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt | 4 ++-- .../ui/screen/newtransfer/upload/UploadSuccessScreen.kt | 6 ++---- 3 files changed, 6 insertions(+), 8 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index 4b1a175cf..87bf01421 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -36,7 +36,7 @@ import com.infomaniak.swisstransfer.ui.images.illus.uploadSuccessEmail.UploadSuc import com.infomaniak.swisstransfer.ui.theme.Dimens import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme -import com.infomaniak.swisstransfer.ui.utils.PreviewSmallWindow +import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows @Composable fun UploadSuccessEmailScreen() { @@ -80,7 +80,7 @@ fun UploadSuccessEmailScreen() { ) } -@PreviewSmallWindow +@PreviewAllWindows @Composable private fun UploadSuccessEmailScreenPreview() { SwissTransferTheme { diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt index 7e9e84721..c659659e4 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt @@ -35,7 +35,7 @@ import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.components import com.infomaniak.swisstransfer.ui.theme.Dimens import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme -import com.infomaniak.swisstransfer.ui.utils.PreviewSmallWindow +import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows @Composable fun UploadSuccessQrScreen(transferType: TransferType) { @@ -105,7 +105,7 @@ fun UploadSuccessQrScreen(transferType: TransferType) { ) } -@PreviewSmallWindow +@PreviewAllWindows @Composable private fun UploadSuccessQrScreenPreview() { SwissTransferTheme { diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt index a951e3d26..fd8f5f933 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt @@ -21,8 +21,7 @@ import androidx.compose.material3.Surface import androidx.compose.runtime.Composable import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.components.TransferType import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme -import com.infomaniak.swisstransfer.ui.utils.PreviewLargeWindow -import com.infomaniak.swisstransfer.ui.utils.PreviewSmallWindow +import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows @Composable fun UploadSuccessScreen(transferType: TransferType) { @@ -33,8 +32,7 @@ fun UploadSuccessScreen(transferType: TransferType) { } } -@PreviewSmallWindow -@PreviewLargeWindow +@PreviewAllWindows @Composable private fun UploadSuccessScreenPreview() { SwissTransferTheme { From eff56254d3c3ebadb7b0f69246e1beafb5ec7641 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Fri, 18 Oct 2024 10:41:07 +0200 Subject: [PATCH 04/27] review: Add some missing components previews --- .../ui/components/EmailAddressChip.kt | 14 +++++++++++ .../swisstransfer/ui/components/EmptyState.kt | 21 ++++++++++++++++ .../ui/components/NewTransferFab.kt | 25 +++++++++++++++++++ .../swisstransfer/ui/components/QrCode.kt | 14 +++++++++++ 4 files changed, 74 insertions(+) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt index 5f0422b2f..f74a3100f 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt @@ -17,13 +17,16 @@ */ package com.infomaniak.swisstransfer.ui.components +import android.content.res.Configuration import androidx.compose.foundation.background import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip +import androidx.compose.ui.tooling.preview.Preview import com.infomaniak.swisstransfer.ui.theme.CustomShapes import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @@ -42,3 +45,14 @@ fun EmailAddressChip(text: String) { ) } } + +@Preview(name = "Light mode") +@Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL) +@Composable +private fun SwissTransferFabPreview() { + SwissTransferTheme { + Surface { + EmailAddressChip("test.test@ik.me") + } + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt index 3b9fbdbdd..1c7030c5f 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt @@ -17,9 +17,11 @@ */ package com.infomaniak.swisstransfer.ui.components +import android.content.res.Configuration import androidx.annotation.StringRes import androidx.compose.foundation.Image import androidx.compose.foundation.layout.* +import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment @@ -27,6 +29,10 @@ import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.vector.ImageVector import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.tooling.preview.Preview +import com.infomaniak.swisstransfer.R +import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus +import com.infomaniak.swisstransfer.ui.images.illus.MascotSearching import com.infomaniak.swisstransfer.ui.theme.Dimens import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @@ -62,3 +68,18 @@ fun EmptyState( ) } } + +@Preview(name = "Light mode") +@Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL) +@Composable +private fun SwissTransferFabPreview() { + SwissTransferTheme { + Surface { + EmptyState( + icon = AppIllus.MascotSearching, + title = R.string.noTransferReceivedTitle, + description = R.string.noTransferReceivedDescription, + ) + } + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/NewTransferFab.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/NewTransferFab.kt index d40dbbaf4..9da1d46c2 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/NewTransferFab.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/NewTransferFab.kt @@ -17,14 +17,22 @@ */ package com.infomaniak.swisstransfer.ui.components +import android.content.res.Configuration +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.width import androidx.compose.material3.FloatingActionButtonDefaults import androidx.compose.material3.FloatingActionButtonElevation +import androidx.compose.material3.Surface import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.platform.LocalContext +import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.dp import com.infomaniak.swisstransfer.ui.NewTransferActivity +import com.infomaniak.swisstransfer.ui.theme.Margin +import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme import com.infomaniak.swisstransfer.ui.utils.launchActivity @Composable @@ -57,3 +65,20 @@ enum class NewTransferFabType(val fabType: FabType, private val defaultElevation } } } + +@Preview(name = "Light mode") +@Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL) +@Composable +private fun SwissTransferFabPreview() { + SwissTransferTheme { + Surface { + Row { + NewTransferFab(newTransferFabType = NewTransferFabType.BOTTOM_BAR) + Spacer(modifier = Modifier.width(Margin.Large)) + NewTransferFab(newTransferFabType = NewTransferFabType.EMPTY_STATE) + Spacer(modifier = Modifier.width(Margin.Large)) + NewTransferFab(newTransferFabType = NewTransferFabType.NAVIGATION_RAIL) + } + } + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt index 38fc2d7be..46aebb7e0 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt @@ -17,13 +17,16 @@ */ package com.infomaniak.swisstransfer.ui.components +import android.content.res.Configuration import androidx.compose.foundation.background import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.size +import androidx.compose.material3.Surface import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip +import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import com.infomaniak.swisstransfer.ui.theme.CustomShapes import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @@ -44,3 +47,14 @@ fun QrCode() { // TODO: Add parameter containing the QR code value, and use it. ) } } + +@Preview(name = "Light mode") +@Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL) +@Composable +private fun SwissTransferFabPreview() { + SwissTransferTheme { + Surface { + QrCode() + } + } +} From d416bf03bfedeb5eddcea9aad3e0f12f7fab055b Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Fri, 18 Oct 2024 10:42:18 +0200 Subject: [PATCH 05/27] review: Separate navigations --- .../swisstransfer/ui/navigation/NavigationDestination.kt | 1 + 1 file changed, 1 insertion(+) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/navigation/NavigationDestination.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/navigation/NavigationDestination.kt index c012dd957..ff8a8df5c 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/navigation/NavigationDestination.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/navigation/NavigationDestination.kt @@ -59,6 +59,7 @@ sealed class NewTransferNavigation : NavigationDestination() { data object TransferOptionsDestination : NewTransferNavigation() @Serializable data object ValidateUserEmailDestination : NewTransferNavigation() + @Serializable data object UploadProgressDestination : NewTransferNavigation() @Serializable From 09c0e4b8a6f7d5fe6c0d1a80f60fb8f9b511a438 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Fri, 18 Oct 2024 11:52:11 +0200 Subject: [PATCH 06/27] feat: Add `IllustratedMessageBlock` --- .../swisstransfer/ui/components/EmptyState.kt | 33 +------ .../ui/components/IllustratedMessageBlock.kt | 85 +++++++++++++++++++ 2 files changed, 87 insertions(+), 31 deletions(-) create mode 100644 app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt index 1c7030c5f..3673e93cf 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt @@ -19,22 +19,15 @@ package com.infomaniak.swisstransfer.ui.components import android.content.res.Configuration import androidx.annotation.StringRes -import androidx.compose.foundation.Image -import androidx.compose.foundation.layout.* +import androidx.compose.foundation.layout.fillMaxSize 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.graphics.vector.ImageVector -import androidx.compose.ui.res.stringResource -import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.tooling.preview.Preview import com.infomaniak.swisstransfer.R import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus import com.infomaniak.swisstransfer.ui.images.illus.MascotSearching -import com.infomaniak.swisstransfer.ui.theme.Dimens -import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @Composable @@ -44,29 +37,7 @@ fun EmptyState( @StringRes description: Int, modifier: Modifier = Modifier, ) { - Column( - modifier = modifier.fillMaxSize(), - verticalArrangement = Arrangement.Center, - horizontalAlignment = Alignment.CenterHorizontally, - ) { - Image(imageVector = icon, contentDescription = null) - - Text( - text = stringResource(title), - style = SwissTransferTheme.typography.specificMedium22, - modifier = Modifier.padding(PaddingValues(top = Margin.XLarge)), - ) - - Text( - text = stringResource(description), - textAlign = TextAlign.Center, - style = SwissTransferTheme.typography.bodyRegular, - color = SwissTransferTheme.colors.secondaryTextColor, - modifier = Modifier - .widthIn(max = Dimens.DescriptionWidth) - .padding(PaddingValues(top = Margin.Medium)), - ) - } + IllustratedMessageBlock(icon, title, description, modifier.fillMaxSize()) } @Preview(name = "Light mode") diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt new file mode 100644 index 000000000..47f2f591b --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt @@ -0,0 +1,85 @@ +/* + * Infomaniak SwissTransfer - Android + * Copyright (C) 2024 Infomaniak Network SA + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see . + */ +package com.infomaniak.swisstransfer.ui.components + +import android.content.res.Configuration +import androidx.annotation.StringRes +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.* +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.graphics.vector.ImageVector +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.tooling.preview.Preview +import com.infomaniak.swisstransfer.R +import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus +import com.infomaniak.swisstransfer.ui.images.illus.MascotSearching +import com.infomaniak.swisstransfer.ui.theme.Dimens +import com.infomaniak.swisstransfer.ui.theme.Margin +import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme + +@Composable +fun IllustratedMessageBlock( + icon: ImageVector, + @StringRes title: Int, + @StringRes description: Int, + modifier: Modifier = Modifier, +) { + Column( + modifier = modifier, + verticalArrangement = Arrangement.Center, + horizontalAlignment = Alignment.CenterHorizontally, + ) { + Image(imageVector = icon, contentDescription = null) + + Text( + text = stringResource(title), + style = SwissTransferTheme.typography.h1, + modifier = Modifier.padding(PaddingValues(top = Margin.XLarge)), + ) + + Text( + text = stringResource(description), + textAlign = TextAlign.Center, + style = SwissTransferTheme.typography.bodyRegular, + color = SwissTransferTheme.colors.secondaryTextColor, + modifier = Modifier + .widthIn(max = Dimens.DescriptionWidth) + .padding(PaddingValues(top = Margin.Medium)), + ) + } +} + +@Preview(name = "Light mode") +@Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL) +@Composable +private fun SwissTransferFabPreview() { + SwissTransferTheme { + Surface { + IllustratedMessageBlock( + icon = AppIllus.MascotSearching, + title = R.string.noTransferReceivedTitle, + description = R.string.noTransferReceivedDescription, + ) + } + } +} From e2e82b2c3d7218291b56d957eb7f60ee2139e726 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Fri, 18 Oct 2024 11:53:04 +0200 Subject: [PATCH 07/27] chore: Display empty state in Received screen --- .../ui/screen/main/received/ReceivedScreen.kt | 2 +- .../swisstransfer/ui/screen/main/sent/SentListScreen.kt | 9 ++++++--- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/ReceivedScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/ReceivedScreen.kt index 4e64230ca..0ae62bba3 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/ReceivedScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/ReceivedScreen.kt @@ -64,7 +64,7 @@ private fun ReceivedScreen( BrandTopAppBarScaffold( floatingActionButton = { ReceivedEmptyFab(areTransfersEmpty) }, ) { - if (areTransfersEmpty()) { + if (true || areTransfersEmpty()) { // TODO: Remove this `true || `, it's for testing only. EmptyState( icon = AppIllus.MascotSearching, title = R.string.noTransferReceivedTitle, diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/sent/SentListScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/sent/SentListScreen.kt index c1ff2b6b4..89ea230fd 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/sent/SentListScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/sent/SentListScreen.kt @@ -29,29 +29,32 @@ import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows @Composable fun SentListScreen(transfers: List) { + + // TODO: Remove this when `transfers` contains the real data. val transfers = listOf( FileUi( fileName = "The 5-Step Guide to Not Breaking Your Code.txt", uid = "The 5-Step Guide to Not Breaking Your Code.txt", - fileSizeInBytes = 57689032, + fileSizeInBytes = 57_689_032L, mimeType = null, uri = "", ), FileUi( fileName = "Introduction to Turning It Off and On Again.pptx", uid = "Introduction to Turning It Off and On Again.pptx", - fileSizeInBytes = 89723143, + fileSizeInBytes = 89_723_143L, mimeType = null, uri = "", ), FileUi( fileName = "Learning to Copy and Paste: A Complete Guide.docx", uid = "Learning to Copy and Paste: A Complete Guide.docx", - fileSizeInBytes = 237866728, + fileSizeInBytes = 237_866_728L, mimeType = null, uri = "", ), ) + FileItemList( modifier = Modifier.padding(Margin.Medium), files = transfers, From ccbc533c8f23e68ed9f363cf41dcd8d21ebad293 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Fri, 18 Oct 2024 11:53:44 +0200 Subject: [PATCH 08/27] feat: Use IllustratedMessageBlock to display content in UploadSuccessEmail screen --- .../ui/components/EmailAddressChip.kt | 4 +- .../screen/newtransfer/NewTransferNavHost.kt | 2 +- .../upload/UploadSuccessEmailScreen.kt | 42 +++++++------------ .../newtransfer/upload/UploadSuccessScreen.kt | 2 +- 4 files changed, 18 insertions(+), 32 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt index f74a3100f..8f20648fe 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt @@ -32,9 +32,9 @@ import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @Composable -fun EmailAddressChip(text: String) { +fun EmailAddressChip(text: String, modifier: Modifier = Modifier) { Box( - modifier = Modifier + modifier = modifier .clip(CustomShapes.Rounded) .background(SwissTransferTheme.colors.emailAddressChipColor) .padding(horizontal = Margin.Small), diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt index 4774f9323..88fd3dfef 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt @@ -50,7 +50,7 @@ fun NewTransferNavHost(navController: NavHostController, closeActivity: () -> Un } composable { UploadSuccessScreen( - transferType = TransferType.LINK, // TODO: Use correct TransferType instead of hard-coded value. + transferType = TransferType.MAIL, // TODO: Use correct TransferType instead of hard-coded value. ) } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index 87bf01421..712a202ec 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -17,23 +17,18 @@ */ package com.infomaniak.swisstransfer.ui.screen.newtransfer.upload -import androidx.compose.foundation.Image -import androidx.compose.foundation.layout.* +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.padding 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.res.stringResource -import androidx.compose.ui.text.style.TextAlign import com.infomaniak.swisstransfer.R -import com.infomaniak.swisstransfer.ui.components.BottomStickyButtonScaffold -import com.infomaniak.swisstransfer.ui.components.BrandTopAppBar -import com.infomaniak.swisstransfer.ui.components.EmailAddressChip -import com.infomaniak.swisstransfer.ui.components.LargeButton +import com.infomaniak.swisstransfer.ui.components.* import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus import com.infomaniak.swisstransfer.ui.images.illus.uploadSuccessEmail.UploadSuccessEmail -import com.infomaniak.swisstransfer.ui.theme.Dimens import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows @@ -55,26 +50,17 @@ fun UploadSuccessEmailScreen() { horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center, ) { - Image( - imageVector = AppIllus.UploadSuccessEmail.image(), - contentDescription = null, - ) - Text( - text = stringResource(R.string.uploadSuccessEmailTitle), - style = SwissTransferTheme.typography.h1, - color = SwissTransferTheme.colors.primaryTextColor, - modifier = Modifier.padding(top = Margin.XXLarge, start = Margin.Medium, end = Margin.Medium) + + IllustratedMessageBlock( + icon = AppIllus.UploadSuccessEmail.image(), + title = R.string.uploadSuccessEmailTitle, + description = R.string.uploadSuccessEmailDescription, ) - Text( - text = stringResource(R.string.uploadSuccessEmailDescription), - style = SwissTransferTheme.typography.bodyRegular, - textAlign = TextAlign.Center, - color = SwissTransferTheme.colors.secondaryTextColor, - modifier = Modifier - .padding(Margin.Medium) - .widthIn(max = Dimens.DescriptionWidth), + + EmailAddressChip( + text = "test.test@ik.me", // TODO: Use correct email instead of hard-coded value. + modifier = Modifier.padding(top = Margin.Medium), ) - EmailAddressChip("test.test@ik.me") // TODO: Use correct email instead of hard-coded value. } }, ) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt index fd8f5f933..e5e68de77 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt @@ -37,7 +37,7 @@ fun UploadSuccessScreen(transferType: TransferType) { private fun UploadSuccessScreenPreview() { SwissTransferTheme { Surface { - UploadSuccessScreen(TransferType.MAIL) + UploadSuccessScreen(TransferType.QR_CODE) } } } From 395906735fb9d2a97acf841b9078ae98906bd438 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Fri, 18 Oct 2024 12:16:10 +0200 Subject: [PATCH 09/27] review: Use Spacers instead of modifying padding --- .../ui/components/EmailAddressChip.kt | 4 +- .../ui/components/IllustratedMessageBlock.kt | 9 ++-- .../received/components/ReceivedEmptyFab.kt | 7 ++- .../upload/UploadSuccessEmailScreen.kt | 12 ++--- .../upload/UploadSuccessQrScreen.kt | 50 +++++++++++-------- 5 files changed, 45 insertions(+), 37 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt index 8f20648fe..f74a3100f 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt @@ -32,9 +32,9 @@ import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @Composable -fun EmailAddressChip(text: String, modifier: Modifier = Modifier) { +fun EmailAddressChip(text: String) { Box( - modifier = modifier + modifier = Modifier .clip(CustomShapes.Rounded) .background(SwissTransferTheme.colors.emailAddressChipColor) .padding(horizontal = Margin.Small), diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt index 47f2f591b..98b22f852 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt @@ -51,20 +51,21 @@ fun IllustratedMessageBlock( ) { Image(imageVector = icon, contentDescription = null) + Spacer(Modifier.height(Margin.XLarge)) + Text( text = stringResource(title), style = SwissTransferTheme.typography.h1, - modifier = Modifier.padding(PaddingValues(top = Margin.XLarge)), ) + Spacer(Modifier.height(Margin.Medium)) + Text( text = stringResource(description), textAlign = TextAlign.Center, style = SwissTransferTheme.typography.bodyRegular, color = SwissTransferTheme.colors.secondaryTextColor, - modifier = Modifier - .widthIn(max = Dimens.DescriptionWidth) - .padding(PaddingValues(top = Margin.Medium)), + modifier = Modifier.widthIn(max = Dimens.DescriptionWidth), ) } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/components/ReceivedEmptyFab.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/components/ReceivedEmptyFab.kt index 28c378387..990ee1e33 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/components/ReceivedEmptyFab.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/components/ReceivedEmptyFab.kt @@ -18,7 +18,10 @@ package com.infomaniak.swisstransfer.ui.screen.main.received.components import android.content.res.Configuration -import androidx.compose.foundation.layout.* +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.padding import androidx.compose.material3.Icon import androidx.compose.material3.Surface import androidx.compose.material3.Text @@ -47,7 +50,7 @@ fun ReceivedEmptyFab(isMessageVisible: () -> Boolean) { style = SwissTransferTheme.typography.bodyRegular, color = SwissTransferTheme.colors.secondaryTextColor, modifier = Modifier - .padding(PaddingValues(top = Margin.XLarge)) + .padding(top = Margin.XLarge) .constrainAs(text) { bottom.linkTo(icon.top, Margin.Small) end.linkTo(icon.end, Margin.Small) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index 712a202ec..2b564231b 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -17,10 +17,7 @@ */ package com.infomaniak.swisstransfer.ui.screen.newtransfer.upload -import androidx.compose.foundation.layout.Arrangement -import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.fillMaxSize -import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.* import androidx.compose.material3.Surface import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment @@ -57,10 +54,9 @@ fun UploadSuccessEmailScreen() { description = R.string.uploadSuccessEmailDescription, ) - EmailAddressChip( - text = "test.test@ik.me", // TODO: Use correct email instead of hard-coded value. - modifier = Modifier.padding(top = Margin.Medium), - ) + Spacer(Modifier.height(Margin.Medium)) + + EmailAddressChip("test.test@ik.me") // TODO: Use correct email instead of hard-coded value. } }, ) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt index c659659e4..2010b3149 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt @@ -70,37 +70,45 @@ fun UploadSuccessQrScreen(transferType: TransferType) { horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center, ) { + Image( imageVector = AppIllus.UploadSuccessQr.image(), contentDescription = null, ) + + Spacer(Modifier.height(Margin.XLarge)) + Text( text = stringResource(uploadSuccessTitle), style = SwissTransferTheme.typography.h1, color = SwissTransferTheme.colors.primaryTextColor, - modifier = Modifier.padding(Margin.XLarge) ) + + Spacer(Modifier.height(Margin.XLarge)) + QrCode() - Text( - text = stringResource(R.string.uploadSuccessLinkDescription), - style = SwissTransferTheme.typography.bodyRegular, - textAlign = TextAlign.Center, - color = SwissTransferTheme.colors.secondaryTextColor, - modifier = Modifier - .alpha(if (transferType == TransferType.QR_CODE) 0.0f else 1.0f) - .padding(top = Margin.XXLarge, start = Margin.Medium, end = Margin.Medium) - .widthIn(max = Dimens.DescriptionWidth), - ) - // TODO: What do we want to do with this button placement? - LargeButton( - modifier = Modifier - .fillMaxSize() - .padding(Margin.Medium), - style = ButtonType.SECONDARY, - titleRes = R.string.buttonCopyLink, - onClick = { /* TODO */ }, - ) + + if (transferType != TransferType.QR_CODE) { + Spacer(Modifier.height(Margin.XXLarge)) + Text( + text = stringResource(R.string.uploadSuccessLinkDescription), + style = SwissTransferTheme.typography.bodyRegular, + textAlign = TextAlign.Center, + color = SwissTransferTheme.colors.secondaryTextColor, + modifier = Modifier + .alpha(1.0f) + .widthIn(max = Dimens.DescriptionWidth), + ) + } } + + // TODO: What do we want to do with this button placement? + LargeButton( + modifier = Modifier.padding(Margin.Medium), + style = ButtonType.SECONDARY, + titleRes = R.string.buttonCopyLink, + onClick = { /* TODO */ }, + ) }, ) } @@ -110,7 +118,7 @@ fun UploadSuccessQrScreen(transferType: TransferType) { private fun UploadSuccessQrScreenPreview() { SwissTransferTheme { Surface { - UploadSuccessQrScreen(transferType = TransferType.QR_CODE) + UploadSuccessQrScreen(transferType = TransferType.LINK) } } } From 5917b33319b94a6ac75383ecde52b8e099039cd4 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Fri, 18 Oct 2024 12:20:09 +0200 Subject: [PATCH 10/27] review: Make content scrollable if the device screen it too small --- .../screen/newtransfer/upload/UploadSuccessEmailScreen.kt | 6 +++++- .../ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt | 6 +++++- 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index 2b564231b..21405f55c 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -18,6 +18,8 @@ package com.infomaniak.swisstransfer.ui.screen.newtransfer.upload import androidx.compose.foundation.layout.* +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll import androidx.compose.material3.Surface import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment @@ -43,7 +45,9 @@ fun UploadSuccessEmailScreen() { }, content = { Column( - modifier = Modifier.fillMaxSize(), + modifier = Modifier + .fillMaxSize() + .verticalScroll(rememberScrollState()), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center, ) { diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt index 2010b3149..ea6e20688 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt @@ -19,6 +19,8 @@ package com.infomaniak.swisstransfer.ui.screen.newtransfer.upload import androidx.compose.foundation.Image import androidx.compose.foundation.layout.* +import androidx.compose.foundation.rememberScrollState +import androidx.compose.foundation.verticalScroll import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable @@ -66,7 +68,9 @@ fun UploadSuccessQrScreen(transferType: TransferType) { }, content = { Column( - modifier = Modifier.fillMaxSize(), + modifier = Modifier + .fillMaxSize() + .verticalScroll(rememberScrollState()), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center, ) { From e5b7880f34c587bf4e1b5d1ba6e99293fb4b3b56 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Fri, 18 Oct 2024 13:08:23 +0200 Subject: [PATCH 11/27] review: Add sides margin to IllustratedMessageBlock --- .../swisstransfer/ui/components/IllustratedMessageBlock.kt | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt index 98b22f852..b07e98654 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt @@ -45,7 +45,7 @@ fun IllustratedMessageBlock( modifier: Modifier = Modifier, ) { Column( - modifier = modifier, + modifier = modifier.padding(start = Margin.Medium, end = Margin.Medium), verticalArrangement = Arrangement.Center, horizontalAlignment = Alignment.CenterHorizontally, ) { @@ -55,6 +55,7 @@ fun IllustratedMessageBlock( Text( text = stringResource(title), + textAlign = TextAlign.Center, style = SwissTransferTheme.typography.h1, ) From 5b880bab22357c3eb3cd5f20f8d0737c11b7a1a2 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Mon, 21 Oct 2024 09:26:02 +0200 Subject: [PATCH 12/27] chore: Remove now useless testing code --- .../swisstransfer/ui/screen/main/received/ReceivedScreen.kt | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/ReceivedScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/ReceivedScreen.kt index 0ae62bba3..4e64230ca 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/ReceivedScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/ReceivedScreen.kt @@ -64,7 +64,7 @@ private fun ReceivedScreen( BrandTopAppBarScaffold( floatingActionButton = { ReceivedEmptyFab(areTransfersEmpty) }, ) { - if (true || areTransfersEmpty()) { // TODO: Remove this `true || `, it's for testing only. + if (areTransfersEmpty()) { EmptyState( icon = AppIllus.MascotSearching, title = R.string.noTransferReceivedTitle, From 3c9327baa3d2630dfcf2e631ea753cc5272cd0e6 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Mon, 21 Oct 2024 14:35:40 +0200 Subject: [PATCH 13/27] refactor: Extract Screens content into functions --- .../screen/newtransfer/NewTransferNavHost.kt | 5 +- .../upload/UploadSuccessEmailScreen.kt | 39 ++++---- .../upload/UploadSuccessQrScreen.kt | 97 ++++++++++--------- 3 files changed, 73 insertions(+), 68 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt index 88fd3dfef..ad79c163c 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/NewTransferNavHost.kt @@ -49,9 +49,8 @@ fun NewTransferNavHost(navController: NavHostController, closeActivity: () -> Un UploadProgressScreen() } composable { - UploadSuccessScreen( - transferType = TransferType.MAIL, // TODO: Use correct TransferType instead of hard-coded value. - ) + // TODO: Use correct TransferType instead of hard-coded value + UploadSuccessScreen(transferType = TransferType.MAIL) } } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index 21405f55c..e3d187945 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -43,27 +43,30 @@ fun UploadSuccessEmailScreen() { onClick = { /* TODO */ }, ) }, - content = { - Column( - modifier = Modifier - .fillMaxSize() - .verticalScroll(rememberScrollState()), - horizontalAlignment = Alignment.CenterHorizontally, - verticalArrangement = Arrangement.Center, - ) { + content = { Content() }, + ) +} - IllustratedMessageBlock( - icon = AppIllus.UploadSuccessEmail.image(), - title = R.string.uploadSuccessEmailTitle, - description = R.string.uploadSuccessEmailDescription, - ) +@Composable +private fun Content() { + Column( + modifier = Modifier + .fillMaxSize() + .verticalScroll(rememberScrollState()), + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.Center, + ) { - Spacer(Modifier.height(Margin.Medium)) + IllustratedMessageBlock( + icon = AppIllus.UploadSuccessEmail.image(), + title = R.string.uploadSuccessEmailTitle, + description = R.string.uploadSuccessEmailDescription, + ) - EmailAddressChip("test.test@ik.me") // TODO: Use correct email instead of hard-coded value. - } - }, - ) + Spacer(Modifier.height(Margin.Medium)) + + EmailAddressChip("test.test@ik.me") // TODO: Use correct email instead of hard-coded value. + } } @PreviewAllWindows diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt index ea6e20688..c9bcfd81e 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt @@ -41,13 +41,6 @@ import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows @Composable fun UploadSuccessQrScreen(transferType: TransferType) { - - val uploadSuccessTitle = if (transferType == TransferType.QR_CODE) { - R.string.uploadSuccessQrTitle - } else { - R.string.uploadSuccessLinkTitle - } - BottomStickyButtonScaffold( topBar = { BrandTopAppBar() }, topButton = { @@ -66,54 +59,64 @@ fun UploadSuccessQrScreen(transferType: TransferType) { onClick = { /* TODO */ }, ) }, - content = { - Column( - modifier = Modifier - .fillMaxSize() - .verticalScroll(rememberScrollState()), - horizontalAlignment = Alignment.CenterHorizontally, - verticalArrangement = Arrangement.Center, - ) { + content = { Content(transferType) }, + ) +} + +@Composable +private fun Content(transferType: TransferType) { + + val uploadSuccessTitle = if (transferType == TransferType.QR_CODE) { + R.string.uploadSuccessQrTitle + } else { + R.string.uploadSuccessLinkTitle + } - Image( - imageVector = AppIllus.UploadSuccessQr.image(), - contentDescription = null, - ) + Column( + modifier = Modifier + .fillMaxSize() + .verticalScroll(rememberScrollState()), + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.Center, + ) { - Spacer(Modifier.height(Margin.XLarge)) + Image( + imageVector = AppIllus.UploadSuccessQr.image(), + contentDescription = null, + ) - Text( - text = stringResource(uploadSuccessTitle), - style = SwissTransferTheme.typography.h1, - color = SwissTransferTheme.colors.primaryTextColor, - ) + Spacer(Modifier.height(Margin.XLarge)) - Spacer(Modifier.height(Margin.XLarge)) + Text( + text = stringResource(uploadSuccessTitle), + style = SwissTransferTheme.typography.h1, + color = SwissTransferTheme.colors.primaryTextColor, + ) - QrCode() + Spacer(Modifier.height(Margin.XLarge)) - if (transferType != TransferType.QR_CODE) { - Spacer(Modifier.height(Margin.XXLarge)) - Text( - text = stringResource(R.string.uploadSuccessLinkDescription), - style = SwissTransferTheme.typography.bodyRegular, - textAlign = TextAlign.Center, - color = SwissTransferTheme.colors.secondaryTextColor, - modifier = Modifier - .alpha(1.0f) - .widthIn(max = Dimens.DescriptionWidth), - ) - } - } + QrCode() - // TODO: What do we want to do with this button placement? - LargeButton( - modifier = Modifier.padding(Margin.Medium), - style = ButtonType.SECONDARY, - titleRes = R.string.buttonCopyLink, - onClick = { /* TODO */ }, + if (transferType != TransferType.QR_CODE) { + Spacer(Modifier.height(Margin.XXLarge)) + Text( + text = stringResource(R.string.uploadSuccessLinkDescription), + style = SwissTransferTheme.typography.bodyRegular, + textAlign = TextAlign.Center, + color = SwissTransferTheme.colors.secondaryTextColor, + modifier = Modifier + .alpha(1.0f) + .widthIn(max = Dimens.DescriptionWidth), ) - }, + } + } + + // TODO: What do we want to do with this button placement? + LargeButton( + modifier = Modifier.padding(Margin.Medium), + style = ButtonType.SECONDARY, + titleRes = R.string.buttonCopyLink, + onClick = { /* TODO */ }, ) } From edaed19c5064be84685c518dce24cb5ffaebfc17 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Mon, 21 Oct 2024 15:29:26 +0200 Subject: [PATCH 14/27] fix: Handle new names of CustomShapes --- .../infomaniak/swisstransfer/ui/components/EmailAddressChip.kt | 2 +- .../java/com/infomaniak/swisstransfer/ui/components/QrCode.kt | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt index f74a3100f..492224fc5 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt @@ -35,7 +35,7 @@ import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme fun EmailAddressChip(text: String) { Box( modifier = Modifier - .clip(CustomShapes.Rounded) + .clip(CustomShapes.ROUNDED) .background(SwissTransferTheme.colors.emailAddressChipColor) .padding(horizontal = Margin.Small), ) { diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt index 46aebb7e0..be1f836ae 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt @@ -36,7 +36,7 @@ fun QrCode() { // TODO: Add parameter containing the QR code value, and use it. Box( modifier = Modifier .size(180.dp) - .clip(CustomShapes.small) + .clip(CustomShapes.SMALL) .background(SwissTransferTheme.colors.qrCodeBackground), contentAlignment = Alignment.Center, ) { From 75da3666300b884d778f93f72b8584b6ead9b48b Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Mon, 21 Oct 2024 16:58:28 +0200 Subject: [PATCH 15/27] review: Use margin horizontal instead of start + end --- .../swisstransfer/ui/components/IllustratedMessageBlock.kt | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt index b07e98654..97878e8cd 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt @@ -45,7 +45,7 @@ fun IllustratedMessageBlock( modifier: Modifier = Modifier, ) { Column( - modifier = modifier.padding(start = Margin.Medium, end = Margin.Medium), + modifier = modifier.padding(horizontal = Margin.Medium), verticalArrangement = Arrangement.Center, horizontalAlignment = Alignment.CenterHorizontally, ) { From 7c88bc706adfe5846db0f964b4b749659d4b1071 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Mon, 21 Oct 2024 18:06:38 +0200 Subject: [PATCH 16/27] refactor: Use a SuggestionChip for the EmailAddressChip instead of creating it from scratch --- .../ui/components/EmailAddressChip.kt | 42 +++++++++++-------- .../upload/UploadSuccessEmailScreen.kt | 2 +- 2 files changed, 26 insertions(+), 18 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt index 492224fc5..36055110d 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt @@ -18,32 +18,40 @@ package com.infomaniak.swisstransfer.ui.components import android.content.res.Configuration -import androidx.compose.foundation.background -import androidx.compose.foundation.layout.Box -import androidx.compose.foundation.layout.padding +import androidx.compose.material3.ChipColors +import androidx.compose.material3.SuggestionChip import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable -import androidx.compose.ui.Modifier -import androidx.compose.ui.draw.clip +import androidx.compose.ui.graphics.Color import androidx.compose.ui.tooling.preview.Preview import com.infomaniak.swisstransfer.ui.theme.CustomShapes -import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @Composable fun EmailAddressChip(text: String) { - Box( - modifier = Modifier - .clip(CustomShapes.ROUNDED) - .background(SwissTransferTheme.colors.emailAddressChipColor) - .padding(horizontal = Margin.Small), - ) { - Text( - color = SwissTransferTheme.colors.onEmailAddressChipColor, - text = text, - ) - } + SuggestionChip( + onClick = { }, + label = { + Text( + text = text, + style = SwissTransferTheme.typography.bodyRegular, + ) + }, + enabled = false, + shape = CustomShapes.ROUNDED, + colors = ChipColors( + containerColor = Color.Unspecified, + disabledContainerColor = SwissTransferTheme.colors.emailAddressChipColor, + labelColor = Color.Unspecified, + disabledLabelColor = SwissTransferTheme.colors.onEmailAddressChipColor, + leadingIconContentColor = Color.Unspecified, + disabledLeadingIconContentColor = Color.Unspecified, + trailingIconContentColor = Color.Unspecified, + disabledTrailingIconContentColor = Color.Unspecified, + ), + border = null, + ) } @Preview(name = "Light mode") diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index e3d187945..a59961956 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -63,7 +63,7 @@ private fun Content() { description = R.string.uploadSuccessEmailDescription, ) - Spacer(Modifier.height(Margin.Medium)) + Spacer(Modifier.height(Margin.Small)) EmailAddressChip("test.test@ik.me") // TODO: Use correct email instead of hard-coded value. } From adc26c3307c8b0e4e7225b838aba5144fef572b1 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Tue, 22 Oct 2024 10:26:27 +0200 Subject: [PATCH 17/27] review: Remove padding from IllustratedMessageBlock --- .../swisstransfer/ui/components/EmptyState.kt | 11 ++++++++++- .../ui/components/IllustratedMessageBlock.kt | 4 ++-- .../newtransfer/upload/UploadSuccessEmailScreen.kt | 1 + 3 files changed, 13 insertions(+), 3 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt index 3673e93cf..d3b517b5e 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt @@ -20,6 +20,7 @@ package com.infomaniak.swisstransfer.ui.components import android.content.res.Configuration import androidx.annotation.StringRes import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.padding import androidx.compose.material3.Surface import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier @@ -28,6 +29,7 @@ import androidx.compose.ui.tooling.preview.Preview import com.infomaniak.swisstransfer.R import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus import com.infomaniak.swisstransfer.ui.images.illus.MascotSearching +import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @Composable @@ -37,7 +39,14 @@ fun EmptyState( @StringRes description: Int, modifier: Modifier = Modifier, ) { - IllustratedMessageBlock(icon, title, description, modifier.fillMaxSize()) + IllustratedMessageBlock( + icon = icon, + title = title, + description = description, + modifier = modifier + .padding(horizontal = Margin.Medium) + .fillMaxSize(), + ) } @Preview(name = "Light mode") diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt index 97878e8cd..0b32636ba 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt @@ -45,7 +45,7 @@ fun IllustratedMessageBlock( modifier: Modifier = Modifier, ) { Column( - modifier = modifier.padding(horizontal = Margin.Medium), + modifier = modifier, verticalArrangement = Arrangement.Center, horizontalAlignment = Alignment.CenterHorizontally, ) { @@ -74,7 +74,7 @@ fun IllustratedMessageBlock( @Preview(name = "Light mode") @Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL) @Composable -private fun SwissTransferFabPreview() { +private fun IllustratedMessageBlockPreview() { SwissTransferTheme { Surface { IllustratedMessageBlock( diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index a59961956..77d88321a 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -61,6 +61,7 @@ private fun Content() { icon = AppIllus.UploadSuccessEmail.image(), title = R.string.uploadSuccessEmailTitle, description = R.string.uploadSuccessEmailDescription, + modifier = Modifier.padding(horizontal = Margin.Medium), ) Spacer(Modifier.height(Margin.Small)) From f14ae336010e7f9b85c1f9a78bb582371a2f14b8 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Tue, 22 Oct 2024 13:05:06 +0200 Subject: [PATCH 18/27] review: Use `SuggestionChipDefaults.suggestionChipColors()` to set Chips colors --- .../swisstransfer/ui/components/EmailAddressChip.kt | 13 +++---------- 1 file changed, 3 insertions(+), 10 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt index 36055110d..93a9c0540 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt @@ -18,12 +18,11 @@ package com.infomaniak.swisstransfer.ui.components import android.content.res.Configuration -import androidx.compose.material3.ChipColors import androidx.compose.material3.SuggestionChip +import androidx.compose.material3.SuggestionChipDefaults import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable -import androidx.compose.ui.graphics.Color import androidx.compose.ui.tooling.preview.Preview import com.infomaniak.swisstransfer.ui.theme.CustomShapes import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @@ -40,15 +39,9 @@ fun EmailAddressChip(text: String) { }, enabled = false, shape = CustomShapes.ROUNDED, - colors = ChipColors( - containerColor = Color.Unspecified, + colors = SuggestionChipDefaults.suggestionChipColors( disabledContainerColor = SwissTransferTheme.colors.emailAddressChipColor, - labelColor = Color.Unspecified, - disabledLabelColor = SwissTransferTheme.colors.onEmailAddressChipColor, - leadingIconContentColor = Color.Unspecified, - disabledLeadingIconContentColor = Color.Unspecified, - trailingIconContentColor = Color.Unspecified, - disabledTrailingIconContentColor = Color.Unspecified, + disabledLabelColor = SwissTransferTheme.colors.onEmailAddressChipColor ), border = null, ) From 8b64e050cac131cbab27059309c24747a38ef275 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Tue, 22 Oct 2024 13:24:36 +0200 Subject: [PATCH 19/27] fix: Rename wrongly names Previews --- .../infomaniak/swisstransfer/ui/components/EmailAddressChip.kt | 2 +- .../com/infomaniak/swisstransfer/ui/components/EmptyState.kt | 2 +- .../infomaniak/swisstransfer/ui/components/NewTransferFab.kt | 2 +- .../java/com/infomaniak/swisstransfer/ui/components/QrCode.kt | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt index 93a9c0540..6bdb39ef3 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt @@ -50,7 +50,7 @@ fun EmailAddressChip(text: String) { @Preview(name = "Light mode") @Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL) @Composable -private fun SwissTransferFabPreview() { +private fun EmailAddressChipPreview() { SwissTransferTheme { Surface { EmailAddressChip("test.test@ik.me") diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt index d3b517b5e..0d9728a21 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt @@ -52,7 +52,7 @@ fun EmptyState( @Preview(name = "Light mode") @Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL) @Composable -private fun SwissTransferFabPreview() { +private fun EmptyStatePreview() { SwissTransferTheme { Surface { EmptyState( diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/NewTransferFab.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/NewTransferFab.kt index 9da1d46c2..04fe3246a 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/NewTransferFab.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/NewTransferFab.kt @@ -69,7 +69,7 @@ enum class NewTransferFabType(val fabType: FabType, private val defaultElevation @Preview(name = "Light mode") @Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL) @Composable -private fun SwissTransferFabPreview() { +private fun NewTransferFabPreview() { SwissTransferTheme { Surface { Row { diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt index be1f836ae..37acad089 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt @@ -51,7 +51,7 @@ fun QrCode() { // TODO: Add parameter containing the QR code value, and use it. @Preview(name = "Light mode") @Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL) @Composable -private fun SwissTransferFabPreview() { +private fun QrCodePreview() { SwissTransferTheme { Surface { QrCode() From 1c48537044d0cbd84c751559c3dbf2e0d58143ba Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Tue, 22 Oct 2024 13:25:00 +0200 Subject: [PATCH 20/27] refactor: Move hardcoded email string to an upper level --- .../newtransfer/upload/UploadSuccessEmailScreen.kt | 10 +++++----- .../screen/newtransfer/upload/UploadSuccessScreen.kt | 2 +- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index 77d88321a..a36ec08c6 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -33,7 +33,7 @@ import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows @Composable -fun UploadSuccessEmailScreen() { +fun UploadSuccessEmailScreen(email: String) { BottomStickyButtonScaffold( topBar = { BrandTopAppBar() }, bottomButton = { @@ -43,12 +43,12 @@ fun UploadSuccessEmailScreen() { onClick = { /* TODO */ }, ) }, - content = { Content() }, + content = { Content(email) }, ) } @Composable -private fun Content() { +private fun Content(email: String) { Column( modifier = Modifier .fillMaxSize() @@ -66,7 +66,7 @@ private fun Content() { Spacer(Modifier.height(Margin.Small)) - EmailAddressChip("test.test@ik.me") // TODO: Use correct email instead of hard-coded value. + EmailAddressChip(text = email) } } @@ -75,7 +75,7 @@ private fun Content() { private fun UploadSuccessEmailScreenPreview() { SwissTransferTheme { Surface { - UploadSuccessEmailScreen() + UploadSuccessEmailScreen("test.test@ik.me") } } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt index e5e68de77..081116c13 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt @@ -26,7 +26,7 @@ import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows @Composable fun UploadSuccessScreen(transferType: TransferType) { if (transferType == TransferType.MAIL) { - UploadSuccessEmailScreen() + UploadSuccessEmailScreen(email = "test.test@ik.me") // TODO: Use correct email instead of hard-coded value } else { UploadSuccessQrScreen(transferType) } From 523fca42e0e067c5bac5e297a46e5a91fd271a69 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Tue, 22 Oct 2024 13:25:34 +0200 Subject: [PATCH 21/27] review: Move vertical arrangement from IllustratedMessageBlock to EmptyState --- .../swisstransfer/ui/components/EmptyState.kt | 21 ++++++++++++------- .../ui/components/IllustratedMessageBlock.kt | 6 ++++-- 2 files changed, 17 insertions(+), 10 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt index 0d9728a21..085224308 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt @@ -19,10 +19,12 @@ package com.infomaniak.swisstransfer.ui.components import android.content.res.Configuration import androidx.annotation.StringRes +import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.padding import androidx.compose.material3.Surface import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.vector.ImageVector import androidx.compose.ui.tooling.preview.Preview @@ -39,14 +41,17 @@ fun EmptyState( @StringRes description: Int, modifier: Modifier = Modifier, ) { - IllustratedMessageBlock( - icon = icon, - title = title, - description = description, - modifier = modifier - .padding(horizontal = Margin.Medium) - .fillMaxSize(), - ) + Box( + modifier = Modifier.fillMaxSize(), + contentAlignment = Alignment.Center, + ) { + IllustratedMessageBlock( + icon = icon, + title = title, + description = description, + modifier = modifier.padding(horizontal = Margin.Medium), + ) + } } @Preview(name = "Light mode") diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt index 0b32636ba..464a543b4 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt @@ -20,7 +20,10 @@ package com.infomaniak.swisstransfer.ui.components import android.content.res.Configuration import androidx.annotation.StringRes import androidx.compose.foundation.Image -import androidx.compose.foundation.layout.* +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Spacer +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.widthIn import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable @@ -46,7 +49,6 @@ fun IllustratedMessageBlock( ) { Column( modifier = modifier, - verticalArrangement = Arrangement.Center, horizontalAlignment = Alignment.CenterHorizontally, ) { Image(imageVector = icon, contentDescription = null) From 22e579c6d0197f1865c13c5b415b9375a37fc35d Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Tue, 22 Oct 2024 13:33:41 +0200 Subject: [PATCH 22/27] feat: Add Copy & Share icons in UploadSuccessQr screen --- .../swisstransfer/ui/images/icons/Copy.kt | 89 ++++++++++++++ .../swisstransfer/ui/images/icons/Share.kt | 112 ++++++++++++++++++ .../upload/UploadSuccessQrScreen.kt | 10 +- 3 files changed, 207 insertions(+), 4 deletions(-) create mode 100644 app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Copy.kt create mode 100644 app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Share.kt diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Copy.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Copy.kt new file mode 100644 index 000000000..053d92032 --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Copy.kt @@ -0,0 +1,89 @@ +package com.infomaniak.swisstransfer.ui.images.icons + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.size +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.PathFillType.Companion.NonZero +import androidx.compose.ui.graphics.SolidColor +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.graphics.vector.ImageVector.Builder +import androidx.compose.ui.graphics.vector.path +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import com.infomaniak.swisstransfer.ui.images.AppImages +import com.infomaniak.swisstransfer.ui.images.AppImages.AppIcons +import androidx.compose.ui.graphics.StrokeCap.Companion.Round as strokeCapRound +import androidx.compose.ui.graphics.StrokeJoin.Companion.Round as strokeJoinRound + +val AppIcons.Copy: ImageVector + get() { + + if (_copy != null) return _copy!! + + _copy = Builder( + name = "Copy", + defaultWidth = 24.0.dp, + defaultHeight = 24.0.dp, + viewportWidth = 24.0f, + viewportHeight = 24.0f, + ).apply { + path( + fill = SolidColor(Color(0x00000000)), stroke = SolidColor(Color(0xFF9f9f9f)), + strokeLineWidth = 1.5f, strokeLineCap = strokeCapRound, strokeLineJoin = + strokeJoinRound, strokeLineMiter = 4.0f, pathFillType = NonZero + ) { + moveTo(7.5f, 6.75f) + lineTo(7.5f, 2.25f) + curveTo(7.5f, 1.852f, 7.658f, 1.471f, 7.939f, 1.189f) + curveTo(8.221f, 0.908f, 8.602f, 0.75f, 9.0f, 0.75f) + lineTo(16.629f, 0.75f) + curveTo(17.027f, 0.75f, 17.408f, 0.908f, 17.689f, 1.189f) + lineTo(20.561f, 4.061f) + curveTo(20.842f, 4.342f, 21.0f, 4.723f, 21.0f, 5.121f) + lineTo(21.0f, 15.75f) + curveTo(21.0f, 16.148f, 20.842f, 16.529f, 20.561f, 16.811f) + curveTo(20.279f, 17.092f, 19.898f, 17.25f, 19.5f, 17.25f) + lineTo(16.5f, 17.25f) + } + path( + fill = SolidColor(Color(0x00000000)), stroke = SolidColor(Color(0xFF9f9f9f)), + strokeLineWidth = 1.5f, strokeLineCap = strokeCapRound, strokeLineJoin = + strokeJoinRound, strokeLineMiter = 4.0f, pathFillType = NonZero + ) { + moveTo(16.5f, 21.75f) + curveTo(16.5f, 22.148f, 16.342f, 22.529f, 16.061f, 22.811f) + curveTo(15.779f, 23.092f, 15.398f, 23.25f, 15.0f, 23.25f) + lineTo(4.5f, 23.25f) + curveTo(4.102f, 23.25f, 3.721f, 23.092f, 3.439f, 22.811f) + curveTo(3.158f, 22.529f, 3.0f, 22.148f, 3.0f, 21.75f) + lineTo(3.0f, 8.25f) + curveTo(3.0f, 7.852f, 3.158f, 7.471f, 3.439f, 7.189f) + curveTo(3.721f, 6.908f, 4.102f, 6.75f, 4.5f, 6.75f) + lineTo(12.129f, 6.75f) + curveTo(12.526f, 6.75f, 12.908f, 6.908f, 13.189f, 7.189f) + lineTo(16.061f, 10.061f) + curveTo(16.342f, 10.342f, 16.5f, 10.724f, 16.5f, 11.121f) + lineTo(16.5f, 21.75f) + close() + } + }.build() + + return _copy!! + } + +private var _copy: ImageVector? = null + +@Preview +@Composable +private fun Preview() { + Box { + Image( + imageVector = AppIcons.Copy, + contentDescription = null, + modifier = Modifier.size(AppImages.previewSize), + ) + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Share.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Share.kt new file mode 100644 index 000000000..a20d50c5d --- /dev/null +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Share.kt @@ -0,0 +1,112 @@ +package com.infomaniak.swisstransfer.ui.images.icons + +import androidx.compose.foundation.Image +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.size +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.PathFillType.Companion.EvenOdd +import androidx.compose.ui.graphics.PathFillType.Companion.NonZero +import androidx.compose.ui.graphics.SolidColor +import androidx.compose.ui.graphics.StrokeCap.Companion.Butt +import androidx.compose.ui.graphics.StrokeJoin.Companion.Miter +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.graphics.vector.ImageVector.Builder +import androidx.compose.ui.graphics.vector.path +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import com.infomaniak.swisstransfer.ui.images.AppImages +import com.infomaniak.swisstransfer.ui.images.AppImages.AppIcons +import androidx.compose.ui.graphics.StrokeCap.Companion.Round as strokeCapRound +import androidx.compose.ui.graphics.StrokeJoin.Companion.Round as strokeJoinRound + +val AppIcons.Share: ImageVector + get() { + + if (_share != null) return _share!! + + _share = Builder( + name = "Share", + defaultWidth = 24.0.dp, + defaultHeight = 24.0.dp, + viewportWidth = 24.0f, + viewportHeight = 24.0f, + ).apply { + path( + fill = SolidColor(Color(0xFF9f9f9f)), stroke = SolidColor(Color(0x00000000)), + strokeLineWidth = 0.0f, strokeLineCap = Butt, strokeLineJoin = Miter, + strokeLineMiter = 4.0f, pathFillType = EvenOdd + ) { + moveTo(19.644f, 16.175f) + curveTo(19.673f, 16.206f, 19.702f, 16.237f, 19.732f, 16.268f) + curveTo(20.201f, 16.737f, 20.837f, 17.0f, 21.5f, 17.0f) + curveTo(22.163f, 17.0f, 22.799f, 16.737f, 23.268f, 16.268f) + curveTo(23.737f, 15.799f, 24.0f, 15.163f, 24.0f, 14.5f) + curveTo(24.0f, 13.837f, 23.737f, 13.201f, 23.268f, 12.732f) + curveTo(22.799f, 12.263f, 22.163f, 12.0f, 21.5f, 12.0f) + curveTo(20.837f, 12.0f, 20.201f, 12.263f, 19.732f, 12.732f) + curveTo(19.263f, 13.201f, 19.0f, 13.837f, 19.0f, 14.5f) + curveTo(19.0f, 14.604f, 19.007f, 14.708f, 19.019f, 14.81f) + lineTo(16.236f, 16.202f) + curveTo(15.771f, 15.752f, 15.148f, 15.5f, 14.5f, 15.5f) + curveTo(13.837f, 15.5f, 13.201f, 15.763f, 12.732f, 16.232f) + curveTo(12.263f, 16.701f, 12.0f, 17.337f, 12.0f, 18.0f) + curveTo(12.0f, 18.663f, 12.263f, 19.299f, 12.732f, 19.768f) + curveTo(13.201f, 20.237f, 13.837f, 20.5f, 14.5f, 20.5f) + curveTo(15.148f, 20.5f, 15.771f, 20.248f, 16.236f, 19.799f) + lineTo(19.019f, 21.19f) + curveTo(19.007f, 21.292f, 19.0f, 21.396f, 19.0f, 21.5f) + curveTo(19.0f, 22.163f, 19.263f, 22.799f, 19.732f, 23.268f) + curveTo(20.201f, 23.737f, 20.837f, 24.0f, 21.5f, 24.0f) + curveTo(22.163f, 24.0f, 22.799f, 23.737f, 23.268f, 23.268f) + curveTo(23.737f, 22.799f, 24.0f, 22.163f, 24.0f, 21.5f) + curveTo(24.0f, 20.837f, 23.737f, 20.201f, 23.268f, 19.732f) + curveTo(22.799f, 19.263f, 22.163f, 19.0f, 21.5f, 19.0f) + curveTo(20.837f, 19.0f, 20.201f, 19.263f, 19.732f, 19.732f) + curveTo(19.702f, 19.763f, 19.673f, 19.794f, 19.644f, 19.825f) + lineTo(16.954f, 18.48f) + curveTo(16.984f, 18.323f, 17.0f, 18.162f, 17.0f, 18.0f) + curveTo(17.0f, 17.838f, 16.984f, 17.677f, 16.954f, 17.52f) + lineTo(19.644f, 16.175f) + close() + } + path( + fill = SolidColor(Color(0x00000000)), stroke = SolidColor(Color(0xFF9f9f9f)), + strokeLineWidth = 1.5f, strokeLineCap = strokeCapRound, strokeLineJoin = + strokeJoinRound, strokeLineMiter = 4.0f, pathFillType = NonZero + ) { + moveTo(9.983f, 19.75f) + lineTo(0.75f, 19.75f) + curveTo(0.75f, 17.622f, 1.617f, 15.581f, 3.161f, 14.076f) + curveTo(4.706f, 12.571f, 6.8f, 11.725f, 8.983f, 11.725f) + curveTo(10.829f, 11.725f, 12.61f, 12.329f, 14.05f, 13.425f) + moveTo(3.917f, 5.817f) + curveTo(3.917f, 7.16f, 4.45f, 8.449f, 5.401f, 9.399f) + curveTo(6.351f, 10.349f, 7.64f, 10.883f, 8.983f, 10.883f) + curveTo(10.327f, 10.883f, 11.616f, 10.349f, 12.566f, 9.399f) + curveTo(13.516f, 8.449f, 14.05f, 7.16f, 14.05f, 5.817f) + curveTo(14.05f, 4.473f, 13.516f, 3.184f, 12.566f, 2.234f) + curveTo(11.616f, 1.284f, 10.327f, 0.75f, 8.983f, 0.75f) + curveTo(7.64f, 0.75f, 6.351f, 1.284f, 5.401f, 2.234f) + curveTo(4.45f, 3.184f, 3.917f, 4.473f, 3.917f, 5.817f) + close() + } + }.build() + + return _share!! + } + +private var _share: ImageVector? = null + +@Preview +@Composable +private fun Preview() { + Box { + Image( + imageVector = AppIcons.Share, + contentDescription = null, + modifier = Modifier.size(AppImages.previewSize), + ) + } +} diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt index c9bcfd81e..a2d62c65f 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt @@ -26,12 +26,14 @@ import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier -import androidx.compose.ui.draw.alpha import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.style.TextAlign import com.infomaniak.swisstransfer.R import com.infomaniak.swisstransfer.ui.components.* +import com.infomaniak.swisstransfer.ui.images.AppImages.AppIcons import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus +import com.infomaniak.swisstransfer.ui.images.icons.Copy +import com.infomaniak.swisstransfer.ui.images.icons.Share import com.infomaniak.swisstransfer.ui.images.illus.uploadSuccessQr.UploadSuccessQr import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.components.TransferType import com.infomaniak.swisstransfer.ui.theme.Dimens @@ -48,6 +50,7 @@ fun UploadSuccessQrScreen(transferType: TransferType) { modifier = it, style = ButtonType.PRIMARY, titleRes = R.string.buttonShare, + imageVector = AppIcons.Share, onClick = { /* TODO */ }, ) }, @@ -104,9 +107,7 @@ private fun Content(transferType: TransferType) { style = SwissTransferTheme.typography.bodyRegular, textAlign = TextAlign.Center, color = SwissTransferTheme.colors.secondaryTextColor, - modifier = Modifier - .alpha(1.0f) - .widthIn(max = Dimens.DescriptionWidth), + modifier = Modifier.widthIn(max = Dimens.DescriptionWidth), ) } } @@ -116,6 +117,7 @@ private fun Content(transferType: TransferType) { modifier = Modifier.padding(Margin.Medium), style = ButtonType.SECONDARY, titleRes = R.string.buttonCopyLink, + imageVector = AppIcons.Copy, onClick = { /* TODO */ }, ) } From 9d976a46cbf852cf803f066887979624fb488799 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Wed, 23 Oct 2024 07:44:57 +0200 Subject: [PATCH 23/27] feat: Use a FlowRow to display a list of emails instead of a single one in UploadSuccessEmail screen --- .../ui/components/EmailAddressChip.kt | 9 +++- .../upload/UploadSuccessEmailScreen.kt | 41 +++++++++++++++---- .../newtransfer/upload/UploadSuccessScreen.kt | 2 +- 3 files changed, 42 insertions(+), 10 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt index 6bdb39ef3..59751fce3 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt @@ -23,12 +23,16 @@ import androidx.compose.material3.SuggestionChipDefaults import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier import androidx.compose.ui.tooling.preview.Preview import com.infomaniak.swisstransfer.ui.theme.CustomShapes import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme @Composable -fun EmailAddressChip(text: String) { +fun EmailAddressChip( + text: String, + modifier: Modifier = Modifier, +) { SuggestionChip( onClick = { }, label = { @@ -37,6 +41,7 @@ fun EmailAddressChip(text: String) { style = SwissTransferTheme.typography.bodyRegular, ) }, + modifier = modifier, enabled = false, shape = CustomShapes.ROUNDED, colors = SuggestionChipDefaults.suggestionChipColors( @@ -53,7 +58,7 @@ fun EmailAddressChip(text: String) { private fun EmailAddressChipPreview() { SwissTransferTheme { Surface { - EmailAddressChip("test.test@ik.me") + EmailAddressChip(text = "test.test@ik.me") } } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index a36ec08c6..2ced48689 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -32,8 +32,26 @@ import com.infomaniak.swisstransfer.ui.theme.Margin import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows +// TODO: Use correct emails instead of hard-coded values @Composable -fun UploadSuccessEmailScreen(email: String) { +fun UploadSuccessEmailScreen( + emails: List = listOf( + "email@example.com", + "firstname.lastname@example.com", + "email@subdomain.example.com", + "firstname+lastname@example.com", + "email@123.123.123.123", + "email@[123.123.123.123]", + "\"email\"@example.com", + "1234567890@example.com", + "email@example-one.com", + "_______@example.com", + "email@example.name", + "email@example.museum", + "email@example.co.jp", + "firstname-lastname@example.com", + ), +) { BottomStickyButtonScaffold( topBar = { BrandTopAppBar() }, bottomButton = { @@ -43,12 +61,13 @@ fun UploadSuccessEmailScreen(email: String) { onClick = { /* TODO */ }, ) }, - content = { Content(email) }, + content = { Content(emails) }, ) } +@OptIn(ExperimentalLayoutApi::class) @Composable -private fun Content(email: String) { +private fun Content(emails: List) { Column( modifier = Modifier .fillMaxSize() @@ -64,9 +83,17 @@ private fun Content(email: String) { modifier = Modifier.padding(horizontal = Margin.Medium), ) - Spacer(Modifier.height(Margin.Small)) - - EmailAddressChip(text = email) + FlowRow( + modifier = Modifier.padding(Margin.Medium), + horizontalArrangement = Arrangement.Center, + ) { + emails.forEach { + EmailAddressChip( + text = it, + modifier = Modifier.padding(horizontal = Margin.XSmall) + ) + } + } } } @@ -75,7 +102,7 @@ private fun Content(email: String) { private fun UploadSuccessEmailScreenPreview() { SwissTransferTheme { Surface { - UploadSuccessEmailScreen("test.test@ik.me") + UploadSuccessEmailScreen() } } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt index 081116c13..e5e68de77 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessScreen.kt @@ -26,7 +26,7 @@ import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows @Composable fun UploadSuccessScreen(transferType: TransferType) { if (transferType == TransferType.MAIL) { - UploadSuccessEmailScreen(email = "test.test@ik.me") // TODO: Use correct email instead of hard-coded value + UploadSuccessEmailScreen() } else { UploadSuccessQrScreen(transferType) } From f2386ff430d80ec0897a1da00584cd8936c2cd40 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Wed, 23 Oct 2024 07:50:51 +0200 Subject: [PATCH 24/27] review: Rename + clean some icons --- .../icons/{Copy.kt => DocumentOnDocument.kt} | 32 +++++++++++-------- .../icons/{Share.kt => PersonBadgeShare.kt} | 32 +++++++++++-------- .../upload/UploadSuccessQrScreen.kt | 8 ++--- 3 files changed, 42 insertions(+), 30 deletions(-) rename app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/{Copy.kt => DocumentOnDocument.kt} (76%) rename app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/{Share.kt => PersonBadgeShare.kt} (84%) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Copy.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/DocumentOnDocument.kt similarity index 76% rename from app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Copy.kt rename to app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/DocumentOnDocument.kt index 053d92032..4191150c1 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Copy.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/DocumentOnDocument.kt @@ -18,22 +18,25 @@ import com.infomaniak.swisstransfer.ui.images.AppImages.AppIcons import androidx.compose.ui.graphics.StrokeCap.Companion.Round as strokeCapRound import androidx.compose.ui.graphics.StrokeJoin.Companion.Round as strokeJoinRound -val AppIcons.Copy: ImageVector +val AppIcons.DocumentOnDocument: ImageVector get() { - if (_copy != null) return _copy!! + if (_documentOnDocument != null) return _documentOnDocument!! - _copy = Builder( - name = "Copy", + _documentOnDocument = Builder( + name = "DocumentOnDocument", defaultWidth = 24.0.dp, defaultHeight = 24.0.dp, viewportWidth = 24.0f, viewportHeight = 24.0f, ).apply { path( - fill = SolidColor(Color(0x00000000)), stroke = SolidColor(Color(0xFF9f9f9f)), - strokeLineWidth = 1.5f, strokeLineCap = strokeCapRound, strokeLineJoin = - strokeJoinRound, strokeLineMiter = 4.0f, pathFillType = NonZero + stroke = SolidColor(Color(0xFF9f9f9f)), + strokeLineWidth = 1.5f, + strokeLineCap = strokeCapRound, + strokeLineJoin = strokeJoinRound, + strokeLineMiter = 4.0f, + pathFillType = NonZero, ) { moveTo(7.5f, 6.75f) lineTo(7.5f, 2.25f) @@ -49,9 +52,12 @@ val AppIcons.Copy: ImageVector lineTo(16.5f, 17.25f) } path( - fill = SolidColor(Color(0x00000000)), stroke = SolidColor(Color(0xFF9f9f9f)), - strokeLineWidth = 1.5f, strokeLineCap = strokeCapRound, strokeLineJoin = - strokeJoinRound, strokeLineMiter = 4.0f, pathFillType = NonZero + stroke = SolidColor(Color(0xFF9f9f9f)), + strokeLineWidth = 1.5f, + strokeLineCap = strokeCapRound, + strokeLineJoin = strokeJoinRound, + strokeLineMiter = 4.0f, + pathFillType = NonZero, ) { moveTo(16.5f, 21.75f) curveTo(16.5f, 22.148f, 16.342f, 22.529f, 16.061f, 22.811f) @@ -71,17 +77,17 @@ val AppIcons.Copy: ImageVector } }.build() - return _copy!! + return _documentOnDocument!! } -private var _copy: ImageVector? = null +private var _documentOnDocument: ImageVector? = null @Preview @Composable private fun Preview() { Box { Image( - imageVector = AppIcons.Copy, + imageVector = AppIcons.DocumentOnDocument, contentDescription = null, modifier = Modifier.size(AppImages.previewSize), ) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Share.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/PersonBadgeShare.kt similarity index 84% rename from app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Share.kt rename to app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/PersonBadgeShare.kt index a20d50c5d..13b1b14f0 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/Share.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/images/icons/PersonBadgeShare.kt @@ -21,22 +21,25 @@ import com.infomaniak.swisstransfer.ui.images.AppImages.AppIcons import androidx.compose.ui.graphics.StrokeCap.Companion.Round as strokeCapRound import androidx.compose.ui.graphics.StrokeJoin.Companion.Round as strokeJoinRound -val AppIcons.Share: ImageVector +val AppIcons.PersonBadgeShare: ImageVector get() { - if (_share != null) return _share!! + if (_personBadgeShare != null) return _personBadgeShare!! - _share = Builder( - name = "Share", + _personBadgeShare = Builder( + name = "PersonBadgeShare", defaultWidth = 24.0.dp, defaultHeight = 24.0.dp, viewportWidth = 24.0f, viewportHeight = 24.0f, ).apply { path( - fill = SolidColor(Color(0xFF9f9f9f)), stroke = SolidColor(Color(0x00000000)), - strokeLineWidth = 0.0f, strokeLineCap = Butt, strokeLineJoin = Miter, - strokeLineMiter = 4.0f, pathFillType = EvenOdd + fill = SolidColor(Color(0xFF9f9f9f)), + strokeLineWidth = 0.0f, + strokeLineCap = Butt, + strokeLineJoin = Miter, + strokeLineMiter = 4.0f, + pathFillType = EvenOdd, ) { moveTo(19.644f, 16.175f) curveTo(19.673f, 16.206f, 19.702f, 16.237f, 19.732f, 16.268f) @@ -72,9 +75,12 @@ val AppIcons.Share: ImageVector close() } path( - fill = SolidColor(Color(0x00000000)), stroke = SolidColor(Color(0xFF9f9f9f)), - strokeLineWidth = 1.5f, strokeLineCap = strokeCapRound, strokeLineJoin = - strokeJoinRound, strokeLineMiter = 4.0f, pathFillType = NonZero + stroke = SolidColor(Color(0xFF9f9f9f)), + strokeLineWidth = 1.5f, + strokeLineCap = strokeCapRound, + strokeLineJoin = strokeJoinRound, + strokeLineMiter = 4.0f, + pathFillType = NonZero, ) { moveTo(9.983f, 19.75f) lineTo(0.75f, 19.75f) @@ -94,17 +100,17 @@ val AppIcons.Share: ImageVector } }.build() - return _share!! + return _personBadgeShare!! } -private var _share: ImageVector? = null +private var _personBadgeShare: ImageVector? = null @Preview @Composable private fun Preview() { Box { Image( - imageVector = AppIcons.Share, + imageVector = AppIcons.PersonBadgeShare, contentDescription = null, modifier = Modifier.size(AppImages.previewSize), ) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt index a2d62c65f..353c9f580 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt @@ -32,8 +32,8 @@ import com.infomaniak.swisstransfer.R import com.infomaniak.swisstransfer.ui.components.* import com.infomaniak.swisstransfer.ui.images.AppImages.AppIcons import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus -import com.infomaniak.swisstransfer.ui.images.icons.Copy -import com.infomaniak.swisstransfer.ui.images.icons.Share +import com.infomaniak.swisstransfer.ui.images.icons.DocumentOnDocument +import com.infomaniak.swisstransfer.ui.images.icons.PersonBadgeShare import com.infomaniak.swisstransfer.ui.images.illus.uploadSuccessQr.UploadSuccessQr import com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.components.TransferType import com.infomaniak.swisstransfer.ui.theme.Dimens @@ -50,7 +50,7 @@ fun UploadSuccessQrScreen(transferType: TransferType) { modifier = it, style = ButtonType.PRIMARY, titleRes = R.string.buttonShare, - imageVector = AppIcons.Share, + imageVector = AppIcons.PersonBadgeShare, onClick = { /* TODO */ }, ) }, @@ -117,7 +117,7 @@ private fun Content(transferType: TransferType) { modifier = Modifier.padding(Margin.Medium), style = ButtonType.SECONDARY, titleRes = R.string.buttonCopyLink, - imageVector = AppIcons.Copy, + imageVector = AppIcons.DocumentOnDocument, onClick = { /* TODO */ }, ) } From 031589ede0ebf546d36c2ca63ef3a5b70cc46f3f Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Wed, 23 Oct 2024 11:03:17 +0200 Subject: [PATCH 25/27] review: Move padding to Column --- .../newtransfer/upload/UploadSuccessEmailScreen.kt | 9 +++++---- .../screen/newtransfer/upload/UploadSuccessQrScreen.kt | 5 +++-- 2 files changed, 8 insertions(+), 6 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index 2ced48689..227b91165 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -71,7 +71,8 @@ private fun Content(emails: List) { Column( modifier = Modifier .fillMaxSize() - .verticalScroll(rememberScrollState()), + .verticalScroll(rememberScrollState()) + .padding(Margin.Medium), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center, ) { @@ -80,17 +81,17 @@ private fun Content(emails: List) { icon = AppIllus.UploadSuccessEmail.image(), title = R.string.uploadSuccessEmailTitle, description = R.string.uploadSuccessEmailDescription, - modifier = Modifier.padding(horizontal = Margin.Medium), ) + Spacer(modifier = Modifier.height(Margin.Medium)) + FlowRow( - modifier = Modifier.padding(Margin.Medium), horizontalArrangement = Arrangement.Center, ) { emails.forEach { EmailAddressChip( text = it, - modifier = Modifier.padding(horizontal = Margin.XSmall) + modifier = Modifier.padding(horizontal = Margin.XSmall), ) } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt index 353c9f580..5ee32a116 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessQrScreen.kt @@ -78,7 +78,8 @@ private fun Content(transferType: TransferType) { Column( modifier = Modifier .fillMaxSize() - .verticalScroll(rememberScrollState()), + .verticalScroll(rememberScrollState()) + .padding(Margin.Medium), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.Center, ) { @@ -101,7 +102,7 @@ private fun Content(transferType: TransferType) { QrCode() if (transferType != TransferType.QR_CODE) { - Spacer(Modifier.height(Margin.XXLarge)) + Spacer(Modifier.height(Margin.XLarge)) Text( text = stringResource(R.string.uploadSuccessLinkDescription), style = SwissTransferTheme.typography.bodyRegular, From 426e3197f6138b1da0bdf0a02edd8f4c2c564871 Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Wed, 23 Oct 2024 11:36:11 +0200 Subject: [PATCH 26/27] fix: Add plurals version of `uploadSuccessEmailDescription` --- .../swisstransfer/ui/components/EmptyState.kt | 3 ++- .../ui/components/IllustratedMessageBlock.kt | 6 +++--- .../importfiles/components/ImportedFilesCard.kt | 10 +++++----- .../newtransfer/upload/UploadSuccessEmailScreen.kt | 3 ++- app/src/main/res/values-de/strings.xml | 5 ++++- app/src/main/res/values-es/strings.xml | 5 ++++- app/src/main/res/values-fr/strings.xml | 5 ++++- app/src/main/res/values-it/strings.xml | 5 ++++- app/src/main/res/values/strings.xml | 5 ++++- 9 files changed, 32 insertions(+), 15 deletions(-) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt index 085224308..efeac9f0e 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt @@ -27,6 +27,7 @@ import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.res.stringResource import androidx.compose.ui.tooling.preview.Preview import com.infomaniak.swisstransfer.R import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus @@ -48,7 +49,7 @@ fun EmptyState( IllustratedMessageBlock( icon = icon, title = title, - description = description, + description = stringResource(description), modifier = modifier.padding(horizontal = Margin.Medium), ) } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt index 464a543b4..691888280 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt @@ -44,7 +44,7 @@ import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme fun IllustratedMessageBlock( icon: ImageVector, @StringRes title: Int, - @StringRes description: Int, + description: String, modifier: Modifier = Modifier, ) { Column( @@ -64,7 +64,7 @@ fun IllustratedMessageBlock( Spacer(Modifier.height(Margin.Medium)) Text( - text = stringResource(description), + text = description, textAlign = TextAlign.Center, style = SwissTransferTheme.typography.bodyRegular, color = SwissTransferTheme.colors.secondaryTextColor, @@ -82,7 +82,7 @@ private fun IllustratedMessageBlockPreview() { IllustratedMessageBlock( icon = AppIllus.MascotSearching, title = R.string.noTransferReceivedTitle, - description = R.string.noTransferReceivedDescription, + description = stringResource(R.string.noTransferReceivedDescription), ) } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/importfiles/components/ImportedFilesCard.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/importfiles/components/ImportedFilesCard.kt index d2d5a5645..091ccbd83 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/importfiles/components/ImportedFilesCard.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/importfiles/components/ImportedFilesCard.kt @@ -58,19 +58,19 @@ fun ImportedFilesCard( SwissTransferCard(modifier) { SharpRippleButton(onClick = { /*TODO*/ }) { Text( - pluralStringResource(R.plurals.filesCount, fileCount, fileCount), + text = pluralStringResource(R.plurals.filesCount, fileCount, fileCount), modifier = Modifier.padding(start = Margin.Medium), color = SwissTransferTheme.colors.secondaryTextColor, style = SwissTransferTheme.typography.bodySmallRegular, ) Text( - "•", + text = "•", modifier = Modifier.padding(horizontal = Margin.Small), color = SwissTransferTheme.colors.secondaryTextColor, style = SwissTransferTheme.typography.bodySmallRegular, ) Text( - formatSpaceLeft(humanReadableSize), + text = formatSpaceLeft(humanReadableSize), color = SwissTransferTheme.colors.secondaryTextColor, style = SwissTransferTheme.typography.bodySmallRegular, ) @@ -84,7 +84,7 @@ fun ImportedFilesCard( } LazyRow( - Modifier.fillMaxWidth(), + modifier = Modifier.fillMaxWidth(), contentPadding = PaddingValues(start = Margin.Medium, end = Margin.Medium, bottom = Margin.Medium), horizontalArrangement = Arrangement.spacedBy(Margin.Medium), ) { @@ -147,7 +147,7 @@ private fun ImportedFilesCardPreview(@PreviewParameter(FileUiListPreviewParamete files = { files }, humanReadableSize = { "20 GB" }, showUploadSourceChoiceBottomSheet = {}, - removeFileByUid = {} + removeFileByUid = {}, ) } } diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index 227b91165..9073284cd 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -24,6 +24,7 @@ import androidx.compose.material3.Surface import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.res.pluralStringResource import com.infomaniak.swisstransfer.R import com.infomaniak.swisstransfer.ui.components.* import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus @@ -80,7 +81,7 @@ private fun Content(emails: List) { IllustratedMessageBlock( icon = AppIllus.UploadSuccessEmail.image(), title = R.string.uploadSuccessEmailTitle, - description = R.string.uploadSuccessEmailDescription, + description = pluralStringResource(R.plurals.uploadSuccessEmailDescription, emails.count()), ) Spacer(modifier = Modifier.height(Margin.Medium)) diff --git a/app/src/main/res/values-de/strings.xml b/app/src/main/res/values-de/strings.xml index b938282ce..8189a7159 100644 --- a/app/src/main/res/values-de/strings.xml +++ b/app/src/main/res/values-de/strings.xml @@ -89,7 +89,10 @@ Dateien durchsuchen Foto- und Videogalerie Herunterladen von - Der Download-Link wurde erfolgreich an den folgenden Empfänger gesendet: + + Der Download-Link wurde erfolgreich an den folgenden Empfänger gesendet: + Der Download-Link wurde an die folgenden Empfänger gesendet: + Hoppla, das ist gesendet! Lass diesen QR-Code in deiner Umgebung scannen, um deine Dateien weiterzugeben, oder kopiere den untenstehenden Link. Deine Überweisung ist fertig! diff --git a/app/src/main/res/values-es/strings.xml b/app/src/main/res/values-es/strings.xml index 584b8f995..c1cc14864 100644 --- a/app/src/main/res/values-es/strings.xml +++ b/app/src/main/res/values-es/strings.xml @@ -89,7 +89,10 @@ Examinar archivos Galería de fotos y vídeos Descargar desde - El enlace de descarga se ha enviado al siguiente destinatario: + + El enlace de descarga se ha enviado al siguiente destinatario: + El enlace de descarga se ha enviado a los siguientes destinatarios: + ¡Y ya está! Escanea este código QR a tu alrededor para compartir tus archivos o copia el enlace que aparece a continuación. Su transferencia está lista diff --git a/app/src/main/res/values-fr/strings.xml b/app/src/main/res/values-fr/strings.xml index afed8fadf..5fadb05b9 100644 --- a/app/src/main/res/values-fr/strings.xml +++ b/app/src/main/res/values-fr/strings.xml @@ -91,7 +91,10 @@ Parcourir les fichiers Galerie photos et vidéos Télécharger à partir de - Le lien de téléchargement a bien été envoyé au destinataire suivant : + + Le lien de téléchargement a bien été envoyé au destinataire suivant : + Le lien de téléchargement a été envoyé aux destinataires suivants : + Hop c’est envoyé ! Fais scanner ce QR code autour de toi pour partager tes fichiers ou copie le lien ci-dessous. Ton transfert est prêt ! diff --git a/app/src/main/res/values-it/strings.xml b/app/src/main/res/values-it/strings.xml index fd272521a..c975172d2 100644 --- a/app/src/main/res/values-it/strings.xml +++ b/app/src/main/res/values-it/strings.xml @@ -89,7 +89,10 @@ Sfoglia i file Galleria di foto e video Scarica da - Il link per il download è stato inviato al seguente destinatario: + + Il link per il download è stato inviato al seguente destinatario: + Il link per il download è stato inviato ai seguenti destinatari: + E si parte! Scansiona questo codice QR intorno a voi per condividere i vostri file o copiate il link qui sotto. Il trasferimento è pronto! diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml index 2c2773c89..c1a587179 100644 --- a/app/src/main/res/values/strings.xml +++ b/app/src/main/res/values/strings.xml @@ -94,7 +94,10 @@ Browse files Photo and video gallery Upload from - The download link has been sent to the following recipient: + + The download link has been sent to the following recipient: + The download link has been sent to the following recipients: + It’s sent! Scan this QR code around you to share your files, or copy the link below. Your transfer is ready! From 43de163f74d2f1b5f9d3e89a2cb5157613fb3d2d Mon Sep 17 00:00:00 2001 From: Kevin Boulongne Date: Wed, 23 Oct 2024 11:44:23 +0200 Subject: [PATCH 27/27] review: Limit FlowRox width to 800.dp --- .../ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt | 2 ++ 1 file changed, 2 insertions(+) diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt index 9073284cd..e20dd080d 100644 --- a/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt +++ b/app/src/main/java/com/infomaniak/swisstransfer/ui/screen/newtransfer/upload/UploadSuccessEmailScreen.kt @@ -25,6 +25,7 @@ import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.res.pluralStringResource +import androidx.compose.ui.unit.dp import com.infomaniak.swisstransfer.R import com.infomaniak.swisstransfer.ui.components.* import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus @@ -87,6 +88,7 @@ private fun Content(emails: List) { Spacer(modifier = Modifier.height(Margin.Medium)) FlowRow( + modifier = Modifier.widthIn(max = 800.dp), horizontalArrangement = Arrangement.Center, ) { emails.forEach {