JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html manifest="/XMII/CM/EnCompass/grid/grid.appcache">
<head>
	 <meta http-equiv="X-UA-Compatible" content="IE=8,9,EDGE" />
	 <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
	 <meta http-equiv="Pragma" content="no-cache" />
	 <meta http-equiv="Expires" content="0" />
	 <title>NC Summary Report</title>
	<!-- Ignite UI Required Combined CSS Files -->
    <link href="http://cdn-na.infragistics.com/igniteui/2016.2/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />
    <link href="http://cdn-na.infragistics.com/igniteui/2016.2/latest/css/structure/infragistics.css" rel="stylesheet" />

    <script src="http://ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.8.3.js"></script>
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
    <script src="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>
    <script src="http://www.igniteui.com/js/angular.min.js"></script>

    <!-- Ignite UI Required Combined JavaScript Files -->
    <script src="http://cdn-na.infragistics.com/igniteui/2016.2/latest/js/infragistics.core.js"></script>
    <script src="http://cdn-na.infragistics.com/igniteui/2016.2/latest/js/infragistics.lob.js"></script>

    <script src="http://cdn-na.infragistics.com/igniteui/2016.2/latest/js/extensions/igniteui-angular.js"></script>

	<script type="text/javascript">
		var sampleApp = angular.module('NCSummaryConfiguration', ['igniteui-directives']);
		sampleApp.controller('NCSummaryController', function ($scope) {
			$scope.data = [{sfc: "asd", comments: "comment1", "category": "cat1", incident: "i1", "name": "something", history: [], history_second: []}];
		});
    $(document).on("igchildgridcreating", function (evt, ui) {
      if (ui.element.attr("id").indexOf("_history_") !== -1) {
        ui.options.dataSource = [{Component: "Component1"}];
      }
      if (ui.element.attr("id").indexOf("_historySecond_") !== -1) {
        ui.options.dataSource =...