feat: Implement full-stack Veil entity management with dedicated backend services and frontend UI components.

Author: beginwebdev2002

backend/src/veil/domain/veil.entity.ts

@@ -4,7 +4,7 @@ export interface VeilProps {
   description: string;
   price: number;
   rentalPrice: number;
-  images: string[];
+  image: string;
   category: string;
   isAvailable?: boolean;
   sku?: string;
@@ -23,7 +23,7 @@ export class Veil {
   public readonly description: string;
   public readonly price: number;
   public readonly rentalPrice: number;
-  public readonly images: string[];
+  public readonly image: string;
   public readonly category: string;
   public readonly isAvailable: boolean;
   public readonly sku?: string;
@@ -41,7 +41,7 @@ export class Veil {
     this.description = props.description;
     this.price = props.price;
     this.rentalPrice = props.rentalPrice;
-    this.images = props.images;
+    this.image = props.image;
     this.category = props.category;
     this.isAvailable = props.isAvailable ?? true;
     this.sku = props.sku;

backend/src/veil/infrastructure/repositories/veil.repository.ts

@@ -57,7 +57,7 @@ export class VeilRepository {
       description,
       price,
       rentalPrice,
-      images,
+      image,
       category,
       isAvailable,
       sku,
@@ -76,7 +76,7 @@ export class VeilRepository {
       description,
       price,
       rentalPrice,
-      images,
+      image,
       category,
       isAvailable,
       sku,

backend/src/veil/infrastructure/schemas/veil.schema.ts

@@ -17,8 +17,8 @@ export class VeilSchemaEntity {
   @Prop({ required: true })
   rentalPrice: number;
 
-  @Prop([String])
-  images: string[];
+  @Prop({ required: true })
+  image: string;
 
   @Prop({ required: true })
   category: string;

backend/src/veil/presentation/dto/create-veil.dto.ts

@@ -2,7 +2,6 @@ import {
   IsString,
   IsNotEmpty,
   IsNumber,
-  IsArray,
   IsOptional,
   IsBoolean,
 } from 'class-validator';
@@ -27,14 +26,9 @@ export class CreateVeilDto {
   @Type(() => Number)
   rentalPrice: number;
 
-  @IsArray()
   @IsOptional()
-  @IsString({ each: true })
-  @Transform(({ value }: { value: string | string[] }) => {
-    if (!!value && Array.isArray(value)) return value;
-    return typeof value === 'string' ? value.split(',') : [];
-  })
-  images: string[];
+  @IsString()
+  image: string;
 
   @IsString()
   @IsNotEmpty()

backend/src/veil/presentation/veil.controller.ts

@@ -54,12 +54,12 @@ export class VeilController {
     @Body() createVeilDto: CreateVeilDto,
     @UploadedFiles() files: Array<Express.Multer.File>,
   ): Promise<Veil> {
-    const imagePaths = files
-      ? files.map((file) => `/uploads/veils/${file.filename}`)
-      : [];
+    const imagePath =
+      files && files.length > 0 ? `/uploads/veils/${files[0].filename}` : null;
+
     const veilData = {
       ...createVeilDto,
-      images: [...(createVeilDto.images || []), ...imagePaths],
+      image: imagePath || createVeilDto.image,
     };
     const veil = veilData as unknown as Omit<Veil, 'id' | 'createdAt'>;
     return this.veilService.create(veil);
@@ -84,23 +84,17 @@ export class VeilController {
     @Body() updateVeilDto: UpdateVeilDto,
     @UploadedFiles() files: Array<Express.Multer.File>,
   ): Promise<Veil> {
-    const imagePaths = files
-      ? files.map((file) => `/uploads/veils/${file.filename}`)
-      : [];
-    let existingImages: string[] = [];
-    if (updateVeilDto.images) {
-      if (Array.isArray(updateVeilDto.images)) {
-        existingImages = updateVeilDto.images;
-      } else {
-        existingImages = [updateVeilDto.images];
-      }
-    }
+    const imagePath =
+      files && files.length > 0 ? `/uploads/veils/${files[0].filename}` : null;
 
     const veilData = {
       ...updateVeilDto,
-      images: [...existingImages, ...imagePaths],
     };
 
+    if (imagePath) {
+      veilData.image = imagePath;
+    }
+
     return this.veilService.update(id, veilData as unknown as Partial<Veil>);
   }
 

frontend/src/app.routes.ts

@@ -29,15 +29,33 @@ export const routes: Routes = [
       {
         path: "dashboard",
         loadComponent: () =>
-          import("./pages/dashboard/dashboard.component").then(
-            (m) => m.DashboardComponent,
-          ),
+          import("@pages/dashboard").then((m) => m.DashboardComponent),
+      },
+      {
+        path: "veil",
+        loadComponent: () =>
+          import("@pages/veil").then((m) => m.VeilPageComponent),
+      },
+      {
+        path: "services",
+        loadComponent: () =>
+          import("@pages/services").then((m) => m.ServicesPageComponent),
+      },
+      {
+        path: "clients",
+        loadComponent: () =>
+          import("@pages/dashboard").then((m) => m.DashboardComponent),
+      },
+      {
+        path: "gallery",
+        loadComponent: () =>
+          import("@pages/gallery").then((m) => m.GalleryComponent),
+      },
+      {
+        path: "settings",
+        loadComponent: () =>
+          import("@pages/settings").then((m) => m.SettingsComponent),
       },
-      { path: "veil", component: VeilPageComponent },
-      { path: "services", component: ServicesPageComponent },
-      { path: "clients", component: DashboardComponent },
-      { path: "gallery", component: GalleryComponent },
-      { path: "settings", component: SettingsComponent },
     ],
   },
 

frontend/src/core/interceptors/api.interceptor.ts

@@ -1,17 +1,21 @@
-import { HttpInterceptorFn } from '@angular/common/http';
-import { environment } from '@environments/environment';
+import { HttpInterceptorFn } from "@angular/common/http";
+import { environment } from "@environments/environment";
+import { linkServerConvert } from "@shared/lib";
 
 export const apiInterceptor: HttpInterceptorFn = (req, next) => {
-  if (req.url.startsWith('/')) {
-    const token = typeof localStorage !== 'undefined' ? localStorage.getItem('token') : null;
+  if (req.url.startsWith("/")) {
+    const token =
+      typeof localStorage !== "undefined"
+        ? localStorage.getItem("token")
+        : null;
     let headers = req.headers;
     if (token) {
-      headers = headers.set('Authorization', `Bearer ${token}`);
+      headers = headers.set("Authorization", `Bearer ${token}`);
     }
 
     const apiReq = req.clone({
-      url: `${environment.apiUrl}${req.url}`,
-      headers
+      url: linkServerConvert(req.url),
+      headers,
     });
     return next(apiReq);
   }

frontend/src/entities/veil/veil.service.ts

@@ -2,6 +2,7 @@ import { Injectable, inject, signal } from "@angular/core";
 import { HttpClient } from "@angular/common/http";
 import { Observable, tap } from "rxjs";
 import { Veil } from "@features/veil";
+import { formDataExcludeProperty, objectExcludePropety } from "@shared/lib";
 
 @Injectable({
   providedIn: "root",
@@ -32,7 +33,12 @@ export class VeilService {
       );
   }
 
-  updateVeil(id: string, veil: Partial<Veil> | FormData): Observable<Veil> {
+  updateVeil(id: string, veil: FormData): Observable<Veil> {
+    const updatedVeil = formDataExcludeProperty(veil, [
+      "id",
+      "createdAt",
+      "updatedAt",
+    ]);
     return this.http
       .put<Veil>(`${this.apiUrl}/${id}`, veil)
       .pipe(

frontend/src/features/veil/model/veil.data.ts

@@ -4,7 +4,7 @@ export interface Veil {
   description?: string;
   price: number;
   rentalPrice: number;
-  images?: string[];
+  image?: string;
   category: string;
   isAvailable: boolean;
   sku: string;

frontend/src/pages/user-home/user-home.component.ts

@@ -21,7 +21,7 @@ export class UserHomeComponent implements OnInit {
   http = inject(HttpClient);
 
   ngOnInit(): void {
-    this.http.get(API_ENDPOINTS.AdminSettings).subscribe((res) => {
+    this.http.get(API_ENDPOINTS.ADMIN.SETTINGS).subscribe((res) => {
       console.log(res);
     });
   }