Merge branch 'operationId'

# Conflicts:
#	src/core/components/operation.jsx
This commit is contained in:
Artem
2017-06-06 17:23:04 +03:00
27 changed files with 7191 additions and 108 deletions

View File

@@ -53,8 +53,7 @@ export default class ApiKeyAuth extends React.Component {
<h4>Api key authorization<JumpToPath path={[ "securityDefinitions", name ]} /></h4>
{ value && <h6>Authorized</h6>}
<Row>
<Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}}
source={ schema.get("description") } />
<Markdown source={ schema.get("description") } />
</Row>
<Row>
<p>Name: <code>{ schema.get("name") }</code></p>

View File

@@ -59,8 +59,7 @@ export default class BasicAuth extends React.Component {
<h4>Basic authorization<JumpToPath path={[ "securityDefinitions", name ]} /></h4>
{ username && <h6>Authorized</h6> }
<Row>
<Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}}
source={ schema.get("description") } />
<Markdown source={ schema.get("description") } />
</Row>
<Row>
<label>Username:</label>

View File

@@ -102,8 +102,7 @@ export default class Oauth2 extends React.Component {
<div>
<h4>OAuth2.0 <JumpToPath path={[ "securityDefinitions", name ]} /></h4>
{ !this.state.appName ? null : <h5>Application: { this.state.appName } </h5> }
<Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}}
source={ schema.get("description") } />
<Markdown source={ schema.get("description") } />
{ isAuthorized && <h6>Authorized</h6> }

View File

