Add URL params for InfoPanel tab and product (infoTab, infoProduct)

app/components/catalog/InfoPanel.vue

@@ -41,8 +41,8 @@
             :key="tab.id"
             role="tab"
             class="tab text-white/70"
-            :class="{ 'tab-active !text-white !bg-white/20': currentTab === tab.id }"
-            @click="currentTab = tab.id"
+            :class="{ 'tab-active !text-white !bg-white/20': activeTab === tab.id }"
+            @click="onTabClick(tab.id)"
           >
             {{ tab.label }}
             <span v-if="tab.count !== undefined" class="ml-1 opacity-70">({{ tab.count }})</span>
@@ -52,7 +52,7 @@
         <!-- Tab content -->
         <div class="flex flex-col gap-2">
           <!-- Products tab (only for Offer entity) -->
-          <div v-if="currentTab === 'products' && entityType === 'offer'">
+          <div v-if="activeTab === 'products' && entityType === 'offer'">
             <div v-if="relatedProducts.length === 0" class="text-center py-8 text-white/60">
               <Icon name="lucide:package" size="32" class="mb-2 opacity-50" />
               <p>{{ $t('catalog.empty.noProducts') }}</p>
@@ -70,7 +70,7 @@
           </div>
 
           <!-- Hubs tab -->
-          <div v-if="currentTab === 'hubs'">
+          <div v-if="activeTab === 'hubs'">
             <div v-if="relatedHubs.length === 0" class="text-center py-8 text-white/60">
               <Icon name="lucide:warehouse" size="32" class="mb-2 opacity-50" />
               <p>{{ $t('catalog.info.noHubs') }}</p>
@@ -87,7 +87,7 @@
           </div>
 
           <!-- Suppliers tab -->
-          <div v-if="currentTab === 'suppliers'">
+          <div v-if="activeTab === 'suppliers'">
             <div v-if="relatedSuppliers.length === 0" class="text-center py-8 text-white/60">
               <Icon name="lucide:factory" size="32" class="mb-2 opacity-50" />
               <p>{{ $t('catalog.info.noSuppliers') }}</p>
@@ -104,7 +104,7 @@
           </div>
 
           <!-- Offers tab (two-step for Hub/Supplier) -->
-          <div v-if="currentTab === 'offers'">
+          <div v-if="activeTab === 'offers'">
             <!-- Step 1: Select product (for Hub/Supplier) -->
             <div v-if="!selectedProduct && (entityType === 'hub' || entityType === 'supplier')">
               <div v-if="relatedProducts.length === 0" class="text-center py-8 text-white/60">
@@ -183,6 +183,7 @@ const props = defineProps<{
   relatedSuppliers?: any[]
   relatedOffers?: any[]
   selectedProduct?: string | null
+  currentTab?: string
   loading?: boolean
 }>()
 
@@ -191,6 +192,7 @@ const emit = defineEmits<{
   'add-to-filter': []
   'open-info': [type: InfoEntityType, uuid: string]
   'select-product': [uuid: string | null]
+  'update:current-tab': [tab: string]
 }>()
 
 const { t } = useI18n()
@@ -202,9 +204,6 @@ const relatedHubs = computed(() => props.relatedHubs ?? [])
 const relatedSuppliers = computed(() => props.relatedSuppliers ?? [])
 const relatedOffers = computed(() => props.relatedOffers ?? [])
 
-// Current active tab
-const currentTab = ref<string>('offers')
-
 // Entity name
 const entityName = computed(() => {
   return props.entity?.name || props.entity?.productName || props.entityId.slice(0, 8) + '...'
@@ -278,17 +277,20 @@ const availableTabs = computed(() => {
   return tabs
 })
 
-// Set default active tab when entity type changes
-watch(
-  () => props.entityType,
-  () => {
-    const firstTab = availableTabs.value[0]
-    if (firstTab) {
-      currentTab.value = firstTab.id
-    }
-  },
-  { immediate: true }
-)
+// Active tab - use prop or default to first available
+const activeTab = computed(() => {
+  // If prop is set and is a valid tab, use it
+  if (props.currentTab && availableTabs.value.some(t => t.id === props.currentTab)) {
+    return props.currentTab
+  }
+  // Default to first tab
+  return availableTabs.value[0]?.id || 'offers'
+})
+
+// Handler for tab click
+const onTabClick = (tabId: string) => {
+  emit('update:current-tab', tabId)
+}
 
 // Handlers for selecting related items
 const onProductSelect = (product: any) => {