diff --git a/src/core/components/live-response.jsx b/src/core/components/live-response.jsx index 457e3306..4a581d4e 100644 --- a/src/core/components/live-response.jsx +++ b/src/core/components/live-response.jsx @@ -1,6 +1,7 @@ import React from "react" import PropTypes from "prop-types" import ImPropTypes from "react-immutable-proptypes" +import { Iterable } from "immutable" const Headers = ( { headers } )=>{ return ( @@ -28,15 +29,24 @@ Duration.propTypes = { export default class LiveResponse extends React.Component { static propTypes = { - response: PropTypes.object.isRequired, - specSelectors: PropTypes.object.isRequired, + response: PropTypes.instanceOf(Iterable).isRequired, path: PropTypes.string.isRequired, method: PropTypes.string.isRequired, - getComponent: PropTypes.func.isRequired, displayRequestDuration: PropTypes.bool.isRequired, + specSelectors: PropTypes.object.isRequired, + getComponent: PropTypes.func.isRequired, getConfigs: PropTypes.func.isRequired } + shouldComponentUpdate(nextProps) { + // BUG: props.response is always coming back as a new Immutable instance + // same issue as responses.jsx (tryItOutResponse) + return this.props.response !== nextProps.response + || this.props.path !== nextProps.path + || this.props.method !== nextProps.method + || this.props.displayRequestDuration !== nextProps.displayRequestDuration + } + render() { const { response, getComponent, getConfigs, displayRequestDuration, specSelectors, path, method } = this.props const { showMutatedRequest } = getConfigs() @@ -112,7 +122,6 @@ export default class LiveResponse extends React.Component { static propTypes = { getComponent: PropTypes.func.isRequired, - request: ImPropTypes.map, response: ImPropTypes.map } } diff --git a/src/core/components/operation.jsx b/src/core/components/operation.jsx index 680d2701..7e97d5d8 100644 --- a/src/core/components/operation.jsx +++ b/src/core/components/operation.jsx @@ -6,6 +6,8 @@ import { Iterable } from "immutable" export default class Operation extends PureComponent { static propTypes = { operation: PropTypes.instanceOf(Iterable).isRequired, + response: PropTypes.instanceOf(Iterable), + request: PropTypes.instanceOf(Iterable), toggleShown: PropTypes.func.isRequired, onTryoutClick: PropTypes.func.isRequired, @@ -24,19 +26,21 @@ export default class Operation extends PureComponent { } static defaultProps = { - showSummary: true, + operation: null, response: null, - allowTryItOut: true, - displayOperationId: false, - displayRequestDuration: false + request: null } shouldComponentUpdate(nextProps) { return this.props.operation !== nextProps.operation + || this.props.response !== nextProps.response + || this.props.request !== nextProps.request } render() { let { + response, + request, toggleShown, onTryoutClick, onCancelClick, @@ -67,8 +71,6 @@ export default class Operation extends PureComponent { tryItOutEnabled, executeInProgress } = operationProps.toJS() - let response = operationProps.get("response") - let request = operationProps.get("request") let { summary, diff --git a/src/core/components/response.jsx b/src/core/components/response.jsx index 8c0a8bf1..aca6e0d6 100644 --- a/src/core/components/response.jsx +++ b/src/core/components/response.jsx @@ -1,6 +1,6 @@ import React from "react" import PropTypes from "prop-types" -import { fromJS, Seq } from "immutable" +import { fromJS, Seq, Iterable } from "immutable" import { getSampleSchema } from "core/utils" const getExampleComponent = ( sampleResponse, examples, HighlightCode ) => { @@ -41,7 +41,7 @@ export default class Response extends React.Component { static propTypes = { code: PropTypes.string.isRequired, - response: PropTypes.object, + response: PropTypes.instanceOf(Iterable), className: PropTypes.string, getComponent: PropTypes.func.isRequired, specSelectors: PropTypes.object.isRequired, @@ -53,6 +53,12 @@ export default class Response extends React.Component { response: fromJS({}), }; + shouldComponentUpdate(nextProps) { + return this.props.code !== nextProps.code + || this.props.response !== nextProps.response + || this.props.className !== nextProps.className + } + render() { let { code, diff --git a/src/core/components/responses.jsx b/src/core/components/responses.jsx index 46c82a69..0525fac8 100644 --- a/src/core/components/responses.jsx +++ b/src/core/components/responses.jsx @@ -5,7 +5,6 @@ import { defaultStatusCode } from "core/utils" export default class Responses extends React.Component { static propTypes = { - request: PropTypes.instanceOf(Iterable), tryItOutResponse: PropTypes.instanceOf(Iterable), responses: PropTypes.instanceOf(Iterable).isRequired, produces: PropTypes.instanceOf(Iterable), @@ -21,33 +20,27 @@ export default class Responses extends React.Component { } static defaultProps = { - request: null, tryItOutResponse: null, produces: fromJS(["application/json"]), displayRequestDuration: false } shouldComponentUpdate(nextProps) { - console.log("Responses SCU", this.props.tryItOutResponse.toJS(), nextProps.tryItOutResponse.toJS()) - let render = this.props.request !== nextProps.request - || this.props.tryItOutResponse !== nextProps.tryItOutResponse + // BUG: props.tryItOutResponse is always coming back as a new Immutable instance + let render = this.props.tryItOutResponse !== nextProps.tryItOutResponse || this.props.responses !== nextProps.responses || this.props.produces !== nextProps.produces || this.props.producesValue !== nextProps.producesValue || this.props.displayRequestDuration !== nextProps.displayRequestDuration || this.props.path !== nextProps.path || this.props.method !== nextProps.method - - console.log("render", render) - return render } onChangeProducesWrapper = ( val ) => this.props.specActions.changeProducesValue([this.props.path, this.props.method], val) render() { - console.log("Responses render") - let { responses, request, tryItOutResponse, getComponent, getConfigs, specSelectors, fn, producesValue, displayRequestDuration } = this.props + let { responses, tryItOutResponse, getComponent, getConfigs, specSelectors, fn, producesValue, displayRequestDuration } = this.props let defaultCode = defaultStatusCode( responses ) const ContentType = getComponent( "contentType" ) @@ -72,8 +65,7 @@ export default class Responses extends React.Component { { !tryItOutResponse ? null :