diff --git a/app/pages/catalog/index.vue b/app/pages/catalog/index.vue
index fbb778a..d3f8e25 100644
--- a/app/pages/catalog/index.vue
+++ b/app/pages/catalog/index.vue
@@ -44,7 +44,7 @@
 </template>
 
 <script setup lang="ts">
-import { GetOffersDocument } from '~/composables/graphql/public/exchange-generated'
+import { GetOffersDocument, GetOfferDocument } from '~/composables/graphql/public/exchange-generated'
 import type { MapBounds } from '~/components/catalog/CatalogMap.vue'
 
 definePageMeta({
@@ -234,14 +234,18 @@ const mapPointColor = computed(() => {
 })
 
 // Handle map item selection
-const onMapSelect = (item: any) => {
-  // If in selection mode, use map click to fill the selector
-  if (selectMode.value && item.uuid) {
-    const itemName = item.name || item.uuid.slice(0, 8) + '...'
+const onMapSelect = async (item: any) => {
+  // Get uuid from item - clusters use 'id', regular items use 'uuid'
+  const itemId = item.uuid || item.id
+  if (!itemId || itemId.startsWith('cluster-')) return
 
+  const itemName = item.name || itemId.slice(0, 8) + '...'
+
+  // If in selection mode, use map click to fill the selector
+  if (selectMode.value) {
     // For hubs selection - click on hub fills hub selector
     if (selectMode.value === 'hub' && mapViewMode.value === 'hubs') {
-      selectItem('hub', item.uuid, itemName)
+      selectItem('hub', itemId, itemName)
       showQuoteResults.value = false
       offers.value = []
       return
@@ -249,30 +253,28 @@ const onMapSelect = (item: any) => {
 
     // For supplier selection - click on supplier fills supplier selector
     if (selectMode.value === 'supplier' && mapViewMode.value === 'suppliers') {
-      selectItem('supplier', item.uuid, itemName)
+      selectItem('supplier', itemId, itemName)
       showQuoteResults.value = false
       offers.value = []
       return
     }
 
-    // For product selection viewing offers - try to find product in loaded list
+    // For product selection viewing offers - fetch offer to get productUuid
     if (selectMode.value === 'product' && mapViewMode.value === 'offers') {
-      // The offer has product info - we'll look it up from the products list if loaded
-      // or just use the offer's product_uuid if available
-      const product = products.value.find((p: any) => p.uuid === item.productUuid)
-      if (product) {
-        selectItem('product', product.uuid, product.name || itemName)
-      } else if (item.productUuid) {
-        selectItem('product', item.productUuid, item.productName || itemName)
+      // Fetch offer details to get productUuid (not available in cluster data)
+      const data = await execute(GetOfferDocument, { uuid: itemId }, 'public', 'exchange')
+      const offer = data?.getOffer
+      if (offer?.productUuid) {
+        selectItem('product', offer.productUuid, offer.productName || itemName)
+        showQuoteResults.value = false
+        offers.value = []
       }
-      showQuoteResults.value = false
-      offers.value = []
       return
     }
   }
 
   // Default behavior for quote mode etc
-  if (catalogMode.value === 'quote' && item.uuid) {
+  if (catalogMode.value === 'quote') {
     console.log('Selected from map:', item)
   }
 }