feat(tickets): include tickets in immersive account dropdown and adjust visibility logic

This commit is contained in:
2026-09-22 14:31:24 -03:00
parent fc04992ebb
commit 0e6c949513
3 changed files with 42 additions and 10 deletions

View File

@@ -49,15 +49,18 @@
</form> </form>
} }
@if (!showHero()) {
@if (ticketsMenu(); as menu) { @if (ticketsMenu(); as menu) {
<app-button <app-button
variant="secondary" variant="secondary"
hostClass="immersive-header__tickets" hostClass="immersive-header__tickets"
data-testid="store-header-tickets"
(click)="ticketsClick.emit()" (click)="ticketsClick.emit()"
> >
{{ menu.label }} {{ menu.label }}
</app-button> </app-button>
} }
}
@if (displayCart()) { @if (displayCart()) {
<app-cart-icon <app-cart-icon

View File

@@ -305,6 +305,33 @@ describe('StoreLayoutComponent', () => {
expect(element.querySelector('app-cart-icon')).not.toBeNull(); expect(element.querySelector('app-cart-icon')).not.toBeNull();
}); });
it('keeps tickets in the immersive account dropdown while hiding its root action', () => {
const authService = TestBed.inject(AuthService);
(authService.isAuthenticated as any).set(true);
(authService.user as any).set({
id: 1,
nombre_apellido: 'Ada Lovelace',
email: 'ada@example.com',
});
tenantState.set({ ...tenant, header_type: 'immersive' });
const fixture = TestBed.createComponent(StoreLayoutComponent);
fixture.detectChanges();
const element = fixture.nativeElement as HTMLElement;
expect(element.querySelector('[data-testid="store-header-tickets"]')).toBeNull();
element.querySelector<HTMLButtonElement>('app-icon-button[variant="user"] button')?.click();
fixture.detectChanges();
expect(element.querySelector('[data-testid="user-dropdown-account.tickets"]')).not.toBeNull();
(fixture.componentInstance as any).isHomeRoute.set(false);
fixture.detectChanges();
expect(element.querySelector('[data-testid="store-header-tickets"]')).not.toBeNull();
});
it('shows immersive categories below the header and navigates on selection', () => { it('shows immersive categories below the header and navigates on selection', () => {
tenantState.set({ tenantState.set({
...tenant, ...tenant,
@@ -708,7 +735,7 @@ describe('StoreLayoutComponent', () => {
expect( expect(
compiled.querySelector('[data-testid="user-dropdown-account.purchases"]'), compiled.querySelector('[data-testid="user-dropdown-account.purchases"]'),
).not.toBeNull(); ).not.toBeNull();
expect(compiled.querySelector('[data-testid="user-dropdown-account.tickets"]')).toBeNull(); expect(compiled.querySelector('[data-testid="user-dropdown-account.tickets"]')).not.toBeNull();
expect(router.navigate).not.toHaveBeenCalled(); expect(router.navigate).not.toHaveBeenCalled();
}); });
@@ -783,7 +810,7 @@ describe('StoreLayoutComponent', () => {
expect(profileLink?.getAttribute('href')).toBe('/mi-cuenta/datos-personales'); expect(profileLink?.getAttribute('href')).toBe('/mi-cuenta/datos-personales');
expect(purchasesLink?.getAttribute('href')).toBe('/mi-cuenta/compras'); expect(purchasesLink?.getAttribute('href')).toBe('/mi-cuenta/compras');
expect(ticketsLink).toBeUndefined(); expect(ticketsLink?.getAttribute('href')).toBe('/mi-cuenta/tickets');
expect(logoutButton).toBeDefined(); expect(logoutButton).toBeDefined();
logoutButton!.click(); logoutButton!.click();

View File

@@ -211,10 +211,12 @@ export class StoreLayoutComponent implements OnInit {
const profile = accountMenu.submenues.find((menu) => menu.code === 'account.profile'); const profile = accountMenu.submenues.find((menu) => menu.code === 'account.profile');
const purchases = accountMenu.submenues.find((menu) => menu.code === 'account.purchases'); const purchases = accountMenu.submenues.find((menu) => menu.code === 'account.purchases');
const tickets = accountMenu.submenues.find((menu) => menu.code === 'account.tickets');
return [ return [
...(profile ? [{ ...accountMenu, route: profile.route }] : []), ...(profile ? [{ ...accountMenu, route: profile.route }] : []),
...(purchases ? [purchases] : []), ...(purchases ? [purchases] : []),
...(tickets ? [tickets] : []),
]; ];
}); });