Object is possibily undefined and the left hand side of assignment expression may not be an optional property access typescript angular

I have below class

export declare abstract class BaseFormComponent<T> {
    controlsConfig?: IMeta;
}

export declare interface IMeta {
    container?: IContainer;
}

export declare interface IContainer {
    layoutConfig?: ILayoutConfig[];
}

export declare interface ILayoutConfig {
    componentConfig?: IComponentConfig[];
}
export declare interface IComponentConfig {
    componentProperty?: IComponentProperty;
}

export declare interface IComponentProperty {
    options?: IOptions[] | any;
    value?: string | any;
}

Now one of the angular components I have defined the control config as below

@Component({
  selector: 'fetebird-ui-subcategory-add-edit',
  templateUrl: './subcategory-add-edit.component.html',
  styleUrls: ['./subcategory-add-edit.component.scss'],
  providers: [ProductSubCategoryStore, ProductCategoryStore]
})
export class SubcategoryAddEditComponent extends BaseFormComponent<SubCategoryModel> implements OnInit {
constructor() {
    super();
    this.defineForm();
  }

    protected defineForm(): void {
        this.controlsConfig = {
          container: {
            fxLayout: FxLayout.Column,
            fxLayoutAlignHorizontal: AlignmentLayoutDirection.SpaceBetween,
            fxLayoutAlignVertical: AlignmentLayoutDirection.None,
            layoutConfig: [
              {
                fxLayout: FxLayout.Column,
                fxLayoutGap: '10px',
                componentConfig: [
                  {
                    componentProperty: {
                      options: this.categories,
                      value: ""
                    },
                  },
                ]
              }
            ]
          }
        };
      }
}

Facing the below

Tried with if statement, but still same issue

if (
          this.controlsConfig?.container?.layoutConfig &&
          this.controlsConfig?.container?.layoutConfig[0].componentConfig &&
          this.controlsConfig?.container?.layoutConfig[0].componentConfig[0].componentProperty?.options
        ) {
          this.controlsConfig?.container?.layoutConfig[0].componentConfig[0] = [];
        }

The left-hand side of an assignment expression may not be an optional property access.

Using Typescript 4.7.3