From 92546a28c08abff5c5f34e8454e228c00d98950d Mon Sep 17 00:00:00 2001
From: ncoronel <ncoronel@quo.ar>
Date: Thu, 20 Aug 2026 12:46:14 -0300
Subject: [PATCH] feat(catalog): add anchor IDs to featured groups

---
 src/app/core/services/catalog/catalog.interface.ts            | 1 +
 .../pages/store-home-page/store-home-page.component.html      | 2 +-
 .../pages/store-home-page/store-home-page.component.scss      | 4 ++++
 .../pages/store-home-page/store-home-page.component.spec.ts   | 2 ++
 4 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/app/core/services/catalog/catalog.interface.ts b/src/app/core/services/catalog/catalog.interface.ts
index 4d8b4d3..d9d26fb 100644
--- a/src/app/core/services/catalog/catalog.interface.ts
+++ b/src/app/core/services/catalog/catalog.interface.ts
@@ -155,6 +155,7 @@ export type CatalogFeaturedItems =
 
 export interface CatalogFeaturedGroup {
   id: number;
+  code: string;
   title: string;
   layout: CatalogProductLayout;
   group_layout: CatalogGroupLayout;
diff --git a/src/app/features/store/pages/store-home-page/store-home-page.component.html b/src/app/features/store/pages/store-home-page/store-home-page.component.html
index 94425a4..697aa4c 100644
--- a/src/app/features/store/pages/store-home-page/store-home-page.component.html
+++ b/src/app/features/store/pages/store-home-page/store-home-page.component.html
@@ -23,7 +23,7 @@
   </p>
 } @else {
   @for (group of catalog(); track group.id) {
-    <app-store-section [title]="group.title">
+    <app-store-section [attr.id]="group.code" [title]="group.title">
       <app-product-list
         [layout]="group.layout"
         [groupLayout]="group.group_layout"
diff --git a/src/app/features/store/pages/store-home-page/store-home-page.component.scss b/src/app/features/store/pages/store-home-page/store-home-page.component.scss
index a7310b9..d4dfd47 100644
--- a/src/app/features/store/pages/store-home-page/store-home-page.component.scss
+++ b/src/app/features/store/pages/store-home-page/store-home-page.component.scss
@@ -11,6 +11,10 @@ app-store-section + app-store-section {
   margin-top: clamp(3rem, 6vw, 5rem);
 }
 
+app-store-section[id] {
+  scroll-margin-top: 8rem;
+}
+
 :host > .store-home__additional-info:not(:first-child) {
   margin-top: clamp(3rem, 6vw, 5rem);
 }
diff --git a/src/app/features/store/pages/store-home-page/store-home-page.component.spec.ts b/src/app/features/store/pages/store-home-page/store-home-page.component.spec.ts
index 70ddd41..6027fcb 100644
--- a/src/app/features/store/pages/store-home-page/store-home-page.component.spec.ts
+++ b/src/app/features/store/pages/store-home-page/store-home-page.component.spec.ts
@@ -58,6 +58,7 @@ function createCatalog(
   return [
     {
       id: 7,
+      code: 'destacados',
       title: 'Destacados',
       layout: 'column_with_image',
       group_layout: 'paginated',
@@ -149,6 +150,7 @@ describe('StoreHomePageComponent', () => {
     const element = fixture.nativeElement as HTMLElement;
 
     expect(catalogServiceStub.getCatalog).not.toHaveBeenCalled();
+    expect(element.querySelector('app-store-section')?.id).toBe('destacados');
     expect(element.querySelector('.store-section__title')?.textContent?.trim()).toBe('Destacados');
     expect(element.querySelectorAll('app-product-column-with-image')).toHaveLength(2);
     expect(element.textContent).toContain('Auriculares Bluetooth');