@upendra19/swagger-ui-custom 1.0.0

package/src/core/plugins/layout/actions.js

@@ -0,0 +1,39 @@
+import { normalizeArray } from "core/utils"
+
+export const UPDATE_LAYOUT = "layout_update_layout"
+export const UPDATE_FILTER = "layout_update_filter"
+export const UPDATE_MODE = "layout_update_mode"
+export const SHOW = "layout_show"
+
+// export const ONLY_SHOW = "layout_only_show"
+
+export function updateLayout(layout) {
+  return {
+    type: UPDATE_LAYOUT,
+    payload: layout
+  }
+}
+
+export function updateFilter(filter) {
+  return {
+    type: UPDATE_FILTER,
+    payload: filter
+  }
+}
+
+export function show(thing, shown=true) {
+  thing = normalizeArray(thing)
+  return {
+    type: SHOW,
+    payload: {thing, shown}
+  }
+}
+
+// Simple string key-store, used for
+export function changeMode(thing, mode="") {
+  thing = normalizeArray(thing)
+  return {
+    type: UPDATE_MODE,
+    payload: {thing, mode}
+  }
+}

package/src/core/plugins/layout/index.js

@@ -0,0 +1,19 @@
+import reducers from "./reducers"
+import * as actions from "./actions"
+import * as selectors from "./selectors"
+import * as wrapSelectors from "./spec-extensions/wrap-selector"
+
+export default function() {
+  return {
+    statePlugins: {
+      layout: {
+        reducers,
+        actions,
+        selectors
+      },
+      spec: {
+        wrapSelectors
+      }
+    }
+  }
+}

package/src/core/plugins/layout/reducers.js

@@ -0,0 +1,32 @@
+import { fromJS } from "immutable"
+import {
+  UPDATE_LAYOUT,
+  UPDATE_FILTER,
+  UPDATE_MODE,
+  SHOW
+} from "./actions"
+
+export default {
+
+  [UPDATE_LAYOUT]: (state, action) => state.set("layout", action.payload),
+
+  [UPDATE_FILTER]: (state, action) => state.set("filter", action.payload),
+
+  [SHOW]: (state, action) => {
+    const isShown = action.payload.shown
+    // This is one way to serialize an array, another (preferred) is to convert to json-pointer
+    // TODO: use json-pointer serilization instead of fromJS(...), for performance
+    const thingToShow = fromJS(action.payload.thing)
+    // This is a map of paths to bools
+    // eg: [one, two] => true
+    // eg: [one] => false
+    return state.update("shown", fromJS({}), a => a.set(thingToShow, isShown))
+  },
+
+  [UPDATE_MODE]: (state, action) => {
+    let thing = action.payload.thing
+    let mode = action.payload.mode
+    return state.setIn(["modes"].concat(thing), (mode || "") + "")
+  }
+
+}

package/src/core/plugins/layout/selectors.js

@@ -0,0 +1,24 @@
+import { createSelector } from "reselect"
+import { normalizeArray } from "core/utils"
+import { fromJS } from "immutable"
+
+const state = state => state
+
+export const current = state => state.get("layout")
+
+export const currentFilter = state => state.get("filter")
+
+export const isShown = (state, thing, def) => {
+  thing = normalizeArray(thing)
+  return state.get("shown", fromJS({})).get(fromJS(thing), def)
+}
+
+export const whatMode = (state, thing, def="") => {
+  thing = normalizeArray(thing)
+  return state.getIn(["modes", ...thing], def)
+}
+
+export const showSummary = createSelector(
+  state,
+  state => !isShown(state, "editor")
+)

package/src/core/plugins/layout/spec-extensions/wrap-selector.js

@@ -0,0 +1,22 @@
+
+export const taggedOperations = (oriSelector, system) => (state, ...args) => {
+  let taggedOps = oriSelector(state, ...args)
+
+  const { fn, layoutSelectors, getConfigs } = system.getSystem()
+  const configs = getConfigs()
+  const { maxDisplayedTags } = configs
+
+  // Filter, if requested
+  let filter = layoutSelectors.currentFilter()
+  if (filter) {
+    if (filter !== true) {
+      taggedOps = fn.opsFilter(taggedOps, filter)
+    }
+  }
+  // Limit to [max] items, if specified
+  if (maxDisplayedTags >= 0) {
+    taggedOps = taggedOps.slice(0, maxDisplayedTags)
+  }
+
+  return taggedOps
+}

