feat: Add UploadSuccess screens

app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmailAddressChip.kt

@@ -0,0 +1,64 @@
+/*
+ * 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 <http://www.gnu.org/licenses/>.
+ */
+package com.infomaniak.swisstransfer.ui.components
+
+import android.content.res.Configuration
+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.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,
+    modifier: Modifier = Modifier,
+) {
+    SuggestionChip(
+        onClick = { },
+        label = {
+            Text(
+                text = text,
+                style = SwissTransferTheme.typography.bodyRegular,
+            )
+        },
+        modifier = modifier,
+        enabled = false,
+        shape = CustomShapes.ROUNDED,
+        colors = SuggestionChipDefaults.suggestionChipColors(
+            disabledContainerColor = SwissTransferTheme.colors.emailAddressChipColor,
+            disabledLabelColor = SwissTransferTheme.colors.onEmailAddressChipColor
+        ),
+        border = null,
+    )
+}
+
+@Preview(name = "Light mode")
+@Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL)
+@Composable
+private fun EmailAddressChipPreview() {
+    SwissTransferTheme {
+        Surface {
+            EmailAddressChip(text = "[email protected]")
+        }
+    }
+}

app/src/main/java/com/infomaniak/swisstransfer/ui/components/EmptyState.kt

@@ -17,17 +17,21 @@
  */
 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.Text
+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.res.stringResource
-import androidx.compose.ui.text.style.TextAlign
-import com.infomaniak.swisstransfer.ui.theme.Dimens
+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
 
@@ -38,27 +42,30 @@ fun EmptyState(
     @StringRes description: Int,
     modifier: Modifier = Modifier,
 ) {
-    Column(
-        modifier = modifier.fillMaxSize(),
-        verticalArrangement = Arrangement.Center,
-        horizontalAlignment = Alignment.CenterHorizontally,
+    Box(
+        modifier = Modifier.fillMaxSize(),
+        contentAlignment = Alignment.Center,
     ) {
-        Image(imageVector = icon, contentDescription = null)
-
-        Text(
-            text = stringResource(title),
-            style = SwissTransferTheme.typography.specificMedium22,
-            modifier = Modifier.padding(PaddingValues(top = Margin.XLarge)),
+        IllustratedMessageBlock(
+            icon = icon,
+            title = title,
+            description = stringResource(description),
+            modifier = modifier.padding(horizontal = 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)),
-        )
+@Preview(name = "Light mode")
+@Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL)
+@Composable
+private fun EmptyStatePreview() {
+    SwissTransferTheme {
+        Surface {
+            EmptyState(
+                icon = AppIllus.MascotSearching,
+                title = R.string.noTransferReceivedTitle,
+                description = R.string.noTransferReceivedDescription,
+            )
+        }
     }
 }

app/src/main/java/com/infomaniak/swisstransfer/ui/components/IllustratedMessageBlock.kt

@@ -0,0 +1,89 @@
+/*
+ * 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 <http://www.gnu.org/licenses/>.
+ */
+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.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
+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,
+    description: String,
+    modifier: Modifier = Modifier,
+) {
+    Column(
+        modifier = modifier,
+        horizontalAlignment = Alignment.CenterHorizontally,
+    ) {
+        Image(imageVector = icon, contentDescription = null)
+
+        Spacer(Modifier.height(Margin.XLarge))
+
+        Text(
+            text = stringResource(title),
+            textAlign = TextAlign.Center,
+            style = SwissTransferTheme.typography.h1,
+        )
+
+        Spacer(Modifier.height(Margin.Medium))
+
+        Text(
+            text = description,
+            textAlign = TextAlign.Center,
+            style = SwissTransferTheme.typography.bodyRegular,
+            color = SwissTransferTheme.colors.secondaryTextColor,
+            modifier = Modifier.widthIn(max = Dimens.DescriptionWidth),
+        )
+    }
+}
+
+@Preview(name = "Light mode")
+@Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL)
+@Composable
+private fun IllustratedMessageBlockPreview() {
+    SwissTransferTheme {
+        Surface {
+            IllustratedMessageBlock(
+                icon = AppIllus.MascotSearching,
+                title = R.string.noTransferReceivedTitle,
+                description = stringResource(R.string.noTransferReceivedDescription),
+            )
+        }
+    }
+}

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 NewTransferFabPreview() {
+    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)
+            }
+        }
+    }
+}

app/src/main/java/com/infomaniak/swisstransfer/ui/components/QrCode.kt

@@ -0,0 +1,60 @@
+/*
+ * 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 <http://www.gnu.org/licenses/>.
+ */
+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
+
+@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.
+        )
+    }
+}
+
+@Preview(name = "Light mode")
+@Preview(name = "Dark mode", uiMode = Configuration.UI_MODE_NIGHT_YES or Configuration.UI_MODE_TYPE_NORMAL)
+@Composable
+private fun QrCodePreview() {
+    SwissTransferTheme {
+        Surface {
+            QrCode()
+        }
+    }
+}