some fixes & improvements

composeApp/build.gradle.kts

@@ -26,6 +26,10 @@ tasks.withType<KotlinCompile>().configureEach {
     }
 }
 
+compose.resources {
+    nameOfResClass = "R"
+}
+
 kotlin {
     androidTarget {
         compilerOptions {
@@ -74,7 +78,8 @@ kotlin {
         commonMain.dependencies {
             implementation(compose.runtime)
             implementation(compose.foundation)
-            implementation(compose.material3)
+//            implementation(compose.material3)
+            implementation(libs.material3)
             implementation(compose.materialIconsExtended)
             implementation(compose.components.resources)
             implementation(libs.androidx.navigation.compose)

composeApp/src/commonMain/kotlin/dev/meloda/overseerr/App.kt

@@ -1,16 +1,11 @@
 package dev.meloda.overseerr
 
-import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.foundation.layout.height
-import androidx.compose.foundation.layout.width
 import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
-import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.unit.dp
 import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import dev.meloda.overseerr.datastore.SettingsController
 import dev.meloda.overseerr.screens.main.MainScreen
@@ -34,18 +29,9 @@ internal fun App() {
         settingsController.loadAppSettings()
     }
 
-    Box(
-        modifier = Modifier.fillMaxSize(),
-        contentAlignment = Alignment.Center
-    ) {
-        AppTheme(themeMode = settings.themeMode) {
-            Surface(
-                modifier = Modifier
-                    .width(360.dp)
-                    .height(640.dp)
-            ) {
-                MainScreen()
-            }
+    AppTheme(themeMode = settings.themeMode) {
+        Surface(modifier = Modifier.fillMaxSize()) {
+            MainScreen()
         }
     }
 }

composeApp/src/commonMain/kotlin/dev/meloda/overseerr/screens/main/MainScreen.kt

@@ -39,6 +39,7 @@ import dev.meloda.overseerr.screens.requests.presentation.RequestsScreen
 import dev.meloda.overseerr.screens.settings.presentation.SettingsScreen
 import dev.meloda.overseerr.theme.LocalHazeState
 import dev.meloda.overseerr.theme.LocalPadding
+import dev.meloda.overseerr.theme.NavigationSettings
 
 @OptIn(ExperimentalMaterial3Api::class, ExperimentalHazeMaterialsApi::class)
 @Composable
@@ -46,6 +47,7 @@ fun MainScreen() {
     val hazeState = remember { HazeState(true) }
 
     val navController = rememberNavController()
+    NavigationSettings(navController)
 
     val navigationItems = remember {
         listOf(

composeApp/src/wasmJsMain/kotlin/main.kt

@@ -1,4 +1,11 @@
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.width
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.ExperimentalComposeUiApi
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
 import androidx.compose.ui.window.ComposeViewport
 import dev.meloda.overseerr.App
 import dev.meloda.overseerr.di.appModule
@@ -9,7 +16,18 @@ import org.koin.compose.KoinApplication
 fun main() {
     ComposeViewport(document.body!!) {
         KoinApplication(application = { modules(appModule) }) {
-            App()
+            Box(
+                modifier = Modifier.fillMaxSize(),
+                contentAlignment = Alignment.Center
+            ) {
+                Box(
+                    modifier = Modifier
+                        .width(360.dp)
+                        .height(640.dp)
+                ) {
+                    App()
+                }
+            }
         }
     }
 }