product grid creating
This commit is contained in:
sdarbinyan
148
docs/Catalog-Module-Report.md
Normal file
148
docs/Catalog-Module-Report.md
Normal file
@@ -0,0 +1,148 @@
|
||||
# Catalog Module Report
|
||||
|
||||
## Scope
|
||||
|
||||
Sprint 5 added a Catalog Module on the frozen platform architecture. No backend APIs, authentication, payment, or bootstrap contracts were changed.
|
||||
|
||||
The catalog uses existing domain boundaries:
|
||||
|
||||
- Category data: `CategoryFacade` -> `CategoryService` -> Category Repository -> existing `GET /category`
|
||||
- Product data: `ProductFacade` -> `ProductDataService` -> Product Provider -> existing product/category item endpoints
|
||||
|
||||
## Implemented Module
|
||||
|
||||
### Catalog Container
|
||||
|
||||
- `src/app/features/website/catalog/containers/catalog-container.component.ts`
|
||||
- `src/app/features/website/catalog/containers/catalog-container.component.html`
|
||||
- `src/app/features/website/catalog/containers/catalog-container.component.scss`
|
||||
|
||||
Responsibilities implemented:
|
||||
|
||||
- Reads the route category id.
|
||||
- Requests category data through `CategoryFacade` only.
|
||||
- Requests product data through `ProductFacade` only.
|
||||
- Determines whether the current category has child categories.
|
||||
- Renders category grid when child categories exist.
|
||||
- Renders product grid when no child categories exist.
|
||||
- Supports root catalog entry with root categories.
|
||||
- Handles loading, empty, and error states.
|
||||
- Cancels prior category/product data subscriptions when the route changes.
|
||||
|
||||
No `HttpClient`, backend DTO, auth, payment, bootstrap, or tenant-specific logic is used in the container.
|
||||
|
||||
### Category Grid
|
||||
|
||||
- `src/app/features/website/catalog/components/category-grid/category-grid.component.ts`
|
||||
- `src/app/features/website/catalog/components/category-grid/category-grid.component.html`
|
||||
- `src/app/features/website/catalog/components/category-grid/category-grid.component.scss`
|
||||
|
||||
Reusable category grid implemented with:
|
||||
|
||||
- Input: `Category[]`
|
||||
- Output: selected `Category`
|
||||
- Responsive grid layout
|
||||
- Domain model only
|
||||
- No data fetching
|
||||
- No backend DTOs
|
||||
|
||||
### Product Grid
|
||||
|
||||
- `src/app/features/website/catalog/components/product-grid/product-grid.component.ts`
|
||||
- `src/app/features/website/catalog/components/product-grid/product-grid.component.html`
|
||||
- `src/app/features/website/catalog/components/product-grid/product-grid.component.scss`
|
||||
|
||||
Reusable product grid implemented with:
|
||||
|
||||
- Input: `Product[]`
|
||||
- Output: selected `Product`
|
||||
- Output: add-to-cart payload
|
||||
- Output: product preview id
|
||||
- Responsive grid layout
|
||||
- Uses existing reusable product card
|
||||
- No `HttpClient`
|
||||
- No backend DTOs
|
||||
|
||||
### Product Card Compatibility
|
||||
|
||||
- `src/app/components/product-card/product-card.component.ts`
|
||||
- `src/app/components/product-card/product-card.component.html`
|
||||
|
||||
Updated the reusable product card to depend on the Product Domain type and added an explicit selected output.
|
||||
|
||||
The product card remains input/output-only and does not use services, storage, `HttpClient`, or environment configuration. It displays image, title, price, discount, badges, and stock.
|
||||
|
||||
### Catalog State
|
||||
|
||||
- `src/app/features/website/catalog/models/catalog-state.model.ts`
|
||||
|
||||
Prepared future state architecture for:
|
||||
|
||||
- Category
|
||||
- Search
|
||||
- Sort
|
||||
- Price range
|
||||
- Attributes
|
||||
- Pagination
|
||||
- Filters
|
||||
|
||||
Backend filtering was intentionally not implemented in this sprint.
|
||||
|
||||
## Navigation
|
||||
|
||||
Updated routes in `src/app/app.routes.ts`:
|
||||
|
||||
- `/catalog`
|
||||
- `/catalog/:id`
|
||||
|
||||
Both routes load the same catalog container. Legacy category URLs redirect to the catalog route:
|
||||
|
||||
- `/category/:id` -> `/catalog/:id`
|
||||
- `/category/:id/items` -> `/catalog/:id`
|
||||
|
||||
Home category links now point to `/catalog/:id`.
|
||||
|
||||
## Unlimited Category Depth
|
||||
|
||||
Unlimited nesting is supported by the Category Domain tree utilities from Sprint 4. The catalog container does not assume a fixed depth. For any category id, it asks `CategoryFacade.getChildren(categoryId)`:
|
||||
|
||||
- if children exist, it renders the category grid
|
||||
- if no children exist, it loads the product grid
|
||||
|
||||
This same decision repeats for every category route depth.
|
||||
|
||||
## Localization
|
||||
|
||||
Added catalog translations in:
|
||||
|
||||
- `src/app/i18n/en.ts`
|
||||
- `src/app/i18n/ru.ts`
|
||||
- `src/app/i18n/hy.ts`
|
||||
- `src/app/i18n/translations.ts`
|
||||
|
||||
## Validation
|
||||
|
||||
Completed checks:
|
||||
|
||||
- Unlimited category depth is supported through facade child lookup and recursive category domain tree utilities.
|
||||
- Product grid is reusable and consumes `Product[]`.
|
||||
- Category grid is reusable and consumes `Category[]`.
|
||||
- Catalog components use domain models only.
|
||||
- Catalog data requests go through facades only.
|
||||
- DTOs remain isolated outside the catalog module.
|
||||
- Catalog module has no `HttpClient` usage.
|
||||
- Product card has no services, storage, `HttpClient`, or environment usage.
|
||||
- Authentication was not modified.
|
||||
- Payment was not modified.
|
||||
- Bootstrap contracts were not modified.
|
||||
- Backend APIs were not modified.
|
||||
|
||||
Build validation passed:
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
## Stop Point
|
||||
|
||||
Catalog Module implementation is complete for Sprint 5. Stop here for approval before starting the next module or any Builder/Backoffice work.
|
||||
Reference in New Issue
Block a user