docusaurus-theme-openapi-docs 0.0.0-695 → 0.0.0-697

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

@@ -246,19 +246,14 @@ function CodeSnippets({ postman, codeSamples }) {
     return defaultLang[0] ?? mergedLangs[0];
   });
   const [codeText, setCodeText] = (0, react_1.useState)("");
-  const [codeSampleCodeText, setCodeSampleCodeText] = (0, react_1.useState)("");
+  const [codeSampleCodeText, setCodeSampleCodeText] = (0, react_1.useState)(
+    () => (0, languages_1.getCodeSampleSourceFromLanguage)(language)
+  );
   (0, react_1.useEffect)(() => {
-    // initial active language is custom code sample
-    if (
-      language &&
-      language.sample &&
-      language.samples &&
-      language.samplesSources
-    ) {
-      const sampleIndex = language.samples.findIndex(
-        (smp) => smp === language.sample
+    if (language && !!language.sample) {
+      setCodeSampleCodeText(
+        (0, languages_1.getCodeSampleSourceFromLanguage)(language)
       );
-      setCodeSampleCodeText(language.samplesSources[sampleIndex]);
     }
     if (language && !!language.options) {
       const postmanRequest = (0, buildPostmanRequest_1.default)(postman, {
@@ -388,7 +383,9 @@ function CodeSnippets({ postman, codeSamples }) {
         action: {
           setLanguage: setLanguage,
           setSelectedVariant: setSelectedVariant,
+          setSelectedSample: setSelectedSample,
         },
+        languageSet: mergedLangs,
         lazy: true,
       },
       mergedLangs.map((lang) => {
@@ -414,6 +411,7 @@ function CodeSnippets({ postman, codeSamples }) {
                 includeSample: true,
                 currentLanguage: lang.language,
                 defaultValue: selectedSample,
+                languageSet: mergedLangs,
                 lazy: true,
               },
               lang.samples.map((sample, index) => {
@@ -452,6 +450,7 @@ function CodeSnippets({ postman, codeSamples }) {
               includeVariant: true,
               currentLanguage: lang.language,
               defaultValue: selectedVariant,
+              languageSet: mergedLangs,
               lazy: true,
             },
             lang.variants.map((variant, index) => {

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

@@ -1,2 +1,3 @@
 import { CodeSample, Language } from "./code-snippets-types";
 export declare function mergeCodeSampleLanguage(languages: Language[], codeSamples: CodeSample[]): Language[];
+export declare function getCodeSampleSourceFromLanguage(language: Language): string;

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

@@ -6,7 +6,8 @@
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.mergeCodeSampleLanguage = void 0;
+exports.getCodeSampleSourceFromLanguage = exports.mergeCodeSampleLanguage =
+  void 0;
 function mergeCodeSampleLanguage(languages, codeSamples) {
   return languages.map((language) => {
     const languageCodeSamples = codeSamples.filter(
@@ -30,3 +31,18 @@ function mergeCodeSampleLanguage(languages, codeSamples) {
   });
 }
 exports.mergeCodeSampleLanguage = mergeCodeSampleLanguage;
+function getCodeSampleSourceFromLanguage(language) {
+  if (
+    language &&
+    language.sample &&
+    language.samples &&
+    language.samplesSources
+  ) {
+    const sampleIndex = language.samples.findIndex(
+      (smp) => smp === language.sample
+    );
+    return language.samplesSources[sampleIndex];
+  }
+  return "";
+}
+exports.getCodeSampleSourceFromLanguage = getCodeSampleSourceFromLanguage;

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

@@ -12,12 +12,12 @@ import {
   useTabs,
 } from "@docusaurus/theme-common/internal";
 import useIsBrowser from "@docusaurus/useIsBrowser";
-import { languageSet } from "@theme/ApiExplorer/CodeSnippets";
 import clsx from "clsx";
 
 function TabList({
   action,
   currentLanguage,
+  languageSet,
   includeVariant,
   includeSample,
   className,
@@ -48,16 +48,18 @@ function TabList({
         )[0];
         newLanguage.variant = newTabValue;
         action.setSelectedVariant(newTabValue.toLowerCase());
+      } else if (currentLanguage && includeSample) {
+        newLanguage = languageSet.filter(
+          (lang) => lang.language === currentLanguage
+        )[0];
+        newLanguage.sample = newTabValue;
+        action.setSelectedSample(newTabValue);
       } else {
         newLanguage = languageSet.filter(
           (lang) => lang.language === newTabValue
         )[0];
         action.setSelectedVariant(newLanguage.variant.toLowerCase());
-      }
-
-      if (currentLanguage && includeSample) {
-        newLanguage.sample = newTabValue;
-        action.setSelectedSample(newTabValue.toLowerCase());
+        action.setSelectedSample(newLanguage.sample);
       }
 
       action.setLanguage(newLanguage);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "docusaurus-theme-openapi-docs",
   "description": "OpenAPI theme for Docusaurus.",
-  "version": "0.0.0-695",
+  "version": "0.0.0-697",
   "license": "MIT",
   "keywords": [
     "openapi",
@@ -43,7 +43,7 @@
     "clsx": "^1.1.1",
     "copy-text-to-clipboard": "^3.1.0",
     "crypto-js": "^4.1.1",
-    "docusaurus-plugin-openapi-docs": "0.0.0-695",
+    "docusaurus-plugin-openapi-docs": "0.0.0-697",
     "docusaurus-plugin-sass": "^0.2.3",
     "file-saver": "^2.0.5",
     "lodash": "^4.17.20",
@@ -68,5 +68,5 @@
   "engines": {
     "node": ">=14"
   },
-  "gitHead": "c111297c25d9cde0cede97f07d32d368f68679b1"
+  "gitHead": "a6bbe786231f3938c6333379a036c614afb27029"
 }

package/src/theme/ApiExplorer/CodeSnippets/index.tsx

@@ -17,7 +17,10 @@ import { useTypedSelector } from "@theme/ApiItem/hooks";
 import merge from "lodash/merge";
 
 import { CodeSample, Language } from "./code-snippets-types";
-import { mergeCodeSampleLanguage } from "./languages";
+import {
+  getCodeSampleSourceFromLanguage,
+  mergeCodeSampleLanguage,
+} from "./languages";
 
 export const languageSet: Language[] = [
   {
@@ -198,20 +201,13 @@ function CodeSnippets({ postman, codeSamples }: Props) {
     return defaultLang[0] ?? mergedLangs[0];
   });
   const [codeText, setCodeText] = useState<string>("");
-  const [codeSampleCodeText, setCodeSampleCodeText] = useState<string>("");
+  const [codeSampleCodeText, setCodeSampleCodeText] = useState<
+    string | (() => string)
+  >(() => getCodeSampleSourceFromLanguage(language));
 
   useEffect(() => {
-    // initial active language is custom code sample
-    if (
-      language &&
-      language.sample &&
-      language.samples &&
-      language.samplesSources
-    ) {
-      const sampleIndex = language.samples.findIndex(
-        (smp) => smp === language.sample
-      );
-      setCodeSampleCodeText(language.samplesSources[sampleIndex]);
+    if (language && !!language.sample) {
+      setCodeSampleCodeText(getCodeSampleSourceFromLanguage(language));
     }
 
     if (language && !!language.options) {
@@ -344,7 +340,9 @@ function CodeSnippets({ postman, codeSamples }: Props) {
         action={{
           setLanguage: setLanguage,
           setSelectedVariant: setSelectedVariant,
+          setSelectedSample: setSelectedSample,
         }}
+        languageSet={mergedLangs}
         lazy
       >
         {mergedLangs.map((lang) => {
@@ -367,6 +365,7 @@ function CodeSnippets({ postman, codeSamples }: Props) {
                   includeSample={true}
                   currentLanguage={lang.language}
                   defaultValue={selectedSample}
+                  languageSet={mergedLangs}
                   lazy
                 >
                   {lang.samples.map((sample, index) => {
@@ -406,6 +405,7 @@ function CodeSnippets({ postman, codeSamples }: Props) {
                 includeVariant={true}
                 currentLanguage={lang.language}
                 defaultValue={selectedVariant}
+                languageSet={mergedLangs}
                 lazy
               >
                 {lang.variants.map((variant, index) => {

package/src/theme/ApiExplorer/CodeSnippets/languages.ts

@@ -35,3 +35,19 @@ export function mergeCodeSampleLanguage(
     return language;
   });
 }
+
+export function getCodeSampleSourceFromLanguage(language: Language) {
+  if (
+    language &&
+    language.sample &&
+    language.samples &&
+    language.samplesSources
+  ) {
+    const sampleIndex = language.samples.findIndex(
+      (smp) => smp === language.sample
+    );
+    return language.samplesSources[sampleIndex];
+  }
+
+  return "";
+}

package/src/theme/ApiExplorer/CodeTabs/index.js

@@ -12,12 +12,12 @@ import {
   useTabs,
 } from "@docusaurus/theme-common/internal";
 import useIsBrowser from "@docusaurus/useIsBrowser";
-import { languageSet } from "@theme/ApiExplorer/CodeSnippets";
 import clsx from "clsx";
 
 function TabList({
   action,
   currentLanguage,
+  languageSet,
   includeVariant,
   includeSample,
   className,
@@ -48,16 +48,18 @@ function TabList({
         )[0];
         newLanguage.variant = newTabValue;
         action.setSelectedVariant(newTabValue.toLowerCase());
+      } else if (currentLanguage && includeSample) {
+        newLanguage = languageSet.filter(
+          (lang) => lang.language === currentLanguage
+        )[0];
+        newLanguage.sample = newTabValue;
+        action.setSelectedSample(newTabValue);
       } else {
         newLanguage = languageSet.filter(
           (lang) => lang.language === newTabValue
         )[0];
         action.setSelectedVariant(newLanguage.variant.toLowerCase());
-      }
-
-      if (currentLanguage && includeSample) {
-        newLanguage.sample = newTabValue;
-        action.setSelectedSample(newTabValue.toLowerCase());
+        action.setSelectedSample(newLanguage.sample);
       }
 
       action.setLanguage(newLanguage);