docusaurus-theme-openapi-docs 0.0.0-1050 → 0.0.0-1055

package/lib/theme/ApiExplorer/Authorization/index.js

@@ -12,12 +12,14 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
 const FormItem_1 = __importDefault(require("@theme/ApiExplorer/FormItem"));
 const FormSelect_1 = __importDefault(require("@theme/ApiExplorer/FormSelect"));
 const FormTextInput_1 = __importDefault(
   require("@theme/ApiExplorer/FormTextInput")
 );
 const hooks_1 = require("@theme/ApiItem/hooks");
+const translationIds_1 = require("@theme/translationIds");
 const slice_1 = require("./slice");
 function Authorization() {
   const data = (0, hooks_1.useTypedSelector)((state) => state.auth.data);
@@ -50,9 +52,18 @@ function Authorization() {
       if (a.type === "http" && a.scheme === "bearer") {
         return react_1.default.createElement(
           FormItem_1.default,
-          { label: "Bearer Token", key: a.key + "-bearer" },
+          {
+            label: (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_AUTH.BEARER_TOKEN,
+              message: "Bearer Token",
+            }),
+            key: a.key + "-bearer",
+          },
           react_1.default.createElement(FormTextInput_1.default, {
-            placeholder: "Bearer Token",
+            placeholder: (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_AUTH.BEARER_TOKEN,
+              message: "Bearer Token",
+            }),
             password: true,
             value: data[a.key].token ?? "",
             onChange: (e) => {
@@ -71,9 +82,18 @@ function Authorization() {
       if (a.type === "oauth2") {
         return react_1.default.createElement(
           FormItem_1.default,
-          { label: "Bearer Token", key: a.key + "-oauth2" },
+          {
+            label: (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_AUTH.BEARER_TOKEN,
+              message: "Bearer Token",
+            }),
+            key: a.key + "-oauth2",
+          },
           react_1.default.createElement(FormTextInput_1.default, {
-            placeholder: "Bearer Token",
+            placeholder: (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_AUTH.BEARER_TOKEN,
+              message: "Bearer Token",
+            }),
             password: true,
             value: data[a.key].token ?? "",
             onChange: (e) => {
@@ -95,9 +115,17 @@ function Authorization() {
           { key: a.key + "-basic" },
           react_1.default.createElement(
             FormItem_1.default,
-            { label: "Username" },
+            {
+              label: (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_AUTH.USERNAME,
+                message: "Username",
+              }),
+            },
             react_1.default.createElement(FormTextInput_1.default, {
-              placeholder: "Username",
+              placeholder: (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_AUTH.USERNAME,
+                message: "Username",
+              }),
               value: data[a.key].username ?? "",
               onChange: (e) => {
                 const value = e.target.value;
@@ -113,9 +141,17 @@ function Authorization() {
           ),
           react_1.default.createElement(
             FormItem_1.default,
-            { label: "Password" },
+            {
+              label: (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_AUTH.PASSWORD,
+                message: "Password",
+              }),
+            },
             react_1.default.createElement(FormTextInput_1.default, {
-              placeholder: "Password",
+              placeholder: (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_AUTH.PASSWORD,
+                message: "Password",
+              }),
               password: true,
               value: data[a.key].password ?? "",
               onChange: (e) => {

package/lib/theme/ApiExplorer/Body/index.js

@@ -12,6 +12,7 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
 const json2xml_1 = __importDefault(require("@theme/ApiExplorer/Body/json2xml"));
 const FormFileUpload_1 = __importDefault(
   require("@theme/ApiExplorer/FormFileUpload")
@@ -26,6 +27,7 @@ const hooks_1 = require("@theme/ApiItem/hooks");
 const Markdown_1 = __importDefault(require("@theme/Markdown"));
 const SchemaTabs_1 = __importDefault(require("@theme/SchemaTabs"));
 const TabItem_1 = __importDefault(require("@theme/TabItem"));
+const translationIds_1 = require("@theme/translationIds");
 const xml_formatter_1 = __importDefault(require("xml-formatter"));
 const slice_1 = require("./slice");
 function BodyWrap({
@@ -85,7 +87,12 @@ function Body({
       FormItem_1.default,
       null,
       react_1.default.createElement(FormFileUpload_1.default, {
-        placeholder: schema.description || "Body",
+        placeholder:
+          schema.description ||
+          (0, Translate_1.translate)({
+            id: translationIds_1.OPENAPI_REQUEST.BODY_TITLE,
+            message: "Body",
+          }),
         onChange: (file) => {
           if (file === undefined) {
             dispatch((0, slice_1.clearRawBody)());
@@ -291,7 +298,10 @@ function Body({
         react_1.default.createElement(
           TabItem_1.default,
           {
-            label: "Example (from schema)",
+            label: (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_BODY.EXAMPLE_FROM_SCHEMA,
+              message: "Example (from schema)",
+            }),
             value: "Example (from schema)",
             default: true,
           },
@@ -330,7 +340,10 @@ function Body({
         react_1.default.createElement(
           TabItem_1.default,
           {
-            label: "Example (from schema)",
+            label: (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_BODY.EXAMPLE_FROM_SCHEMA,
+              message: "Example (from schema)",
+            }),
             value: "Example (from schema)",
             default: true,
           },

package/lib/theme/ApiExplorer/CodeSnippets/index.d.ts

@@ -5,6 +5,7 @@ export declare const languageSet: Language[];
 export interface Props {
     postman: sdk.Request;
     codeSamples: CodeSample[];
+    maskCredentials?: boolean;
 }
-declare function CodeSnippets({ postman, codeSamples }: Props): React.JSX.Element | null;
+declare function CodeSnippets({ postman, codeSamples, maskCredentials: propMaskCredentials, }: Props): React.JSX.Element | null;
 export default CodeSnippets;

package/lib/theme/ApiExplorer/CodeSnippets/index.js

@@ -93,7 +93,11 @@ function CodeTab({ children, hidden, className }) {
     children
   );
 }
-function CodeSnippets({ postman, codeSamples }) {
+function CodeSnippets({
+  postman,
+  codeSamples,
+  maskCredentials: propMaskCredentials,
+}) {
   const { siteConfig } = (0, useDocusaurusContext_1.default)();
   const contentType = (0, hooks_1.useTypedSelector)(
     (state) => state.contentType.value
@@ -114,29 +118,36 @@ function CodeSnippets({ postman, codeSamples }) {
     (state) => state.params.header
   );
   const auth = (0, hooks_1.useTypedSelector)((state) => state.auth);
-  const clonedAuth = (0, cloneDeep_1.default)(auth);
-  let placeholder;
-  function cleanCredentials(obj) {
-    for (const key in obj) {
-      if (typeof obj[key] === "object" && obj[key] !== null) {
-        // use name as placeholder if exists
-        const comboAuthId = Object.keys(obj).join(" and ");
-        const authOptions =
-          clonedAuth?.options?.[key] ?? clonedAuth?.options?.[comboAuthId];
-        placeholder = authOptions?.[0]?.name;
-        obj[key] = cleanCredentials(obj[key]);
-      } else {
-        obj[key] = `<${placeholder ?? key}>`;
-      }
-    }
-    return obj;
-  }
-  // scrub credentials from code snippets
-  const cleanedAuth = {
-    ...clonedAuth,
-    data: cleanCredentials(clonedAuth.data),
-  };
-  // Create a Postman request object using cleanedAuth
+  // Check if credential masking is enabled (default: true)
+  const maskCredentials = propMaskCredentials ?? true;
+  // Clone Auth if maskCredentials is not false
+  const cleanedAuth = maskCredentials
+    ? (() => {
+        const clonedAuth = (0, cloneDeep_1.default)(auth);
+        let placeholder;
+        function cleanCredentials(obj) {
+          for (const key in obj) {
+            if (typeof obj[key] === "object" && obj[key] !== null) {
+              // use name as placeholder if exists
+              const comboAuthId = Object.keys(obj).join(" and ");
+              const authOptions =
+                clonedAuth?.options?.[key] ??
+                clonedAuth?.options?.[comboAuthId];
+              placeholder = authOptions?.[0]?.name;
+              obj[key] = cleanCredentials(obj[key]);
+            } else {
+              obj[key] = `<${placeholder ?? key}>`;
+            }
+          }
+          return obj;
+        }
+        return {
+          ...clonedAuth,
+          data: cleanCredentials(clonedAuth.data),
+        };
+      })()
+    : auth;
+  // Create a Postman request object using cleanedAuth or original auth
   const cleanedPostmanRequest = (0, buildPostmanRequest_1.default)(postman, {
     queryParams,
     pathParams,

package/lib/theme/ApiExplorer/FormFileUpload/index.js

@@ -68,9 +68,11 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
 const FloatingButton_1 = __importDefault(
   require("@theme/ApiExplorer/FloatingButton")
 );
+const translationIds_1 = require("@theme/translationIds");
 const react_magic_dropzone_1 = __importDefault(require("react-magic-dropzone"));
 function RenderPreview({ file }) {
   switch (file.type) {
@@ -158,7 +160,10 @@ function FormFileUpload({ placeholder, onChange }) {
                   setAndNotifyFile(undefined);
                 },
               },
-              "Clear"
+              (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_FORM_FILE_UPLOAD.CLEAR_BUTTON,
+                message: "Clear",
+              })
             ),
             react_1.default.createElement(RenderPreview, { file: file })
           )

package/lib/theme/ApiExplorer/FormItem/index.js

@@ -12,6 +12,8 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
+const translationIds_1 = require("@theme/translationIds");
 const clsx_1 = __importDefault(require("clsx"));
 function FormItem({ label, type, required, children, className }) {
   return react_1.default.createElement(
@@ -36,7 +38,10 @@ function FormItem({ label, type, required, children, className }) {
       react_1.default.createElement(
         "span",
         { className: "openapi-schema__required" },
-        "required"
+        (0, Translate_1.translate)({
+          id: translationIds_1.OPENAPI_SCHEMA_ITEM.REQUIRED,
+          message: "required",
+        })
       ),
     react_1.default.createElement("div", null, children)
   );

package/lib/theme/ApiExplorer/FormTextInput/index.js

@@ -13,7 +13,9 @@ var __importDefault =
 Object.defineProperty(exports, "__esModule", { value: true });
 // @ts-nocheck
 const react_1 = __importDefault(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
 const error_message_1 = require("@hookform/error-message");
+const translationIds_1 = require("@theme/translationIds");
 const clsx_1 = __importDefault(require("clsx"));
 const react_hook_form_1 = require("react-hook-form");
 function FormTextInput({
@@ -36,7 +38,12 @@ function FormTextInput({
     paramName
       ? react_1.default.createElement("input", {
           ...register(paramName, {
-            required: isRequired ? "This field is required" : false,
+            required: isRequired
+              ? (0, Translate_1.translate)({
+                  id: translationIds_1.OPENAPI_FORM.FIELD_REQUIRED,
+                  message: "This field is required",
+                })
+              : false,
           }),
           className: (0, clsx_1.default)("openapi-explorer__form-item-input", {
             error: showErrorMessage,

package/lib/theme/ApiExplorer/LiveEditor/index.js

@@ -69,9 +69,11 @@ var __importDefault =
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
 const theme_common_1 = require("@docusaurus/theme-common");
+const Translate_1 = require("@docusaurus/Translate");
 const useIsBrowser_1 = __importDefault(require("@docusaurus/useIsBrowser"));
 const error_message_1 = require("@hookform/error-message");
 const slice_1 = require("@theme/ApiExplorer/Body/slice");
+const translationIds_1 = require("@theme/translationIds");
 const clsx_1 = __importDefault(require("clsx"));
 const react_hook_form_1 = require("react-hook-form");
 const react_live_1 = require("react-live");
@@ -140,7 +142,13 @@ function App({
       react_1.default.createElement(react_hook_form_1.Controller, {
         control: control,
         rules: {
-          required: isRequired && !code ? "This field is required" : false,
+          required:
+            isRequired && !code
+              ? (0, Translate_1.translate)({
+                  id: translationIds_1.OPENAPI_FORM.FIELD_REQUIRED,
+                  message: "This field is required",
+                })
+              : false,
         },
         name: "requestBody",
         render: ({ field: { onChange, name } }) =>

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamArrayFormItem.js

@@ -69,6 +69,7 @@ var __importDefault =
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = ParamArrayFormItem;
 const react_1 = __importStar(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
 const error_message_1 = require("@hookform/error-message");
 const toolkit_1 = require("@reduxjs/toolkit");
 const FormSelect_1 = __importDefault(require("@theme/ApiExplorer/FormSelect"));
@@ -77,6 +78,7 @@ const FormTextInput_1 = __importDefault(
 );
 const slice_1 = require("@theme/ApiExplorer/ParamOptions/slice");
 const hooks_1 = require("@theme/ApiItem/hooks");
+const translationIds_1 = require("@theme/translationIds");
 const react_hook_form_1 = require("react-hook-form");
 function ArrayItem({ param, onChange, initialValue }) {
   const [value, setValue] = (0, react_1.useState)(initialValue || "");
@@ -157,7 +159,14 @@ function ParamArrayFormItem({ param }) {
     null,
     react_1.default.createElement(react_hook_form_1.Controller, {
       control: control,
-      rules: { required: param.required ? "This field is required" : false },
+      rules: {
+        required: param.required
+          ? (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_FORM.FIELD_REQUIRED,
+              message: "This field is required",
+            })
+          : false,
+      },
       name: "paramArray",
       render: ({ field: { onChange, name } }) =>
         react_1.default.createElement(

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamBooleanFormItem.js

@@ -13,10 +13,12 @@ var __importDefault =
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = ParamBooleanFormItem;
 const react_1 = __importDefault(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
 const error_message_1 = require("@hookform/error-message");
 const FormSelect_1 = __importDefault(require("@theme/ApiExplorer/FormSelect"));
 const slice_1 = require("@theme/ApiExplorer/ParamOptions/slice");
 const hooks_1 = require("@theme/ApiItem/hooks");
+const translationIds_1 = require("@theme/translationIds");
 const react_hook_form_1 = require("react-hook-form");
 function ParamBooleanFormItem({ param }) {
   const dispatch = (0, hooks_1.useTypedDispatch)();
@@ -30,7 +32,14 @@ function ParamBooleanFormItem({ param }) {
     null,
     react_1.default.createElement(react_hook_form_1.Controller, {
       control: control,
-      rules: { required: param.required ? "This field is required" : false },
+      rules: {
+        required: param.required
+          ? (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_FORM.FIELD_REQUIRED,
+              message: "This field is required",
+            })
+          : false,
+      },
       name: "paramBoolean",
       render: ({ field: { onChange, name } }) =>
         react_1.default.createElement(FormSelect_1.default, {

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamMultiSelectFormItem.js

@@ -13,12 +13,14 @@ var __importDefault =
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = ParamMultiSelectFormItem;
 const react_1 = __importDefault(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
 const error_message_1 = require("@hookform/error-message");
 const FormMultiSelect_1 = __importDefault(
   require("@theme/ApiExplorer/FormMultiSelect")
 );
 const slice_1 = require("@theme/ApiExplorer/ParamOptions/slice");
 const hooks_1 = require("@theme/ApiItem/hooks");
+const translationIds_1 = require("@theme/translationIds");
 const react_hook_form_1 = require("react-hook-form");
 function ParamMultiSelectFormItem({ param }) {
   const {
@@ -64,7 +66,14 @@ function ParamMultiSelectFormItem({ param }) {
     null,
     react_1.default.createElement(react_hook_form_1.Controller, {
       control: control,
-      rules: { required: param.required ? "This field is required" : false },
+      rules: {
+        required: param.required
+          ? (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_FORM.FIELD_REQUIRED,
+              message: "This field is required",
+            })
+          : false,
+      },
       name: "paramMultiSelect",
       render: ({ field: { onChange, name } }) =>
         react_1.default.createElement(FormMultiSelect_1.default, {

package/lib/theme/ApiExplorer/ParamOptions/ParamFormItems/ParamSelectFormItem.js

@@ -13,10 +13,12 @@ var __importDefault =
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = ParamSelectFormItem;
 const react_1 = __importDefault(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
 const error_message_1 = require("@hookform/error-message");
 const FormSelect_1 = __importDefault(require("@theme/ApiExplorer/FormSelect"));
 const slice_1 = require("@theme/ApiExplorer/ParamOptions/slice");
 const hooks_1 = require("@theme/ApiItem/hooks");
+const translationIds_1 = require("@theme/translationIds");
 const react_hook_form_1 = require("react-hook-form");
 function ParamSelectFormItem({ param }) {
   const {
@@ -31,7 +33,14 @@ function ParamSelectFormItem({ param }) {
     null,
     react_1.default.createElement(react_hook_form_1.Controller, {
       control: control,
-      rules: { required: param.required ? "This field is required" : false },
+      rules: {
+        required: param.required
+          ? (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_FORM.FIELD_REQUIRED,
+              message: "This field is required",
+            })
+          : false,
+      },
       name: "paramSelect",
       render: ({ field: { onChange, name } }) =>
         react_1.default.createElement(FormSelect_1.default, {

package/lib/theme/ApiExplorer/ParamOptions/index.js

@@ -68,6 +68,7 @@ var __importDefault =
   };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
+const Translate_1 = require("@docusaurus/Translate");
 const FormItem_1 = __importDefault(require("@theme/ApiExplorer/FormItem"));
 const ParamArrayFormItem_1 = __importDefault(
   require("@theme/ApiExplorer/ParamOptions/ParamFormItems/ParamArrayFormItem")
@@ -85,6 +86,7 @@ const ParamTextFormItem_1 = __importDefault(
   require("@theme/ApiExplorer/ParamOptions/ParamFormItems/ParamTextFormItem")
 );
 const hooks_1 = require("@theme/ApiItem/hooks");
+const translationIds_1 = require("@theme/translationIds");
 function ParamOption({ param }) {
   if (param.schema?.type === "array" && param.schema.items?.enum) {
     return react_1.default.createElement(ParamMultiSelectFormItem_1.default, {
@@ -201,7 +203,15 @@ function ParamOptions() {
               )
             )
           ),
-          showOptional ? "Hide optional parameters" : "Show optional parameters"
+          showOptional
+            ? (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_PARAM_OPTIONS.HIDE_OPTIONAL,
+                message: "Hide optional parameters",
+              })
+            : (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_PARAM_OPTIONS.SHOW_OPTIONAL,
+                message: "Show optional parameters",
+              })
         ),
         react_1.default.createElement(
           "div",

package/lib/theme/ApiExplorer/Request/index.js

@@ -70,6 +70,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // @ts-nocheck
 const react_1 = __importStar(require("react"));
 const client_1 = require("@docusaurus/plugin-content-docs/client");
+const Translate_1 = require("@docusaurus/Translate");
 const Accept_1 = __importDefault(require("@theme/ApiExplorer/Accept"));
 const Authorization_1 = __importDefault(
   require("@theme/ApiExplorer/Authorization")
@@ -87,6 +88,7 @@ const ParamOptions_1 = __importDefault(
 const slice_1 = require("@theme/ApiExplorer/Response/slice");
 const Server_1 = __importDefault(require("@theme/ApiExplorer/Server"));
 const hooks_1 = require("@theme/ApiItem/hooks");
+const translationIds_1 = require("@theme/translationIds");
 const sdk = __importStar(require("postman-collection"));
 const react_hook_form_1 = require("react-hook-form");
 const makeRequest_1 = __importDefault(require("./makeRequest"));
@@ -179,7 +181,14 @@ function Request({ item }) {
       dispatch((0, slice_1.setHeaders)(Object.fromEntries(res.headers)));
   };
   const onSubmit = async (data) => {
-    dispatch((0, slice_1.setResponse)("Fetching..."));
+    dispatch(
+      (0, slice_1.setResponse)(
+        (0, Translate_1.translate)({
+          id: translationIds_1.OPENAPI_REQUEST.FETCHING_MESSAGE,
+          message: "Fetching...",
+        })
+      )
+    );
     try {
       await delay(1200);
       const res = await (0, makeRequest_1.default)(postmanRequest, proxy, body);
@@ -190,7 +199,14 @@ function Request({ item }) {
       }
     } catch (e) {
       console.log(e);
-      dispatch((0, slice_1.setResponse)("Connection failed"));
+      dispatch(
+        (0, slice_1.setResponse)(
+          (0, Translate_1.translate)({
+            id: translationIds_1.OPENAPI_REQUEST.CONNECTION_FAILED,
+            message: "Connection failed",
+          })
+        )
+      );
       dispatch((0, slice_1.clearCode)());
       dispatch((0, slice_1.clearHeaders)());
     }
@@ -242,7 +258,10 @@ function Request({ item }) {
         react_1.default.createElement(
           "span",
           { className: "openapi-explorer__request-title" },
-          "Request "
+          (0, Translate_1.translate)({
+            id: translationIds_1.OPENAPI_REQUEST.REQUEST_TITLE,
+            message: "Request",
+          })
         ),
         allDetailsExpanded
           ? react_1.default.createElement(
@@ -251,7 +270,10 @@ function Request({ item }) {
                 className: "openapi-explorer__expand-details-btn",
                 onClick: collapseAllDetails,
               },
-              "Collapse all"
+              (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_REQUEST.COLLAPSE_ALL,
+                message: "Collapse all",
+              })
             )
           : react_1.default.createElement(
               "span",
@@ -259,7 +281,10 @@ function Request({ item }) {
                 className: "openapi-explorer__expand-details-btn",
                 onClick: expandAllDetails,
               },
-              "Expand all"
+              (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_REQUEST.EXPAND_ALL,
+                message: "Expand all",
+              })
             )
       ),
       react_1.default.createElement(
@@ -282,7 +307,10 @@ function Request({ item }) {
                   setExpandServer(!expandServer);
                 },
               },
-              "Base URL"
+              (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_REQUEST.BASE_URL_TITLE,
+                message: "Base URL",
+              })
             ),
             react_1.default.createElement(Server_1.default, null)
           ),
@@ -302,7 +330,10 @@ function Request({ item }) {
                   setExpandAuth(!expandAuth);
                 },
               },
-              "Auth"
+              (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_REQUEST.AUTH_TITLE,
+                message: "Auth",
+              })
             ),
             react_1.default.createElement(Authorization_1.default, null)
           ),
@@ -323,7 +354,10 @@ function Request({ item }) {
                   setExpandParams(!expandParams);
                 },
               },
-              "Parameters"
+              (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_REQUEST.PARAMETERS_TITLE,
+                message: "Parameters",
+              })
             ),
             react_1.default.createElement(ParamOptions_1.default, null)
           ),
@@ -343,12 +377,19 @@ function Request({ item }) {
                   setExpandBody(!expandBody);
                 },
               },
-              "Body",
+              (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_REQUEST.BODY_TITLE,
+                message: "Body",
+              }),
               requestBodyRequired &&
                 react_1.default.createElement(
                   "span",
                   { className: "openapi-schema__required" },
-                  "\u00A0required"
+                  "\u00A0",
+                  (0, Translate_1.translate)({
+                    id: translationIds_1.OPENAPI_REQUEST.REQUIRED_LABEL,
+                    message: "required",
+                  })
                 )
             ),
             react_1.default.createElement(
@@ -378,7 +419,10 @@ function Request({ item }) {
                   setExpandAccept(!expandAccept);
                 },
               },
-              "Accept"
+              (0, Translate_1.translate)({
+                id: translationIds_1.OPENAPI_REQUEST.ACCEPT_TITLE,
+                message: "Accept",
+              })
             ),
             react_1.default.createElement(Accept_1.default, null)
           ),
@@ -387,7 +431,10 @@ function Request({ item }) {
           react_1.default.createElement(
             "button",
             { className: "openapi-explorer__request-btn", type: "submit" },
-            "Send API Request"
+            (0, Translate_1.translate)({
+              id: translationIds_1.OPENAPI_REQUEST.SEND_BUTTON,
+              message: "Send API Request",
+            })
           )
       )
     )