Is it possible to do inheritance for DTOs in NestJs?

Question

I have a NestJs Get controller which searches for a list of employees.

@Controller('employee')
export class EmployeeController {
    private logger = new Logger('EmployeeController');
    constructor(private employeeService:EmployeeService){}

    @Get()
    @UsePipes(new ValidationPipe({ transform: true }))
    getEmployees(
        @Query() filter:GetEmployeesFilterDto
    ):Promise<Employee[]>{
        console.log(JSON.stringify(filter), filter.batch);
        return this.employeeService.getEmployees(filter);
    }
}

In order to support pagination, the method accepts a filter DTO to accept parameters such as batch size and page number. Seeing as how this will be common parameters for other DTO classes, I thought of creating a base filter DTO:

export class BaseQueryFilterDto{

    @IsOptional()
    @IsInt()
    @UsePipes(ParseIntPipe)
    batch:number;

    @IsOptional()
    @IsInt()
    @UsePipes(ParseIntPipe)
    skip:number;

}

And then inherit this DTO for the GetEmployeesFilterDto:

export class GetEmployeesFilterDto extends BaseQueryFilterDto{
    @IsOptional()
    @IsNotEmpty()
    search:string;

    @IsOptional()
    primarySupervisorId:string;

}

Running the following request http://localhost:3000/employee?batch=30 would throw the following exception:

[Nest] 27920   - 02/14/2020, 6:29:54 PM   [ExceptionsHandler] Cannot assign to read only property 'batch' of object '#<GetEmployeesFilterDto>' +606974ms
TypeError: Cannot assign to read only property 'batch' of object '#<GetEmployeesFilterDto>'
    at _loop_1 (C:\ng-proj\nestjs-tutorial\node_modules\class-transformer\TransformOperationExecutor.js:242:47)
    at TransformOperationExecutor.transform (C:\ng-proj\nestjs-tutorial\node_modules\class-transformer\TransformOperationExecutor.js:260:17)
    at ClassTransformer.plainToClass (C:\ng-proj\nestjs-tutorial\node_modules\class-transformer\ClassTransformer.js:17:25)    at Object.plainToClass (C:\ng-proj\nestjs-tutorial\node_modules\class-transformer\index.js:20:29)
    at ValidationPipe.transform (C:\ng-proj\nestjs-tutorial\node_modules\@nestjs\common\pipes\validation.pipe.js:55:41)
    at transforms.reduce (C:\ng-proj\nestjs-tutorial\node_modules\@nestjs\core\pipes\pipes-consumer.js:15:33)
    at process._tickCallback (internal/process/next_tick.js:68:7)

However, when i move all the properties from the super class to GetEmployeesFilterDto like so:

export class GetEmployeesFilterDto extends BaseQueryFilterDto{
    @IsOptional()
    @IsNotEmpty()
    search:string;

    @IsOptional()
    primarySupervisorId:string;

    //Moved from BaseQueryFilterDto
    @IsOptional()
    @IsInt()
    @UsePipes(ParseIntPipe)
    batch:number;

    @IsOptional()
    @IsInt()
    @UsePipes(ParseIntPipe)
    skip:number;

}

The request runs successfully. Am I missing out something here or can I not implement inheritance to controller DTOs in NestJs?

Answer 1

Thanks to @JayMcDoniel for pointing out that I shouldn't be using @UsePipes() on properties.

Here's the solution that works fine for me.

export class BaseQueryFilterDto{

    @IsOptional()
    @Type(() => Number)
    batch:number;

    @IsOptional()
    @Type(() => Number)
    skip:number;

}