feat: Update import screen design (#250)

Infomaniak · Dec 16, 2024 · 568a771 · 568a771
2 parents 8f94b90 + a9905e7
commit 568a771
Show file tree

Hide file tree

Showing 5 changed files with 46 additions and 37 deletions.
diff --git a/app/src/main/java/com/infomaniak/swisstransfer/ui/components/SmallFileItem.kt b/app/src/main/java/com/infomaniak/swisstransfer/ui/components/SmallFileItem.kt
@@ -39,7 +39,6 @@ fun SmallFileItem(
     modifier: Modifier = Modifier,
     file: FileUi,
     smallFileTileSize: SmallFileTileSize,
-    onRemove: (() -> Unit)? = null,
 ) {
     Box(
         modifier
@@ -54,8 +53,6 @@ fun SmallFileItem(
             showFileName = smallFileTileSize.showFileName,
             fileIconContentPadding = PaddingValues(SmallFileTileSize.fileNameIconPadding),
         )
-
-        onRemove?.let { CrossCircleButton(onClick = it, size = 40.dp) }
     }
 }
 
@@ -79,7 +76,6 @@ private fun SmallFileItemPreview(@PreviewParameter(FileUiListPreviewParameter::c
                 SmallFileItem(
                     file = file,
                     smallFileTileSize = SmallFileTileSize.LARGE,
-                    onRemove = {}
                 )
 
                 Spacer(Modifier.height(Margin.Medium))

diff --git a/.../java/com/infomaniak/swisstransfer/ui/screen/newtransfer/importfiles/ImportFilesScreen.kt b/.../java/com/infomaniak/swisstransfer/ui/screen/newtransfer/importfiles/ImportFilesScreen.kt
@@ -79,24 +79,35 @@ fun ImportFilesScreen(
 
     val transferOptionsCallbacks = importFilesViewModel.getTransferOptionsCallbacks(
         transferOptionsStates = {
-            listOf(
-                TransferOptionState(
-                    transferOptionType = TransferOptionType.VALIDITY_DURATION,
-                    settingState = { validityPeriodState },
-                ),
-                TransferOptionState(
-                    transferOptionType = TransferOptionType.DOWNLOAD_NUMBER_LIMIT,
-                    settingState = { downloadLimitState },
-                ),
-                TransferOptionState(
-                    transferOptionType = TransferOptionType.PASSWORD,
-                    settingState = { passwordOptionState },
-                ),
-                TransferOptionState(
-                    transferOptionType = TransferOptionType.LANGUAGE,
-                    settingState = { emailLanguageState },
-                ),
-            )
+            buildList {
+                add(
+                    TransferOptionState(
+                        transferOptionType = TransferOptionType.VALIDITY_DURATION,
+                        settingState = { validityPeriodState },
+                    )
+                )
+                add(
+                    TransferOptionState(
+                        transferOptionType = TransferOptionType.DOWNLOAD_NUMBER_LIMIT,
+                        settingState = { downloadLimitState },
+                    )
+                )
+                add(
+                    TransferOptionState(
+                        transferOptionType = TransferOptionType.PASSWORD,
+                        settingState = { passwordOptionState },
+                    )
+                )
+
+                if (selectedTransferType == TransferTypeUi.MAIL) {
+                    add(
+                        TransferOptionState(
+                            transferOptionType = TransferOptionType.LANGUAGE,
+                            settingState = { emailLanguageState },
+                        )
+                    )
+                }
+            }
         },
     )
 
@@ -111,11 +122,10 @@ fun ImportFilesScreen(
             set = importFilesViewModel::selectTransferType,
         ),
         transferOptionsCallbacks = transferOptionsCallbacks,
-        removeFileByUid = importFilesViewModel::removeFileByUid,
         addFiles = importFilesViewModel::importFiles,
         closeActivity = closeActivity,
-        sendTransfer = importFilesViewModel::sendTransfer,
         shouldStartByPromptingUserForFiles = true,
+        sendTransfer = importFilesViewModel::sendTransfer,
     )
 }
 
@@ -143,7 +153,6 @@ private fun ImportFilesScreen(
     transferMessage: GetSetCallbacks<String>,
     selectedTransferType: GetSetCallbacks<TransferTypeUi>,
     transferOptionsCallbacks: TransferOptionsCallbacks,
-    removeFileByUid: (uid: String) -> Unit,
     addFiles: (List<Uri>) -> Unit,
     closeActivity: () -> Unit,
     shouldStartByPromptingUserForFiles: Boolean,
@@ -174,15 +183,15 @@ private fun ImportFilesScreen(
         content = {
             Column(modifier = Modifier.verticalScroll(rememberScrollState())) {
                 val modifier = Modifier.padding(horizontal = HORIZONTAL_PADDING)
-                FilesToImport(modifier, files, removeFileByUid, addFiles, shouldStartByPromptingUserForFiles)
+                SendByOptions(modifier, selectedTransferType)
+                FilesToImport(modifier, files, navigateToFileDetails = { /*TODO*/ }, addFiles, shouldStartByPromptingUserForFiles)
                 Spacer(Modifier.height(Margin.Medium))
                 ImportTextFields(
                     horizontalPaddingModifier = modifier,
                     transferAuthorEmail = transferAuthorEmail,
                     transferMessage = transferMessage,
                     shouldShowEmailAddressesFields = { shouldShowEmailAddressesFields },
                 )
-                SendByOptions(modifier, selectedTransferType)
                 TransferOptions(modifier, transferOptionsCallbacks)
             }
         }
@@ -193,7 +202,7 @@ private fun ImportFilesScreen(
 private fun FilesToImport(
     modifier: Modifier,
     files: () -> List<FileUi>,
-    removeFileByUid: (uid: String) -> Unit,
+    navigateToFileDetails: () -> Unit,
     addFiles: (List<Uri>) -> Unit,
     shouldStartByPromptingUserForFiles: Boolean,
 ) {
@@ -212,7 +221,7 @@ private fun FilesToImport(
     LaunchedEffect(Unit) { if (shouldShowInitialFilePick) pickFiles() }
 
     ImportFilesTitle(modifier, R.string.myFilesTitle)
-    ImportedFilesCard(modifier, files, ::pickFiles, removeFileByUid)
+    ImportedFilesCard(modifier, files, ::pickFiles, navigateToFileDetails)
 }
 
 @Composable
@@ -431,7 +440,6 @@ private fun Preview(@PreviewParameter(FileUiListPreviewParameter::class) files:
             transferMessage = GetSetCallbacks(get = { "" }, set = {}),
             selectedTransferType = GetSetCallbacks(get = { TransferTypeUi.MAIL }, set = {}),
             transferOptionsCallbacks = transferOptionsCallbacks,
-            removeFileByUid = {},
             addFiles = {},
             closeActivity = {},
             shouldStartByPromptingUserForFiles = false,

diff --git a/...nfomaniak/swisstransfer/ui/screen/newtransfer/importfiles/components/ImportedFilesCard.kt b/...nfomaniak/swisstransfer/ui/screen/newtransfer/importfiles/components/ImportedFilesCard.kt
@@ -18,6 +18,7 @@
 package com.infomaniak.swisstransfer.ui.screen.newtransfer.importfiles.components
 
 import android.os.Parcelable
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.lazy.LazyRow
 import androidx.compose.foundation.lazy.items
@@ -28,14 +29,18 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.pluralStringResource
 import androidx.compose.ui.tooling.preview.PreviewParameter
 import androidx.compose.ui.unit.dp
 import com.infomaniak.multiplatform_swisstransfer.common.interfaces.ui.FileUi
 import com.infomaniak.swisstransfer.R
-import com.infomaniak.swisstransfer.ui.components.*
+import com.infomaniak.swisstransfer.ui.components.SmallFileItem
+import com.infomaniak.swisstransfer.ui.components.SmallFileTileSize
+import com.infomaniak.swisstransfer.ui.components.SwissTransferCard
+import com.infomaniak.swisstransfer.ui.components.TextDotText
 import com.infomaniak.swisstransfer.ui.images.AppImages.AppIcons
 import com.infomaniak.swisstransfer.ui.images.icons.AddThick
 import com.infomaniak.swisstransfer.ui.images.icons.ChevronRightThick
@@ -55,7 +60,7 @@ fun ImportedFilesCard(
     modifier: Modifier = Modifier,
     files: () -> List<FileUi>,
     pickFiles: () -> Unit,
-    removeFileByUid: (uid: String) -> Unit,
+    navigateToFileDetails: () -> Unit,
 ) {
 
     val context = LocalContext.current
@@ -68,8 +73,8 @@ fun ImportedFilesCard(
         }
     }
 
-    SwissTransferCard(modifier) {
-        SharpRippleButton(onClick = { /* TODO */ }) {
+    SwissTransferCard(modifier.clickable { navigateToFileDetails() }) {
+        Row(verticalAlignment = Alignment.CenterVertically) {
             TextDotText(
                 firstText = {
                     val fileCount = files().count()
@@ -104,7 +109,6 @@ fun ImportedFilesCard(
                     modifier = Modifier.animateItem(),
                     file = file,
                     smallFileTileSize = SmallFileTileSize.LARGE,
-                    onRemove = { removeFileByUid(file.uid) },
                 )
             }
         }
@@ -148,7 +152,7 @@ private fun ImportedFilesCardPreview(@PreviewParameter(FileUiListPreviewParamete
             modifier = Modifier.padding(Margin.Medium),
             files = { files },
             pickFiles = {},
-            removeFileByUid = {},
+            navigateToFileDetails = {},
         )
     }
 }
diff --git a/...maniak/swisstransfer/ui/screen/newtransfer/importfiles/components/TransferOptionsTypes.kt b/...maniak/swisstransfer/ui/screen/newtransfer/importfiles/components/TransferOptionsTypes.kt
@@ -48,6 +48,7 @@ fun TransferOptionsTypes(
     transferOptionsStates: () -> List<TransferOptionState>,
     onClick: (TransferOptionType) -> Unit,
 ) {
+    // TODO: Animate the addition or removal when the list of transferOptionsStates changes
     SwissTransferCard(modifier = modifier) {
         transferOptionsStates().forEach {
             val title by remember { derivedStateOf { it.settingState } }

diff --git a/...fomaniak/swisstransfer/ui/screen/newtransfer/importfiles/components/TransferTypeButton.kt b/...fomaniak/swisstransfer/ui/screen/newtransfer/importfiles/components/TransferTypeButton.kt
@@ -42,7 +42,7 @@ fun TransferTypeButton(transferType: TransferTypeUi, isActive: () -> Boolean, on
     Button(
         modifier = Modifier
             .height(Dimens.LargeButtonHeight)
-            .border(width = Dimens.BorderWidth, color = borderColor, shape = CustomShapes.SMALL),
+            .border(width = Dimens.BorderWidth, color = borderColor, shape = CustomShapes.EXTRA_SMALL),
         shape = CustomShapes.SMALL,
         colors = ButtonDefaults.buttonColors(containerColor = Color.Transparent, contentColor = contentColor),
         onClick = onClick,