How to customise keyboard navigation of AgGrid in an Angular application

Right now when I click on tab focus moves to next cell of the ag grid, I want to implement navigation in such a way that

1. if focus is on column header(not last), the focus should move to next column header.
2. If focus is on last column header and user press tab then the focus should move to next row(1st row in this case) and the entire row should get highlighted(by default focus moves to 1st cell of the 1st row, I want to avoid that in this case).
3. When a row is focused, and user clicks tab then the next editable cell of that row should get focused, if the row doesn't have such a editable cell/field, then focus should move to next row(entire row).

//HTML
      <ag-grid-angular
      theme="legacy"
        class="ag-theme-quartz"
        style="height: 700px;"
        [rowData]="rowData"
        [columnDefs]="colDefs"
  />

import { Component } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import { AgGridAngular } from 'ag-grid-angular';
import type { ColDef } from 'ag-grid-community';
import 'ag-grid-community/styles/ag-grid.css';
import 'ag-grid-community/styles/ag-theme-quartz.css';

import { AllCommunityModule, ModuleRegistry } from 'ag-grid-community';
ModuleRegistry.registerModules([AllCommunityModule]);
@Component({
  selector: 'app-root',
  imports: [ AgGridAngular],
  templateUrl: './app.component.html',
  styleUrl: './app.component.scss'
})
export class AppComponent {
    rowData = [
        { make: "Tesla", model: "Model Y", price: 64950, electric: true },
        { make: "Ford", model: "F-Series", price: 33850, electric: false },
        { make: "Toyota", model: "Corolla", price: 29600, electric: false },
    ];

    colDefs: ColDef[] = [
        { field: "make", headerName: "Company" },
        { field: "model"  },
        { field: "price" },
        { field: "electric", editable: true }
    ];
  }