package/src/core/plugins/logs/index.js

@@ -0,0 +1,28 @@
+export default function ({configs}) {
+
+  const levels = {
+    "debug": 0,
+    "info": 1,
+    "log": 2,
+    "warn": 3,
+    "error": 4
+  }
+
+  const getLevel = (level) => levels[level] || -1
+
+  let { logLevel } = configs
+  let logLevelInt = getLevel(logLevel)
+
+  function log(level, ...args) {
+    if(getLevel(level) >= logLevelInt)
+    // eslint-disable-next-line no-console
+      console[level](...args)
+  }
+
+  log.warn = log.bind(null, "warn")
+  log.error = log.bind(null, "error")
+  log.info = log.bind(null, "info")
+  log.debug = log.bind(null, "debug")
+
+  return { rootInjects: { log } }
+}

package/src/core/plugins/oas3/actions.js

@@ -0,0 +1,99 @@
+// Actions conform to FSA (flux-standard-actions)
+// {type: string,payload: Any|Error, meta: obj, error: bool}
+
+export const UPDATE_SELECTED_SERVER = "oas3_set_servers"
+export const UPDATE_REQUEST_BODY_VALUE = "oas3_set_request_body_value"
+export const UPDATE_REQUEST_BODY_VALUE_RETAIN_FLAG = "oas3_set_request_body_retain_flag"
+export const UPDATE_REQUEST_BODY_INCLUSION = "oas3_set_request_body_inclusion"
+export const UPDATE_ACTIVE_EXAMPLES_MEMBER = "oas3_set_active_examples_member"
+export const UPDATE_REQUEST_CONTENT_TYPE = "oas3_set_request_content_type"
+export const UPDATE_RESPONSE_CONTENT_TYPE = "oas3_set_response_content_type"
+export const UPDATE_SERVER_VARIABLE_VALUE = "oas3_set_server_variable_value"
+export const SET_REQUEST_BODY_VALIDATE_ERROR = "oas3_set_request_body_validate_error"
+export const CLEAR_REQUEST_BODY_VALIDATE_ERROR = "oas3_clear_request_body_validate_error"
+export const CLEAR_REQUEST_BODY_VALUE = "oas3_clear_request_body_value"
+
+export function setSelectedServer (selectedServerUrl, namespace) {
+  return {
+    type: UPDATE_SELECTED_SERVER,
+    payload: {selectedServerUrl, namespace}
+  }
+}
+
+export function setRequestBodyValue ({ value, pathMethod }) {
+  return {
+    type: UPDATE_REQUEST_BODY_VALUE,
+    payload: { value, pathMethod }
+  }
+}
+
+export const setRetainRequestBodyValueFlag = ({ value, pathMethod }) => {
+  return {
+    type: UPDATE_REQUEST_BODY_VALUE_RETAIN_FLAG,
+    payload: { value, pathMethod }
+  }
+}
+
+
+export function setRequestBodyInclusion ({ value, pathMethod, name }) {
+  return {
+    type: UPDATE_REQUEST_BODY_INCLUSION,
+    payload: { value, pathMethod, name }
+  }
+}
+
+export function setActiveExamplesMember ({ name, pathMethod, contextType, contextName }) {
+  return {
+    type: UPDATE_ACTIVE_EXAMPLES_MEMBER,
+    payload: { name, pathMethod, contextType, contextName }
+  }
+}
+
+export function setRequestContentType ({ value, pathMethod }) {
+  return {
+    type: UPDATE_REQUEST_CONTENT_TYPE,
+    payload: { value, pathMethod }
+  }
+}
+
+export function setResponseContentType ({ value, path, method }) {
+  return {
+    type: UPDATE_RESPONSE_CONTENT_TYPE,
+    payload: { value, path, method }
+  }
+}
+
+export function setServerVariableValue ({ server, namespace, key, val }) {
+  return {
+    type: UPDATE_SERVER_VARIABLE_VALUE,
+    payload: { server, namespace, key, val }
+  }
+}
+
+export const setRequestBodyValidateError = ({ path, method, validationErrors }) => {
+  return {
+    type: SET_REQUEST_BODY_VALIDATE_ERROR,
+    payload: { path, method, validationErrors }
+  }
+}
+
+export const clearRequestBodyValidateError = ({ path, method }) => {
+  return {
+    type: CLEAR_REQUEST_BODY_VALIDATE_ERROR,
+    payload: { path, method }
+  }
+}
+
+export const initRequestBodyValidateError = ({ pathMethod } ) => {
+  return {
+    type: CLEAR_REQUEST_BODY_VALIDATE_ERROR,
+    payload: { path: pathMethod[0], method: pathMethod[1] }
+  }
+}
+
+export const clearRequestBodyValue = ({ pathMethod }) => {
+  return {
+    type:  CLEAR_REQUEST_BODY_VALUE,
+    payload: { pathMethod }
+  }
+}

