...into OperationSummary, OperationSummaryPath, OperationSummaryMethodbubble
@@ -1,5 +1,6 @@ | |||
node_modules | |||
.idea | |||
.vscode | |||
.deps_check | |||
.DS_Store | |||
.nyc_output | |||
@@ -0,0 +1,25 @@ | |||
import React, { PureComponent } from "react" | |||
import PropTypes from "prop-types" | |||
import { Iterable } from "immutable" | |||
export default class OperationSummaryMethod extends PureComponent { | |||
static propTypes = { | |||
operationProps: PropTypes.instanceOf(Iterable).isRequired, | |||
method: PropTypes.string.isRequired, | |||
} | |||
static defaultProps = { | |||
operationProps: null, | |||
} | |||
render() { | |||
let { | |||
method, | |||
} = this.props | |||
return ( | |||
<span className="opblock-summary-method">{method.toUpperCase()}</span> | |||
) | |||
} | |||
} |
@@ -0,0 +1,48 @@ | |||
import React, { PureComponent } from "react" | |||
import PropTypes from "prop-types" | |||
import { Iterable } from "immutable" | |||
import ImPropTypes from "react-immutable-proptypes" | |||
export default class OperationSummaryPath extends PureComponent{ | |||
static propTypes = { | |||
specPath: ImPropTypes.list.isRequired, | |||
operationProps: PropTypes.instanceOf(Iterable).isRequired, | |||
getComponent: PropTypes.func.isRequired, | |||
} | |||
render(){ | |||
let { | |||
getComponent, | |||
operationProps, | |||
specPath, | |||
} = this.props | |||
let { | |||
deprecated, | |||
isShown, | |||
path, | |||
tag, | |||
operationId, | |||
isDeepLinkingEnabled, | |||
} = operationProps.toJS() | |||
let isShownKey = ["operations", tag, operationId] | |||
const JumpToPath = getComponent("JumpToPath", true) | |||
const DeepLink = getComponent( "DeepLink" ) | |||
return( | |||
<span className={ deprecated ? "opblock-summary-path__deprecated" : "opblock-summary-path" } > | |||
<DeepLink | |||
enabled={isDeepLinkingEnabled} | |||
isShown={isShown} | |||
path={`${isShownKey.join("/")}`} | |||
text={path} /> | |||
<JumpToPath path={specPath} />{/* TODO: use wrapComponents here, swagger-ui doesn't care about jumpToPath */} | |||
</span> | |||
) | |||
} | |||
} |
@@ -0,0 +1,85 @@ | |||
import React, { PureComponent } from "react" | |||
import PropTypes from "prop-types" | |||
import { Iterable, List } from "immutable" | |||
import ImPropTypes from "react-immutable-proptypes" | |||
export default class OperationSummary extends PureComponent { | |||
static propTypes = { | |||
specPath: ImPropTypes.list.isRequired, | |||
operationProps: PropTypes.instanceOf(Iterable).isRequired, | |||
toggleShown: PropTypes.func.isRequired, | |||
getComponent: PropTypes.func.isRequired, | |||
getConfigs: PropTypes.func.isRequired, | |||
authActions: PropTypes.object, | |||
authSelectors: PropTypes.object, | |||
} | |||
static defaultProps = { | |||
operationProps: null, | |||
specPath: List(), | |||
summary: "" | |||
} | |||
render() { | |||
let { | |||
toggleShown, | |||
getComponent, | |||
authActions, | |||
authSelectors, | |||
operationProps, | |||
specPath, | |||
} = this.props | |||
let { | |||
summary, | |||
isAuthorized, | |||
method, | |||
op, | |||
showSummary, | |||
operationId, | |||
originalOperationId, | |||
displayOperationId, | |||
} = operationProps.toJS() | |||
let { | |||
summary: resolvedSummary, | |||
} = op | |||
let security = operationProps.get("security") | |||
const AuthorizeOperationBtn = getComponent("authorizeOperationBtn") | |||
const OperationSummaryMethod = getComponent("OperationSummaryMethod") | |||
const OperationSummaryPath = getComponent("OperationSummaryPath") | |||
return ( | |||
<div className={`opblock-summary opblock-summary-${method}`} onClick={toggleShown} > | |||
<OperationSummaryMethod method={method} /> | |||
<OperationSummaryPath getComponent={getComponent} operationProps={operationProps} specPath={specPath} /> | |||
{!showSummary ? null : | |||
<div className="opblock-summary-description"> | |||
{resolvedSummary || summary} | |||
</div> | |||
} | |||
{displayOperationId && (originalOperationId || operationId) ? <span className="opblock-summary-operation-id">{originalOperationId || operationId}</span> : null} | |||
{ | |||
(!security || !security.count()) ? null : | |||
<AuthorizeOperationBtn | |||
isAuthorized={isAuthorized} | |||
onClick={() => { | |||
const applicableDefinitions = authSelectors.definitionsForRequirements(security) | |||
authActions.showDefinitions(applicableDefinitions) | |||
}} | |||
/> | |||
} | |||
</div> | |||
) | |||
} | |||
} |
@@ -62,34 +62,26 @@ export default class Operation extends PureComponent { | |||
let operationProps = this.props.operation | |||
let { | |||
summary, | |||
deprecated, | |||
isShown, | |||
isAuthorized, | |||
path, | |||
method, | |||
op, | |||
tag, | |||
showSummary, | |||
operationId, | |||
originalOperationId, | |||
allowTryItOut, | |||
displayOperationId, | |||
displayRequestDuration, | |||
isDeepLinkingEnabled, | |||
tryItOutEnabled, | |||
executeInProgress | |||
} = operationProps.toJS() | |||
let { | |||
summary: resolvedSummary, | |||
description, | |||
externalDocs, | |||
schemes | |||
} = op | |||
let operation = operationProps.getIn(["op"]) | |||
let security = operationProps.get("security") | |||
let responses = operation.get("responses") | |||
let produces = operation.get("produces") | |||
let parameters = getList(operation, ["parameters"]) | |||
@@ -101,14 +93,12 @@ export default class Operation extends PureComponent { | |||
const Parameters = getComponent( "parameters" ) | |||
const Execute = getComponent( "execute" ) | |||
const Clear = getComponent( "clear" ) | |||
const AuthorizeOperationBtn = getComponent( "authorizeOperationBtn" ) | |||
const JumpToPath = getComponent("JumpToPath", true) | |||
const Collapse = getComponent( "Collapse" ) | |||
const Markdown = getComponent( "Markdown" ) | |||
const Schemes = getComponent( "schemes" ) | |||
const OperationServers = getComponent( "OperationServers" ) | |||
const OperationExt = getComponent( "OperationExt" ) | |||
const DeepLink = getComponent( "DeepLink" ) | |||
const OperationSummary = getComponent( "OperationSummary" ) | |||
const { showExtensions } = getConfigs() | |||
@@ -122,39 +112,7 @@ export default class Operation extends PureComponent { | |||
return ( | |||
<div className={deprecated ? "opblock opblock-deprecated" : isShown ? `opblock opblock-${method} is-open` : `opblock opblock-${method}`} id={isShownKey.join("-")} > | |||
<div className={`opblock-summary opblock-summary-${method}`} onClick={toggleShown} > | |||
{/*TODO: convert this into a component, that can be wrapped | |||
and pulled in with getComponent */} | |||
<span className="opblock-summary-method">{method.toUpperCase()}</span> | |||
<span className={ deprecated ? "opblock-summary-path__deprecated" : "opblock-summary-path" } > | |||
<DeepLink | |||
enabled={isDeepLinkingEnabled} | |||
isShown={isShown} | |||
path={`${isShownKey.join("/")}`} | |||
text={path} /> | |||
<JumpToPath path={specPath} /> {/*TODO: use wrapComponents here, swagger-ui doesn't care about jumpToPath */} | |||
</span> | |||
{ !showSummary ? null : | |||
<div className="opblock-summary-description"> | |||
{ resolvedSummary || summary } | |||
</div> | |||
} | |||
{ displayOperationId && (originalOperationId || operationId) ? <span className="opblock-summary-operation-id">{originalOperationId || operationId}</span> : null } | |||
{ | |||
(!security || !security.count()) ? null : | |||
<AuthorizeOperationBtn | |||
isAuthorized={ isAuthorized } | |||
onClick={() => { | |||
const applicableDefinitions = authSelectors.definitionsForRequirements(security) | |||
authActions.showDefinitions(applicableDefinitions) | |||
}} | |||
/> | |||
} | |||
</div> | |||
<OperationSummary operationProps={operationProps} toggleShown={toggleShown} getComponent={getComponent} authActions={authActions} authSelectors={authSelectors} specPath={specPath} /> | |||
<Collapse isOpened={isShown}> | |||
<div className="opblock-body"> | |||
{ (operation && operation.size) || operation === null ? null : | |||
@@ -33,6 +33,9 @@ import OnlineValidatorBadge from "core/components/online-validator-badge" | |||
import Operations from "core/components/operations" | |||
import OperationTag from "core/components/operation-tag" | |||
import Operation from "core/components/operation" | |||
import OperationSummary from "core/components/operation-summary" | |||
import OperationSummaryMethod from "core/components/operation-summary-method" | |||
import OperationSummaryPath from "core/components/operation-summary-path" | |||
import OperationExt from "core/components/operation-extensions" | |||
import OperationExtRow from "core/components/operation-extension-row" | |||
import HighlightCode from "core/components/highlight-code" | |||
@@ -102,6 +105,9 @@ export default function() { | |||
onlineValidatorBadge: OnlineValidatorBadge, | |||
operations: Operations, | |||
operation: Operation, | |||
OperationSummary, | |||
OperationSummaryMethod, | |||
OperationSummaryPath, | |||
highlightCode: HighlightCode, | |||
responses: Responses, | |||
response: Response, | |||