crap

src/routes/test.lazy.tsx

@@ -1,6 +1,6 @@
 import {createLazyFileRoute} from "@tanstack/react-router";
-import {Button} from "@mantine/core";
-import {notifications} from "@mantine/notifications";
+import {Button, Text} from "@mantine/core";
+import {modals} from "@mantine/modals";
 
 export const Route = createLazyFileRoute('/test')({
     component: TestPage
@@ -8,11 +8,28 @@ export const Route = createLazyFileRoute('/test')({
 
 function TestPage() {
     return (
-        <>
-            <Button onClick={() => {
-                notifications.show({title: "test", message: "хуй"})
-            }}>TEST</Button>
-
-        </>
-    )
+        <Button
+            onClick={() =>
+                modals.openConfirmModal({
+                    title: 'Please confirm your action',
+                    closeOnConfirm: false,
+                    labels: {confirm: 'Next modal', cancel: 'Close modal'},
+                    onConfirm: () =>
+                        modals.openConfirmModal({
+                            title: 'This is modal at second layer',
+                            labels: {confirm: 'Close modal', cancel: 'Back'},
+                            closeOnConfirm: false,
+                            children: (
+                                <Text size="sm">
+                                    When this modal is closed modals state will revert to first modal
+                                </Text>
+                            ),
+                            onConfirm: modals.closeAll,
+                        }),
+                })
+            }
+        >
+            Open multiple steps modal
+        </Button>
+    );
 }