docusaurus-theme-openapi-docs 1.0.1 → 1.0.2

package/lib-next/theme/ApiDemoPanel/Authorization/index.js

@@ -1,203 +0,0 @@
-/* ============================================================================
- * Copyright (c) Palo Alto Networks
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- * ========================================================================== */
-import React, { useState } from "react";
-import clsx from "clsx";
-import FormItem from "../FormItem";
-import FormSelect from "../FormSelect";
-import FormTextInput from "../FormTextInput";
-import { useTypedDispatch, useTypedSelector } from "../hooks";
-import styles from "../styles.module.css";
-import { setAuthData, setSelectedAuth } from "./slice";
-
-function LockButton({ mode, children, style, ...rest }) {
-  return (
-    <button
-      className={clsx("button", "button--primary", {
-        "button--outline": mode !== "locked",
-      })}
-      style={{
-        marginLeft: "auto",
-        display: "flex",
-        alignItems: "center",
-        marginBottom: "var(--ifm-spacing-vertical)",
-        ...style,
-      }}
-      {...rest}
-    >
-      <span>{children}</span>
-
-      <svg
-        style={{
-          marginLeft: "12px",
-          width: "18px",
-          height: "18px",
-          fill: "currentColor",
-        }}
-        viewBox="0 0 20 20"
-        id={mode}
-      >
-        {mode === "locked" ? (
-          <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"></path>
-        ) : (
-          <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>
-    </button>
-  );
-}
-
-function validateData(selectedAuth, data) {
-  for (const scheme of selectedAuth) {
-    if (data[scheme.key] === undefined) {
-      return false;
-    }
-
-    const hasMissingKeys = Object.values(data[scheme.key]).includes(undefined);
-
-    if (hasMissingKeys) {
-      return false;
-    }
-  }
-
-  return true;
-}
-
-function Authorization() {
-  const [editing, setEditing] = useState(false);
-  const data = useTypedSelector((state) => state.auth.data);
-  const options = useTypedSelector((state) => state.auth.options);
-  const selected = useTypedSelector((state) => state.auth.selected);
-  const dispatch = useTypedDispatch();
-
-  if (selected === undefined) {
-    return null;
-  }
-
-  const selectedAuth = options[selected];
-  const authenticated = validateData(selectedAuth, data);
-  const optionKeys = Object.keys(options);
-
-  if (editing) {
-    return (
-      <div className={styles.optionsPanel}>
-        {optionKeys.length > 1 && (
-          <FormItem label="Security Scheme">
-            <FormSelect
-              options={optionKeys}
-              value={selected}
-              onChange={(e) => {
-                dispatch(setSelectedAuth(e.target.value));
-              }}
-            />
-          </FormItem>
-        )}
-        {selectedAuth.map((a) => {
-          if (a.type === "http" && a.scheme === "bearer") {
-            return (
-              <FormItem label="Bearer Token" key={selected + "-bearer"}>
-                <FormTextInput
-                  placeholder="Bearer Token"
-                  value={data[a.key].token ?? ""}
-                  onChange={(e) => {
-                    const value = e.target.value.trim();
-                    dispatch(
-                      setAuthData({
-                        scheme: a.key,
-                        key: "token",
-                        value: value ? value : undefined,
-                      })
-                    );
-                  }}
-                />
-              </FormItem>
-            );
-          }
-
-          if (a.type === "http" && a.scheme === "basic") {
-            return (
-              <React.Fragment key={selected + "-basic"}>
-                <FormItem label="Username">
-                  <FormTextInput
-                    placeholder="Username"
-                    value={data[a.key].username ?? ""}
-                    onChange={(e) => {
-                      const value = e.target.value.trim();
-                      dispatch(
-                        setAuthData({
-                          scheme: a.key,
-                          key: "username",
-                          value: value ? value : undefined,
-                        })
-                      );
-                    }}
-                  />
-                </FormItem>
-                <FormItem label="Password">
-                  <FormTextInput
-                    placeholder="Password"
-                    password
-                    value={data[a.key].password ?? ""}
-                    onChange={(e) => {
-                      const value = e.target.value.trim();
-                      dispatch(
-                        setAuthData({
-                          scheme: a.key,
-                          key: "password",
-                          value: value ? value : undefined,
-                        })
-                      );
-                    }}
-                  />
-                </FormItem>
-              </React.Fragment>
-            );
-          }
-
-          return null;
-        })}
-        <LockButton
-          mode="unlocked"
-          style={{
-            marginTop: "var(--ifm-spacing-vertical)",
-            marginBottom: 0,
-          }}
-          onClick={() => {
-            setEditing(false);
-          }}
-        >
-          Save
-        </LockButton>
-      </div>
-    );
-  }
-
-  if (authenticated) {
-    return (
-      <LockButton
-        mode="locked"
-        onClick={() => {
-          setEditing(true);
-        }}
-      >
-        Authorized
-      </LockButton>
-    );
-  }
-
-  return (
-    <LockButton
-      mode="unlocked"
-      onClick={() => {
-        setEditing(true);
-      }}
-    >
-      Authorize
-    </LockButton>
-  );
-}
-
-export default Authorization;

package/lib-next/theme/ApiDemoPanel/Execute/index.js

@@ -1,74 +0,0 @@
-/* ============================================================================
- * Copyright (c) Palo Alto Networks
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- * ========================================================================== */
-import React from "react"; // @ts-ignore
-
-import { useTypedDispatch, useTypedSelector } from "../hooks";
-import { setResponse } from "../Response/slice";
-import buildPostmanRequest from "./../buildPostmanRequest";
-import makeRequest from "./makeRequest";
-
-function validateRequest(params) {
-  for (let paramList of Object.values(params)) {
-    for (let param of paramList) {
-      if (param.required && !param.value) {
-        return false;
-      }
-    }
-  }
-
-  return true;
-}
-
-function Execute({ postman, proxy }) {
-  const pathParams = useTypedSelector((state) => state.params.path);
-  const queryParams = useTypedSelector((state) => state.params.query);
-  const cookieParams = useTypedSelector((state) => state.params.cookie);
-  const headerParams = useTypedSelector((state) => state.params.header);
-  const contentType = useTypedSelector((state) => state.contentType.value);
-  const body = useTypedSelector((state) => state.body);
-  const accept = useTypedSelector((state) => state.accept.value);
-  const server = useTypedSelector((state) => state.server.value);
-  const params = useTypedSelector((state) => state.params);
-  const auth = useTypedSelector((state) => state.auth);
-  const isValidRequest = validateRequest(params);
-  const dispatch = useTypedDispatch();
-  const postmanRequest = buildPostmanRequest(postman, {
-    queryParams,
-    pathParams,
-    cookieParams,
-    contentType,
-    accept,
-    headerParams,
-    body,
-    server,
-    auth,
-  });
-  return (
-    <button
-      className="button button--block button--primary"
-      style={{
-        height: "48px",
-        marginBottom: "var(--ifm-spacing-vertical)",
-      }}
-      disabled={!isValidRequest}
-      onClick={async () => {
-        dispatch(setResponse("loading..."));
-
-        try {
-          const res = await makeRequest(postmanRequest, proxy, body);
-          dispatch(setResponse(res));
-        } catch (e) {
-          dispatch(setResponse(e.message ?? "Error fetching."));
-        }
-      }}
-    >
-      Execute
-    </button>
-  );
-}
-
-export default Execute;

package/lib-next/theme/ApiDemoPanel/Execute/makeRequest.js

@@ -1,183 +0,0 @@
-/* ============================================================================
- * Copyright (c) Palo Alto Networks
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- * ========================================================================== */
-// @ts-ignore
-async function loadImage(content) {
-  return new Promise((accept, reject) => {
-    const reader = new FileReader();
-
-    reader.onabort = () => {
-      console.log("file reading was aborted");
-      reject();
-    };
-
-    reader.onerror = () => {
-      console.log("file reading has failed");
-      reject();
-    };
-
-    reader.onload = () => {
-      // Do whatever you want with the file contents
-      const binaryStr = reader.result;
-      accept(binaryStr);
-    };
-
-    reader.readAsArrayBuffer(content);
-  });
-}
-
-async function makeRequest(request, proxy, _body) {
-  const headers = request.toJSON().header;
-  let myHeaders = new Headers();
-
-  if (headers) {
-    // @ts-ignore
-    headers.forEach((header) => {
-      if (header.key && header.value) {
-        myHeaders.append(header.key, header.value);
-      }
-    });
-  } // The following code handles multiple files in the same formdata param.
-  // It removes the form data params where the src property is an array of filepath strings
-  // Splits that array into different form data params with src set as a single filepath string
-  // TODO:
-  // if (request.body && request.body.mode === 'formdata') {
-  //   let formdata = request.body.formdata,
-  //     formdataArray = [];
-  //   formdata.members.forEach((param) => {
-  //     let key = param.key,
-  //       type = param.type,
-  //       disabled = param.disabled,
-  //       contentType = param.contentType;
-  //     // check if type is file or text
-  //     if (type === 'file') {
-  //       // if src is not of type string we check for array(multiple files)
-  //       if (typeof param.src !== 'string') {
-  //         // if src is an array(not empty), iterate over it and add files as separate form fields
-  //         if (Array.isArray(param.src) && param.src.length) {
-  //           param.src.forEach((filePath) => {
-  //             addFormParam(
-  //               formdataArray,
-  //               key,
-  //               param.type,
-  //               filePath,
-  //               disabled,
-  //               contentType
-  //             );
-  //           });
-  //         }
-  //         // if src is not an array or string, or is an empty array, add a placeholder for file path(no files case)
-  //         else {
-  //           addFormParam(
-  //             formdataArray,
-  //             key,
-  //             param.type,
-  //             '/path/to/file',
-  //             disabled,
-  //             contentType
-  //           );
-  //         }
-  //       }
-  //       // if src is string, directly add the param with src as filepath
-  //       else {
-  //         addFormParam(
-  //           formdataArray,
-  //           key,
-  //           param.type,
-  //           param.src,
-  //           disabled,
-  //           contentType
-  //         );
-  //       }
-  //     }
-  //     // if type is text, directly add it to formdata array
-  //     else {
-  //       addFormParam(
-  //         formdataArray,
-  //         key,
-  //         param.type,
-  //         param.value,
-  //         disabled,
-  //         contentType
-  //       );
-  //     }
-  //   });
-  //   request.body.update({
-  //     mode: 'formdata',
-  //     formdata: formdataArray,
-  //   });
-  // }
-
-  const body = request.body?.toJSON();
-  let myBody = undefined;
-
-  if (body !== undefined && Object.keys(body).length > 0) {
-    switch (body.mode) {
-      case "urlencoded": {
-        myBody = new URLSearchParams();
-
-        if (Array.isArray(body.urlencoded)) {
-          for (const data of body.urlencoded) {
-            if (data.key && data.value) {
-              myBody.append(data.key, data.value);
-            }
-          }
-        }
-
-        break;
-      }
-
-      case "raw": {
-        myBody = (body.raw ?? "").toString();
-        break;
-      }
-
-      case "formdata": {
-        myBody = new FormData();
-
-        if (Array.isArray(body.formdata)) {
-          for (const data of body.formdata) {
-            if (data.key && data.value) {
-              myBody.append(data.key, data.value);
-            }
-          }
-        }
-
-        break;
-      }
-
-      case "file": {
-        if (_body.type === "raw" && _body.content?.type === "file") {
-          myBody = await loadImage(_body.content.value.content);
-        }
-
-        break;
-      }
-
-      default:
-        break;
-    }
-  }
-
-  const requestOptions = {
-    method: request.method,
-    headers: myHeaders,
-    body: myBody,
-  };
-  let finalUrl = request.url.toString();
-
-  if (proxy) {
-    // Ensure the proxy ends with a slash.
-    let normalizedProxy = proxy.replace(/\/$/, "") + "/";
-    finalUrl = normalizedProxy + request.url.toString();
-  }
-
-  return await fetch(finalUrl, requestOptions).then((response) => {
-    return response.text();
-  });
-}
-
-export default makeRequest;

package/src/theme/ApiDemoPanel/Authorization/index.tsx

@@ -1,211 +0,0 @@
-/* ============================================================================
- * Copyright (c) Palo Alto Networks
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- * ========================================================================== */
-
-import React, { useState } from "react";
-
-import clsx from "clsx";
-
-import FormItem from "../FormItem";
-import FormSelect from "../FormSelect";
-import FormTextInput from "../FormTextInput";
-import { useTypedDispatch, useTypedSelector } from "../hooks";
-import styles from "../styles.module.css";
-import { AuthState, Scheme, setAuthData, setSelectedAuth } from "./slice";
-
-type Props = {
-  mode: "locked" | "unlocked";
-} & JSX.IntrinsicElements["button"];
-
-function LockButton({ mode, children, style, ...rest }: Props) {
-  return (
-    <button
-      className={clsx("button", "button--primary", {
-        "button--outline": mode !== "locked",
-      })}
-      style={{
-        marginLeft: "auto",
-        display: "flex",
-        alignItems: "center",
-        marginBottom: "var(--ifm-spacing-vertical)",
-        ...style,
-      }}
-      {...rest}
-    >
-      <span>{children}</span>
-
-      <svg
-        style={{
-          marginLeft: "12px",
-          width: "18px",
-          height: "18px",
-          fill: "currentColor",
-        }}
-        viewBox="0 0 20 20"
-        id={mode}
-      >
-        {mode === "locked" ? (
-          <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"></path>
-        ) : (
-          <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>
-    </button>
-  );
-}
-
-function validateData(selectedAuth: Scheme[], data: AuthState["data"]) {
-  for (const scheme of selectedAuth) {
-    if (data[scheme.key] === undefined) {
-      return false;
-    }
-    const hasMissingKeys = Object.values(data[scheme.key]).includes(undefined);
-    if (hasMissingKeys) {
-      return false;
-    }
-  }
-  return true;
-}
-
-function Authorization() {
-  const [editing, setEditing] = useState(false);
-
-  const data = useTypedSelector((state) => state.auth.data);
-  const options = useTypedSelector((state) => state.auth.options);
-  const selected = useTypedSelector((state) => state.auth.selected);
-
-  const dispatch = useTypedDispatch();
-
-  if (selected === undefined) {
-    return null;
-  }
-
-  const selectedAuth = options[selected];
-
-  const authenticated = validateData(selectedAuth, data);
-
-  const optionKeys = Object.keys(options);
-
-  if (editing) {
-    return (
-      <div className={styles.optionsPanel}>
-        {optionKeys.length > 1 && (
-          <FormItem label="Security Scheme">
-            <FormSelect
-              options={optionKeys}
-              value={selected}
-              onChange={(e) => {
-                dispatch(setSelectedAuth(e.target.value));
-              }}
-            />
-          </FormItem>
-        )}
-        {selectedAuth.map((a) => {
-          if (a.type === "http" && a.scheme === "bearer") {
-            return (
-              <FormItem label="Bearer Token" key={selected + "-bearer"}>
-                <FormTextInput
-                  placeholder="Bearer Token"
-                  value={data[a.key].token ?? ""}
-                  onChange={(e) => {
-                    const value = e.target.value.trim();
-                    dispatch(
-                      setAuthData({
-                        scheme: a.key,
-                        key: "token",
-                        value: value ? value : undefined,
-                      })
-                    );
-                  }}
-                />
-              </FormItem>
-            );
-          }
-
-          if (a.type === "http" && a.scheme === "basic") {
-            return (
-              <React.Fragment key={selected + "-basic"}>
-                <FormItem label="Username">
-                  <FormTextInput
-                    placeholder="Username"
-                    value={data[a.key].username ?? ""}
-                    onChange={(e) => {
-                      const value = e.target.value.trim();
-                      dispatch(
-                        setAuthData({
-                          scheme: a.key,
-                          key: "username",
-                          value: value ? value : undefined,
-                        })
-                      );
-                    }}
-                  />
-                </FormItem>
-                <FormItem label="Password">
-                  <FormTextInput
-                    placeholder="Password"
-                    password
-                    value={data[a.key].password ?? ""}
-                    onChange={(e) => {
-                      const value = e.target.value.trim();
-                      dispatch(
-                        setAuthData({
-                          scheme: a.key,
-                          key: "password",
-                          value: value ? value : undefined,
-                        })
-                      );
-                    }}
-                  />
-                </FormItem>
-              </React.Fragment>
-            );
-          }
-
-          return null;
-        })}
-        <LockButton
-          mode="unlocked"
-          style={{
-            marginTop: "var(--ifm-spacing-vertical)",
-            marginBottom: 0,
-          }}
-          onClick={() => {
-            setEditing(false);
-          }}
-        >
-          Save
-        </LockButton>
-      </div>
-    );
-  }
-
-  if (authenticated) {
-    return (
-      <LockButton
-        mode="locked"
-        onClick={() => {
-          setEditing(true);
-        }}
-      >
-        Authorized
-      </LockButton>
-    );
-  }
-
-  return (
-    <LockButton
-      mode="unlocked"
-      onClick={() => {
-        setEditing(true);
-      }}
-    >
-      Authorize
-    </LockButton>
-  );
-}
-
-export default Authorization;