Cleaner UI

closes #182
2025-06-18 16:25:27 +02:00 · 2024-02-10 17:09:30 +03:00 · 2024-02-10 17:09:30 +03:00 · 80f1624748
commit 80f1624748
parent 7cbbb846af
21 changed files with 130 additions and 204 deletions
--- a/app/src/main/java/com/sadellie/unitto/App.kt
+++ b/app/src/main/java/com/sadellie/unitto/App.kt
@ -92,7 +92,8 @@ internal fun ComponentActivity.App(prefs: AppPreferences?) {
            modifier = Modifier,
            state = drawerState,
            gesturesEnabled = gesturesEnabled,
-            tabs = DrawerItem.main,
+            mainTabs = DrawerItem.main,
+            additionalTabs = DrawerItem.additional,
            currentDestination = navBackStackEntry?.destination?.route,
            onItemClick = { destination ->
                drawerScope.launch { drawerState.close() }
--- a/app/src/main/java/com/sadellie/unitto/UnittoNavigation.kt
+++ b/app/src/main/java/com/sadellie/unitto/UnittoNavigation.kt
@ -30,7 +30,6 @@ import com.sadellie.unitto.feature.bodymass.navigation.bodyMassGraph
 import com.sadellie.unitto.feature.calculator.navigation.calculatorGraph
 import com.sadellie.unitto.feature.converter.navigation.converterGraph
 import com.sadellie.unitto.feature.datecalculator.navigation.dateCalculatorGraph
-import com.sadellie.unitto.feature.settings.navigation.navigateToSettings
 import com.sadellie.unitto.feature.settings.navigation.navigateToUnitGroups
 import com.sadellie.unitto.feature.settings.navigation.settingGraph
 import com.sadellie.unitto.feature.timezone.navigation.timeZoneGraph
@ -48,39 +47,35 @@ internal fun UnittoNavigation(
        startDestination = startDestination,
        modifier = Modifier.background(MaterialTheme.colorScheme.background),
        enterTransition = { fadeIn() },
-        exitTransition = { fadeOut() }
+        exitTransition = { fadeOut() },
    ) {
+        calculatorGraph(
+            openDrawer = openDrawer,
+        )
+
        converterGraph(
            openDrawer = openDrawer,
            navController = navController,
-            navigateToSettings = navController::navigateToSettings,
-            navigateToUnitGroups = navController::navigateToUnitGroups
-        )
-
-        settingGraph(
-            themmoController = themmoController,
-            navController = navController
-        )
-
-        calculatorGraph(
-            openDrawer = openDrawer,
-            navigateToSettings = navController::navigateToSettings
+            navigateToUnitGroups = navController::navigateToUnitGroups,
        )

        dateCalculatorGraph(
-            navigateToMenu = openDrawer,
-            navigateToSettings = navController::navigateToSettings
+            openDrawer = openDrawer,
        )

        timeZoneGraph(
-            navigateToMenu = openDrawer,
-            navigateToSettings = navController::navigateToSettings,
+            openDrawer = openDrawer,
            navController = navController,
        )

        bodyMassGraph(
            openDrawer = openDrawer,
-            navigateToSettings = navController::navigateToSettings,
+        )
+
+        settingGraph(
+            openDrawer = openDrawer,
+            navController = navController,
+            themmoController = themmoController,
        )
    }
 }
--- a/core/ui/src/main/java/com/sadellie/unitto/core/ui/common/DrawerButton.kt
+++ b/core/ui/src/main/java/com/sadellie/unitto/core/ui/common/DrawerButton.kt
@ -27,16 +27,16 @@ import androidx.compose.ui.res.stringResource
 import com.sadellie.unitto.core.base.R

 /**
- * Button that is used in Top bars
+ * Button that is used in Top bars to open drawer.
 *
 * @param onClick Action to be called when button is clicked.
 */
@Composable
-fun MenuButton(onClick: () -> Unit) {
+fun DrawerButton(onClick: () -> Unit) {
    IconButton(onClick = onClick) {
        Icon(
-            Icons.Outlined.Menu,
-            contentDescription = stringResource(R.string.open_menu_description)
+            imageVector = Icons.Outlined.Menu,
+            contentDescription = stringResource(R.string.open_menu_description),
        )
    }
 }
--- a/core/ui/src/main/java/com/sadellie/unitto/core/ui/common/NavigationDrawer.kt
+++ b/core/ui/src/main/java/com/sadellie/unitto/core/ui/common/NavigationDrawer.kt
@ -111,7 +111,8 @@ fun NavigationDrawer(
    modifier: Modifier,
    gesturesEnabled: Boolean,
    state: DrawerState = rememberDrawerState(),
-    tabs: List<DrawerItem>,
+    mainTabs: List<DrawerItem>,
+    additionalTabs: List<DrawerItem>,
    currentDestination: String?,
    onItemClick: (DrawerItem) -> Unit,
    content: @Composable () -> Unit,
@ -126,7 +127,8 @@ fun NavigationDrawer(
                        .verticalScroll(rememberScrollState())
                ) {
                    SheetContent(
-                        tabs = tabs,
+                        mainTabs = mainTabs,
+                        additionalTabs = additionalTabs,
                        currentDestination = currentDestination,
                        onItemClick = onItemClick
                    )
@ -144,7 +146,8 @@ fun NavigationDrawer(
                        .verticalScroll(rememberScrollState())
                ) {
                    SheetContent(
-                        tabs = tabs,
+                        mainTabs = mainTabs,
+                        additionalTabs = additionalTabs,
                        currentDestination = currentDestination,
                        onItemClick = onItemClick
                    )
@ -279,7 +282,8 @@ private fun PreviewUnittoModalNavigationDrawerClose() {
        modifier = Modifier,
        state = drawerState,
        gesturesEnabled = true,
-        tabs = DrawerItem.main,
+        mainTabs = DrawerItem.main,
+        additionalTabs = DrawerItem.additional,
        currentDestination = DrawerItem.Calculator.start,
        onItemClick = {},
        content = {
--- a/core/ui/src/main/java/com/sadellie/unitto/core/ui/common/ScaffoldWithTopBar.kt
+++ b/core/ui/src/main/java/com/sadellie/unitto/core/ui/common/ScaffoldWithTopBar.kt
@ -71,7 +71,11 @@ fun ScaffoldWithTopBar(
            ) {
                CenterAlignedTopAppBar(
                    title = title,
-                    navigationIcon = if (LocalWindowSize.current.widthSizeClass != WindowWidthSizeClass.Expanded) navigationIcon else { {} },
+                    navigationIcon = {
+                        if (LocalWindowSize.current.widthSizeClass != WindowWidthSizeClass.Expanded) {
+                            navigationIcon()
+                        }
+                    },
                    actions = actions,
                    colors = colors,
                    scrollBehavior = scrollBehavior,
--- a/core/ui/src/main/java/com/sadellie/unitto/core/ui/common/SettingsButton.kt
+++ b/core/ui/src/main/java/com/sadellie/unitto/core/ui/common/SettingsButton.kt
@ -1,34 +0,0 @@
-/*
- * Unitto is a calculator for Android
- * Copyright (c) 2023-2024 Elshan Agaev
- *
- * 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 <https://www.gnu.org/licenses/>.
- */
-
-package com.sadellie.unitto.core.ui.common
-
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Settings
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.res.stringResource
-import com.sadellie.unitto.core.base.R
-
-@Composable
-fun SettingsButton(onClick: () -> Unit) {
-    IconButton(onClick) {
-        Icon(Icons.Outlined.Settings, stringResource(R.string.open_settings_label))
-    }
-}
--- a/core/ui/src/main/java/com/sadellie/unitto/core/ui/common/SheetContent.kt
+++ b/core/ui/src/main/java/com/sadellie/unitto/core/ui/common/SheetContent.kt
@ -39,15 +39,14 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.sadellie.unitto.core.base.R
-import com.sadellie.unitto.core.ui.LocalWindowSize
-import com.sadellie.unitto.core.ui.WindowHeightSizeClass
 import com.sadellie.unitto.core.ui.model.DrawerItem
 import kotlinx.coroutines.delay

@Suppress("UnusedReceiverParameter")
@Composable
 internal fun ColumnScope.SheetContent(
-    tabs: List<DrawerItem>,
+    mainTabs: List<DrawerItem>,
+    additionalTabs: List<DrawerItem>,
    currentDestination: String?,
    onItemClick: (DrawerItem) -> Unit,
 ) {
@ -79,7 +78,7 @@ internal fun ColumnScope.SheetContent(
        )
    }

-    tabs.forEach { drawerItem ->
+    mainTabs.forEach { drawerItem ->
        val selected = drawerItem.start == currentDestination
        DrawerItem(
            modifier = Modifier.padding(NavigationDrawerItemDefaults.ItemPadding),
@ -90,15 +89,15 @@ internal fun ColumnScope.SheetContent(
        )
    }

-    // Top bar (and settings button in it) is not visible for compact height
-    if (LocalWindowSize.current.heightSizeClass == WindowHeightSizeClass.Compact) {
    HorizontalDivider(Modifier.padding(horizontal = 12.dp, vertical = 8.dp))

+    additionalTabs.forEach { drawerItem ->
+        val selected = drawerItem.start == currentDestination
        DrawerItem(
            modifier = Modifier.padding(NavigationDrawerItemDefaults.ItemPadding),
-            destination = DrawerItem.Settings,
-            icon = DrawerItem.Settings.defaultIcon,
-            selected = false,
+            destination = drawerItem,
+            icon = if (selected) drawerItem.selectedIcon else drawerItem.defaultIcon,
+            selected = selected,
            onClick = onItemClick
        )
    }
@ -109,7 +108,12 @@ internal fun ColumnScope.SheetContent(
 private fun PreviewDrawerSheet() {
    Column {
        SheetContent(
-            tabs = listOf(
+            mainTabs = listOf(
+                DrawerItem.Calculator,
+                DrawerItem.Calculator,
+                DrawerItem.Calculator,
+            ),
+            additionalTabs = listOf(
                DrawerItem.Calculator,
                DrawerItem.Calculator,
                DrawerItem.Calculator,
--- a/core/ui/src/main/java/com/sadellie/unitto/core/ui/model/DrawerItem.kt
+++ b/core/ui/src/main/java/com/sadellie/unitto/core/ui/model/DrawerItem.kt
@ -139,7 +139,9 @@ sealed class DrawerItem(
            all
        }

+        val additional = listOf(Settings)
+
        // Only routes, not graphs!
-        val startRoutes by lazy { main.map { it.start } }
+        val startRoutes by lazy { (main + additional).map { it.start } }
    }
 }
--- a/feature/bodymass/src/main/java/com/sadellie/unitto/feature/bodymass/BodyMassScreen.kt
+++ b/feature/bodymass/src/main/java/com/sadellie/unitto/feature/bodymass/BodyMassScreen.kt
@ -50,12 +50,11 @@ import androidx.compose.ui.unit.dp
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.sadellie.unitto.core.base.R
+import com.sadellie.unitto.core.ui.common.DrawerButton
 import com.sadellie.unitto.core.ui.common.EmptyScreen
-import com.sadellie.unitto.core.ui.common.MenuButton
 import com.sadellie.unitto.core.ui.common.ScaffoldWithTopBar
 import com.sadellie.unitto.core.ui.common.SegmentedButton
 import com.sadellie.unitto.core.ui.common.SegmentedButtonsRow
-import com.sadellie.unitto.core.ui.common.SettingsButton
 import com.sadellie.unitto.core.ui.common.textfield.ExpressionTransformer
 import com.sadellie.unitto.core.ui.common.textfield.FormatterSymbols
 import com.sadellie.unitto.core.ui.openLink
@ -67,8 +66,7 @@ import java.math.BigDecimal
@Composable
 internal fun BodyMassRoute(
    openDrawer: () -> Unit,
-    navigateToSettings: () -> Unit,
-    viewModel: BodyMassViewModel = hiltViewModel()
+    viewModel: BodyMassViewModel = hiltViewModel(),
 ) {
    when (val uiState = viewModel.uiState.collectAsStateWithLifecycle().value) {
        UIState.Loading -> EmptyScreen()
@ -79,7 +77,6 @@ internal fun BodyMassRoute(
            updateWeight = viewModel::updateWeight,
            updateIsMetric = viewModel::updateIsMetric,
            openDrawer = openDrawer,
-            navigateToSettings = navigateToSettings
        )
    }
 }
@ -92,7 +89,6 @@ private fun BodyMassScreen(
    updateWeight: (TextFieldValue) -> Unit,
    updateIsMetric: (Boolean) -> Unit,
    openDrawer: () -> Unit,
-    navigateToSettings: () -> Unit,
 ) {
    val mContext = LocalContext.current
    val expressionTransformer = remember(uiState.formatterSymbols) {
@ -106,8 +102,7 @@ private fun BodyMassScreen(

    ScaffoldWithTopBar(
        title = { Text(stringResource(R.string.body_mass_title)) },
-        navigationIcon = { MenuButton(openDrawer) },
-        actions = { SettingsButton(navigateToSettings) }
+        navigationIcon = { DrawerButton(openDrawer) },
    ) { paddingValues ->
        Column(
            modifier = Modifier
@ -235,6 +230,5 @@ fun PreviewBodyMassScreen() {
        updateWeight = {},
        updateIsMetric = {},
        openDrawer = {},
-        navigateToSettings = {}
    )
 }
--- a/feature/bodymass/src/main/java/com/sadellie/unitto/feature/bodymass/navigation/Navigation.kt
+++ b/feature/bodymass/src/main/java/com/sadellie/unitto/feature/bodymass/navigation/Navigation.kt
@ -30,7 +30,6 @@ private val start = DrawerItem.BodyMass.start

 fun NavGraphBuilder.bodyMassGraph(
    openDrawer: () -> Unit,
-    navigateToSettings: () -> Unit
 ) {
    unittoNavigation(
        startDestination = start,
@ -42,7 +41,6 @@ fun NavGraphBuilder.bodyMassGraph(
        unittoComposable(start) {
            BodyMassRoute(
                openDrawer = openDrawer,
-                navigateToSettings = navigateToSettings
            )
        }
    }
--- a/feature/calculator/src/androidTest/java/com/sadellie/unitto/feature/calculator/CalculatorScreenTest.kt
+++ b/feature/calculator/src/androidTest/java/com/sadellie/unitto/feature/calculator/CalculatorScreenTest.kt
@ -41,16 +41,15 @@ class CalculatorScreenTest {
        setContent {
            CalculatorScreen(
                uiState = CalculatorUIState.Loading,
-                navigateToMenu = {},
-                navigateToSettings = {},
+                openDrawer = {},
                addTokens = {},
+                addBracket = {},
                clearInput = {},
                deleteTokens = {},
                onValueChange = {},
                toggleCalculatorMode = {},
                equal = {},
                clearHistory = {},
-                addBracket = {},
                onDelete = {},
            )
        }
@ -74,16 +73,15 @@ class CalculatorScreenTest {
                    acButton = true,
                    partialHistoryView = true
                ),
-                navigateToMenu = {},
-                navigateToSettings = {},
+                openDrawer = {},
                addTokens = {},
+                addBracket = {},
                clearInput = {},
                deleteTokens = {},
                onValueChange = {},
                toggleCalculatorMode = {},
                equal = {},
                clearHistory = {},
-                addBracket = {},
                onDelete = {},
            )
        }
@ -108,16 +106,15 @@ class CalculatorScreenTest {
                    acButton = true,
                    partialHistoryView = true
                ),
-                navigateToMenu = {},
-                navigateToSettings = {},
+                openDrawer = {},
                addTokens = {},
+                addBracket = {},
                clearInput = {},
                deleteTokens = {},
                onValueChange = {},
                toggleCalculatorMode = {},
                equal = {},
                clearHistory = {},
-                addBracket = {},
                onDelete = {},
            )
        }
--- a/feature/calculator/src/main/java/com/sadellie/unitto/feature/calculator/CalculatorScreen.kt
+++ b/feature/calculator/src/main/java/com/sadellie/unitto/feature/calculator/CalculatorScreen.kt
@ -19,7 +19,7 @@
 package com.sadellie.unitto.feature.calculator

 import androidx.activity.compose.BackHandler
-import androidx.compose.animation.Crossfade
+import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.core.tween
 import androidx.compose.foundation.background
 import androidx.compose.foundation.gestures.AnchoredDraggableState
@ -66,10 +66,9 @@ import com.sadellie.unitto.core.base.OutputFormat
 import com.sadellie.unitto.core.base.R
 import com.sadellie.unitto.core.ui.LocalWindowSize
 import com.sadellie.unitto.core.ui.WindowHeightSizeClass
+import com.sadellie.unitto.core.ui.common.DrawerButton
 import com.sadellie.unitto.core.ui.common.EmptyScreen
-import com.sadellie.unitto.core.ui.common.MenuButton
 import com.sadellie.unitto.core.ui.common.ScaffoldWithTopBar
-import com.sadellie.unitto.core.ui.common.SettingsButton
 import com.sadellie.unitto.core.ui.common.textfield.FormatterSymbols
 import com.sadellie.unitto.data.model.HistoryItem
 import com.sadellie.unitto.feature.calculator.components.CalculatorKeyboard
@ -83,24 +82,22 @@ import kotlin.math.roundToInt

@Composable
 internal fun CalculatorRoute(
-    navigateToMenu: () -> Unit,
-    navigateToSettings: () -> Unit,
-    viewModel: CalculatorViewModel = hiltViewModel()
+    openDrawer: () -> Unit,
+    viewModel: CalculatorViewModel = hiltViewModel(),
 ) {
    val uiState = viewModel.uiState.collectAsStateWithLifecycle()

    CalculatorScreen(
        uiState = uiState.value,
-        navigateToMenu = navigateToMenu,
-        navigateToSettings = navigateToSettings,
+        openDrawer = openDrawer,
        addTokens = viewModel::addTokens,
+        addBracket = viewModel::addBracket,
        clearInput = viewModel::clearInput,
        deleteTokens = viewModel::deleteTokens,
        onValueChange = viewModel::updateInput,
        toggleCalculatorMode = viewModel::updateRadianMode,
        equal = viewModel::equal,
        clearHistory = viewModel::clearHistory,
-        addBracket = viewModel::addBracket,
        onDelete = viewModel::deleteHistoryItem,
    )
 }
@ -108,8 +105,7 @@ internal fun CalculatorRoute(
@Composable
 internal fun CalculatorScreen(
    uiState: CalculatorUIState,
-    navigateToMenu: () -> Unit,
-    navigateToSettings: () -> Unit,
+    openDrawer: () -> Unit,
    addTokens: (String) -> Unit,
    addBracket: () -> Unit,
    clearInput: () -> Unit,
@ -124,16 +120,15 @@ internal fun CalculatorScreen(
        is CalculatorUIState.Loading -> EmptyScreen()
        is CalculatorUIState.Ready -> Ready(
            uiState = uiState,
-            navigateToMenu = navigateToMenu,
-            navigateToSettings = navigateToSettings,
+            openDrawer = openDrawer,
            addSymbol = addTokens,
+            addBracket = addBracket,
            clearSymbols = clearInput,
            deleteSymbol = deleteTokens,
            onValueChange = onValueChange,
            toggleAngleMode = { toggleCalculatorMode(!uiState.radianMode) },
            equal = equal,
            clearHistory = clearHistory,
-            addBracket = addBracket,
            onDelete = onDelete,
        )
    }
@ -142,8 +137,7 @@ internal fun CalculatorScreen(
@Composable
 private fun Ready(
    uiState: CalculatorUIState.Ready,
-    navigateToMenu: () -> Unit,
-    navigateToSettings: () -> Unit,
+    openDrawer: () -> Unit,
    addSymbol: (String) -> Unit,
    addBracket: () -> Unit,
    clearSymbols: () -> Unit,
@ -167,12 +161,11 @@ private fun Ready(
    val isOpen = dragState.currentValue == DragState.OPEN

    ScaffoldWithTopBar(
-        title = { Text(stringResource(R.string.calculator_title)) },
-        navigationIcon = { MenuButton { navigateToMenu() } },
+        title = {},
+        navigationIcon = { DrawerButton { openDrawer() } },
        colors = TopAppBarDefaults.topAppBarColors(MaterialTheme.colorScheme.surfaceVariant),
        actions = {
-            Crossfade(isOpen, label = "Clear button reveal") {
-                if (it) {
+            AnimatedVisibility(isOpen, label = "Clear button reveal") {
                IconButton(
                    onClick = { showClearHistoryDialog = true },
                    content = {
@ -183,9 +176,6 @@ private fun Ready(
                    },
                    modifier = Modifier.semantics { testTag = "historyButton" }
                )
-                } else {
-                    SettingsButton(navigateToSettings)
-                }
            }
        }
    ) { paddingValues ->
@ -371,16 +361,15 @@ private fun PreviewCalculatorScreen() {
            acButton = true,
            partialHistoryView = true
        ),
-        navigateToMenu = {},
-        navigateToSettings = {},
+        openDrawer = {},
        addTokens = {},
+        addBracket = {},
        clearInput = {},
        deleteTokens = {},
        onValueChange = {},
        toggleCalculatorMode = {},
        equal = {},
        clearHistory = {},
-        addBracket = {},
        onDelete = {},
    )
 }
--- a/feature/calculator/src/main/java/com/sadellie/unitto/feature/calculator/navigation/CalculatorNavigation.kt
+++ b/feature/calculator/src/main/java/com/sadellie/unitto/feature/calculator/navigation/CalculatorNavigation.kt
@ -30,7 +30,6 @@ private val start = DrawerItem.Calculator.start

 fun NavGraphBuilder.calculatorGraph(
    openDrawer: () -> Unit,
-    navigateToSettings: () -> Unit
 ) {
    unittoNavigation(
        startDestination = start,
@ -41,8 +40,7 @@ fun NavGraphBuilder.calculatorGraph(
    ) {
        unittoComposable(start) {
            CalculatorRoute(
-                navigateToMenu = openDrawer,
-                navigateToSettings = navigateToSettings
+                openDrawer = openDrawer,
            )
        }
    }
--- a/feature/converter/src/main/java/com/sadellie/unitto/feature/converter/ConverterScreen.kt
+++ b/feature/converter/src/main/java/com/sadellie/unitto/feature/converter/ConverterScreen.kt
@ -75,11 +75,10 @@ import com.sadellie.unitto.core.base.R
 import com.sadellie.unitto.core.base.Token
 import com.sadellie.unitto.core.ui.LocalLocale
 import com.sadellie.unitto.core.ui.common.ColumnWithConstraints
+import com.sadellie.unitto.core.ui.common.DrawerButton
 import com.sadellie.unitto.core.ui.common.EmptyScreen
-import com.sadellie.unitto.core.ui.common.MenuButton
 import com.sadellie.unitto.core.ui.common.PortraitLandscape
 import com.sadellie.unitto.core.ui.common.ScaffoldWithTopBar
-import com.sadellie.unitto.core.ui.common.SettingsButton
 import com.sadellie.unitto.core.ui.common.textfield.ExpressionTextField
 import com.sadellie.unitto.core.ui.common.textfield.FormatterSymbols
 import com.sadellie.unitto.core.ui.common.textfield.NumberBaseTextField
@ -99,8 +98,7 @@ internal fun ConverterRoute(
    viewModel: ConverterViewModel = hiltViewModel(),
    navigateToLeftScreen: (uiState: UnitConverterUIState) -> Unit,
    navigateToRightScreen: (uiState: UnitConverterUIState) -> Unit,
-    navigateToMenu: () -> Unit,
-    navigateToSettings: () -> Unit,
+    openDrawer: () -> Unit,
 ) {
    val uiState = viewModel.converterUiState.collectAsStateWithLifecycle()

@ -108,8 +106,7 @@ internal fun ConverterRoute(
        uiState = uiState.value,
        navigateToLeftScreen = navigateToLeftScreen,
        navigateToRightScreen = navigateToRightScreen,
-        navigateToSettings = navigateToSettings,
-        navigateToMenu = navigateToMenu,
+        openDrawer = openDrawer,
        swapUnits = viewModel::swapUnits,
        processInput = viewModel::addTokens,
        deleteDigit = viewModel::deleteTokens,
@ -126,8 +123,7 @@ private fun ConverterScreen(
    uiState: UnitConverterUIState,
    navigateToLeftScreen: (uiState: UnitConverterUIState) -> Unit,
    navigateToRightScreen: (uiState: UnitConverterUIState) -> Unit,
-    navigateToSettings: () -> Unit,
-    navigateToMenu: () -> Unit,
+    openDrawer: () -> Unit,
    swapUnits: () -> Unit,
    processInput: (String) -> Unit,
    deleteDigit: () -> Unit,
@ -142,8 +138,7 @@ private fun ConverterScreen(

        is UnitConverterUIState.NumberBase -> {
            UnitConverterTopBar(
-                navigateToMenu = navigateToMenu,
-                navigateToSettings = navigateToSettings
+                openDrawer = openDrawer,
            ) {
                NumberBase(
                    modifier = Modifier.padding(it),
@ -161,8 +156,7 @@ private fun ConverterScreen(

        is UnitConverterUIState.Default -> {
            UnitConverterTopBar(
-                navigateToMenu = navigateToMenu,
-                navigateToSettings = navigateToSettings
+                openDrawer = openDrawer,
            ) {
                Default(
                    modifier = Modifier.padding(it),
@ -185,16 +179,12 @@ private fun ConverterScreen(

@Composable
 private fun UnitConverterTopBar(
-    navigateToMenu: () -> Unit,
-    navigateToSettings: () -> Unit,
+    openDrawer: () -> Unit,
    content: @Composable (PaddingValues) -> Unit
 ) {
    ScaffoldWithTopBar(
-        title = { Text(stringResource(R.string.unit_converter_title)) },
-        navigationIcon = { MenuButton { navigateToMenu() } },
-        actions = {
-            SettingsButton(navigateToSettings)
-        },
+        title = {},
+        navigationIcon = { DrawerButton { openDrawer() } },
        colors = TopAppBarDefaults.centerAlignedTopAppBarColors(containerColor = Color.Transparent),
        content = { content(it) }
    )
@ -584,8 +574,7 @@ private fun PreviewConverterScreen() {
        uiState = UnitConverterUIState.Loading,
        navigateToLeftScreen = {},
        navigateToRightScreen = {},
-        navigateToSettings = {},
-        navigateToMenu = {},
+        openDrawer = {},
        swapUnits = {},
        processInput = {},
        deleteDigit = {},
@ -593,6 +582,6 @@ private fun PreviewConverterScreen() {
        onValueChange = {},
        onFocusOnInput2 = {},
        onErrorClick = {},
-        addBracket = {}
+        addBracket = {},
    )
 }
--- a/feature/converter/src/main/java/com/sadellie/unitto/feature/converter/navigation/ConverterNavigation.kt
+++ b/feature/converter/src/main/java/com/sadellie/unitto/feature/converter/navigation/ConverterNavigation.kt
@ -62,7 +62,6 @@ private fun NavHostController.navigateRight(
 fun NavGraphBuilder.converterGraph(
    openDrawer: () -> Unit,
    navController: NavHostController,
-    navigateToSettings: () -> Unit,
    navigateToUnitGroups: () -> Unit,
 ) {
    unittoNavigation(
@ -127,8 +126,7 @@ fun NavGraphBuilder.converterGraph(
                        UnitConverterUIState.Loading -> Unit
                    }
                },
-                navigateToSettings = navigateToSettings,
-                navigateToMenu = openDrawer
+                openDrawer = openDrawer,
            )
        }

--- a/feature/datecalculator/src/main/java/com/sadellie/unitto/feature/datecalculator/DateCalculatorScreen.kt
+++ b/feature/datecalculator/src/main/java/com/sadellie/unitto/feature/datecalculator/DateCalculatorScreen.kt
@ -35,8 +35,7 @@ import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import com.sadellie.unitto.core.base.R
-import com.sadellie.unitto.core.ui.common.MenuButton
-import com.sadellie.unitto.core.ui.common.SettingsButton
+import com.sadellie.unitto.core.ui.common.DrawerButton
 import com.sadellie.unitto.core.ui.common.ScaffoldWithTopBar
 import com.sadellie.unitto.feature.datecalculator.addsubtract.AddSubtractPage
 import com.sadellie.unitto.feature.datecalculator.difference.DateDifferencePage
@ -44,19 +43,16 @@ import kotlinx.coroutines.launch

@Composable
 internal fun DateCalculatorRoute(
-    navigateToMenu: () -> Unit,
-    navigateToSettings: () -> Unit,
+    openDrawer: () -> Unit,
 ) {
    DateCalculatorScreen(
-        navigateToMenu = navigateToMenu,
-        navigateToSettings = navigateToSettings,
+        openDrawer = openDrawer,
    )
 }

@Composable
 internal fun DateCalculatorScreen(
-    navigateToMenu: () -> Unit,
-    navigateToSettings: () -> Unit,
+    openDrawer: () -> Unit,
 ) {
    val addSubtractLabel = "${stringResource(R.string.date_calculator_add)}/${stringResource(R.string.date_calculator_subtract)}"
    val differenceLabel = stringResource(R.string.date_calculator_difference)
@ -69,8 +65,7 @@ internal fun DateCalculatorScreen(
    ScaffoldWithTopBar(
        modifier = Modifier,
        title = { Text(stringResource(R.string.date_calculator_title)) },
-        navigationIcon = { MenuButton(navigateToMenu) },
-        actions = { SettingsButton(navigateToSettings) },
+        navigationIcon = { DrawerButton(openDrawer) },
    ) { paddingValues ->
        Column(
            modifier = Modifier.padding(paddingValues),
@ -111,7 +106,6 @@ internal fun DateCalculatorScreen(
@Composable
 private fun DateCalculatorScreenPreview() {
    DateCalculatorScreen(
-        navigateToMenu = {},
-        navigateToSettings = {},
+        openDrawer = {},
    )
 }
--- a/feature/datecalculator/src/main/java/com/sadellie/unitto/feature/datecalculator/navigation/DateCalculatorNavigation.kt
+++ b/feature/datecalculator/src/main/java/com/sadellie/unitto/feature/datecalculator/navigation/DateCalculatorNavigation.kt
@ -29,8 +29,7 @@ private val graph = DrawerItem.DateCalculator.graph
 private val start = DrawerItem.DateCalculator.start

 fun NavGraphBuilder.dateCalculatorGraph(
-    navigateToMenu: () -> Unit,
-    navigateToSettings: () -> Unit
+    openDrawer: () -> Unit,
 ) {
    unittoNavigation(
        startDestination = start,
@ -41,8 +40,7 @@ fun NavGraphBuilder.dateCalculatorGraph(
    ) {
        unittoComposable(start) {
            DateCalculatorRoute(
-                navigateToMenu = navigateToMenu,
-                navigateToSettings = navigateToSettings
+                openDrawer = openDrawer,
            )
        }
    }
--- a/feature/settings/src/main/java/com/sadellie/unitto/feature/settings/SettingsScreen.kt
+++ b/feature/settings/src/main/java/com/sadellie/unitto/feature/settings/SettingsScreen.kt
@ -75,10 +75,12 @@ import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.sadellie.unitto.core.base.BuildConfig
 import com.sadellie.unitto.core.base.R
+import com.sadellie.unitto.core.ui.LocalWindowSize
+import com.sadellie.unitto.core.ui.WindowWidthSizeClass
 import com.sadellie.unitto.core.ui.common.EmptyScreen
 import com.sadellie.unitto.core.ui.common.Header
 import com.sadellie.unitto.core.ui.common.ListItem
-import com.sadellie.unitto.core.ui.common.NavigateUpButton
+import com.sadellie.unitto.core.ui.common.DrawerButton
 import com.sadellie.unitto.core.ui.common.ScaffoldWithLargeTopBar
 import com.sadellie.unitto.core.ui.openLink
 import com.sadellie.unitto.core.ui.showToast
@ -97,7 +99,7 @@ import java.time.format.DateTimeFormatter
@Composable
 internal fun SettingsRoute(
    viewModel: SettingsViewModel = hiltViewModel(),
-    navigateUp: () -> Unit,
+    openDrawer: () -> Unit,
    navControllerAction: (String) -> Unit,
 ) {
    val mContext = LocalContext.current
@ -115,7 +117,7 @@ internal fun SettingsRoute(

        is SettingsUIState.Ready -> SettingsScreen(
            uiState = uiState,
-            navigateUp = navigateUp,
+            openDrawer = openDrawer,
            navControllerAction = navControllerAction,
            updateLastReadChangelog = viewModel::updateLastReadChangelog,
            updateVibrations = viewModel::updateVibrations,
@ -129,7 +131,7 @@ internal fun SettingsRoute(
@Composable
 private fun SettingsScreen(
    uiState: SettingsUIState.Ready,
-    navigateUp: () -> Unit,
+    openDrawer: () -> Unit,
    navControllerAction: (String) -> Unit,
    updateLastReadChangelog: (String) -> Unit,
    updateVibrations: (Boolean) -> Unit,
@ -158,7 +160,11 @@ private fun SettingsScreen(

    ScaffoldWithLargeTopBar(
        title = stringResource(R.string.settings_title),
-        navigationIcon = { NavigateUpButton(navigateUp) },
+        navigationIcon = {
+            if (LocalWindowSize.current.widthSizeClass != WindowWidthSizeClass.Expanded) {
+                DrawerButton(openDrawer)
+            }
+         },
        actions = {
            IconButton(
                onClick = { showMenu = !showMenu },
@ -336,7 +342,7 @@ private fun PreviewSettingsScreen() {

    SettingsScreen(
        uiState = uiState,
-        navigateUp = {},
+        openDrawer = {},
        navControllerAction = {},
        updateLastReadChangelog = {
            uiState = uiState.copy(showUpdateChangelog = false)
--- a/feature/settings/src/main/java/com/sadellie/unitto/feature/settings/navigation/SettingsNavigation.kt
+++ b/feature/settings/src/main/java/com/sadellie/unitto/feature/settings/navigation/SettingsNavigation.kt
@ -51,17 +51,14 @@ internal const val calculatorSettingsRoute = "calculator_settings_route"
 internal const val converterSettingsRoute = "converter_settings_route"
 internal const val bouncingEmoji = "bouncing_emoji_route"

-fun NavController.navigateToSettings() {
-    navigate(DrawerItem.Settings.start)
-}
-
 fun NavController.navigateToUnitGroups() {
    navigate(unitsGroupRoute)
 }

 fun NavGraphBuilder.settingGraph(
-    themmoController: ThemmoController,
+    openDrawer: () -> Unit,
    navController: NavHostController,
+    themmoController: ThemmoController,
 ) {
    unittoNavigation(
        startDestination = start,
@ -72,7 +69,7 @@ fun NavGraphBuilder.settingGraph(
    ) {
        unittoStackedComposable(start) {
            SettingsRoute(
-                navigateUp = navController::navigateUp,
+                openDrawer = openDrawer,
                navControllerAction = navController::navigate
            )
        }
--- a/feature/timezone/src/main/java/com/sadellie/unitto/feature/timezone/TimeZoneScreen.kt
+++ b/feature/timezone/src/main/java/com/sadellie/unitto/feature/timezone/TimeZoneScreen.kt
@ -73,8 +73,7 @@ import androidx.compose.ui.unit.dp
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.sadellie.unitto.core.base.R
-import com.sadellie.unitto.core.ui.common.MenuButton
-import com.sadellie.unitto.core.ui.common.SettingsButton
+import com.sadellie.unitto.core.ui.common.DrawerButton
 import com.sadellie.unitto.core.ui.common.EmptyScreen
 import com.sadellie.unitto.core.ui.common.ScaffoldWithTopBar
 import com.sadellie.unitto.core.ui.common.datetimepicker.TimePickerDialog
@ -94,8 +93,7 @@ import java.time.ZonedDateTime
@Composable
 internal fun TimeZoneRoute(
    viewModel: TimeZoneViewModel = hiltViewModel(),
-    openMenu: () -> Unit,
-    navigateToSettings: () -> Unit,
+    openDrawer: () -> Unit,
    navigateToAddTimeZone: (ZonedDateTime) -> Unit,
 ) {
    when (val uiState = viewModel.uiState.collectAsStateWithLifecycle().value) {
@ -103,8 +101,7 @@ internal fun TimeZoneRoute(
        is TimeZoneUIState.Ready -> {
            TimeZoneScreen(
                uiState = uiState,
-                openMenu = openMenu,
-                navigateToSettings = navigateToSettings,
+                openDrawer = openDrawer,
                navigateToAddTimeZone = navigateToAddTimeZone,
                setCurrentTime = viewModel::setCurrentTime,
                setSelectedTime = viewModel::setSelectedTime,
@ -122,8 +119,7 @@ internal fun TimeZoneRoute(
@Composable
 private fun TimeZoneScreen(
    uiState: TimeZoneUIState.Ready,
-    openMenu: () -> Unit,
-    navigateToSettings: () -> Unit,
+    openDrawer: () -> Unit,
    navigateToAddTimeZone: (ZonedDateTime) -> Unit,
    setCurrentTime: () -> Unit,
    setSelectedTime: (ZonedDateTime) -> Unit,
@ -179,8 +175,7 @@ private fun TimeZoneScreen(

    ScaffoldWithTopBar(
        title = { Text(stringResource(R.string.time_zone_title)) },
-        navigationIcon = { MenuButton(openMenu) },
-        actions = { SettingsButton(navigateToSettings) },
+        navigationIcon = { DrawerButton(openDrawer) },
        floatingActionButton = {
            LargeFloatingActionButton(
                onClick = {
@ -366,8 +361,7 @@ fun PreviewTimeZoneScreen() {
            selectedTimeZone = null,
            dialogState = TimeZoneDialogState.Nothing
        ),
-        openMenu = {},
-        navigateToSettings = {},
+        openDrawer = {},
        navigateToAddTimeZone = {},
        setCurrentTime = {},
        setSelectedTime = {},
@ -375,6 +369,6 @@ fun PreviewTimeZoneScreen() {
        delete = {},
        updateLabel = { _, _ -> },
        selectTimeZone = {},
-        setDialogState = {}
+        setDialogState = {},
    )
 }
--- a/feature/timezone/src/main/java/com/sadellie/unitto/feature/timezone/navigation/TimeZoneNavigation.kt
+++ b/feature/timezone/src/main/java/com/sadellie/unitto/feature/timezone/navigation/TimeZoneNavigation.kt
@ -50,8 +50,7 @@ private fun NavController.navigateToAddTimeZone(
 }

 fun NavGraphBuilder.timeZoneGraph(
-    navigateToMenu: () -> Unit,
-    navigateToSettings: () -> Unit,
+    openDrawer: () -> Unit,
    navController: NavHostController,
 ) {
    unittoNavigation(
@ -68,8 +67,7 @@ fun NavGraphBuilder.timeZoneGraph(
            }

            TimeZoneRoute(
-                openMenu = navigateToMenu,
-                navigateToSettings = navigateToSettings,
+                openDrawer = openDrawer,
                navigateToAddTimeZone = navController::navigateToAddTimeZone
            )
        }