Skip to content

Commit c28b128

Browse files
authored
Merge pull request #3922 from swagger-api/bug/3904-operation-not-updating
Update Operation content correctly
2 parents 170aa12 + f6727b4 commit c28b128

File tree

15 files changed

+448
-183
lines changed

15 files changed

+448
-183
lines changed

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,7 @@
4545
"brace": "0.7.0",
4646
"classnames": "^2.2.5",
4747
"commonmark": "^0.28.1",
48+
"core-js": "^2.5.1",
4849
"css.escape": "1.5.1",
4950
"deep-extend": "0.4.1",
5051
"expect": "1.20.2",

src/core/components/execute.jsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ export default class Execute extends Component {
88
specActions: PropTypes.object.isRequired,
99
operation: PropTypes.object.isRequired,
1010
path: PropTypes.string.isRequired,
11-
getComponent: PropTypes.func.isRequired,
1211
method: PropTypes.string.isRequired,
1312
onExecute: PropTypes.func
1413
}

src/core/components/live-response.jsx

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from "react"
22
import PropTypes from "prop-types"
33
import ImPropTypes from "react-immutable-proptypes"
4+
import { Iterable } from "immutable"
45

56
const Headers = ( { headers } )=>{
67
return (
@@ -28,19 +29,29 @@ Duration.propTypes = {
2829

2930
export default class LiveResponse extends React.Component {
3031
static propTypes = {
31-
response: PropTypes.object.isRequired,
32+
response: PropTypes.instanceOf(Iterable).isRequired,
33+
path: PropTypes.string.isRequired,
34+
method: PropTypes.string.isRequired,
35+
displayRequestDuration: PropTypes.bool.isRequired,
3236
specSelectors: PropTypes.object.isRequired,
33-
pathMethod: PropTypes.object.isRequired,
3437
getComponent: PropTypes.func.isRequired,
35-
displayRequestDuration: PropTypes.bool.isRequired,
3638
getConfigs: PropTypes.func.isRequired
3739
}
3840

41+
shouldComponentUpdate(nextProps) {
42+
// BUG: props.response is always coming back as a new Immutable instance
43+
// same issue as responses.jsx (tryItOutResponse)
44+
return this.props.response !== nextProps.response
45+
|| this.props.path !== nextProps.path
46+
|| this.props.method !== nextProps.method
47+
|| this.props.displayRequestDuration !== nextProps.displayRequestDuration
48+
}
49+
3950
render() {
40-
const { response, getComponent, getConfigs, displayRequestDuration, specSelectors, pathMethod } = this.props
51+
const { response, getComponent, getConfigs, displayRequestDuration, specSelectors, path, method } = this.props
4152
const { showMutatedRequest } = getConfigs()
4253

43-
const curlRequest = showMutatedRequest ? specSelectors.mutatedRequestFor(pathMethod[0], pathMethod[1]) : specSelectors.requestFor(pathMethod[0], pathMethod[1])
54+
const curlRequest = showMutatedRequest ? specSelectors.mutatedRequestFor(path, method) : specSelectors.requestFor(path, method)
4455
const status = response.get("status")
4556
const url = response.get("url")
4657
const headers = response.get("headers").toJS()
@@ -118,7 +129,6 @@ export default class LiveResponse extends React.Component {
118129

119130
static propTypes = {
120131
getComponent: PropTypes.func.isRequired,
121-
request: ImPropTypes.map,
122132
response: ImPropTypes.map
123133
}
124134
}

src/core/components/operation.jsx

Lines changed: 55 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -1,121 +1,89 @@
11
import React, { PureComponent } from "react"
22
import PropTypes from "prop-types"
33
import { getList } from "core/utils"
4-
import * as CustomPropTypes from "core/proptypes"
54
import { sanitizeUrl } from "core/utils"
6-
7-
//import "less/opblock"
5+
import { Iterable } from "immutable"
86

97
export default class Operation extends PureComponent {
108
static propTypes = {
11-
path: PropTypes.string.isRequired,
12-
method: PropTypes.string.isRequired,
13-
operation: PropTypes.object.isRequired,
14-
showSummary: PropTypes.bool,
15-
isShown: PropTypes.bool.isRequired,
16-
17-
tagKey: PropTypes.string,
18-
operationKey: PropTypes.string,
19-
jumpToKey: CustomPropTypes.arrayOrString.isRequired,
20-
21-
allowTryItOut: PropTypes.bool,
9+
operation: PropTypes.instanceOf(Iterable).isRequired,
10+
response: PropTypes.instanceOf(Iterable),
11+
request: PropTypes.instanceOf(Iterable),
2212

23-
displayOperationId: PropTypes.bool,
24-
displayRequestDuration: PropTypes.bool,
25-
26-
response: PropTypes.object,
27-
request: PropTypes.object,
13+
toggleShown: PropTypes.func.isRequired,
14+
onTryoutClick: PropTypes.func.isRequired,
15+
onCancelClick: PropTypes.func.isRequired,
16+
onExecute: PropTypes.func.isRequired,
2817

2918
getComponent: PropTypes.func.isRequired,
19+
getConfigs: PropTypes.func.isRequired,
3020
authActions: PropTypes.object,
3121
authSelectors: PropTypes.object,
3222
specActions: PropTypes.object.isRequired,
3323
specSelectors: PropTypes.object.isRequired,
3424
oas3Actions: PropTypes.object.isRequired,
3525
layoutActions: PropTypes.object.isRequired,
3626
layoutSelectors: PropTypes.object.isRequired,
37-
fn: PropTypes.object.isRequired,
38-
getConfigs: PropTypes.func.isRequired
27+
fn: PropTypes.object.isRequired
3928
}
4029

4130
static defaultProps = {
42-
showSummary: true,
31+
operation: null,
4332
response: null,
44-
allowTryItOut: true,
45-
displayOperationId: false,
46-
displayRequestDuration: false
47-
}
48-
49-
constructor(props, context) {
50-
super(props, context)
51-
this.state = {
52-
tryItOutEnabled: false
53-
}
54-
}
55-
56-
componentWillReceiveProps(nextProps) {
57-
if(nextProps.response !== this.props.response) {
58-
this.setState({ executeInProgress: false })
59-
}
60-
}
61-
62-
toggleShown =() => {
63-
let { layoutActions, tagKey, operationKey, isShown } = this.props
64-
const isShownKey = ["operations", tagKey, operationKey]
65-
66-
layoutActions.show(isShownKey, !isShown)
67-
}
68-
69-
onTryoutClick =() => {
70-
this.setState({tryItOutEnabled: !this.state.tryItOutEnabled})
71-
}
72-
73-
onCancelClick =() => {
74-
let { specActions, path, method } = this.props
75-
this.setState({tryItOutEnabled: !this.state.tryItOutEnabled})
76-
specActions.clearValidateParams([path, method])
77-
}
78-
79-
onExecute = () => {
80-
this.setState({ executeInProgress: true })
33+
request: null
8134
}
8235

8336
render() {
8437
let {
85-
operationKey,
86-
tagKey,
87-
isShown,
88-
jumpToKey,
89-
path,
90-
method,
91-
operation,
92-
showSummary,
9338
response,
9439
request,
95-
allowTryItOut,
96-
displayOperationId,
97-
displayRequestDuration,
40+
toggleShown,
41+
onTryoutClick,
42+
onCancelClick,
43+
onExecute,
9844
fn,
9945
getComponent,
46+
getConfigs,
10047
specActions,
10148
specSelectors,
10249
authActions,
10350
authSelectors,
104-
getConfigs,
10551
oas3Actions
10652
} = this.props
53+
let operationProps = this.props.operation
10754

108-
let summary = operation.get("summary")
109-
let description = operation.get("description")
110-
let deprecated = operation.get("deprecated")
111-
let externalDocs = operation.get("externalDocs")
55+
let {
56+
isShown,
57+
jumpToKey,
58+
path,
59+
method,
60+
op,
61+
tag,
62+
showSummary,
63+
operationId,
64+
allowTryItOut,
65+
displayOperationId,
66+
displayRequestDuration,
67+
isDeepLinkingEnabled,
68+
tryItOutEnabled,
69+
executeInProgress
70+
} = operationProps.toJS()
71+
72+
let {
73+
summary,
74+
description,
75+
deprecated,
76+
externalDocs,
77+
schemes
78+
} = op.operation
79+
80+
let operation = operationProps.getIn(["op", "operation"])
11281
let responses = operation.get("responses")
113-
let security = operation.get("security") || specSelectors.security()
11482
let produces = operation.get("produces")
115-
let schemes = operation.get("schemes")
83+
let security = operation.get("security") || specSelectors.security()
11684
let parameters = getList(operation, ["parameters"])
117-
let operationId = operation.get("__originalOperationId")
11885
let operationScheme = specSelectors.operationScheme(path, method)
86+
let isShownKey = ["operations", tag, operationId]
11987

12088
const Responses = getComponent("responses")
12189
const Parameters = getComponent( "parameters" )
@@ -127,28 +95,23 @@ export default class Operation extends PureComponent {
12795
const Markdown = getComponent( "Markdown" )
12896
const Schemes = getComponent( "schemes" )
12997

130-
const { deepLinking } = getConfigs()
131-
132-
const isDeepLinkingEnabled = deepLinking && deepLinking !== "false"
133-
13498
// Merge in Live Response
13599
if(responses && response && response.size > 0) {
136100
let notDocumented = !responses.get(String(response.get("status")))
137101
response = response.set("notDocumented", notDocumented)
138102
}
139103

140-
let { tryItOutEnabled } = this.state
141104
let onChangeKey = [ path, method ] // Used to add values to _this_ operation ( indexed by path and method )
142105

143106
return (
144-
<div className={deprecated ? "opblock opblock-deprecated" : isShown ? `opblock opblock-${method} is-open` : `opblock opblock-${method}`} id={`operations-${tagKey}-${operationKey}`} >
145-
<div className={`opblock-summary opblock-summary-${method}`} onClick={this.toggleShown} >
107+
<div className={deprecated ? "opblock opblock-deprecated" : isShown ? `opblock opblock-${method} is-open` : `opblock opblock-${method}`} id={isShownKey.join("-")} >
108+
<div className={`opblock-summary opblock-summary-${method}`} onClick={toggleShown} >
146109
<span className="opblock-summary-method">{method.toUpperCase()}</span>
147110
<span className={ deprecated ? "opblock-summary-path__deprecated" : "opblock-summary-path" } >
148111
<a
149112
className="nostyle"
150113
onClick={isDeepLinkingEnabled ? (e) => e.preventDefault() : null}
151-
href={isDeepLinkingEnabled ? `#/${tagKey}/${operationKey}` : null}>
114+
href={isDeepLinkingEnabled ? `#/${isShownKey.join("/")}` : null}>
152115
<span>{path}</span>
153116
</a>
154117
<JumpToPath path={jumpToKey} />
@@ -200,8 +163,8 @@ export default class Operation extends PureComponent {
200163
parameters={parameters}
201164
operation={operation}
202165
onChangeKey={onChangeKey}
203-
onTryoutClick = { this.onTryoutClick }
204-
onCancelClick = { this.onCancelClick }
166+
onTryoutClick = { onTryoutClick }
167+
onCancelClick = { onCancelClick }
205168
tryItOutEnabled = { tryItOutEnabled }
206169
allowTryItOut={allowTryItOut}
207170

@@ -226,25 +189,23 @@ export default class Operation extends PureComponent {
226189
{ !tryItOutEnabled || !allowTryItOut ? null :
227190

228191
<Execute
229-
getComponent={getComponent}
230192
operation={ operation }
231193
specActions={ specActions }
232194
specSelectors={ specSelectors }
233195
path={ path }
234196
method={ method }
235-
onExecute={ this.onExecute } />
197+
onExecute={ onExecute } />
236198
}
237199

238200
{ (!tryItOutEnabled || !response || !allowTryItOut) ? null :
239201
<Clear
240-
onClick={ this.onClearClick }
241202
specActions={ specActions }
242203
path={ path }
243204
method={ method }/>
244205
}
245206
</div>
246207

247-
{this.state.executeInProgress ? <div className="loading-container"><div className="loading"></div></div> : null}
208+
{executeInProgress ? <div className="loading-container"><div className="loading"></div></div> : null}
248209

249210
{ !responses ? null :
250211
<Responses
@@ -258,7 +219,8 @@ export default class Operation extends PureComponent {
258219
specActions={ specActions }
259220
produces={ produces }
260221
producesValue={ operation.get("produces_value") }
261-
pathMethod={ [path, method] }
222+
path={ path }
223+
method={ method }
262224
displayRequestDuration={ displayRequestDuration }
263225
fn={fn} />
264226
}

0 commit comments

Comments
 (0)