JSFiddle - React, Tailwind, and code Playground

HTML

<link rel ="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.css"/>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.js"></script>
<script src="https://momentjs.com/downloads/moment.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.flash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.print.min.js"></script>
<script src="https://cdn.datatables.net/rowgroup/1.1.2/js/dataTables.rowGroup.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.3/js/buttons.bootstrap4.min.js"></script>
<script src="https://cdn.datatables.net/1.10.21/js/dataTables.bootstrap4.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
<link rel ="stylesheet" href="https://cdn.datatables.net/rowgroup/1.1.2/css/rowGroup.bootstrap4.min.css"/>
<link rel ="stylsheet" href="https://cdn.datatables.net/1.10.21/css/dataTables.bootstrap4.min.css"/>
<link rel ="stylesheet" href="https://cdn.datatables.net/buttons/1.6.3/css/buttons.bootstrap4.min.css"/>
  <div class ="heading">
  <h1 class="center"><strong>Deliverables</strong></h1>
  <p><strong>Click the Program/Deliverable names to Collapse/Expand the rows</strong></p>
  </div>
<div class ="container">
<table id="myTable" class="table table-bordered" cellspacing="0" width="100%">
  <thead class="thead-dark">
    <tr>
      <th>Program</th>
     ...

CSS

h1{
  text-align: center;
}
p{
  text-align: center;
}

JavaScript

var dataSet = [
    [ "AMMO", "Meeting Minutes", "[email protected]", "02/10/2020", "Yes", "Example Notes" ],
    [ "AMMO", "Monthly Status Report", "[email protected]", "02/10/2020", "Yes", "Example Notes" ],
    [ "Dar-Q", "Meeting Minutes", "[email protected]", "02/10/2020", "Yes", "Example Notes" ],
    [ "Dar-Q", "Monthly Status Report", "[email protected]", "02/10/2020", "Yes", "Example Notes" ],
    [ "WTBn", "Meeting Minutes", "[email protected]", "02/10/2020", "Yes", "Example Notes" ],
    [ "WTBn", "Monthly Status Report", "[email protected]", "02/10/2020", "Yes", "Example Notes" ],
];
 
$(document).ready(function() {
 var collapsedGroups = {}; 
    var top = '';
    var parent = '';

  var table = $('#myTable').DataTable( {
        data: dataSet,
        columns: [
            { title: "Program" },
            { title: "Deliverable" },
            { title: "To" },
            { title: "Date" },
            { title: "Approved" },
            { title: "Notes" }
        ],
        dom: "<'row'<'col-sm-12 col-md-10'f><'col-sm-12 col-md-2'B>>" +
"<'row'<'col-sm-12'tr>>" +
"<'row'<'col-sm-12 col-md-5'i><'col-sm-12 col-md-7'p>>",
	 buttons: [{
      extend: 'collection',
      className: "btn-dark",
      text: 'Export',
      buttons:
      [{
      extend: "excel", className: "btn-dark"
    },
	  {
      extend: "pdf", className: "btn-dark"
    },
       {
      extend: "print", className: "btn-dark"   
    },
	{
	text: 'Update Table',
	action: function (e, dt, node, config){
		alert( 'Button activated' );
		}
	}
      ],
    }],
	order: [[0, 'asc'], [1, 'asc'] ],	
	rowGroup: {
            dataSrc: [
			'Program',
			'Deliverable'
			],
            startRender: function (rows,group,level){
				var all;
            	if (level === 0) {
                    top = group;
                    all = group;
                } else if (level === 1) {
                    parent = top + group; 
                    all = parent; 
                    // if...