Merge pull request #57 from Infomaniak/top-app-bar

Add BrandTopAppBar in all screens & tablet mode

app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/MainScreen.kt

@@ -24,8 +24,10 @@ import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
 import androidx.navigation.compose.currentBackStackEntryAsState
 import androidx.navigation.compose.rememberNavController
+import com.infomaniak.swisstransfer.ui.components.BrandTobAppBar
 import com.infomaniak.swisstransfer.ui.navigation.MainNavigation
 import com.infomaniak.swisstransfer.ui.navigation.NavigationDestination.Companion.toDestination
+import com.infomaniak.swisstransfer.ui.screen.main.components.MainScaffold
 import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
 import com.infomaniak.swisstransfer.ui.utils.PreviewMobile
 import com.infomaniak.swisstransfer.ui.utils.PreviewTablet
@@ -41,9 +43,13 @@ fun MainScreen() {
         derivedStateOf { navBackStackEntry?.toDestination<MainNavigation>() ?: MainNavigation.startDestination }
     }
 
-    MainScaffold(navController, currentDestination, windowAdaptiveInfo) {
-        MainNavHost(navController, currentDestination, windowAdaptiveInfo)
-    }
+    MainScaffold(
+        navController = navController,
+        currentDestination = currentDestination,
+        windowAdaptiveInfo = windowAdaptiveInfo,
+        tabletTopAppBar = { BrandTobAppBar() },
+        content = { MainNavHost(navController, currentDestination, windowAdaptiveInfo) },
+    )
 }
 
 @PreviewMobile

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

@@ -123,11 +123,12 @@ private fun AppNavigationRail(
             )
         },
         containerColor = SwissTransferTheme.colors.navigationItemBackground,