package/src/core/plugins/oas3/auth-extensions/wrap-selectors.js

@@ -0,0 +1,92 @@
+import { createSelector } from "reselect"
+import { List, Map, fromJS } from "immutable"
+
+
+// Helpers
+
+const state = state => state
+
+function onlyOAS3(selector) {
+  return (ori, system) => (...args) => {
+    if(system.getSystem().specSelectors.isOAS3()) {
+      // Pass the spec plugin state to Reselect to trigger on securityDefinitions update
+      let resolvedSchemes = system.getState().getIn(["spec", "resolvedSubtrees",
+        "components", "securitySchemes"])
+      return selector(system, resolvedSchemes, ...args)
+    } else {
+      return ori(...args)
+    }
+  }
+}
+
+export const definitionsToAuthorize = onlyOAS3(createSelector(
+    state,
+    ({specSelectors}) => specSelectors.securityDefinitions(),
+    (system, definitions) => {
+      // Coerce our OpenAPI 3.0 definitions into monoflow definitions
+      // that look like Swagger2 definitions.
+      let list = List()
+
+      if(!definitions) {
+        return list
+      }
+
+      definitions.entrySeq().forEach( ([ defName, definition ]) => {
+        const type = definition?.get("type")
+
+        if(type === "oauth2") {
+          definition.get("flows").entrySeq().forEach(([flowKey, flowVal]) => {
+            let translatedDef = fromJS({
+              flow: flowKey,
+              authorizationUrl: flowVal.get("authorizationUrl"),
+              tokenUrl: flowVal.get("tokenUrl"),
+              scopes: flowVal.get("scopes"),
+              type: definition.get("type"),
+              description: definition.get("description")
+            })
+
+            list = list.push(new Map({
+              [defName]: translatedDef.filter((v) => {
+                // filter out unset values, sometimes `authorizationUrl`
+                // and `tokenUrl` come out as `undefined` in the data
+                return v !== undefined
+              })
+            }))
+          })
+        }
+        if(type === "http" || type === "apiKey") {
+          list = list.push(new Map({
+            [defName]: definition
+          }))
+        }
+        if(type === "openIdConnect" && definition.get("openIdConnectData")) {
+          let oidcData = definition.get("openIdConnectData")
+          let grants = oidcData.get("grant_types_supported") || ["authorization_code", "implicit"]
+          grants.forEach((grant) => {
+            // Convert from OIDC list of scopes to the OAS-style map with empty descriptions
+            let translatedScopes = oidcData.get("scopes_supported") &&
+              oidcData.get("scopes_supported").reduce((acc, cur) => acc.set(cur, ""), new Map())
+
+            let translatedDef = fromJS({
+              flow: grant,
+              authorizationUrl: oidcData.get("authorization_endpoint"),
+              tokenUrl: oidcData.get("token_endpoint"),
+              scopes: translatedScopes,
+              type: "oauth2",
+              openIdConnectUrl: definition.get("openIdConnectUrl")
+            })
+
+            list = list.push(new Map({
+              [defName]: translatedDef.filter((v) => {
+                // filter out unset values, sometimes `authorizationUrl`
+                // and `tokenUrl` come out as `undefined` in the data
+                return v !== undefined
+              })
+            }))
+          })
+        }
+      })
+
+      return list
+    }
+))

