Renderizar jquery datatable dentro de React-pivottable

He implementado react-pivottablesolo quería saber si hay una manera de mostrar todo el conjunto de datos en la vista de tabla de datos jQuery

es decir, tengo algunas columnas que quiero mostrarlas todas en una vista tabular para los siguientes datos a continuación

[
 'SRN', 'MainSystemType', 'MagnetType', 'MagnetCoverType', 'MagnetRMMUType',
 'MagnetHighOrderShimPowerSupply', 'GradientAmplifierType', 
 'GradientInterfaceType', 'GradientSwitchType', 'RFSystemB1FieldSystem', 
 'RFSystemFrontendInterface', 'CabinetsDasCabinet', 
 'ReconstructorAvailableMemory', 'ReconstructorNumberOfProcessors', 
 'AcquisitionSystemBulkBoardType', 'CabinetsCoolersCabinet', 
 'AcquisitionSystemType', 'PatientSupportPatientSupportType', 
 'PatientInterfaceMiscellaneousBoxType', 'PatientInterfacePPUType', 
 'PatientInterfaceType', 'PatientInterfaceAudioModule', 
 'PatientInterfaceAudioSwitchType', 'PatientSupportPowerSupplyUnit', 
 'RFAmpType', 'IOP_Firmware', 'RFP_Firmware'
],
[
 108, 'WA15', 'WA_15T', 'Wide Aperture', 'MEU', 'NONE', '781', 'IGCIDNA', 
 'NONE', 'HIGH', 'TFINT', 'DACC', 65536, 1, 'NONE', 'LCC2B', 'DDAS', 
 'IMT', 'AIBo', 'NONE', 'wBTU', 'AM3 With E-Stop', null, 'PSU2', 
 'S35_64', 'IOP.NA', 'RFP.NA'
],
[
 121, 'T15', 'F2000', 'Achieva', 'MEU', 'NONE', '781', 'IGCIDNA', 'NONE', 
 'HIGH', 'CFINT', 'DACC', 65536, 1, 'NONE', 'LCC2B', 'DDAS', 'MT', 'AIBo', 
 'NONE', 'wBTU', 'AM3 With E-Stop', null, 'NONE', 'S35_64', 'IOP.NA', 
 'RFP.NA'
],
[
 117, 'T30', '3T_2', 'Achieva AmbiRing', 'MEU', '810_85893', '787', 'IGCI', 
 'Gradient Switchbox', 'HIGH', null, 'DACC', 65536, 1, null, 'LCC2A', 'CDAS', 
 'MT', null, 'NONE', 'wBTU', null, 'VERSION 2', null, '8134_128', 'IOP.NA', 
 'RFP.NA'
]

Vista tabular con todos los datos (orden de búsqueda y opción de descarga).

Permítanme, ¿hay una opción https://www.npmjs.com/package/pivottable a la vista si debo ajustar para lograr esto?

No mostré todas las columnas, pero debería poder modificar mi ejemplo para incluir columnas adicionales.

https://codesandbox.io/s/vibrant-haze-f9nro

import React, { useEffect } from "react";
import PivotTable from "pivottable";
import $ from "jquery";
import "react-pivottable/pivottable.css";

const App = () => {
  useEffect(() => {
    $("#output").pivot(
      [
        {
          SRN: 108,
          MainSystemType: "WA15",
          MagnetCoverType: "WA_15T",
          MagnetRMMUType: "Wide Aperture"
        },
        {
          SRN: 121,
          MainSystemType: "T15",
          MagnetCoverType: "F2000",
          MagnetRMMUType: "Achieva"
        },
        {
          SRN: 117,
          MainSystemType: "T30",
          MagnetCoverType: "3T_2",
          MagnetRMMUType: "Achieva AmbiRing"
        }
      ],
      {
        rows: ["SRN", "MainSystemType"],
        cols: ["MagnetCoverType", "MagnetRMMUType"]
      }
    );
  }, []);

  return <div id="output" />;
};

export default App;