@@ -99,7 +99,7 @@ export default class Info extends React.Component {
</hgroup>
<div className="description">
<Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}} source={ description } />
<Markdown source={ description } />
</div>
{

View File

@@ -1,13 +1,10 @@
import React, { PropTypes } from "react"
import OriCollapse from "react-collapse"
import _Markdown from "react-remarkable"
function xclass(...args) {
return args.filter(a => !!a).join(" ").trim()
}
export const Markdown = _Markdown
export class Container extends React.Component {
render() {
let { fullscreen, full, ...rest } = this.props
@@ -73,7 +70,7 @@ export class Col extends React.Component {
}
}
let classes = xclass(rest.className, "clear", ...classesAr)
let classes = xclass(rest.className, ...classesAr)
return (
<section {...rest} style={{display: hide ? "none": null}} className={classes}/>

View File

@@ -17,6 +17,8 @@ export default class Operation extends React.Component {
allowTryItOut: PropTypes.bool,
displayOperationId: PropTypes.bool,
response: PropTypes.object,
request: PropTypes.object,
@@ -27,13 +29,15 @@ export default class Operation extends React.Component {
specSelectors: PropTypes.object.isRequired,
layoutActions: PropTypes.object.isRequired,
layoutSelectors: PropTypes.object.isRequired,
fn: PropTypes.object.isRequired
fn: PropTypes.object.isRequired,
getConfigs: PropTypes.func.isRequired
}
static defaultProps = {
showSummary: true,
response: null,
allowTryItOut: true,
displayOperationId: false,
}
constructor(props, context) {
@@ -76,8 +80,10 @@ export default class Operation extends React.Component {
}
isShown =() => {
let { layoutSelectors, isShownKey } = this.props
return layoutSelectors.isShown(isShownKey, false ) // Here is where we set the default
let { layoutSelectors, isShownKey, getConfigs } = this.props
let { docExpansion } = getConfigs()
return layoutSelectors.isShown(isShownKey, docExpansion === "full" ) // Here is where we set the default
}
onTryoutClick =() => {
@@ -105,6 +111,7 @@ export default class Operation extends React.Component {
response,
request,
allowTryItOut,
displayOperationId,
fn,
getComponent,
@@ -123,7 +130,7 @@ export default class Operation extends React.Component {
let produces = operation.get("produces")
let schemes = operation.get("schemes")
let parameters = getList(operation, ["parameters"])
let operationId = operation.get("operationId")
let operationId = operation.get("__originalOperationId")
const Responses = getComponent("responses")
const Parameters = getComponent( "parameters" )
@@ -149,7 +156,6 @@ export default class Operation extends React.Component {
<div className={deprecated ? "opblock opblock-deprecated" : shown ? `opblock opblock-${method} is-open` : `opblock opblock-${method}`} id={isShownKey} >
<div className={`opblock-summary opblock-summary-${method}`} onClick={this.toggleShown} >
<span className="opblock-summary-method">{method.toUpperCase()}</span>
<span className={ deprecated ? "opblock-summary-path__deprecated" : "opblock-summary-path" } >
<span>{path}</span>
<JumpToPath path={jumpToKey} />
@@ -160,7 +166,9 @@ export default class Operation extends React.Component {
{ summary }
</div>
}
{ operationId ? <span className="opblock-summary-operation-id">{operationId}</span> : null }
{ displayOperationId && operationId ? <span className="opblock-summary-path">{operationId}</span> : null }
{
(!security || !security.count()) ? null :
<AuthorizeOperationBtn authActions={ authActions }
@@ -175,7 +183,7 @@ export default class Operation extends React.Component {
{ description &&
<div className="opblock-description-wrapper">
<div className="opblock-description">
<Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}} source={ description } />
<Markdown source={ description } />
</div>
</div>
}

View File

@@ -10,10 +10,12 @@ export default class Operations extends React.Component {
layoutActions: PropTypes.object.isRequired,
authActions: PropTypes.object.isRequired,
authSelectors: PropTypes.object.isRequired,
displayOperationId: PropTypes.bool,
getConfigs: PropTypes.func.isRequired
};
static defaultProps = {
displayOperationId: false
};
render() {
@@ -25,6 +27,8 @@ export default class Operations extends React.Component {
layoutActions,
authActions,
authSelectors,
displayOperationId,
getConfigs,
fn
} = this.props
@@ -34,6 +38,8 @@ export default class Operations extends React.Component {
const Collapse = getComponent("Collapse")
let showSummary = layoutSelectors.showSummary()
let { docExpansion } = getConfigs()
displayOperationId = getConfigs().displayOperationId
return (
<div>
@@ -43,7 +49,7 @@ export default class Operations extends React.Component {
let tagDescription = tagObj.getIn(["tagDetails", "description"], null)
let isShownKey = ["operations-tag", tag]
let showTag = layoutSelectors.isShown(isShownKey, true)
let showTag = layoutSelectors.isShown(isShownKey, docExpansion === "full" || docExpansion === "list")
return (
<div className={showTag ? "opblock-tag-section is-open" : "opblock-tag-section"} key={"operation-" + tag}>
@@ -87,6 +93,8 @@ export default class Operations extends React.Component {
request={ request }
allowTryItOut={allowTryItOut}
displayOperationId={displayOperationId}
specActions={ specActions }
specSelectors={ specSelectors }
@@ -98,6 +106,7 @@ export default class Operations extends React.Component {
getComponent={ getComponent }
fn={fn}
getConfigs={ getConfigs }
/>
}).toArray()
}

View File

@@ -99,8 +99,7 @@ export default class ParameterRow extends Component {
</td>
<td className="col parameters-col_description">
<Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}}
source={ param.get("description") }/>
<Markdown source={ param.get("description") }/>
{(isFormData && !isFormDataSupported) && <div>Error: your browser does not support FormData</div>}
{ bodyParam || !isExecute ? null

View File

@@ -0,0 +1,6 @@
# Providers
Providers are generic bridges to third-party components. They provide two benefits:
1. ability for plugins to override third-party components, because providers are loaded through `getComponent`
2. allows us to avoid painting ourselves into a corner with a third-party component

View File

@@ -0,0 +1,17 @@
import React, { PropTypes } from "react"
import Remarkable from "react-remarkable"
import sanitize from "sanitize-html"
function Markdown({ source }) {
const sanitized = sanitize(source)
return <Remarkable
options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}}
source={sanitized}
></Remarkable>
}
Markdown.propTypes = {
source: PropTypes.string.isRequired
}
export default Markdown

View File

@@ -76,7 +76,7 @@ export default class Response extends React.Component {
<td className="col response-col_description">
<div className="response-col_description__inner">
<Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}} source={ response.get( "description" ) } />
<Markdown source={ response.get( "description" ) } />
</div>
{ example ? (

View File

@@ -8,7 +8,7 @@ import { parseSeach, filterConfigs } from "core/utils"
const CONFIGS = [ "url", "spec", "validatorUrl", "onComplete", "onFailure", "authorizations", "docExpansion",
"apisSorter", "operationsSorter", "supportedSubmitMethods", "dom_id", "defaultModelRendering", "oauth2RedirectUrl",
"showRequestHeaders", "custom", "modelPropertyMacro", "parameterMacro" ]
"showRequestHeaders", "custom", "modelPropertyMacro", "parameterMacro", "displayOperationId" ]
// eslint-disable-next-line no-undef
const { GIT_DIRTY, GIT_COMMIT, PACKAGE_VERSION } = buildInfo
@@ -24,9 +24,11 @@ module.exports = function SwaggerUI(opts) {
spec: {},
url: "",
layout: "BaseLayout",
docExpansion: "list",
validatorUrl: "https://online.swagger.io/validator",
configs: {},
custom: {},
displayOperationId: false,
// Initial set of plugins ( TODO rename this, or refactor - we don't need presets _and_ plugins. Its just there for performance.
// Instead, we can compile the first plugin ( it can be a collection of plugins ), then batch the rest.

View File

@@ -43,8 +43,6 @@ export const specResolved = createSelector(
// Default Spec ( as an object )
export const spec = state => {
let res = specResolved(state)
if(res.count() < 1)
res = specJson(state)
return res
}

View File

@@ -46,6 +46,8 @@ import Model from "core/components/model"
import Models from "core/components/models"
import TryItOutButton from "core/components/try-it-out-button"
import Markdown from "core/components/providers/markdown"
import BaseLayout from "core/components/layouts/base"
import * as LayoutUtils from "core/components/layout-utils"
@@ -89,6 +91,7 @@ export default function() {
model: Model,
models: Models,
TryItOutButton,
Markdown,
BaseLayout
}
}

View File

@@ -58,7 +58,7 @@
&.execute
{
animation: pulse 2s infinite;
animation: swagger-ui-pulse 2s infinite;
color: #fff;
border-color: #4990e2;
@@ -66,7 +66,7 @@
}
@keyframes pulse
@keyframes swagger-ui-pulse
{
0%
{

View File

@@ -13,13 +13,18 @@
font-size: 12px;
}
}
p
p, li, table
{
font-size: 14px;
@include text_body();
}
h1, h2, h3, h4, h5
{
@include text_body();
}
code
{
padding: 3px 5px;