JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <label class="narrow" for="category">Category</label>
  <input id="category" type="text" name="category" value="" />
  <span> &larr; </span>
  <select id="category_selection" name="category_selection" onchange="$('#category').val($('#category_selection option:selected').text()) ">
      <option value="Supplies">Supplies</option>
      <option value="Waste">Waste</option>
      <option value="Equipment">Equipment</option>
      <option value="Cleaning">Cleaning</option>
      <option value="Support">Support</option>
      <option value="Coffee">Coffee</option>
      <option value="Toilet">Toilet</option>
  </select>
</div>

JavaScript

// Copy selected drop-down item to a text input
function copySelected(fromId, toId) {
		$('#category').val($('#category_selection option:selected').text())
    $(toId)       .val($(fromId+" option:selected").text());
    
    copySelected("category_selection", "category")
}