JSFiddle - React, Tailwind, and code Playground

HTML

<link href="https://unpkg.com/tabulator-tables/dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/tabulator-tables/dist/js/tabulator.min.js"></script>

<!-- <link href="https://unpkg.com/tabulator-tables@5.1.8/dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="https://unpkg.com/tabulator-tables@5.1.8/dist/js/tabulator.min.js"></script> -->

<div id="vehicles"></div>

JavaScript

var deptList = [
  {
  option: 1,
  value: "Sales"
  },
  {
  option: 2,
  value: "Service"
  },
  {
  option: 3,
  value: "Bodyshop"
  },
  {
  option: 4,
  value: "Carwash"
  }
]

var serviceList = [
  {
  dept: 1,
  option: 2,
  value: "Spot delivery (Used)",
  price: 35
  },
  {
  dept: 1,
  option: 3,
  value: "New delivery",
  price: 45
  },
  {
  dept: 1,
  option: 4,
  value: "Used delivery + Paint Protection",
  price: 80
  },
  {
  dept: 1,
  option: 5,
  value: "Showroom",
  price: 45
  },
  {
  dept: 1,
  option: 6,
  value: "Full recon (Sales)",
  price: 115
  },
]

let vehiclesList = [
  {
  dept: "Sales",
  service: "New delivery",
  },
  {
  dept: "Sales",
  service: "New delivery",
  },
  {
  dept: "Sales",
  service: "Headlight restoration (both)",
  },
  {
  dept: "Sales",
  service: "New delivery",
  },
  {
  dept: "Sales",
  service: "New delivery",
  },
  {
  dept: "Sales",
  service: "New delivery",
  },
  {
  dept: "Sales",
  service: "New delivery",
  },
  {
  dept: "Service",
  service: "Used delivery",
  },
]


const table = new Tabulator("#vehicles", {
  height: "100%",
  data: vehiclesList,
  layout: "fitData",
	columns:[
// For v5.2
 	{title:"DEPT", field:"dept", width:90, hozAlign:"left", editor:"list", editorParams:{values: {1:"Sales",2:"Service",3:"Bodyshop",4:"Carwash"}}},
 	{title:"WORK Type", field:"service", editor:"list", editorParams:{values: serviceList}},

//For v5.1
	//{title:"DEPT", field:"dept", width:90, editor:"select", editorParams:{values: getDepts}},
	//{title:"WORK", field:"service", width:190, editor:"select", editorParams:{values: getServices}},
	],
});


//Get the Department list
var depts;
function callbackDepts(response) {
	depts = response;
}
	
fetch(deptList)
.then(response => {
		return response.json();
})
.then(data => callbackDepts(data));

function getDepts(cell){
	const formattedDepts = {};
	if (depts){
		for (let i = 0; i < depts.length; i++){
			const dept = depts[i];
			formattedDepts[dept.option] =...