diff --git a/bro.config.js b/bro.config.js
index 5b707e6..4cd6696 100644
--- a/bro.config.js
+++ b/bro.config.js
@@ -11,7 +11,8 @@ module.exports = {
   navigations: {
     "nav1.main": "/nav1",
     "link.nav1.about": "/",
-    "link.nav1.profile": "/my-best-profile-page-ever"
+    "link.nav1.profile": "/my-best-profile-page-ever",
+    "nav2.main": "/nav2",
   },
   features: {
     "nav1": {
diff --git a/package-lock.json b/package-lock.json
index ca1b40f..aa7c119 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,6 +10,8 @@
             "license": "ISC",
             "dependencies": {
                 "@brojs/cli": "^1.3.0",
+                "@types/react": "^18.3.12",
+                "@types/react-dom": "^18.3.1",
                 "express": "^4.19.2",
                 "react": "^18.3.1",
                 "react-dom": "^18.3.1",
@@ -2052,6 +2054,31 @@
             "integrity": "sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==",
             "license": "MIT"
         },
+        "node_modules/@types/prop-types": {
+            "version": "15.7.13",
+            "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.13.tgz",
+            "integrity": "sha512-hCZTSvwbzWGvhqxp/RqVqwU999pBf2vp7hzIjiYOsl8wqOmUxkQ6ddw1cV3l8811+kdUFus/q4d1Y3E3SyEifA==",
+            "license": "MIT"
+        },
+        "node_modules/@types/react": {
+            "version": "18.3.12",
+            "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.12.tgz",
+            "integrity": "sha512-D2wOSq/d6Agt28q7rSI3jhU7G6aiuzljDGZ2hTZHIkrTLUI+AF3WMeKkEZ9nN2fkBAlcktT6vcZjDFiIhMYEQw==",
+            "license": "MIT",
+            "dependencies": {
+                "@types/prop-types": "*",
+                "csstype": "^3.0.2"
+            }
+        },
+        "node_modules/@types/react-dom": {
+            "version": "18.3.1",
+            "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.1.tgz",
+            "integrity": "sha512-qW1Mfv8taImTthu4KoXgDfLuk4bydU6Q/TkADnDWWHwi4NX4BR+LWfTp2sVmTqRrsHvyDDTelgelxJ+SsejKKQ==",
+            "license": "MIT",
+            "dependencies": {
+                "@types/react": "*"
+            }
+        },
         "node_modules/@webassemblyjs/ast": {
             "version": "1.12.1",
             "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.12.1.tgz",
@@ -2999,6 +3026,12 @@
                 "node": ">=4"
             }
         },
+        "node_modules/csstype": {
+            "version": "3.1.3",
+            "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
+            "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
+            "license": "MIT"
+        },
         "node_modules/debug": {
             "version": "4.3.7",
             "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
diff --git a/package.json b/package.json
index aaf69fb..386dbf1 100644
--- a/package.json
+++ b/package.json
@@ -15,6 +15,8 @@
     "description": "",
     "dependencies": {
         "@brojs/cli": "^1.3.0",
+        "@types/react": "^18.3.12",
+        "@types/react-dom": "^18.3.1",
         "express": "^4.19.2",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
diff --git a/src/dashboard.tsx b/src/dashboard.tsx
index d76ed27..e401540 100644
--- a/src/dashboard.tsx
+++ b/src/dashboard.tsx
@@ -1,16 +1,34 @@
-import React from "react";
+import React, { Suspense } from "react";
 import { Routes, Route } from "react-router-dom";
 
 import { URLs } from "./__data__/urls";
-import { ProfilePage } from './pages/profile'
-import { AboutPage } from "./pages/about";
+import { ProfilePage, AboutPage } from "./pages";
 
+const PageWrapper = ({ children }) => (
+  <Suspense fallback={<div>Loading...</div>}>{children}</Suspense>
+);
 
 export const Dashboard = () => {
   return (
     <Routes>
-      <Route path={URLs.about.url} element={<AboutPage />} />
-      {URLs.profile.isOn && <Route path={URLs.profile.url} element={<ProfilePage />} />}
+      <Route
+        path={URLs.about.url}
+        element={
+          <PageWrapper>
+            <AboutPage />
+          </PageWrapper>
+        }
+      />
+      {URLs.profile.isOn && (
+        <Route
+          path={URLs.profile.url}
+          element={
+            <PageWrapper>
+              <ProfilePage />
+            </PageWrapper>
+          }
+        />
+      )}
 
       <Route path="*" element={<div>Not found</div>} />
     </Routes>
diff --git a/src/pages/about.tsx b/src/pages/about/about.tsx
similarity index 85%
rename from src/pages/about.tsx
rename to src/pages/about/about.tsx
index 85242ed..ce804f5 100644
--- a/src/pages/about.tsx
+++ b/src/pages/about/about.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import { Link } from "react-router-dom";
 
-import { URLs } from "../__data__/urls";
+import { URLs } from "../../__data__/urls";
 
 export const AboutPage = () => {
   return (
diff --git a/src/pages/about/index.ts b/src/pages/about/index.ts
new file mode 100644
index 0000000..2f89a60
--- /dev/null
+++ b/src/pages/about/index.ts
@@ -0,0 +1,3 @@
+import { AboutPage } from './about';
+
+export default AboutPage;
diff --git a/src/pages/index.ts b/src/pages/index.ts
new file mode 100644
index 0000000..68f301d
--- /dev/null
+++ b/src/pages/index.ts
@@ -0,0 +1,4 @@
+import { lazy } from 'react'
+
+export const AboutPage = lazy(() => import(/* webpackChunkName: "about" */ './about'))
+export const ProfilePage = lazy(() => import(/* webpackChunkName: "profile" */ './profile'))
diff --git a/src/pages/profile/index.ts b/src/pages/profile/index.ts
new file mode 100644
index 0000000..e2f0a37
--- /dev/null
+++ b/src/pages/profile/index.ts
@@ -0,0 +1,3 @@
+import { ProfilePage } from "./profile";
+
+export default ProfilePage;
diff --git a/src/pages/profile.tsx b/src/pages/profile/profile.tsx
similarity index 55%
rename from src/pages/profile.tsx
rename to src/pages/profile/profile.tsx
index 77a4b4a..5a556c6 100644
--- a/src/pages/profile.tsx
+++ b/src/pages/profile/profile.tsx
@@ -1,13 +1,18 @@
 import React from "react";
 import { Link } from "react-router-dom";
 
-import { URLs } from "../__data__/urls";
+import { URLs } from "../../__data__/urls";
+import { getNavigationsValue } from "@brojs/cli";
 
 export const ProfilePage = () => {
   return (
     <div>
       <h1>profile page</h1>
       <Link to={URLs.about.getUrl()}>go to about page</Link>
+
+      <div>
+        <a href={getNavigationsValue('nav2.main')}>edit profile</a>
+      </div>
     </div>
   );
 };