@upendra19/swagger-ui-custom 1.0.0

package/src/core/plugins/err/error-transformers/hook.js

@@ -0,0 +1,38 @@
+import reduce from "lodash/reduce"
+import * as NotOfType from "./transformers/not-of-type"
+import * as ParameterOneOf from "./transformers/parameter-oneof"
+
+const errorTransformers = [
+  NotOfType,
+  ParameterOneOf
+]
+
+export default function transformErrors (errors) {
+  // Dev note: unimplemented artifact where
+  // jsSpec: system.specSelectors.specJS()
+  // regardless, to be compliant with redux@4, instead of calling the store method here,
+  // jsSpec should be pass down as an argument,
+  let inputs = {
+    jsSpec: {}
+  }
+
+  let transformedErrors = reduce(errorTransformers, (result, transformer) => {
+    try {
+      let newlyTransformedErrors = transformer.transform(result, inputs)
+      return newlyTransformedErrors.filter(err => !!err) // filter removed errors
+    } catch(e) {
+      console.error("Transformer error:", e)
+      return result
+    }
+  }, errors)
+
+  return transformedErrors
+    .filter(err => !!err) // filter removed errors
+    .map(err => {
+      if(!err.get("line") && err.get("path")) {
+        // TODO: re-resolve line number if we've transformed it away
+      }
+      return err
+    })
+
+}

package/src/core/plugins/err/error-transformers/transformers/not-of-type.js

@@ -0,0 +1,29 @@
+export function transform(errors) {
+  // JSONSchema refers to the current object being validated
+  // as 'instance'. This isn't helpful to users, so we remove it.
+  return errors
+    .map(err => {
+      let seekStr = "is not of a type(s)"
+      let i = err.get("message").indexOf(seekStr)
+      if(i > -1) {
+        let types = err.get("message").slice(i + seekStr.length).split(",")
+        return err.set("message", err.get("message").slice(0, i) + makeNewMessage(types))
+      } else {
+        return err
+      }
+    })
+}
+
+function makeNewMessage(types) {
+  return types.reduce((p, c, i, arr) => {
+    if(i === arr.length - 1 && arr.length > 1) {
+      return p + "or " + c
+    } else if(arr[i+1] && arr.length > 2) {
+      return p + c + ", "
+    } else if(arr[i+1]) {
+      return p + c + " "
+    } else {
+      return p + c
+    }
+  }, "should be a")
+}

package/src/core/plugins/err/error-transformers/transformers/parameter-oneof.js

@@ -0,0 +1,59 @@
+import get from "lodash/get"
+import { fromJS } from "immutable"
+
+export function transform(errors, { jsSpec }) {
+  // LOOK HERE THIS TRANSFORMER IS CURRENTLY DISABLED 😃
+  // TODO: finish implementing, fix flattening problem
+  /* eslint-disable no-unreachable */
+  return errors
+
+
+  // JSONSchema gives us very little to go on
+  let searchStr = "is not exactly one from <#/definitions/parameter>,<#/definitions/jsonReference>"
+  return errors
+    .map(err => {
+      let message = err.get("message")
+      let isParameterOneOfError = message.indexOf(searchStr) > -1
+      if(isParameterOneOfError) {
+        // try to find what's wrong
+        return createTailoredParameterError(err, jsSpec)
+      } else {
+        return err
+      }
+    })
+    .flatten(true) // shallow Immutable flatten
+}
+
+const VALID_IN_VALUES = ["path", "query", "header", "body", "formData"]
+const VALID_COLLECTIONFORMAT_VALUES = ["csv", "ssv", "tsv", "pipes", "multi"]
+
+function createTailoredParameterError(err, jsSpec) {
+  let newErrs = []
+  let parameter = get(jsSpec, err.get("path"))
+
+  // find addressable cases
+  if(parameter.in && VALID_IN_VALUES.indexOf(parameter.in) === -1) {
+    let message = `Wrong value for the "in" keyword. Expected one of: ${VALID_IN_VALUES.join(", ")}.`
+    newErrs.push({
+      message,
+      path: err.get("path") + ".in",
+      type: "spec",
+      source: "structural",
+      level: "error"
+    })
+  }
+
+  if(parameter.collectionFormat && VALID_COLLECTIONFORMAT_VALUES.indexOf(parameter.collectionFormat) === -1) {
+    let message = `Wrong value for the "collectionFormat" keyword. Expected one of: ${VALID_COLLECTIONFORMAT_VALUES.join(", ")}.`
+    newErrs.push({
+      message,
+      path: err.get("path") + ".collectionFormat",
+      type: "spec",
+      source: "structural",
+      level: "error"
+    })
+  }
+
+  return newErrs.length ? fromJS(newErrs) : err // fall back to making no changes
+
+}

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

