From 3f7b83bb6dd0b07fa9c626d0479666622c3363b1 Mon Sep 17 00:00:00 2001
From: Ruslan Bakiev <572431+veikab@users.noreply.github.com>
Date: Tue, 27 Jan 2026 12:51:08 +0700
Subject: [PATCH] feat(kyc): add KYC profile page, navigate instead of modal

---
 app/pages/catalog/index.vue | 21 ++-------------------
 app/pages/kyc/[uuid].vue    | 25 +++++++++++++++++++++++++
 2 files changed, 27 insertions(+), 19 deletions(-)
 create mode 100644 app/pages/kyc/[uuid].vue

diff --git a/app/pages/catalog/index.vue b/app/pages/catalog/index.vue
index ea1a38f..b6dbf7b 100644
--- a/app/pages/catalog/index.vue
+++ b/app/pages/catalog/index.vue
@@ -66,19 +66,6 @@
       />
     </template>
   </CatalogPage>
-
-  <!-- KYC Profile Modal -->
-  <dialog ref="kycModalRef" class="modal">
-    <div class="modal-box max-w-2xl bg-base-100">
-      <form method="dialog">
-        <button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
-      </form>
-      <KycProfileCard :kyc-profile-uuid="kycProfileUuid" />
-    </div>
-    <form method="dialog" class="modal-backdrop">
-      <button>close</button>
-    </form>
-  </dialog>
 </template>
 
 <script setup lang="ts">
@@ -360,9 +347,6 @@ const offers = ref<OfferResult[]>([])
 const offersLoading = ref(false)
 const showQuoteResults = ref(false)
 
-// KYC Modal
-const kycModalRef = ref<HTMLDialogElement | null>(null)
-const kycProfileUuid = ref<string | null>(null)
 
 // Watch for search trigger from topnav
 const searchTrigger = useState<number>('catalog-search-trigger', () => 0)
@@ -510,11 +494,10 @@ const onInfoSelectProduct = (uuid: string | null) => {
   setInfoProduct(uuid)
 }
 
-// Handle KYC profile open - show modal with full profile
+// Handle KYC profile open - navigate to KYC page
 const onOpenKyc = (uuid: string | undefined) => {
   if (!uuid) return
-  kycProfileUuid.value = uuid
-  kycModalRef.value?.showModal()
+  navigateTo(localePath(`/kyc/${uuid}`))
 }
 
 // Search for offers
diff --git a/app/pages/kyc/[uuid].vue b/app/pages/kyc/[uuid].vue
new file mode 100644
index 0000000..7bd73ad
--- /dev/null
+++ b/app/pages/kyc/[uuid].vue
@@ -0,0 +1,25 @@
+<template>
+  <div class="min-h-screen bg-base-200">
+    <div class="container mx-auto px-4 py-8 max-w-4xl">
+      <!-- Back button -->
+      <NuxtLink :to="localePath('/catalog')" class="btn btn-ghost btn-sm mb-4">
+        <Icon name="lucide:arrow-left" size="16" />
+        {{ $t('common.back') }}
+      </NuxtLink>
+
+      <!-- KYC Profile Card -->
+      <KycProfileCard :kyc-profile-uuid="uuid" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: 'topnav'
+})
+
+const route = useRoute()
+const localePath = useLocalePath()
+
+const uuid = computed(() => route.params.uuid as string)
+</script>