kyy/swagger-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add shouldComponentUpdate to response.jsx and live-response.jsx. Remove isShownKey from shouldComponentUpdate of OperationContainer. Moved response and request out to separate props for operation.jsx. Removed unused request prop from responses.jsx.

Browse Source
This commit is contained in:
Owen Conti
2017-08-20 18:50:49 -06:00
parent 017a26af1e
commit cfb4625eb0
5 changed files with 37 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/core/components/live-response.jsx
View File

@@ -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
}
}

14
src/core/components/operation.jsx
View File

@@ -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,

10
src/core/components/response.jsx
View File

@@ -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,

16
src/core/components/responses.jsx
View File

@@ -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
: <div>
<LiveResponse request={ request }
response={ tryItOutResponse }
<LiveResponse response={ tryItOutResponse }
getComponent={ getComponent }
getConfigs={ getConfigs }
specSelectors={ specSelectors }

7
src/core/containers/OperationContainer.jsx
View File

@@ -98,7 +98,7 @@ export default class OperationContainer extends PureComponent {
}
shouldComponentUpdate(nextProps, nextState) {
return this.state.tryItOutEnabled !== nextState.tryItOutEnabled
const render = this.state.tryItOutEnabled !== nextState.tryItOutEnabled
|| this.state.executeInProgress !== nextState.executeInProgress
|| this.props.op !== nextProps.op
|| this.props.tag !== nextProps.tag
@@ -107,7 +107,6 @@ export default class OperationContainer extends PureComponent {
|| this.props.operationId !== nextProps.operationId
|| this.props.showSummary !== nextProps.showSummary
|| this.props.isShown !== nextProps.isShown
|| this.props.isShownKey !== nextProps.isShownKey
|| this.props.jumpToKey !== nextProps.jumpToKey
|| this.props.allowTryItOut !== nextProps.allowTryItOut
|| this.props.displayOperationId !== nextProps.displayOperationId
@@ -115,6 +114,7 @@ export default class OperationContainer extends PureComponent {
|| this.props.response !== nextProps.response
|| this.props.request !== nextProps.request
|| this.props.isDeepLinkingEnabled !== nextProps.isDeepLinkingEnabled
return render
}
toggleShown =() => {
@@ -177,7 +177,6 @@ export default class OperationContainer extends PureComponent {
isShownKey,
jumpToKey,
allowTryItOut,
response,
request,
displayOperationId,
displayRequestDuration,
@@ -189,6 +188,8 @@ export default class OperationContainer extends PureComponent {
return (
<Operation
operation={operationProps}
response={response}
request={request}
toggleShown={this.toggleShown}
onTryoutClick={this.onTryoutClick}