@@ -0,0 +1,15 @@
+import makeReducers from "./reducers"
+import * as actions from "./actions"
+import * as selectors from "./selectors"
+
+export default function(system) {
+  return {
+    statePlugins: {
+      err: {
+        reducers: makeReducers(system),
+        actions,
+        selectors
+      }
+    }
+  }
+}

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

@@ -0,0 +1,100 @@
+import {
+  NEW_THROWN_ERR,
+  NEW_THROWN_ERR_BATCH,
+  NEW_SPEC_ERR,
+  NEW_SPEC_ERR_BATCH,
+  NEW_AUTH_ERR,
+  CLEAR,
+  CLEAR_BY,
+} from "./actions"
+
+import { fromJS, List } from "immutable"
+
+import transformErrors from "./error-transformers/hook"
+
+let DEFAULT_ERROR_STRUCTURE = {
+  // defaults
+  line: 0,
+  level: "error",
+  message: "Unknown error"
+}
+
+export default function() {
+  return {
+    [NEW_THROWN_ERR]: (state, { payload }) => {
+      let error = Object.assign(DEFAULT_ERROR_STRUCTURE, payload, {type: "thrown"})
+      return state
+        .update("errors", errors => (errors || List()).push( fromJS( error )) )
+        .update("errors", errors => transformErrors(errors))
+    },
+
+    [NEW_THROWN_ERR_BATCH]: (state, { payload }) => {
+      payload = payload.map(err => {
+        return fromJS(Object.assign(DEFAULT_ERROR_STRUCTURE, err, { type: "thrown" }))
+      })
+      return state
+        .update("errors", errors => (errors || List()).concat( fromJS( payload )) )
+        .update("errors", errors => transformErrors(errors))
+    },
+
+    [NEW_SPEC_ERR]: (state, { payload }) => {
+      let error = fromJS(payload)
+      error = error.set("type", "spec")
+      return state
+        .update("errors", errors => (errors || List()).push( fromJS(error)).sortBy(err => err.get("line")) )
+        .update("errors", errors => transformErrors(errors))
+    },
+
+    [NEW_SPEC_ERR_BATCH]: (state, { payload }) => {
+      payload = payload.map(err => {
+        return fromJS(Object.assign(DEFAULT_ERROR_STRUCTURE, err, { type: "spec" }))
+      })
+      return state
+        .update("errors", errors => (errors || List()).concat(fromJS(payload)))
+        .update("errors", errors => transformErrors(errors))
+    },
+
+    [NEW_AUTH_ERR]: (state, { payload }) => {
+      let error = fromJS(Object.assign({}, payload))
+
+      error = error.set("type", "auth")
+      return state
+        .update("errors", errors => (errors || List()).push( fromJS(error)) )
+        .update("errors", errors => transformErrors(errors))
+    },
+
+    [CLEAR]: (state, { payload }) => {
+      if(!payload || !state.get("errors")) {
+        return state
+      }
+
+      let newErrors = state.get("errors")
+        .filter(err => {
+          return err.keySeq().every(k => {
+            const errValue = err.get(k)
+            const filterValue = payload[k]
+
+            if(!filterValue) return true
+
+            return errValue !== filterValue
+          })
+        })
+      return state.merge({
+        errors: newErrors
+      })
+    },
+
+    [CLEAR_BY]: (state, { payload }) => {
+      if(!payload || typeof payload !== "function") {
+        return state
+      }
+      let newErrors = state.get("errors")
+        .filter(err => {
+          return payload(err)
+        })
+      return state.merge({
+        errors: newErrors
+      })
+    }
+  }
+}

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

@@ -0,0 +1,15 @@
+import { List } from "immutable"
+import { createSelector } from "reselect"
+
+const state = state => state
+
+export const allErrors = createSelector(
+  state,
+  err => err.get("errors", List())
+)
+
+export const lastError = createSelector(
+  allErrors,
+  all => all.last()
+)
+

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

