Add flow to response-viewer

app/ui/components/viewers/response-viewer.js

@@ -1,5 +1,5 @@
+// @flow
 import * as React from 'react';
-import PropTypes from 'prop-types';
 import iconv from 'iconv-lite';
 import autobind from 'autobind-decorator';
 import {shell} from 'electron';
@@ -12,9 +12,33 @@ import {LARGE_RESPONSE_MB, PREVIEW_MODE_FRIENDLY, PREVIEW_MODE_RAW} from '../../
 
 let alwaysShowLargeResponses = false;
 
+type Props = {
+  getBody: Function,
+  responseId: string,
+  previewMode: string,
+  filter: string,
+  filterHistory: Array<string>,
+  editorFontSize: number,
+  editorIndentSize: number,
+  editorKeyMap: string,
+  editorLineWrapping: boolean,
+  url: string,
+  bytes: number,
+  contentType: string,
+
+  // Optional
+  updateFilter?: Function,
+  error?: string
+};
+
+type State = {
+  blockingBecauseTooLarge: boolean,
+  bodyBuffer: Buffer | null
+};
+
 @autobind
-class ResponseViewer extends React.Component {
-  constructor (props) {
+class ResponseViewer extends React.Component<Props, State> {
+  constructor (props: Props) {
     super(props);
     this.state = {
       blockingBecauseTooLarge: false,
@@ -22,7 +46,7 @@ class ResponseViewer extends React.Component {
     };
   }
 
-  _handleOpenLink (link) {
+  _handleOpenLink (link: string) {
     shell.openExternal(link);
   }
 
@@ -36,7 +60,7 @@ class ResponseViewer extends React.Component {
     this._handleDismissBlocker();
   }
 
-  _maybeLoadResponseBody (props, forceShow = false) {
+  _maybeLoadResponseBody (props: Props, forceShow?: boolean) {
     // Block the response if it's too large
     const responseIsTooLarge = props.bytes > LARGE_RESPONSE_MB * 1024 * 1024;
     if (!forceShow && !alwaysShowLargeResponses && responseIsTooLarge) {
@@ -53,11 +77,11 @@ class ResponseViewer extends React.Component {
     this._maybeLoadResponseBody(this.props);
   }
 
-  componentWillReceiveProps (nextProps) {
+  componentWillReceiveProps (nextProps: Props) {
     this._maybeLoadResponseBody(nextProps);
   }
 
-  shouldComponentUpdate (nextProps, nextState) {
+  shouldComponentUpdate (nextProps: Props, nextState: State) {
     for (let k of Object.keys(nextProps)) {
       const next = nextProps[k];
       const current = this.props[k];
@@ -66,7 +90,7 @@ class ResponseViewer extends React.Component {
         continue;
       }
 
-      if (current instanceof Buffer) {
+      if (current instanceof Buffer && next instanceof Buffer) {
         if (current.equals(next)) {
           continue;
         } else {
@@ -87,7 +111,7 @@ class ResponseViewer extends React.Component {
         continue;
       }
 
-      if (current instanceof Buffer) {
+      if (current instanceof Buffer && next instanceof Buffer) {
         if (current.equals(next)) {
           continue;
         } else {
@@ -173,7 +197,7 @@ class ResponseViewer extends React.Component {
     // Try to detect JSON in all cases (even if header is set). Apparently users
     // often send JSON with weird content-types like text/plain
     try {
-      JSON.parse(bodyBuffer);
+      JSON.parse(bodyBuffer.toString('utf8'));
       contentType = 'application/json';
     } catch (e) {
       // Nothing
@@ -274,23 +298,4 @@ class ResponseViewer extends React.Component {
   }
 }
 
-ResponseViewer.propTypes = {
-  getBody: PropTypes.func.isRequired,
-  responseId: PropTypes.string.isRequired,
-  previewMode: PropTypes.string.isRequired,
-  filter: PropTypes.string.isRequired,
-  filterHistory: PropTypes.arrayOf(PropTypes.string.isRequired).isRequired,
-  editorFontSize: PropTypes.number.isRequired,
-  editorIndentSize: PropTypes.number.isRequired,
-  editorKeyMap: PropTypes.string.isRequired,
-  editorLineWrapping: PropTypes.bool.isRequired,
-  url: PropTypes.string.isRequired,
-  bytes: PropTypes.number.isRequired,
-  contentType: PropTypes.string.isRequired,
-
-  // Optional
-  updateFilter: PropTypes.func,
-  error: PropTypes.string
-};
-
 export default ResponseViewer;

flow-typed/iconv-lite.js

@@ -0,0 +1,3 @@
+declare module 'iconv-lite' {
+  declare module.exports: *
+}