package/src/core/plugins/oas3/components/auth/http-auth.jsx

@@ -0,0 +1,157 @@
+import React from "react"
+import PropTypes from "prop-types"
+
+export default class HttpAuth extends React.Component {
+  static propTypes = {
+    authorized: PropTypes.object,
+    getComponent: PropTypes.func.isRequired,
+    errSelectors: PropTypes.object.isRequired,
+    schema: PropTypes.object.isRequired,
+    name: PropTypes.string.isRequired,
+    onChange: PropTypes.func,
+    authSelectors: PropTypes.object.isRequired
+  }
+
+  constructor(props, context) {
+    super(props, context)
+    let { name, schema } = this.props
+    let value = this.getValue()
+
+    this.state = {
+      name: name,
+      schema: schema,
+      value: value
+    }
+  }
+
+  getValue () {
+    let { name, authorized } = this.props
+
+    return authorized && authorized.getIn([name, "value"])
+  }
+
+  onChange =(e) => {
+    let { onChange } = this.props
+    let { value, name } = e.target
+
+    let newValue = Object.assign({}, this.state.value)
+
+    if(name) {
+      newValue[name] = value
+    } else {
+      newValue = value
+    }
+
+    this.setState({ value: newValue }, () => onChange(this.state))
+
+  }
+
+  render() {
+    let { schema, getComponent, errSelectors, name, authSelectors } = this.props
+    const Input = getComponent("Input")
+    const Row = getComponent("Row")
+    const Col = getComponent("Col")
+    const AuthError = getComponent("authError")
+    const Markdown = getComponent("Markdown", true)
+    const JumpToPath = getComponent("JumpToPath", true)
+
+    const scheme = (schema.get("scheme") || "").toLowerCase()
+    const path = authSelectors.selectAuthPath(name)
+    let value = this.getValue()
+    let errors = errSelectors.allErrors().filter( err => err.get("authId") === name)
+
+    if(scheme === "basic") {
+      let username = value ? value.get("username") : null
+      return <div>
+        <h4>
+          <code>{name}</code>&nbsp;
+            (http, Basic)
+            <JumpToPath path={path} />
+          </h4>
+        { username && <h6>Authorized</h6> }
+        <Row>
+          <Markdown source={ schema.get("description") } />
+        </Row>
+        <Row>
+          <label htmlFor="auth-basic-username">Username:</label>
+          {
+            username ? <code> { username } </code>
+              : <Col>
+                  <Input 
+                    id="auth-basic-username"
+                    type="text"
+                    required="required"
+                    name="username"
+                    aria-label="auth-basic-username"
+                    onChange={ this.onChange }
+                    autoFocus
+                  />
+                </Col>
+          }
+        </Row>
+        <Row>
+          <label htmlFor="auth-basic-password">Password:</label>
+            {
+              username ? <code> ****** </code>
+                       : <Col>
+                            <Input 
+                              id="auth-basic-password"
+                              autoComplete="new-password"
+                              name="password"
+                              type="password"
+                              aria-label="auth-basic-password"
+                              onChange={ this.onChange }
+                            />
+                          </Col>
+          }
+        </Row>
+        {
+          errors.valueSeq().map( (error, key) => {
+            return <AuthError error={ error }
+                              key={ key }/>
+          } )
+        }
+      </div>
+    }
+
+    if(scheme === "bearer") {
+      return (
+        <div>
+          <h4>
+            <code>{name}</code>&nbsp;
+              (http, Bearer)
+              <JumpToPath path={path} />
+            </h4>
+            { value && <h6>Authorized</h6>}
+            <Row>
+              <Markdown source={ schema.get("description") } />
+            </Row>
+            <Row>
+              <label htmlFor="auth-bearer-value">Value:</label>
+              {
+                value ? <code> ****** </code>
+              : <Col>
+                  <Input
+                    id="auth-bearer-value"
+                    type="text"
+                    aria-label="auth-bearer-value"
+                    onChange={ this.onChange }
+                    autoFocus
+                  />
+                </Col>
+          }
+        </Row>
+        {
+          errors.valueSeq().map( (error, key) => {
+            return <AuthError error={ error }
+              key={ key }/>
+          } )
+        }
+      </div>
+    )
+    }
+  return <div>
+    <em><b>{name}</b> HTTP authentication: unsupported scheme {`'${scheme}'`}</em>
+  </div>
+  }
+}