@@ -0,0 +1,9 @@
+import opsFilter from "./opsFilter"
+
+export default function() {
+  return {
+    fn: {
+      opsFilter
+    }
+  }
+}

package/src/core/plugins/filter/opsFilter.js

@@ -0,0 +1,3 @@
+export default function(taggedOps, phrase) {
+  return taggedOps.filter((tagObj, tag) => tag.indexOf(phrase) !== -1)
+}

package/src/core/plugins/icons/components/arrow-down.jsx

@@ -0,0 +1,28 @@
+/**
+ * @prettier
+ */
+import React from "react"
+import PropTypes from "prop-types"
+
+const ArrowDown = ({ className = null, width = 20, height = 20, ...rest }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 20 20"
+    className={className}
+    width={width}
+    height={height}
+    aria-hidden="true"
+    focusable="false"
+    {...rest}
+  >
+    <path d="M17.418 6.109c.272-.268.709-.268.979 0s.271.701 0 .969l-7.908 7.83c-.27.268-.707.268-.979 0l-7.908-7.83c-.27-.268-.27-.701 0-.969.271-.268.709-.268.979 0L10 13.25l7.418-7.141z" />
+  </svg>
+)
+
+ArrowDown.propTypes = {
+  className: PropTypes.string,
+  width: PropTypes.string,
+  height: PropTypes.string,
+}
+
+export default ArrowDown

package/src/core/plugins/icons/components/arrow-up.jsx

@@ -0,0 +1,28 @@
+/**
+ * @prettier
+ */
+import React from "react"
+import PropTypes from "prop-types"
+
+const ArrowUp = ({ className = null, width = 20, height = 20, ...rest }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 20 20"
+    className={className}
+    width={width}
+    height={height}
+    aria-hidden="true"
+    focusable="false"
+    {...rest}
+  >
+    <path d="M 17.418 14.908 C 17.69 15.176 18.127 15.176 18.397 14.908 C 18.667 14.64 18.668 14.207 18.397 13.939 L 10.489 6.109 C 10.219 5.841 9.782 5.841 9.51 6.109 L 1.602 13.939 C 1.332 14.207 1.332 14.64 1.602 14.908 C 1.873 15.176 2.311 15.176 2.581 14.908 L 10 7.767 L 17.418 14.908 Z" />
+  </svg>
+)
+
+ArrowUp.propTypes = {
+  className: PropTypes.string,
+  width: PropTypes.string,
+  height: PropTypes.string,
+}
+
+export default ArrowUp

package/src/core/plugins/icons/components/arrow.jsx

@@ -0,0 +1,28 @@
+/**
+ * @prettier
+ */
+import React from "react"
+import PropTypes from "prop-types"
+
+const Arrow = ({ className = null, width = 20, height = 20, ...rest }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 20 20"
+    className={className}
+    width={width}
+    height={height}
+    aria-hidden="true"
+    focusable="false"
+    {...rest}
+  >
+    <path d="M13.25 10L6.109 2.58c-.268-.27-.268-.707 0-.979.268-.27.701-.27.969 0l7.83 7.908c.268.271.268.709 0 .979l-7.83 7.908c-.268.271-.701.27-.969 0-.268-.269-.268-.707 0-.979L13.25 10z" />
+  </svg>
+)
+
+Arrow.propTypes = {
+  className: PropTypes.string,
+  width: PropTypes.string,
+  height: PropTypes.string,
+}
+
+export default Arrow

package/src/core/plugins/icons/components/close.jsx

@@ -0,0 +1,28 @@
+/**
+ * @prettier
+ */
+import React from "react"
+import PropTypes from "prop-types"
+
+const Close = ({ className = null, width = 20, height = 20, ...rest }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 20 20"
+    className={className}
+    width={width}
+    height={height}
+    aria-hidden="true"
+    focusable="false"
+    {...rest}
+  >
+    <path d="M14.348 14.849c-.469.469-1.229.469-1.697 0L10 11.819l-2.651 3.029c-.469.469-1.229.469-1.697 0-.469-.469-.469-1.229 0-1.697l2.758-3.15-2.759-3.152c-.469-.469-.469-1.228 0-1.697.469-.469 1.228-.469 1.697 0L10 8.183l2.651-3.031c.469-.469 1.228-.469 1.697 0 .469.469.469 1.229 0 1.697l-2.758 3.152 2.758 3.15c.469.469.469 1.229 0 1.698z" />
+  </svg>
+)
+
+Close.propTypes = {
+  className: PropTypes.string,
+  width: PropTypes.string,
+  height: PropTypes.string,
+}
+
+export default Close

