Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

feat: Update empty screen for sent, received transfers and settings screen #223

Merged
merged 4 commits into from
Dec 4, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -39,17 +39,17 @@ import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme

@Composable
fun EmptyState(
icon: ImageVector,
@StringRes titleRes: Int,
@StringRes descriptionRes: Int,
icon: ImageVector? = null,
@StringRes titleRes: Int? = null,
@StringRes descriptionRes: Int? = null,
modifier: Modifier = Modifier,
) = EmptyState(icon, titleRes, stringResource(descriptionRes), modifier)
) = EmptyState(icon, titleRes, descriptionRes?.let { stringResource(it) }, modifier)

@Composable
fun EmptyState(
icon: ImageVector,
@StringRes titleRes: Int,
description: String,
icon: ImageVector?,
@StringRes titleRes: Int?,
description: String?,
modifier: Modifier = Modifier,
) {
Box(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -42,34 +42,40 @@ import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme

@Composable
fun IllustratedMessageBlock(
icon: ImageVector,
@StringRes title: Int,
description: String,
icon: ImageVector?,
@StringRes title: Int?,
description: String?,
modifier: Modifier = Modifier,
) {
Column(
modifier = modifier,
horizontalAlignment = Alignment.CenterHorizontally,
) {
Image(imageVector = icon, contentDescription = null)
icon?.let {
Image(imageVector = it, contentDescription = null)
tevincent marked this conversation as resolved.
Show resolved Hide resolved

Spacer(Modifier.height(Margin.Huge))
Spacer(Modifier.height(Margin.Huge))
}

Text(
text = stringResource(title),
textAlign = TextAlign.Center,
style = SwissTransferTheme.typography.h1,
)
title?.let {
Text(
text = stringResource(it),
textAlign = TextAlign.Center,
style = SwissTransferTheme.typography.h1,
)
}

Spacer(Modifier.height(Margin.Medium))
description?.let {
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),
)
Text(
text = description,
textAlign = TextAlign.Center,
style = SwissTransferTheme.typography.bodyRegular,
color = SwissTransferTheme.colors.secondaryTextColor,
modifier = Modifier.widthIn(max = Dimens.DescriptionWidth),
)
}
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -30,23 +30,28 @@ import com.infomaniak.swisstransfer.R
import com.infomaniak.swisstransfer.ui.components.EmptyState
import com.infomaniak.swisstransfer.ui.components.transfer.TransfersListWithExpiredBottomSheet
import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus
import com.infomaniak.swisstransfer.ui.images.illus.MascotSearching
import com.infomaniak.swisstransfer.ui.images.illus.MascotWithMagnifyingGlass
import com.infomaniak.swisstransfer.ui.screen.main.components.BrandTopAppBarScaffold
import com.infomaniak.swisstransfer.ui.screen.main.received.components.ReceivedEmptyFab
import com.infomaniak.swisstransfer.ui.screen.main.transfers.TransfersViewModel
import com.infomaniak.swisstransfer.ui.theme.LocalWindowAdaptiveInfo
import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
import com.infomaniak.swisstransfer.ui.utils.PreviewAllWindows
import com.infomaniak.swisstransfer.ui.utils.isWindowSmall

@Composable
fun ReceivedScreen(
navigateToDetails: (transferUuid: String) -> Unit,
getSelectedTransferUuid: () -> String?,
transfersViewModel: TransfersViewModel = hiltViewModel<TransfersViewModel>(),
hasTransfer: (Boolean) -> Unit,
) {

val transfers by transfersViewModel.receivedTransfers.collectAsStateWithLifecycle()
val isLoading by remember { derivedStateOf { transfers == null } }

hasTransfer(transfers?.isNotEmpty() == true)

if (!isLoading) {
ReceivedScreen(
navigateToDetails = navigateToDetails,
Expand All @@ -71,8 +76,9 @@ private fun ReceivedScreen(
floatingActionButton = { ReceivedEmptyFab { areTransfersEmpty } },
) {
if (areTransfersEmpty) {
val shouldDisplayIcon = LocalWindowAdaptiveInfo.current.isWindowSmall()
EmptyState(
icon = AppIllus.MascotSearching,
icon = if (shouldDisplayIcon) AppIllus.MascotWithMagnifyingGlass else null,
titleRes = R.string.noTransferReceivedTitle,
descriptionRes = R.string.noTransferReceivedDescription,
)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -45,11 +45,14 @@ fun SentScreen(
navigateToDetails: (transferUuid: String) -> Unit,
getSelectedTransferUuid: () -> String?,
transfersViewModel: TransfersViewModel = hiltViewModel<TransfersViewModel>(),
hasTransfer: (Boolean) -> Unit,
) {

val transfers by transfersViewModel.sentTransfers.collectAsStateWithLifecycle()
val isLoading by remember { derivedStateOf { transfers == null } }

hasTransfer(transfers?.isNotEmpty() == true)

LifecycleEventEffect(Lifecycle.Event.ON_RESUME) {
transfersViewModel.fetchPendingTransfers()
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,18 +17,13 @@
*/
package com.infomaniak.swisstransfer.ui.screen.main.settings

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.adaptive.ExperimentalMaterial3AdaptiveApi
import androidx.compose.material3.adaptive.layout.ListDetailPaneScaffoldRole
import androidx.compose.material3.adaptive.navigation.ThreePaneScaffoldNavigator
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.stringResource
import androidx.hilt.navigation.compose.hiltViewModel
Expand All @@ -38,8 +33,11 @@ import com.infomaniak.multiplatform_swisstransfer.common.models.EmailLanguage
import com.infomaniak.multiplatform_swisstransfer.common.models.Theme
import com.infomaniak.multiplatform_swisstransfer.common.models.ValidityPeriod
import com.infomaniak.swisstransfer.R
import com.infomaniak.swisstransfer.ui.components.EmptyState
import com.infomaniak.swisstransfer.ui.components.TwoPaneScaffold
import com.infomaniak.swisstransfer.ui.components.safeCurrentContent
import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus
import com.infomaniak.swisstransfer.ui.images.illus.MascotWithMagnifyingGlass
import com.infomaniak.swisstransfer.ui.screen.main.settings.SettingsOptionScreens.*
import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
import com.infomaniak.swisstransfer.ui.utils.*
Expand Down Expand Up @@ -164,8 +162,11 @@ private fun DetailPane(

@Composable
private fun NoSelectionEmptyState() {
Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
Text("Select a setting item", color = SwissTransferTheme.colors.secondaryTextColor)
Surface {
EmptyState(
icon = AppIllus.MascotWithMagnifyingGlass,
descriptionRes = R.string.noSettingsSelectedDescription
)
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,13 +24,17 @@ import androidx.compose.material3.adaptive.ExperimentalMaterial3AdaptiveApi
import androidx.compose.material3.adaptive.layout.ListDetailPaneScaffoldRole
import androidx.compose.material3.adaptive.navigation.ThreePaneScaffoldNavigator
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.runtime.setValue
import com.infomaniak.multiplatform_swisstransfer.common.models.TransferDirection
import com.infomaniak.swisstransfer.R
import com.infomaniak.swisstransfer.ui.components.EmptyState
import com.infomaniak.swisstransfer.ui.components.TwoPaneScaffold
import com.infomaniak.swisstransfer.ui.components.safeCurrentContent
import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus
import com.infomaniak.swisstransfer.ui.images.illus.MascotSearching
import com.infomaniak.swisstransfer.ui.images.illus.MascotWithMagnifyingGlass
import com.infomaniak.swisstransfer.ui.screen.main.received.ReceivedScreen
import com.infomaniak.swisstransfer.ui.screen.main.sent.SentScreen
import com.infomaniak.swisstransfer.ui.screen.main.transferdetails.TransferDetailsScreen
Expand All @@ -42,23 +46,31 @@ import kotlinx.parcelize.Parcelize
@OptIn(ExperimentalMaterial3AdaptiveApi::class)
@Composable
fun TransfersScreenWrapper(direction: TransferDirection) {
var hasTransfer: Boolean by rememberSaveable { mutableStateOf(false) }

TwoPaneScaffold<DestinationContent>(
listPane = { ListPane(direction, navigator = this) },
detailPane = { DetailPane(navigator = this) },
listPane = { ListPane(direction, navigator = this, hasTransfer = { hasTransfer = it }) },
detailPane = { DetailPane(navigator = this, hasTransfer) },
)
}

@OptIn(ExperimentalMaterial3AdaptiveApi::class)
@Composable
private fun ListPane(direction: TransferDirection, navigator: ThreePaneScaffoldNavigator<DestinationContent>) {
private fun ListPane(
direction: TransferDirection,
navigator: ThreePaneScaffoldNavigator<DestinationContent>,
hasTransfer: (Boolean) -> Unit
) {
when (direction) {
TransferDirection.SENT -> SentScreen(
navigateToDetails = { transferUuid -> navigator.navigateToDetails(direction, transferUuid) },
getSelectedTransferUuid = navigator::getSelectedTransferUuid,
hasTransfer = hasTransfer,
)
TransferDirection.RECEIVED -> ReceivedScreen(
navigateToDetails = { transferUuid -> navigator.navigateToDetails(direction, transferUuid) },
getSelectedTransferUuid = navigator::getSelectedTransferUuid,
hasTransfer = hasTransfer,
)
}
}
Expand All @@ -78,12 +90,12 @@ private fun ThreePaneScaffoldNavigator<DestinationContent>.getSelectedTransferUu

@OptIn(ExperimentalMaterial3AdaptiveApi::class)
@Composable
private fun DetailPane(navigator: ThreePaneScaffoldNavigator<DestinationContent>) {
private fun DetailPane(navigator: ThreePaneScaffoldNavigator<DestinationContent>, hasTransfer: Boolean) {

val destinationContent = navigator.safeCurrentContent()

if (destinationContent == null) {
NoSelectionEmptyState()
NoSelectionEmptyState(hasTransfer)
} else {
TransferDetailsScreen(
transferUuid = destinationContent.transferUuid,
Expand All @@ -94,12 +106,18 @@ private fun DetailPane(navigator: ThreePaneScaffoldNavigator<DestinationContent>
}

@Composable
private fun NoSelectionEmptyState() {
private fun NoSelectionEmptyState(hasTransfers: Boolean) {
val (titleRes, descriptionRes) = if (hasTransfers) {
R.string.noTransferSelectedTitle to R.string.noTransferSelectedDescription
} else {
null to null
}

Surface {
EmptyState(
icon = AppIllus.MascotSearching,
titleRes = R.string.noTransferSelectedTitle,
descriptionRes = R.string.noTransferSelectedDescription,
icon = AppIllus.MascotWithMagnifyingGlass,
titleRes = titleRes,
descriptionRes = descriptionRes
)
}
}
Expand Down
1 change: 1 addition & 0 deletions app/src/main/res/values-de/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@
<string name="networkUnavailable">Auf Netzwerk warten…</string>
<string name="noFileDescription">Fügt bis zu 50 GB an Dateien hinzu</string>
<string name="noFileTitle">Keine Datei, keine Übertragung!</string>
<string name="noSettingsSelectedDescription">Wählt einen Parameter zur Anzeige aus</string>
<string name="noTransferReceivedDescription">Alle Überweisungen, die du in den letzten 30 Tagen erhältst, werden hier angezeigt.</string>
<string name="noTransferReceivedTitle">Keine Überweisungen erhalten</string>
<string name="noTransferSelectedDescription">Wähle eine Übertragung aus oder erstelle eine neue.</string>
Expand Down
1 change: 1 addition & 0 deletions app/src/main/res/values-es/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@
<string name="networkUnavailable">Esperando la red…</string>
<string name="noFileDescription">Añade hasta 50 GB de archivos</string>
<string name="noFileTitle">Si no hay archivo, no hay transferencia.</string>
<string name="noSettingsSelectedDescription">Selecciona un parámetro para su visualización</string>
<string name="noTransferReceivedDescription">Aquí aparecerán todas las transferencias recibidas en los últimos 30 días.</string>
<string name="noTransferReceivedTitle">No se han recibido transferencias</string>
<string name="noTransferSelectedDescription">Selecciona una transferencia o crea una nueva.</string>
Expand Down
1 change: 1 addition & 0 deletions app/src/main/res/values-fr/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@
<string name="networkUnavailable">En attente de réseau…</string>
<string name="noFileDescription">Ajoute jusqu’à 50 Go de fichiers</string>
<string name="noFileTitle">Pas de fichier, pas de transfert !</string>
<string name="noSettingsSelectedDescription">Sélectionne un paramètre pour l’afficher</string>
<string name="noTransferReceivedDescription">Tous les transferts que tu recevras sur les 30 derniers jours apparaitront ici.</string>
<string name="noTransferReceivedTitle">Aucun transfert reçu</string>
<string name="noTransferSelectedDescription">Sélectionne un transfert ou créé-en un nouveau.</string>
Expand Down
1 change: 1 addition & 0 deletions app/src/main/res/values-it/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@
<string name="networkUnavailable">In attesa della rete…</string>
<string name="noFileDescription">Aggiungere fino a 50 GB di file</string>
<string name="noFileTitle">Nessun file, nessun trasferimento!</string>
<string name="noSettingsSelectedDescription">Seleziona un parametro da visualizzare</string>
<string name="noTransferReceivedDescription">Qui appariranno tutti i bonifici ricevuti negli ultimi 30 giorni.</string>
<string name="noTransferReceivedTitle">Nessun trasferimento ricevuto</string>
<string name="noTransferSelectedDescription">Selezionare un trasferimento o crearne uno nuovo.</string>
Expand Down
1 change: 1 addition & 0 deletions app/src/main/res/values/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@
<string name="networkUnavailable">Waiting for network…</string>
<string name="noFileDescription">Add up to 50 GB of files</string>
<string name="noFileTitle">No file, no transfer!</string>
<string name="noSettingsSelectedDescription">Select a parameter to display it</string>
<string name="noTransferReceivedDescription">All transfers you receive over the last 30 days will appear here.</string>
<string name="noTransferReceivedTitle">No transfers received</string>
<string name="noTransferSelectedDescription">Select a transfer or create a new one.</string>
Expand Down
Loading