From 34c7404a4277f9601248745df178ccd93a8cc0a7 Mon Sep 17 00:00:00 2001
From: Ruslan Bakiev <ruslanbakiev@dsrptlab.com>
Date: Thu, 8 Jan 2026 13:26:23 +0700
Subject: [PATCH] Refactor navigation and fix UI issues

- Add py-4 to main layout for detail page padding
- Show search widget only on main page (not all catalog pages)
- Add 4 menu items: Search, Catalog, Orders, Seller
- Fix orders page click to navigate to order detail
- Update CatalogPage map positioning for new nav structure
- Add search translation to cabinetNav i18n files
---
 app/components/navigation/MainNavigation.vue | 4 +++-
 app/components/page/CatalogPage.vue          | 6 +++---
 app/layouts/topnav.vue                       | 6 +++---
 app/pages/clientarea/orders/index.vue        | 1 +
 i18n/locales/en/cabinetNav.json              | 1 +
 i18n/locales/ru/cabinetNav.json              | 1 +
 6 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/app/components/navigation/MainNavigation.vue b/app/components/navigation/MainNavigation.vue
index dabe108..388df02 100644
--- a/app/components/navigation/MainNavigation.vue
+++ b/app/components/navigation/MainNavigation.vue
@@ -171,6 +171,7 @@ const route = useRoute()
 const { t } = useI18n()
 
 const tabs = computed(() => [
+  { key: 'search', label: t('cabinetNav.search'), path: '/', auth: false },
   { key: 'catalog', label: t('cabinetNav.catalog'), path: '/catalog/offers', auth: false },
   { key: 'orders', label: t('cabinetNav.orders'), path: '/clientarea/orders', auth: true },
   { key: 'seller', label: t('cabinetNav.seller'), path: '/clientarea/offers', auth: true, seller: true },
@@ -186,7 +187,8 @@ const visibleTabs = computed(() => {
 
 const isActiveTab = (key: string) => {
   const path = route.path
-  if (key === 'catalog') return path.startsWith('/catalog') || path === '/'
+  if (key === 'search') return path === '/' || path === '/en' || path === '/ru'
+  if (key === 'catalog') return path.startsWith('/catalog') || path.includes('/en/catalog') || path.includes('/ru/catalog')
   if (key === 'orders') return path.includes('/clientarea/orders') || path.includes('/clientarea/addresses') || path.includes('/clientarea/billing')
   if (key === 'seller') return path.includes('/clientarea/offers')
   return false
diff --git a/app/components/page/CatalogPage.vue b/app/components/page/CatalogPage.vue
index 2cdc608..bd13df2 100644
--- a/app/components/page/CatalogPage.vue
+++ b/app/components/page/CatalogPage.vue
@@ -181,9 +181,9 @@ const props = withDefaults(defineProps<{
   hasSubNav: true
 })
 
-// Map positioning based on navigation height
-const mapTopClass = computed(() => props.hasSubNav ? 'top-40' : 'top-32')
-const mapHeightClass = computed(() => props.hasSubNav ? 'h-[calc(100vh-11rem)]' : 'h-[calc(100vh-9rem)]')
+// Map positioning based on navigation height (no search bar on catalog pages now)
+const mapTopClass = computed(() => props.hasSubNav ? 'top-32' : 'top-24')
+const mapHeightClass = computed(() => props.hasSubNav ? 'h-[calc(100vh-9rem)]' : 'h-[calc(100vh-7rem)]')
 
 const emit = defineEmits<{
   'select': [item: MapItem]
diff --git a/app/layouts/topnav.vue b/app/layouts/topnav.vue
index 75b9cbb..3188645 100644
--- a/app/layouts/topnav.vue
+++ b/app/layouts/topnav.vue
@@ -23,7 +23,7 @@
     <SubNavigation :section="currentSection" />
 
     <!-- Page content -->
-    <main class="flex-1 flex flex-col min-h-0 px-3 lg:px-6">
+    <main class="flex-1 flex flex-col min-h-0 px-3 lg:px-6 py-4">
       <slot />
     </main>
   </div>
@@ -80,9 +80,9 @@ const currentSection = computed(() => {
   return 'catalog'
 })
 
-// Show search bar on catalog pages
+// Show search bar only on main page
 const showSearch = computed(() => {
-  return currentSection.value === 'catalog'
+  return route.path === '/' || route.path === '/en' || route.path === '/ru'
 })
 
 // Avatar generation
diff --git a/app/pages/clientarea/orders/index.vue b/app/pages/clientarea/orders/index.vue
index 93931e6..49eaf7b 100644
--- a/app/pages/clientarea/orders/index.vue
+++ b/app/pages/clientarea/orders/index.vue
@@ -108,6 +108,7 @@ const itemsForMap = computed(() => {
 
 const onSelectOrder = (item: any) => {
   selectedOrderId.value = item.uuid
+  navigateTo(localePath(`/clientarea/orders/${item.uuid}`))
 }
 
 await init()
diff --git a/i18n/locales/en/cabinetNav.json b/i18n/locales/en/cabinetNav.json
index ffa8f8c..dc98cc3 100644
--- a/i18n/locales/en/cabinetNav.json
+++ b/i18n/locales/en/cabinetNav.json
@@ -1,5 +1,6 @@
 {
   "cabinetNav": {
+    "search": "Search",
     "catalog": "Catalog",
     "orders": "My orders",
     "addresses": "My addresses",
diff --git a/i18n/locales/ru/cabinetNav.json b/i18n/locales/ru/cabinetNav.json
index 47cc5bb..c5a9f28 100644
--- a/i18n/locales/ru/cabinetNav.json
+++ b/i18n/locales/ru/cabinetNav.json
@@ -1,5 +1,6 @@
 {
   "cabinetNav": {
+    "search": "Поиск",
     "catalog": "Каталог",
     "orders": "Мои заказы",
     "addresses": "Мои адреса",