128 lines
4.5 KiB
JavaScript
128 lines
4.5 KiB
JavaScript
import React, { PropTypes } from "react"
|
|
|
|
export default class Operations extends React.Component {
|
|
|
|
static propTypes = {
|
|
specSelectors: PropTypes.object.isRequired,
|
|
specActions: PropTypes.object.isRequired,
|
|
getComponent: PropTypes.func.isRequired,
|
|
layoutSelectors: PropTypes.object.isRequired,
|
|
layoutActions: PropTypes.object.isRequired,
|
|
authActions: PropTypes.object.isRequired,
|
|
authSelectors: PropTypes.object.isRequired,
|
|
getConfigs: PropTypes.func.isRequired
|
|
};
|
|
|
|
render() {
|
|
let {
|
|
specSelectors,
|
|
specActions,
|
|
getComponent,
|
|
layoutSelectors,
|
|
layoutActions,
|
|
authActions,
|
|
authSelectors,
|
|
getConfigs,
|
|
fn
|
|
} = this.props
|
|
|
|
let taggedOps = specSelectors.taggedOperations()
|
|
|
|
const Operation = getComponent("operation")
|
|
const Collapse = getComponent("Collapse")
|
|
|
|
let showSummary = layoutSelectors.showSummary()
|
|
let { docExpansion, displayOperationId, displayRequestDuration } = getConfigs()
|
|
|
|
return (
|
|
<div>
|
|
{
|
|
taggedOps.map( (tagObj, tag) => {
|
|
let operations = tagObj.get("operations")
|
|
let tagDescription = tagObj.getIn(["tagDetails", "description"], null)
|
|
|
|
let isShownKey = ["operations-tag", tag]
|
|
let showTag = layoutSelectors.isShown(isShownKey, docExpansion === "full" || docExpansion === "list")
|
|
|
|
return (
|
|
<div className={showTag ? "opblock-tag-section is-open" : "opblock-tag-section"} key={"operation-" + tag}>
|
|
|
|
<h4 onClick={() => layoutActions.show(isShownKey, !showTag)} className={!tagDescription ? "opblock-tag no-desc" : "opblock-tag" }>
|
|
<span>{tag}</span>
|
|
{ !tagDescription ? null :
|
|
<small>
|
|
{ tagDescription }
|
|
</small>
|
|
}
|
|
|
|
<button className="expand-operation" title="Expand operation" onClick={() => layoutActions.show(isShownKey, !showTag)}>
|
|
<svg className="arrow" width="20" height="20">
|
|
<use xlinkHref={showTag ? "#large-arrow-down" : "#large-arrow"} />
|
|
</svg>
|
|
</button>
|
|
</h4>
|
|
|
|
<Collapse isOpened={showTag}>
|
|
{
|
|
operations.map( op => {
|
|
|
|
const isShownKey = ["operations", op.get("id"), tag]
|
|
const path = op.get("path", "")
|
|
const method = op.get("method", "")
|
|
const jumpToKey = `paths.${path}.${method}`
|
|
|
|
const allowTryItOut = specSelectors.allowTryItOutFor(op.get("path"), op.get("method"))
|
|
const response = specSelectors.responseFor(op.get("path"), op.get("method"))
|
|
const request = specSelectors.requestFor(op.get("path"), op.get("method"))
|
|
|
|
return <Operation
|
|
{...op.toObject()}
|
|
|
|
isShownKey={isShownKey}
|
|
jumpToKey={jumpToKey}
|
|
showSummary={showSummary}
|
|
key={isShownKey}
|
|
response={ response }
|
|
request={ request }
|
|
allowTryItOut={allowTryItOut}
|
|
|
|
displayOperationId={displayOperationId}
|
|
displayRequestDuration={displayRequestDuration}
|
|
|
|
specActions={ specActions }
|
|
specSelectors={ specSelectors }
|
|
|
|
layoutActions={ layoutActions }
|
|
layoutSelectors={ layoutSelectors }
|
|
|
|
authActions={ authActions }
|
|
authSelectors={ authSelectors }
|
|
|
|
getComponent={ getComponent }
|
|
fn={fn}
|
|
getConfigs={ getConfigs }
|
|
/>
|
|
}).toArray()
|
|
}
|
|
</Collapse>
|
|
</div>
|
|
)
|
|
}).toArray()
|
|
}
|
|
|
|
{ taggedOps.size < 1 ? <h3> No operations defined in spec! </h3> : null }
|
|
</div>
|
|
)
|
|
}
|
|
|
|
}
|
|
|
|
Operations.propTypes = {
|
|
layoutActions: PropTypes.object.isRequired,
|
|
specSelectors: PropTypes.object.isRequired,
|
|
specActions: PropTypes.object.isRequired,
|
|
layoutSelectors: PropTypes.object.isRequired,
|
|
getComponent: PropTypes.func.isRequired,
|
|
fn: PropTypes.object.isRequired
|
|
}
|