Push FormGroup inside FormArray in Angular Reactive Forms

I have formArray of which will contain some price adjustment rules. Each rule will contain a FormGroup and each FormGroup with 4 formControls. When I am trying to push the the FormGroup the FormArray getting this error Argument of type 'FormGroup<any>' is not assignable to parameter of type 'never'.

public rules = new FormArray([]);

private getRuleFormGroup(): FormGroup {
   return this._formBuilder.group({
    from: new FormControl('', {
       nonNullable: true,
       validators: [Validators.required]
    }),
    to: new FormControl('', {
       nonNullable: true,
       validators: [Validators.required]
    }),
    increaseBy: new FormControl('', {
       nonNullable: true,
       validators: [Validators.required]
    }),
    increaseType: new FormControl('', {
       nonNullable: true,
       validators: [Validators.required]
    })
   });
}

private addNewRule(): void {
   const group = this.getRuleFormGroup();
   this.rules.push(group); //Getting error here
}

>Solution :

try:

this.rules.controls.push(group);

Just as FormGroups organize themselves into controls, FormArrays also do, each control being a FormGroup or even a loose FormControl.