Download Json as csv File

Youssef Bouchara_oln0q7

Hello, I have a react file that looks like this:

export default class ShareFilter extends Component {

  constructor(props) {

    super(props);

    this.state = {

      error: null,

      isLoaded: false,

      shareFilterRows: []

    };

    }

  componentDidMount() {

    fetch(AJS.contextPath() + "/rest/securityrestresource/1.0/results?check=ShareFilter")

    .then((res)=>{

      if(res.ok) {

        return res.json();

      }

    }).then((res)=>{

      this.setState({

        isLoaded: true,

        shareFilterRows: res.map((row, index) => ({

          key: `row-${index}-${row.filterID}`,

          cells: [{

            key: `${row.filterID}`,

            content: row.filterID,

            },

            {

            key: `${row.author}`,

            content: row.author,

            },

            {

            key: `${row.filtername}`,

            content: row.filtername,

            },

            {

            key: `${row.jql}`,

            content: row.jql,

            },]}))

      })

      })

    }

  render() {

    const { error, isLoaded, shareFilterRows } = this.state;

    if (error) {

      return <div>Error: {error.message}</div>;

    } else if (!isLoaded) {

      return <div>Loading Shared Filters...</div>;

    } else {

      return (<Wrapper>

        <div>

        <DynamicTable

          head={shareFilterHead}

          rows={shareFilterRows}

          rowsPerPage={10}

          defaultPage={1}

          loadingSpinnerSize="large"

          isLoading={false}

          isFixedSize

          defaultSortKey="filterID"

          defaultSortOrder="ASC"

          onSort={() => console.log('onSort')}

          onSetPage={() => console.log('onSetPage')}

        

          />

      </div>

      </Wrapper>

      );

      }

  }

}

 

I would like to download {ShareFilterRows} and {ShareFilterHead} as a .CSV file when I click on a button. The data is in JSON, I tried many open source libraries but I couldnt get it done:

 

import {shareFilterHead} from "./content/share-filter";

import {shareFilterRows} from "./content/share-filter";

import { ExportToCsv } from 'export-to-csv';

AJS.$(document).on("click", "#downloadShareFilterCheck", function(){

        const csvExporter = new ExportToCsv(options);

 

        csvExporter.generateCsv({shareFilterHead}); 

    }); 

Do you have any ideas how to achieve that?

Dave Theodore [Coyote Creek Consulting]

I'm not really following what you are trying to do, but if you are wanting to extract only certain elements from the JSON output, you can pipe it to jq and work with those elements very easily.