package/src/core/plugins/icons/components/copy.jsx

@@ -0,0 +1,34 @@
+/**
+ * @prettier
+ */
+import React from "react"
+import PropTypes from "prop-types"
+
+const Copy = ({ className = null, width = 15, height = 16, ...rest }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 15 16"
+    className={className}
+    width={width}
+    height={height}
+    aria-hidden="true"
+    focusable="false"
+    {...rest}
+  >
+    <g transform="translate(2, -1)">
+      <path
+        fill="#ffffff"
+        fillRule="evenodd"
+        d="M2 13h4v1H2v-1zm5-6H2v1h5V7zm2 3V8l-3 3 3 3v-2h5v-2H9zM4.5 9H2v1h2.5V9zM2 12h2.5v-1H2v1zm9 1h1v2c-.02.28-.11.52-.3.7-.19.18-.42.28-.7.3H1c-.55 0-1-.45-1-1V4c0-.55.45-1 1-1h3c0-1.11.89-2 2-2 1.11 0 2 .89 2 2h3c.55 0 1 .45 1 1v5h-1V6H1v9h10v-2zM2 5h8c0-.55-.45-1-1-1H8c-.55 0-1-.45-1-1s-.45-1-1-1-1 .45-1 1-.45 1-1 1H3c-.55 0-1 .45-1 1z"
+      ></path>
+    </g>
+  </svg>
+)
+
+Copy.propTypes = {
+  className: PropTypes.string,
+  width: PropTypes.string,
+  height: PropTypes.string,
+}
+
+export default Copy

package/src/core/plugins/icons/components/lock.jsx

@@ -0,0 +1,28 @@
+/**
+ * @prettier
+ */
+import React from "react"
+import PropTypes from "prop-types"
+
+const Lock = ({ className = null, width = 20, height = 20, ...rest }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 20 20"
+    className={className}
+    width={width}
+    height={height}
+    aria-hidden="true"
+    focusable="false"
+    {...rest}
+  >
+    <path d="M15.8 8H14V5.6C14 2.703 12.665 1 10 1 7.334 1 6 2.703 6 5.6V8H4c-.553 0-1 .646-1 1.199V17c0 .549.428 1.139.951 1.307l1.197.387C5.672 18.861 6.55 19 7.1 19h5.8c.549 0 1.428-.139 1.951-.307l1.196-.387c.524-.167.953-.757.953-1.306V9.199C17 8.646 16.352 8 15.8 8zM12 8H8V5.199C8 3.754 8.797 3 10 3c1.203 0 2 .754 2 2.199V8z" />
+  </svg>
+)
+
+Lock.propTypes = {
+  className: PropTypes.string,
+  width: PropTypes.string,
+  height: PropTypes.string,
+}
+
+export default Lock

package/src/core/plugins/icons/components/unlock.jsx

@@ -0,0 +1,28 @@
+/**
+ * @prettier
+ */
+import React from "react"
+import PropTypes from "prop-types"
+
+const Unlock = ({ className = null, width = 20, height = 20, ...rest }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 20 20"
+    className={className}
+    width={width}
+    height={height}
+    aria-hidden="true"
+    focusable="false"
+    {...rest}
+  >
+    <path d="M15.8 8H14V5.6C14 2.703 12.665 1 10 1 7.334 1 6 2.703 6 5.6V6h2v-.801C8 3.754 8.797 3 10 3c1.203 0 2 .754 2 2.199V8H4c-.553 0-1 .646-1 1.199V17c0 .549.428 1.139.951 1.307l1.197.387C5.672 18.861 6.55 19 7.1 19h5.8c.549 0 1.428-.139 1.951-.307l1.196-.387c.524-.167.953-.757.953-1.306V9.199C17 8.646 16.352 8 15.8 8z"></path>
+  </svg>
+)
+
+Unlock.propTypes = {
+  className: PropTypes.string,
+  width: PropTypes.string,
+  height: PropTypes.string,
+}
+
+export default Unlock

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

