diff --git a/sample/build.gradle b/sample/build.gradle
index 1aa0c5a2d3..7cb04b2f1f 100644
--- a/sample/build.gradle
+++ b/sample/build.gradle
@@ -66,9 +66,11 @@ dependencies {
     implementation libs.design
     implementation libs.pickT
 
+    implementation libs.navigationCompose
+
     implementation libs.compose
     implementation libs.composeFoundation
-    implementation libs.composeMaterial
+    implementation libs.composeMaterial3
     implementation libs.composeToolingPreview
     implementation libs.composeAccompanistPager
     implementation libs.composeAccompanistThemeAdapter
@@ -86,5 +88,7 @@ dependencies {
     testImplementation libs.androidXTestCore
     testImplementation libs.mockitoKotlin
 
+    implementation "com.google.accompanist:accompanist-navigation-material:0.34.0"
+
     implementation platform('com.google.firebase:firebase-bom:32.1.1')
 }
diff --git a/sample/src/main/AndroidManifest.xml b/sample/src/main/AndroidManifest.xml
index 4fe4e15d2f..877c2a4b4b 100644
--- a/sample/src/main/AndroidManifest.xml
+++ b/sample/src/main/AndroidManifest.xml
@@ -19,7 +19,7 @@
         android:usesCleartextTraffic="true"
         tools:ignore="GoogleAppIndexingWarning">
         <activity
-            android:name=".design_system.DesignSystemActivity"
+            android:name=".ComposeModalsActivity"
             android:exported="true">
             <intent-filter>
                 <action android:name="android.intent.action.MAIN" />
diff --git a/sample/src/main/java/com/anytypeio/anytype/sample/ComposeModalsActivity.kt b/sample/src/main/java/com/anytypeio/anytype/sample/ComposeModalsActivity.kt
new file mode 100644
index 0000000000..5cdc0442af
--- /dev/null
+++ b/sample/src/main/java/com/anytypeio/anytype/sample/ComposeModalsActivity.kt
@@ -0,0 +1,170 @@
+package com.anytypeio.anytype.sample
+
+import android.os.Bundle
+import androidx.activity.compose.setContent
+import androidx.activity.enableEdgeToEdge
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.material3.Button
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.ModalBottomSheet
+import androidx.compose.material3.Text
+import androidx.compose.material3.rememberModalBottomSheetState
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+import androidx.activity.ComponentActivity
+import androidx.navigation.compose.NavHost
+import androidx.navigation.compose.composable
+import androidx.navigation.compose.rememberNavController
+import com.google.accompanist.navigation.material.ExperimentalMaterialNavigationApi
+import com.google.accompanist.navigation.material.ModalBottomSheetLayout
+import com.google.accompanist.navigation.material.bottomSheet
+import com.google.accompanist.navigation.material.rememberBottomSheetNavigator
+
+class ComposeModalsActivity: ComponentActivity() {
+
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        enableEdgeToEdge()
+        setContent {
+            androidx.compose.material3.MaterialTheme {
+                FirstScreen()
+            }
+        }
+    }
+
+    @OptIn(ExperimentalMaterialNavigationApi::class)
+    @Composable
+    fun FirstScreen() {
+        val bottomSheetNavigator = rememberBottomSheetNavigator()
+        val navController = rememberNavController(bottomSheetNavigator)
+        ModalBottomSheetLayout(bottomSheetNavigator = bottomSheetNavigator) {
+            NavHost(navController = navController, startDestination = "first") {
+                composable(route = "first") {
+                    MainModal {
+                        navController.navigate("second")
+                    }
+                }
+                bottomSheet(route = "second") {
+                    SecondModal(
+                        secondClicked = { navController.navigate("third") },
+                        onDismiss = { navController.popBackStack() }
+                    )
+                }
+                bottomSheet(route = "third") {
+                    ThirdModal(
+                        secondClicked = { navController.navigate("four") },
+                        onDismiss = { navController.popBackStack("first", false) }
+                    )
+                }
+                bottomSheet(route = "four") {
+                    FourModal(
+                        oneClicked = { navController.popBackStack() },
+                        onDismiss = { navController.popBackStack() }
+                    )
+                }
+            }
+        }
+    }
+
+    @OptIn(ExperimentalMaterial3Api::class)
+    @Composable
+    fun MainModal(buttonClicked: () -> Unit) {
+        val sheetState = rememberModalBottomSheetState()
+        ModalBottomSheet(
+            sheetState = rememberModalBottomSheetState(true),
+            onDismissRequest = { /*TODO*/ }) {
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .height(900.dp)
+                    .background(color = Color.Red)
+            ) {
+
+                Button(
+                    onClick = { buttonClicked() },
+                    modifier = Modifier.align(Alignment.Center),
+                ) {
+                    Text("Click me")
+                }
+            }
+        }
+    }
+
+    @OptIn(ExperimentalMaterial3Api::class)
+    @Composable
+    fun SecondModal(secondClicked: () -> Unit, onDismiss: () -> Unit) {
+        val sheetState = rememberModalBottomSheetState(skipPartiallyExpanded = true)
+        ModalBottomSheet(
+            sheetState = sheetState,
+            onDismissRequest = { onDismiss() }) {
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .height(500.dp)
+                    .background(color = Color.Green)
+            ) {
+
+                Button(
+                    onClick = { secondClicked() },
+                    modifier = Modifier.align(Alignment.Center),
+                ) {
+                    Text("I'm from 2")
+                }
+            }
+        }
+    }
+
+    @OptIn(ExperimentalMaterial3Api::class)
+    @Composable
+    fun ThirdModal(secondClicked: () -> Unit, onDismiss: () -> Unit) {
+        val sheetState = rememberModalBottomSheetState(skipPartiallyExpanded = true)
+        ModalBottomSheet(
+            sheetState = sheetState,
+            onDismissRequest = { onDismiss() }) {
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .height(500.dp)
+                    .background(color = Color.Blue)
+            ) {
+
+                Button(
+                    onClick = { secondClicked() },
+                    modifier = Modifier.align(Alignment.Center),
+                ) {
+                    Text("I'm from 3")
+                }
+            }
+        }
+    }
+
+    @OptIn(ExperimentalMaterial3Api::class)
+    @Composable
+    fun FourModal(oneClicked: () -> Unit, onDismiss: () -> Unit) {
+        val sheetState = rememberModalBottomSheetState(skipPartiallyExpanded = true)
+        ModalBottomSheet(
+            sheetState = sheetState,
+            onDismissRequest = { onDismiss() }) {
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .height(500.dp)
+                    .background(color = Color.Yellow)
+            ) {
+
+                Button(
+                    onClick = { oneClicked() },
+                    modifier = Modifier.align(Alignment.Center),
+                ) {
+                    Text("I'm from 4")
+                }
+            }
+        }
+    }
+}
\ No newline at end of file
diff --git a/sample/src/main/java/com/anytypeio/anytype/sample/design_system/ComposeDialogFragment.kt b/sample/src/main/java/com/anytypeio/anytype/sample/design_system/ComposeDialogFragment.kt
index 9afc4628ee..55161eb211 100644
--- a/sample/src/main/java/com/anytypeio/anytype/sample/design_system/ComposeDialogFragment.kt
+++ b/sample/src/main/java/com/anytypeio/anytype/sample/design_system/ComposeDialogFragment.kt
@@ -14,6 +14,7 @@ import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.ExperimentalMaterialApi
 import androidx.compose.material.Text
+import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
@@ -34,6 +35,7 @@ import kotlinx.coroutines.FlowPreview
 
 class ComposeDialogFragment : BaseComposeFragment() {
 
+    @OptIn(ExperimentalMaterial3Api::class)
     @FlowPreview
     @ExperimentalPagerApi
     @ExperimentalMaterialApi