stepper component not working

Hi,

Trying to use stepper and I'm getting the following error on the browser console. Anything I'm doing wrong? below is the error:

ERROR TypeError: Cannot set properties of undefined (setting 'isActive') at MdbStepperComponent._setActiveStep (mdb-angular-ui-kit-stepper.mjs:352:9) at MdbStepperComponent.ngAfterContentInit (mdb-angular-ui-kit-stepper.mjs:371:14) at callHook (core.mjs:2526:1) at callHooks (core.mjs:2495:1) at executeInitAndCheckHooks (core.mjs:2446:1) at refreshView (core.mjs:9510:1) at refreshComponent (core.mjs:10640:1) at refreshChildComponents (core.mjs:9265:1) at refreshView (core.mjs:9519:1) at refreshEmbeddedViews (core.mjs:10594:1)

HTml Code is as follows:

<mdb-stepper [orientation]="'vertical'">
    <mdb-step *ngFor="let bdata of bulkCustomerData" [name]="bdata.formData.customerName" [editable]="false">
      {{bdata.formData.customerName}}
    </mdb-step>
  </mdb-stepper>

TS Code is as follows:

import { Component, OnInit } from '@angular/core';
import { BusinessService } from '../business.service';
import { BulkCustomerData } from '../models/data-models';

@Component({ 
        selector: 'app-stepper', 
        templateUrl: './stepper.component.html', 
        styleUrls: ['./stepper.component.scss']
})

export class StepperComponent implements OnInit {

    bulkCustomerData: BulkCustomerData[] | undefined;

    constructor( 
        private business: BusinessService 
    ) { 
        this.getCustomerData(); 
}

    ngOnInit(): void {

    }

getCustomerData(): void{ this.business.getCustomerData().subscribe((data) => {         this.bulkCustomerData = data; 
}) 
}

    }