feat: implement store routing and product detail page skeleton
This commit is contained in:
@@ -0,0 +1 @@
|
|||||||
|
<p>product-detail-page works!</p>
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
/* empty */
|
||||||
@@ -0,0 +1,18 @@
|
|||||||
|
import { TestBed } from '@angular/core/testing';
|
||||||
|
import { beforeEach, describe, expect, it } from 'vitest';
|
||||||
|
import { ProductDetailPageComponent } from './product-detail-page.component';
|
||||||
|
|
||||||
|
describe('ProductDetailPageComponent', () => {
|
||||||
|
beforeEach(() => {
|
||||||
|
TestBed.resetTestingModule();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
imports: [ProductDetailPageComponent]
|
||||||
|
});
|
||||||
|
const fixture = TestBed.createComponent(ProductDetailPageComponent);
|
||||||
|
const component = fixture.componentInstance;
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
import { ChangeDetectionStrategy, Component } from '@angular/core';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-product-detail-page',
|
||||||
|
standalone: true,
|
||||||
|
imports: [],
|
||||||
|
templateUrl: './product-detail-page.component.html',
|
||||||
|
styleUrl: './product-detail-page.component.scss',
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush
|
||||||
|
})
|
||||||
|
export class ProductDetailPageComponent {}
|
||||||
@@ -1,4 +1,5 @@
|
|||||||
import { ChangeDetectionStrategy, Component, OnDestroy, OnInit, computed, inject, signal } from '@angular/core';
|
import { ChangeDetectionStrategy, Component, OnDestroy, OnInit, computed, inject, signal } from '@angular/core';
|
||||||
|
import { Router } from '@angular/router';
|
||||||
import { Subscription } from 'rxjs';
|
import { Subscription } from 'rxjs';
|
||||||
|
|
||||||
import { CatalogService } from '../../../../core/services/catalog/catalog.service';
|
import { CatalogService } from '../../../../core/services/catalog/catalog.service';
|
||||||
@@ -25,6 +26,7 @@ interface StoreHomeProductCardViewModel {
|
|||||||
})
|
})
|
||||||
export class StoreHomePageComponent implements OnInit, OnDestroy {
|
export class StoreHomePageComponent implements OnInit, OnDestroy {
|
||||||
private readonly catalogService = inject(CatalogService);
|
private readonly catalogService = inject(CatalogService);
|
||||||
|
private readonly router = inject(Router);
|
||||||
|
|
||||||
private activeRequestId = 0;
|
private activeRequestId = 0;
|
||||||
private productsRequestSubscription: Subscription | null = null;
|
private productsRequestSubscription: Subscription | null = null;
|
||||||
@@ -62,7 +64,9 @@ export class StoreHomePageComponent implements OnInit, OnDestroy {
|
|||||||
this.loadProducts(page);
|
this.loadProducts(page);
|
||||||
}
|
}
|
||||||
|
|
||||||
protected onBuyProduct(_productId: number): void {}
|
protected onBuyProduct(productId: number): void {
|
||||||
|
this.router.navigate(['/producto', productId]);
|
||||||
|
}
|
||||||
|
|
||||||
private loadProducts(page: number): void {
|
private loadProducts(page: number): void {
|
||||||
this.activeRequestId += 1;
|
this.activeRequestId += 1;
|
||||||
|
|||||||
@@ -11,6 +11,13 @@ export const routes: Routes = [
|
|||||||
{
|
{
|
||||||
path: '',
|
path: '',
|
||||||
component: StoreHomePageComponent
|
component: StoreHomePageComponent
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'producto/:id',
|
||||||
|
loadComponent: () =>
|
||||||
|
import('./pages/product-detail-page/product-detail-page.component').then(
|
||||||
|
(m) => m.ProductDetailPageComponent
|
||||||
|
)
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user