update: toolbar with menu button

.idea/deviceManager.xml

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="DeviceTable">
+    <option name="columnSorters">
+      <list>
+        <ColumnSorterState>
+          <option name="column" value="Name" />
+          <option name="order" value="ASCENDING" />
+        </ColumnSorterState>
+      </list>
+    </option>
+  </component>
+</project>

app/build.gradle.kts

@@ -50,9 +50,11 @@ dependencies {
     implementation(libs.androidx.compose.material3)
     implementation(libs.androidx.compose.ui)
     implementation(libs.androidx.compose.ui.graphics)
+    implementation(libs.androidx.compose.ui.text)
     implementation(libs.androidx.compose.ui.tooling.preview)
     implementation(libs.androidx.core.ktx)
     implementation(libs.androidx.lifecycle.runtime.ktx)
+    implementation(libs.androidx.material3)
     implementation(libs.androidx.navigation.compose)
     testImplementation(libs.junit)
     androidTestImplementation(platform(libs.androidx.compose.bom))
@@ -63,6 +65,8 @@ dependencies {
     debugImplementation(libs.androidx.compose.ui.tooling)
 
     // Hilt
+    implementation(libs.androidx.hilt.navigation.compose) // for viewmodel injection
+
     implementation(libs.hilt.android)
     ksp(libs.hilt.android.compiler)
 
@@ -73,4 +77,7 @@ dependencies {
     ksp(libs.dagger.compiler)
 
     implementation(libs.kotlinx.serialization.json)
+
+    // Material icons
+    implementation(libs.androidx.compose.material.icons.extended)
 }

app/src/main/java/app/odweta/medilarm/activities/MainActivity.kt

@@ -4,6 +4,7 @@ import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
+import androidx.activity.viewModels
 import androidx.appcompat.app.AppCompatActivity
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
@@ -13,6 +14,7 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.tooling.preview.Preview
 import app.odweta.medilarm.nav.NavigationHost
+import app.odweta.medilarm.ui.screens.home.HomeScreenViewModel
 import app.odweta.medilarm.ui.theme.MedilarmTheme
 import dagger.hilt.android.AndroidEntryPoint
 

app/src/main/java/app/odweta/medilarm/ui/components/MedilarmToolbar.kt

@@ -1,7 +1,22 @@
 package app.odweta.medilarm.ui.components
 
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Menu
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.FontStyle
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.navigation.NavController
+import app.odweta.medilarm.R
 
 /**
  * A top bar featuring the app's name on the left side and a button to access the settings page
@@ -11,6 +26,39 @@ import androidx.compose.ui.Modifier
  * TODO: {TOOLBAR} settings button
  */
 @Composable
-fun MedilarmToolbar(modifier: Modifier = Modifier) {
+fun MedilarmToolbar(
+    modifier: Modifier = Modifier,
+    navController: NavController,
+    onMenuButtonClick: (NavController) -> Unit
+) {
+    Box(
+        modifier = Modifier.fillMaxWidth()
+    ) {
+        Row {
+            AppName()
 
+            Spacer(modifier = Modifier.weight(1f))
+
+            MenuButton(navController, onMenuButtonClick)
+        }
+    }
+}
+
+@Composable
+private fun AppName() {
+    Text(
+        text = stringResource(R.string.app_name),
+        style = TextStyle(
+            fontStyle = FontStyle.Italic
+        )
+    )
+}
+
+@Composable
+private fun MenuButton(navController: NavController, onMenuButtonClick: (NavController) -> Unit) {
+    IconButton(
+        onClick = { onMenuButtonClick(navController) }
+    ) {
+        Icon(Icons.Default.Menu, contentDescription = "menu button")
+    }
 }

app/src/main/java/app/odweta/medilarm/ui/screens/home/HomeScreen.kt

@@ -6,6 +6,7 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.hilt.lifecycle.viewmodel.compose.hiltViewModel
 import androidx.navigation.NavController
 import app.odweta.medilarm.ui.components.MedilarmAlarm
 import app.odweta.medilarm.ui.components.MedilarmMeditation
@@ -14,6 +15,7 @@ import app.odweta.medilarm.ui.components.MedilarmToolbar
 @Composable
 fun HomeScreen(
     modifier: Modifier = Modifier,
+    viewModel: HomeScreenViewModel = hiltViewModel(),
     navController: NavController
 ) {
     Column(
@@ -22,7 +24,10 @@ fun HomeScreen(
         modifier = Modifier.fillMaxSize()
     ) {
         // toolbar (app name + settings button)
-        MedilarmToolbar()
+        MedilarmToolbar(
+            navController = navController,
+            onMenuButtonClick = viewModel::onMenuButtonClick
+        )
 
         // meditation starter
         MedilarmMeditation()

app/src/main/java/app/odweta/medilarm/ui/screens/home/HomeScreenViewModel.kt

@@ -1,4 +1,14 @@
 package app.odweta.medilarm.ui.screens.home
 
-class HomeScreenViewModel {
+import androidx.lifecycle.ViewModel
+import androidx.navigation.NavController
+import app.odweta.medilarm.nav.Route
+import dagger.hilt.android.lifecycle.HiltViewModel
+import javax.inject.Inject
+
+@HiltViewModel
+class HomeScreenViewModel @Inject constructor() : ViewModel() {
+    fun onMenuButtonClick(navController: NavController) {
+        navController.navigate(Route.SettingsScreen)
+    }
 }

gradle/libs.versions.toml

@@ -1,5 +1,6 @@
 [versions]
 agp = "9.2.1"
+androidxHiltNavigationCompose = "1.3.0"
 coreKtx = "1.18.0"
 hiltAndroid = "2.59.2"
 hiltAndroidCompiler = "2.51"
@@ -18,9 +19,13 @@ composeBom = "2026.02.01"
 roomCompiler = "2.8.4"
 appcompat = "1.7.1"
 navigationCompose = "2.9.8"
+uiText = "1.11.2"
+material3 = "1.4.0"
 
 [libraries]
+androidx-compose-material-icons-extended = { module = "androidx.compose.material:material-icons-extended" }
 androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "coreKtx" }
+androidx-hilt-navigation-compose = { module = "androidx.hilt:hilt-navigation-compose", version.ref = "androidxHiltNavigationCompose" }
 androidx-room-compiler = { module = "androidx.room:room-compiler", version.ref = "roomCompiler" }
 androidx-room-runtime = { module = "androidx.room:room-runtime", version.ref = "roomCompiler" }
 dagger = { module = "com.google.dagger:dagger", version.ref = "hiltAndroid" }
@@ -43,6 +48,8 @@ androidx-compose-material3 = { group = "androidx.compose.material3", name = "mat
 androidx-appcompat = { group = "androidx.appcompat", name = "appcompat", version.ref = "appcompat" }
 androidx-navigation-compose = { group = "androidx.navigation", name = "navigation-compose", version.ref = "navigationCompose" }
 kotlinx-serialization-json = { module = "org.jetbrains.kotlinx:kotlinx-serialization-json", version.ref = "kotlinxSerializationJson" }
+androidx-compose-ui-text = { group = "androidx.compose.ui", name = "ui-text", version.ref = "uiText" }
+androidx-material3 = { group = "androidx.compose.material3", name = "material3", version.ref = "material3" }
 
 [plugins]
 android-application = { id = "com.android.application", version.ref = "agp" }