feat: Add a custom NavigationSuiteScaffold

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

@@ -21,23 +21,17 @@ package com.infomaniak.swisstransfer.ui.screen.main
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.material3.HorizontalDivider
-import androidx.compose.material3.Icon
-import androidx.compose.material3.Text
 import androidx.compose.material3.adaptive.WindowAdaptiveInfo
-import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteDefaults
-import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteScaffold
 import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteScaffoldDefaults
 import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteType
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.res.stringResource
 import androidx.navigation.NavGraph.Companion.findStartDestination
 import androidx.navigation.NavHostController
 import com.infomaniak.swisstransfer.ui.navigation.MainNavigation
 import com.infomaniak.swisstransfer.ui.navigation.NavigationItem
-import com.infomaniak.swisstransfer.ui.theme.LocalCustomTypography
+import com.infomaniak.swisstransfer.ui.screen.main.components.AppNavigationSuiteScaffold
 import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
-import com.infomaniak.swisstransfer.ui.theme.Typography
 import com.infomaniak.swisstransfer.ui.utils.PreviewMobile
 import com.infomaniak.swisstransfer.ui.utils.PreviewTablet
 
@@ -65,50 +59,17 @@ private fun MainScaffold(
     navigateToSelectedItem: (MainNavigation) -> Unit,
     content: @Composable () -> Unit,
 ) {
-    val isNavigationBar = navType == NavigationSuiteType.NavigationBar
-
-    NavigationSuiteScaffold(
-        navigationSuiteItems = {
-            NavigationItem.entries.forEach { navigationItem ->
-                item(
-                    icon = { NavigationIcon(isNavigationBar, navigationItem) },
-                    label = { NavigationLabel(isNavigationBar, navigationItem) },
-                    selected = currentDestination == navigationItem.destination,
-                    onClick = { navigateToSelectedItem(navigationItem.destination) }
-                )
-            }
-        },
-        navigationSuiteColors = NavigationSuiteDefaults.colors(
-            navigationBarContainerColor = SwissTransferTheme.colors.navigationItemBackground,
-            navigationRailContainerColor = SwissTransferTheme.colors.navigationItemBackground,
-            navigationDrawerContainerColor = SwissTransferTheme.colors.navigationItemBackground,
-        ),
-        layoutType = navType,
-        content = {
-            if (navType == NavigationSuiteType.None) {
-                content()
-            } else {
-                Column {
-                    Box(modifier = Modifier.weight(1f)) {
-                        content()
-                    }
-                    HorizontalDivider(color = SwissTransferTheme.colors.divider)
+    AppNavigationSuiteScaffold(navType, NavigationItem.entries, currentDestination, navigateToSelectedItem) {
+        if (navType == NavigationSuiteType.None) {
+            content()
+        } else {
+            Column {
+                Box(modifier = Modifier.weight(1f)) {
+                    content()
                 }
+                HorizontalDivider(color = SwissTransferTheme.colors.divider)
             }
-        },
-    )
-}
-
-@Composable
-private fun NavigationIcon(isNavigationBar: Boolean, navigationItem: NavigationItem) {
-    val contentDescription = if (isNavigationBar) null else stringResource(navigationItem.label)
-    Icon(navigationItem.icon, contentDescription)
-}
-
-@Composable
-private fun NavigationLabel(isNavigationBar: Boolean, navigationItem: NavigationItem) {
-    if (isNavigationBar) {
-        Text(stringResource(navigationItem.label))
+        }
     }
 }
 

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

@@ -0,0 +1,145 @@
+/*
+ * 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.*
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Add
+import androidx.compose.material3.*
+import androidx.compose.material3.adaptive.navigationsuite.NavigationSuite
+import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteScaffold
+import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteScaffoldLayout
+import androidx.compose.material3.adaptive.navigationsuite.NavigationSuiteType
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import com.infomaniak.swisstransfer.ui.navigation.MainNavigation
+import com.infomaniak.swisstransfer.ui.navigation.NavigationItem
+import com.infomaniak.swisstransfer.ui.theme.Margin
+import com.infomaniak.swisstransfer.ui.theme.SwissTransferTheme
+
+/**
+ * Layout for a [NavigationSuiteScaffold]'s content. This function wraps the [content] and places
+ * the [NavigationSuite] component according to the given [layoutType].
+ *
+ * @param layoutType The current [NavigationSuiteType]. It determines whether
+ * the app will use a bottom navigation bar ([NavigationSuiteType.NavigationBar])
+ * or a navigation rail ([NavigationSuiteType.NavigationRail]).
+ *
+ * @param navigationItems The navigation items to be displayed.
+ *
+ * @param currentDestination The current selected item in the navigation suite. It represents
+ * the active navigation item that the user is currently on, which will be highlighted or selected
+ * in the navigation UI.
+ *
+ * @param navigateToSelectedItem A lambda function that handles the navigation logic when a user
+ * selects a different item in the navigation suite. It receives the selected [MainNavigation]
+ * item and performs the necessary navigation.
+ *
+ * @param content The content of your screen
+ */
+@Composable
+fun AppNavigationSuiteScaffold(
+    layoutType: NavigationSuiteType,
+    navigationItems: List<NavigationItem>,
+    currentDestination: MainNavigation,
+    navigateToSelectedItem: (MainNavigation) -> Unit,
+    content: @Composable () -> Unit,
+) {
+    Surface(color = SwissTransferTheme.materialColors.background) {
+        NavigationSuiteScaffoldLayout(
+            navigationSuite = {
+                if (layoutType == NavigationSuiteType.NavigationBar) {
+                    AppNavigationBar(navigationItems, currentDestination, navigateToSelectedItem)
+                } else {
+                    AppNavigationRail(navigationItems, currentDestination, navigateToSelectedItem)
+                }
+            },
+            layoutType = layoutType,
+        ) {
+            Box(
+                Modifier.consumeWindowInsets(
+                    when (layoutType) {
+                        NavigationSuiteType.NavigationBar ->
+                            NavigationBarDefaults.windowInsets.only(WindowInsetsSides.Bottom)
+                        NavigationSuiteType.NavigationRail ->
+                            NavigationRailDefaults.windowInsets.only(WindowInsetsSides.Start)
+                        else -> WindowInsets(0, 0, 0, 0)
+                    }
+                )
+            ) {
+                content()
+            }
+        }
+    }
+}
+
+@Composable
+private fun AppNavigationBar(
+    navigationItems: List<NavigationItem>,
+    currentDestination: MainNavigation,
+    onClick: (MainNavigation) -> Unit,
+) {
+    NavigationBar(containerColor = SwissTransferTheme.colors.navigationItemBackground) {
+        navigationItems.forEach { navigationItem ->
+            NavigationBarItem(
+                icon = { NavigationIcon(true, navigationItem) },
+                label = { NavigationLabel(navigationItem) },
+                selected = currentDestination == navigationItem.destination,
+                onClick = { onClick(navigationItem.destination) },
+            )
+        }
+    }
+}
+
+@Composable
+private fun AppNavigationRail(
+    navigationItems: List<NavigationItem>,
+    currentDestination: MainNavigation,
+    onClick: (MainNavigation) -> Unit,
+) {
+    NavigationRail(
+        header = {
+            FloatingActionButton(onClick = {}, modifier = Modifier.padding(bottom = Margin.Large)) {
+                Icon(Icons.Default.Add, contentDescription = null)
+            }
+        },
+        containerColor = SwissTransferTheme.colors.navigationItemBackground
+    ) {
+        navigationItems.forEach { navigationItem ->
+            NavigationRailItem(
+                icon = { NavigationIcon(false, navigationItem) },
+                label = {},
+                selected = currentDestination == navigationItem.destination,
+                onClick = { onClick(navigationItem.destination) },
+            )
+        }
+    }
+}
+
+@Composable
+private fun NavigationIcon(isNavigationBar: Boolean, navigationItem: NavigationItem) {
+    val contentDescription = if (isNavigationBar) null else stringResource(navigationItem.label)
+    Icon(navigationItem.icon, contentDescription)
+}
+
+@Composable
+private fun NavigationLabel(navigationItem: NavigationItem) {
+    Text(stringResource(navigationItem.label))
+}