diff --git a/packages/insomnia-app/app/ui/components/dropdowns/preview-mode-dropdown.js b/packages/insomnia-app/app/ui/components/dropdowns/preview-mode-dropdown.js index f4135a6ebe..d6573ef2ae 100644 --- a/packages/insomnia-app/app/ui/components/dropdowns/preview-mode-dropdown.js +++ b/packages/insomnia-app/app/ui/components/dropdowns/preview-mode-dropdown.js @@ -1,16 +1,35 @@ -import React, { PureComponent } from 'react'; -import PropTypes from 'prop-types'; +// @flow +import * as React from 'react'; import autobind from 'autobind-decorator'; import { Dropdown, DropdownButton, DropdownDivider, DropdownItem } from '../base/dropdown'; import { getPreviewModeName, PREVIEW_MODES } from '../../../common/constants'; +type Props = {| + download: (pretty: boolean) => any, + fullDownload: (pretty: boolean) => any, + updatePreviewMode: string => any, + previewMode: string, + showPrettifyOption?: boolean, +|}; + @autobind -class PreviewModeDropdown extends PureComponent { - _handleClick(previewMode) { - this.props.updatePreviewMode(previewMode); +class PreviewModeDropdown extends React.PureComponent { + async _handleClick(previewMode: string) { + const { updatePreviewMode } = this.props; + await updatePreviewMode(previewMode); } - renderPreviewMode(mode) { + async _handleDownloadPrettify() { + const { download } = this.props; + download(true); + } + + async _handleDownloadNormal() { + const { download } = this.props; + download(false); + } + + renderPreviewMode(mode: string) { const { previewMode } = this.props; return ( @@ -21,7 +40,8 @@ class PreviewModeDropdown extends PureComponent { } render() { - const { download, fullDownload, previewMode } = this.props; + const { fullDownload, previewMode, showPrettifyOption } = this.props; + return ( @@ -31,27 +51,23 @@ class PreviewModeDropdown extends PureComponent { Preview Mode {PREVIEW_MODES.map(this.renderPreviewMode)} Actions - + - Save Response Body + Save Raw Response + {showPrettifyOption && ( + + + Save Prettified Response + + )} - - Save Full Response + + Save HTTP Debug ); } } -PreviewModeDropdown.propTypes = { - // Functions - updatePreviewMode: PropTypes.func.isRequired, - download: PropTypes.func.isRequired, - fullDownload: PropTypes.func.isRequired, - - // Required - previewMode: PropTypes.string.isRequired, -}; - export default PreviewModeDropdown; diff --git a/packages/insomnia-app/app/ui/components/response-pane.js b/packages/insomnia-app/app/ui/components/response-pane.js index c93b9b1a02..85f3f91087 100644 --- a/packages/insomnia-app/app/ui/components/response-pane.js +++ b/packages/insomnia-app/app/ui/components/response-pane.js @@ -29,7 +29,7 @@ import type { HotKeyRegistry } from '../../common/hotkeys'; import { hotKeyRefs } from '../../common/hotkeys'; import type { RequestVersion } from '../../models/request-version'; import { showError } from '../components/modals/index'; -import prettify from 'insomnia-prettify'; +import { json as jsonPrettify } from 'insomnia-prettify'; type Props = { // Functions @@ -75,7 +75,7 @@ class ResponsePane extends React.PureComponent { return models.response.getBodyBuffer(this.props.response); } - async _handleDownloadResponseBody() { + async _handleDownloadResponseBody(prettify: boolean) { const { response, request } = this.props; if (!response || !request) { // Should never happen @@ -105,10 +105,8 @@ class ResponsePane extends React.PureComponent { }); readStream.on('end', () => { const to = fs.createWriteStream(outputPath); - if (extension === 'json') { - dataBuffers = prettify.json(dataBuffers); - } - to.write(dataBuffers); + const finalBuffer = Buffer.concat(dataBuffers); + to.on('error', err => { showError({ title: 'Save Failed', @@ -116,6 +114,12 @@ class ResponsePane extends React.PureComponent { error: err, }); }); + + if (prettify && contentType.includes('json')) { + to.write(jsonPrettify(finalBuffer.toString('utf8'))); + } else { + to.write(finalBuffer); + } }); } }); @@ -304,6 +308,7 @@ class ResponsePane extends React.PureComponent { fullDownload={this._handleDownloadFullResponseBody} previewMode={previewMode} updatePreviewMode={handleSetPreviewMode} + showPrettifyOption={response.contentType.includes('json')} />