package/src/core/plugins/oas3/components/callbacks.jsx

@@ -0,0 +1,51 @@
+/**
+ * @prettier
+ */
+import React from "react"
+import PropTypes from "prop-types"
+import ImPropTypes from "react-immutable-proptypes"
+
+const Callbacks = ({ callbacks, specPath, specSelectors, getComponent }) => {
+  const operationDTOs = specSelectors.callbacksOperations({
+    callbacks,
+    specPath,
+  })
+  const callbackNames = Object.keys(operationDTOs)
+
+  const OperationContainer = getComponent("OperationContainer", true)
+
+  if (callbackNames.length === 0) return <span>No callbacks</span>
+
+  return (
+    <div>
+      {callbackNames.map((callbackName) => (
+        <div key={`${callbackName}`}>
+          <h2>{callbackName}</h2>
+
+          {operationDTOs[callbackName].map((operationDTO) => (
+            <OperationContainer
+              key={`${callbackName}-${operationDTO.path}-${operationDTO.method}`}
+              op={operationDTO.operation}
+              tag="callbacks"
+              method={operationDTO.method}
+              path={operationDTO.path}
+              specPath={operationDTO.specPath}
+              allowTryItOut={false}
+            />
+          ))}
+        </div>
+      ))}
+    </div>
+  )
+}
+
+Callbacks.propTypes = {
+  getComponent: PropTypes.func.isRequired,
+  specSelectors: PropTypes.shape({
+    callbacksOperations: PropTypes.func.isRequired,
+  }).isRequired,
+  callbacks: ImPropTypes.iterable.isRequired,
+  specPath: ImPropTypes.list.isRequired,
+}
+
+export default Callbacks

package/src/core/plugins/oas3/components/index.js

@@ -0,0 +1,19 @@
+import Callbacks from "./callbacks"
+import RequestBody from "./request-body"
+import OperationLink from "./operation-link"
+import Servers from "./servers"
+import ServersContainer from "./servers-container"
+import RequestBodyEditor from "./request-body-editor"
+import HttpAuth from "./auth/http-auth"
+import OperationServers from "./operation-servers"
+
+export default {
+  Callbacks,
+  HttpAuth,
+  RequestBody,
+  Servers,
+  ServersContainer,
+  RequestBodyEditor,
+  OperationServers,
+  operationLink: OperationLink,
+}

package/src/core/plugins/oas3/components/operation-link.jsx

@@ -0,0 +1,43 @@
+import React, { Component } from "react"
+import PropTypes from "prop-types"
+import ImPropTypes from "react-immutable-proptypes"
+
+class OperationLink extends Component {
+  render() {
+    const { link, name, getComponent } = this.props
+
+    const Markdown = getComponent("Markdown", true)
+
+    let targetOp = link.get("operationId") || link.get("operationRef")
+    let parameters = link.get("parameters") && link.get("parameters").toJS()
+    let description = link.get("description")
+
+    return <div className="operation-link">
+      <div className="description">
+        <b><code>{name}</code></b>
+        { description ? <Markdown source={description}></Markdown> : null }
+      </div>
+      <pre>
+        Operation `{targetOp}`<br /><br />
+        Parameters {padString(0, JSON.stringify(parameters, null, 2)) || "{}"}<br />
+      </pre>
+    </div>
+  }
+
+}
+
+function padString(n, string) {
+  if(typeof string !== "string") { return "" }
+  return string
+    .split("\n")
+    .map((line, i) => i > 0 ? Array(n + 1).join(" ") + line : line)
+    .join("\n")
+}
+
+OperationLink.propTypes = {
+  getComponent: PropTypes.func.isRequired,
+  link: ImPropTypes.orderedMap.isRequired,
+  name: PropTypes.String
+}
+
+export default OperationLink