aboutsummaryrefslogtreecommitdiffstats
path: root/client/js/app/src/app/pages/querybuilder/Components/Buttons/DownloadJSONButton.jsx
blob: 7ec6683afa31d899d7ab0f07b95fe024e32e50ea (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
import React, { useContext } from 'react';
import { ResponseContext } from '../Contexts/ResponseContext';
import transform from '../../TransformVespaTrace';
import SimpleButton from './SimpleButton';

export default function DownloadJSONButton({ children }) {
  const { response } = useContext(ResponseContext);

  const transformResponse = (response) => {
    return transform(response);
  };

  const handleClick = () => {
    if (response != '') {
      let transformedResponse = JSON.stringify(
        transformResponse(JSON.parse(response), undefined, '\t')
      );
      // copied from safakeskin´s answer on SO, link: https://stackoverflow.com/questions/55613438/reactwrite-to-json-file-or-export-download-no-server
      const fileName = 'vespa-response';
      const blob = new Blob([transformedResponse], {
        type: 'application/json',
      });
      const href = URL.createObjectURL(blob);

      // create "a" HTLM element with href to file
      const link = document.createElement('a');
      link.href = href;
      link.download = fileName + '.json';
      document.body.appendChild(link);
      link.click();

      // clean up "a" element & remove ObjectURL
      document.body.removeChild(link);
      URL.revokeObjectURL(href);

      // open Jaeger in a new tab
      window.open('http://localhost:16686/search', '__blank');
    } else {
      alert('Response was empty');
    }
  };

  return <SimpleButton onClick={handleClick}>{children}</SimpleButton>;
}