+        windowInsets = WindowInsets(left = 0, top = 0, right = 0, bottom = 0),
     ) {
         navigationItems.forEach { navigationItem ->
             NavigationRailItem(
                 icon = { NavigationIcon(false, navigationItem) },
-                label = {},
+                label = {}, // Don't remove this seemingly useless label, it changes the icons background.
                 selected = currentDestination == navigationItem.destination,
                 onClick = { onClick(navigationItem.destination) },
             )

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

@@ -0,0 +1,34 @@
+/*
+ * 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.screen.main.components
+
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.runtime.Composable
+import com.infomaniak.swisstransfer.ui.components.BrandTobAppBar
+
+@Composable
+fun BrandTobAppBarScaffold(
+    floatingActionButton: @Composable () -> Unit = {},
+    content: @Composable (PaddingValues) -> Unit,
+) {
+    PhoneTopAppBarScaffold(
+        phoneTopAppBar = { BrandTobAppBar() },
+        floatingActionButton = floatingActionButton,
+        content = content,
+    )
+}

app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/MainScaffold.kt → app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/components/MainScaffold.kt

@@ -15,7 +15,7 @@
  * 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.screen.main
+package com.infomaniak.swisstransfer.ui.screen.main.components
 
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -27,9 +27,9 @@ import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.navigation.NavGraph.Companion.findStartDestination
 import androidx.navigation.NavHostController
+import com.infomaniak.swisstransfer.ui.components.BrandTobAppBar
 import com.infomaniak.swisstransfer.ui.navigation.MainNavigation
 import com.infomaniak.swisstransfer.ui.navigation.NavigationItem
-import com.infomaniak.swisstransfer.ui.screen.main.components.AppNavigationSuiteScaffold
 import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
 import com.infomaniak.swisstransfer.ui.utils.PreviewMobile
 import com.infomaniak.swisstransfer.ui.utils.PreviewTablet
@@ -41,12 +41,13 @@ fun MainScaffold(
     navController: NavHostController,
     currentDestination: MainNavigation,
     windowAdaptiveInfo: WindowAdaptiveInfo,
+    tabletTopAppBar: @Composable () -> Unit = {},
     content: @Composable () -> Unit = {},
 ) {
     val navType by rememberNavType(currentDestination, windowAdaptiveInfo)
 
     CompositionLocalProvider(LocalNavType provides navType) {
-        MainScaffold(navType, currentDestination, navController::navigateToSelectedItem, content)
+        MainScaffold(navType, currentDestination, navController::navigateToSelectedItem, tabletTopAppBar, content)
     }
 }
 
@@ -55,15 +56,19 @@ private fun MainScaffold(
     navType: NavigationSuiteType,
     currentDestination: MainNavigation,
     navigateToSelectedItem: (MainNavigation) -> Unit,
+    tabletTopAppBar: @Composable () -> Unit,
     content: @Composable () -> Unit,
 ) {
-    AppNavigationSuiteScaffold(navType, NavigationItem.entries, currentDestination, navigateToSelectedItem) {
-        if (navType == NavigationSuiteType.None) {
-            content()
-        } else {
-            Column {
-                Box(modifier = Modifier.weight(1.0f)) { content() }
-                HorizontalDivider()
+    Column {
+        if (navType == NavigationSuiteType.NavigationRail) tabletTopAppBar()
+        AppNavigationSuiteScaffold(navType, NavigationItem.entries, currentDestination, navigateToSelectedItem) {
+            if (navType == NavigationSuiteType.NavigationBar) {
+                Column {
+                    Box(modifier = Modifier.weight(1.0f)) { content() }
+                    HorizontalDivider()
+                }
+            } else {
+                content()
             }
         }
     }
@@ -115,6 +120,7 @@ private fun NavigationMobilePreview() {
             currentDestination = MainNavigation.SentDestination,
             navigateToSelectedItem = {},
             navType = NavigationSuiteType.NavigationBar,
+            tabletTopAppBar = { BrandTobAppBar() },
             content = {},
         )
     }
@@ -128,6 +134,7 @@ private fun NavigationTabletPreview() {
             currentDestination = MainNavigation.SentDestination,
             navigateToSelectedItem = {},
             navType = NavigationSuiteType.NavigationRail,
+            tabletTopAppBar = { BrandTobAppBar() },
             content = {},
         )
     }

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

@@ -0,0 +1,43 @@
+/*
+ * 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.screen.main.components
+
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.material3.Scaffold
+import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteType
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.unit.dp
+
+@Composable
+fun PhoneTopAppBarScaffold(
+    phoneTopAppBar: @Composable () -> Unit = {},
+    floatingActionButton: @Composable () -> Unit = {},
+    content: @Composable (PaddingValues) -> Unit,
+) {
+    Scaffold(
+        topBar = { if (LocalNavType.current == NavigationSuiteType.NavigationBar) phoneTopAppBar() },
+        floatingActionButton = floatingActionButton,
+    ) { contentPadding ->
+        val paddingValues = if (LocalNavType.current == NavigationSuiteType.NavigationBar) {
+            contentPadding
+        } else {
+            PaddingValues(all = 0.dp)
+        }
+        content(paddingValues)
+    }
+}

app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/ReceivedScreen.kt

@@ -18,7 +18,6 @@
 package com.infomaniak.swisstransfer.ui.screen.main.received
 
 import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.derivedStateOf
@@ -28,10 +27,10 @@ import androidx.compose.ui.Modifier
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.infomaniak.swisstransfer.R
-import com.infomaniak.swisstransfer.ui.components.BrandTobAppBar
 import com.infomaniak.swisstransfer.ui.components.EmptyState
 import com.infomaniak.swisstransfer.ui.images.AppImages.AppIllus
 import com.infomaniak.swisstransfer.ui.images.illus.MascotSearching
+import com.infomaniak.swisstransfer.ui.screen.main.components.BrandTobAppBarScaffold
 import com.infomaniak.swisstransfer.ui.screen.main.received.components.ReceivedEmptyFab
 import com.infomaniak.swisstransfer.ui.screen.main.sent.SentViewModel
 import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
@@ -51,8 +50,7 @@ fun ReceivedScreen(
 
 @Composable
 private fun ReceivedScreen(areTransfersEmpty: () -> Boolean) {
-    Scaffold(
-        topBar = { BrandTobAppBar() },
+    BrandTobAppBarScaffold(
         floatingActionButton = { ReceivedEmptyFab(areTransfersEmpty) },
     ) { contentPadding ->
         EmptyState(

app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/received/components/ReceivedEmptyFab.kt

@@ -67,7 +67,7 @@ fun ReceivedEmptyFab(isMessageVisible: () -> Boolean) {
         }
 
         NewTransferFab(
-            modifier = Modifier.constrainAs(fab) { },
+            modifier = Modifier.constrainAs(fab) {},
             newTransferFabType = NewTransferFabType.BOTTOM_BAR,
         )
     }

app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/sent/SentEmptyScreen.kt

@@ -39,9 +39,9 @@ import com.infomaniak.swisstransfer.ui.utils.PreviewMobile
 import com.infomaniak.swisstransfer.ui.utils.PreviewTablet
 
 @Composable
-fun SentEmptyScreen() {
+fun SentEmptyScreen(modifier: Modifier) {
     Column(
-        modifier = Modifier.fillMaxSize(),
+        modifier = modifier.fillMaxSize(),
         horizontalAlignment = Alignment.CenterHorizontally,
         verticalArrangement = Arrangement.Center,
     ) {
@@ -91,7 +91,7 @@ fun SentEmptyScreen() {
 private fun SentEmptyScreenPreview() {
     SwissTransferTheme {
         Surface {
-            SentEmptyScreen()
+            SentEmptyScreen(modifier = Modifier)
         }
     }
 }

app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/sent/SentListScreen.kt

@@ -17,42 +17,35 @@
  */
 package com.infomaniak.swisstransfer.ui.screen.main.sent
 
-import androidx.compose.foundation.layout.padding
-import androidx.compose.material3.Scaffold
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
-import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteType
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
-import com.infomaniak.swisstransfer.ui.components.NewTransferFab
-import com.infomaniak.swisstransfer.ui.components.NewTransferFabType
 import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
 import com.infomaniak.swisstransfer.ui.utils.PreviewMobile
 import com.infomaniak.swisstransfer.ui.utils.PreviewTablet
+import java.util.UUID
 
 @Composable
 fun SentListScreen(
-    navType: NavigationSuiteType,
+    modifier: Modifier = Modifier,
+    transfers: List<Any>,
 ) {
-    Scaffold(
-        floatingActionButton = {
-            if (navType == NavigationSuiteType.NavigationBar) NewTransferFab(newTransferFabType = NewTransferFabType.BOTTOM_BAR)
-        },
-    ) { contentPadding ->
-        Text(
-            text = "Sent screen",
-            modifier = Modifier.padding(contentPadding),
-        )
+    LazyColumn(modifier) {
+        items(items = transfers, key = { UUID.randomUUID() }) {
+            Text(text = "Sent screen")
+        }
     }
 }
-
 @PreviewMobile
 @PreviewTablet
 @Composable
 private fun SentListScreenPreview() {
     SwissTransferTheme {
         Surface {
-            SentListScreen(navType = NavigationSuiteType.NavigationRail)
+            SentListScreen(transfers = listOf(Unit))
         }
     }
 }

app/src/main/java/com/infomaniak/swisstransfer/ui/screen/main/sent/SentScreen.kt

@@ -17,13 +17,18 @@
  */
 package com.infomaniak.swisstransfer.ui.screen.main.sent
 
+import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Surface
 import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteType
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
+import androidx.compose.ui.Modifier
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
-import com.infomaniak.swisstransfer.ui.screen.main.LocalNavType
+import com.infomaniak.swisstransfer.ui.components.NewTransferFab
+import com.infomaniak.swisstransfer.ui.components.NewTransferFabType
+import com.infomaniak.swisstransfer.ui.screen.main.components.BrandTobAppBarScaffold
+import com.infomaniak.swisstransfer.ui.screen.main.components.LocalNavType
 import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
 import com.infomaniak.swisstransfer.ui.utils.PreviewMobile
 import com.infomaniak.swisstransfer.ui.utils.PreviewTablet
@@ -34,31 +39,41 @@ fun SentScreen(
     sentViewModel: SentViewModel = hiltViewModel<SentViewModel>(),
 ) {
     val transfers by sentViewModel.transfers.collectAsStateWithLifecycle()
-    SentScreen(
-        transfers = transfers,
-        navType = LocalNavType.current,
-    )
+    val navType = LocalNavType.current
+
+    SentScreen(navType, transfers)
 }
 
 @Composable
-private fun SentScreen(transfers: List<Any>?, navType: NavigationSuiteType) {
+private fun SentScreen(navType: NavigationSuiteType, transfers: List<Any>?) {
     if (transfers == null) return
 
-    if (transfers.isEmpty()) {
-        SentEmptyScreen()
-    } else {
-        SentListScreen(navType)
+    BrandTobAppBarScaffold(
+        floatingActionButton = {
+            if (navType == NavigationSuiteType.NavigationBar && transfers.isNotEmpty()) {
+                NewTransferFab(newTransferFabType = NewTransferFabType.BOTTOM_BAR)
+            }
+        },
+    ) { contentPadding ->
+        val modifier = Modifier.padding(contentPadding)
+        if (transfers.isEmpty()) {
+            SentEmptyScreen(modifier)
+        } else {
+            SentListScreen(modifier, transfers)
+        }
     }
+
 }
 
 @PreviewMobile
 @Composable
 private fun SentScreenMobilePreview() {
+    val navType = LocalNavType.current
     SwissTransferTheme {
         Surface {
             SentScreen(
+                navType = navType,
                 transfers = emptyList(),
-                navType = NavigationSuiteType.NavigationBar,
             )
         }
     }
@@ -67,11 +82,12 @@ private fun SentScreenMobilePreview() {
 @PreviewTablet
 @Composable
 private fun SentScreenTabletPreview() {
+    val navType = LocalNavType.current
     SwissTransferTheme {
         Surface {
             SentScreen(
+                navType = navType,
                 transfers = emptyList(),
-                navType = NavigationSuiteType.NavigationRail,
             )
         }
     }