@@ -0,0 +1,24 @@
+/**
+ * @prettier
+ */
+import ArrowUpIcon from "./components/arrow-up"
+import ArrowDownIcon from "./components/arrow-down"
+import ArrowIcon from "./components/arrow"
+import CloseIcon from "./components/close"
+import CopyIcon from "./components/copy"
+import LockIcon from "./components/lock"
+import UnlockIcon from "./components/unlock"
+
+const IconsPlugin = () => ({
+  components: {
+    ArrowUpIcon,
+    ArrowDownIcon,
+    ArrowIcon,
+    CloseIcon,
+    CopyIcon,
+    LockIcon,
+    UnlockIcon,
+  },
+})
+
+export default IconsPlugin

package/src/core/plugins/json-schema-2020-12/components/Accordion/Accordion.jsx

@@ -0,0 +1,45 @@
+/**
+ * @prettier
+ */
+import React, { useCallback } from "react"
+import PropTypes from "prop-types"
+import classNames from "classnames"
+
+import { useComponent } from "../../hooks"
+
+const Accordion = ({ expanded = false, children, onChange }) => {
+  const ChevronRightIcon = useComponent("ChevronRightIcon")
+
+  const handleExpansion = useCallback(
+    (event) => {
+      onChange(event, !expanded)
+    },
+    [expanded, onChange]
+  )
+
+  return (
+    <button
+      type="button"
+      className="json-schema-2020-12-accordion"
+      onClick={handleExpansion}
+    >
+      <div className="json-schema-2020-12-accordion__children">{children}</div>
+      <span
+        className={classNames("json-schema-2020-12-accordion__icon", {
+          "json-schema-2020-12-accordion__icon--expanded": expanded,
+          "json-schema-2020-12-accordion__icon--collapsed": !expanded,
+        })}
+      >
+        <ChevronRightIcon />
+      </span>
+    </button>
+  )
+}
+
+Accordion.propTypes = {
+  expanded: PropTypes.bool,
+  children: PropTypes.node.isRequired,
+  onChange: PropTypes.func.isRequired,
+}
+
+export default Accordion

package/src/core/plugins/json-schema-2020-12/components/Accordion/_accordion.scss

@@ -0,0 +1,33 @@
+.json-schema-2020-12-accordion {
+  outline: none;
+  border: none;
+  padding-left: 0;
+
+  &__children {
+    display: inline-block;
+  }
+
+  &__icon {
+    width: 18px;
+    height: 18px;
+    display: inline-block;
+    vertical-align: bottom;
+
+    &--expanded {
+      transition: transform 0.15s ease-in;
+      transform: rotate(-90deg);
+      transform-origin: 50% 50%;
+    }
+
+    &--collapsed {
+      transition: transform 0.15s ease-in;
+      transform: rotate(0deg);
+      transform-origin: 50% 50%;
+    }
+
+    & svg {
+      height: 20px;
+      width: 20px;
+    }
+  }
+}

package/src/core/plugins/json-schema-2020-12/components/ExpandDeepButton/ExpandDeepButton.jsx

@@ -0,0 +1,31 @@
+/**
+ * @prettier
+ */
+import React, { useCallback } from "react"
+import PropTypes from "prop-types"
+
+const ExpandDeepButton = ({ expanded, onClick }) => {
+  const handleExpansion = useCallback(
+    (event) => {
+      onClick(event, !expanded)
+    },
+    [expanded, onClick]
+  )
+
+  return (
+    <button
+      type="button"
+      className="json-schema-2020-12-expand-deep-button"
+      onClick={handleExpansion}
+    >
+      {expanded ? "Collapse all" : "Expand all"}
+    </button>
+  )
+}
+
+ExpandDeepButton.propTypes = {
+  expanded: PropTypes.bool.isRequired,
+  onClick: PropTypes.func.isRequired,
+}
+
+export default ExpandDeepButton

package/src/core/plugins/json-schema-2020-12/components/ExpandDeepButton/_expand-deep-button.scss

@@ -0,0 +1,10 @@
+@use "./../../../../../style/variables" as *;
+@use "./../../../../../style/type";
+
+.json-schema-2020-12-expand-deep-button {
+  @include type.text_headline($section-models-model-title-font-color);
+  font-size: 12px;
+  color: rgb(175, 174, 174);
+  border: none;
+  padding-right: 0;
+}