fix: added custom api step

Author: PavelKorobchuk

auth4genai/snippets/get-started/langchain-next-js/async-auth.mdx

@@ -1,7 +1,7 @@
 import { Prerequisites } from "/snippets/get-started/prerequisites/async-auth.jsx";
 import { AccountAndAppSteps } from "/snippets/get-started/prerequisites/account-app-steps.jsx";
 
-<Prerequisites />
+<Prerequisites createAuth0ApiStep={{}} />
 
 ### Prepare Next.js app
 

auth4genai/snippets/get-started/langchain-next-js/auth-for-rag.mdx

@@ -1,7 +1,7 @@
 import { Prerequisites } from "/snippets/get-started/prerequisites/auth-for-rag.jsx";
 import { AccountAndAppSteps } from "/snippets/get-started/prerequisites/account-app-steps.jsx";
 
-<Prerequisites />
+<Prerequisites createAuth0ApiStep={{}} />
 
 ### Prepare Next.js app
 

auth4genai/snippets/get-started/langchain-next-js/call-others-api.mdx

@@ -1,7 +1,7 @@
 import { Prerequisites } from "/snippets/get-started/prerequisites/call-others-api.jsx";
 import { AccountAndAppSteps } from "/snippets/get-started/prerequisites/account-app-steps.jsx";
 
-<Prerequisites />
+<Prerequisites createAuth0ApiStep={{}} createResourceServerClientStep={{}} />
 
 <Tabs>
   <Tab

auth4genai/snippets/get-started/langchain-next-js/call-your-api.mdx

@@ -1,7 +1,7 @@
 import { Prerequisites } from "/snippets/get-started/prerequisites/call-your-api.jsx";
 import { AccountAndAppSteps } from "/snippets/get-started/prerequisites/account-app-steps.jsx";
 
-<Prerequisites />
+<Prerequisites createAuth0ApiStep={{}} />
 
 ### Prepare Next.js app
 

auth4genai/snippets/get-started/prerequisites/async-auth.jsx

@@ -3,9 +3,38 @@ import { AccountAndAppSteps } from "/snippets/get-started/prerequisites/account-
 export const Prerequisites = ({
   callbackUrl = "http://localhost:3000/auth/callback",
   logoutUrl = "http://localhost:3000",
+  createAuth0ApiStep = undefined,
 }) => {
   const steps = AccountAndAppSteps({ callbackUrl, logoutUrl });
 
+  if (createAuth0ApiStep) {
+    steps.push(
+      <Step key="auth0-api" title="Create an Auth0 API">
+        <ul>
+          <li>
+            In your Auth0 Dashboard, go to{" "}
+            <strong>Applications &gt; APIs</strong>.
+          </li>
+          <li>Create a new API with an identifier (audience).</li>
+          <li>
+            Once API is created, go to the APIs{" "}
+            <strong>Settings &gt; Access Settings</strong> and enable{" "}
+            <strong>Allow Offline Access</strong>.
+          </li>
+          <li>Note down the API identifier for your environment variables.</li>
+        </ul>
+        To learn more about Auth0 APIs, read{" "}
+        <a
+          href="https://auth0.com/docs/get-started/auth0-overview/set-up-apis"
+          target="_blank"
+        >
+          APIs
+        </a>
+        .
+      </Step>
+    );
+  }
+
   steps.push(
     <Step title="Enable CIBA Grant">
       Enable the CIBA Grant for your Auth0 Application. Go to{" "}

auth4genai/snippets/get-started/prerequisites/auth-for-rag.jsx

@@ -4,13 +4,42 @@ export const Prerequisites = ({
   callbackUrl = "http://localhost:3000/auth/callback",
   logoutUrl = "http://localhost:3000",
   appCreation = true,
+  createAuth0ApiStep = undefined,
 }) => {
   const steps = [];
 
   if (appCreation) {
     steps.push(...AccountAndAppSteps({ callbackUrl, logoutUrl, appCreation }));
   }
 
+  if (createAuth0ApiStep) {
+    steps.push(
+      <Step key="auth0-api" title="Create an Auth0 API">
+        <ul>
+          <li>
+            In your Auth0 Dashboard, go to{" "}
+            <strong>Applications &gt; APIs</strong>.
+          </li>
+          <li>Create a new API with an identifier (audience).</li>
+          <li>
+            Once API is created, go to the APIs{" "}
+            <strong>Settings &gt; Access Settings</strong> and enable{" "}
+            <strong>Allow Offline Access</strong>.
+          </li>
+          <li>Note down the API identifier for your environment variables.</li>
+        </ul>
+        To learn more about Auth0 APIs, read{" "}
+        <a
+          href="https://auth0.com/docs/get-started/auth0-overview/set-up-apis"
+          target="_blank"
+        >
+          APIs
+        </a>
+        .
+      </Step>
+    );
+  }
+
   steps.push(
     <Step title="Create an Auth0 FGA account">
       You need an{" "}

auth4genai/snippets/get-started/prerequisites/call-your-api.jsx

@@ -3,9 +3,38 @@ import { AccountAndAppSteps } from "/snippets/get-started/prerequisites/account-
 export const Prerequisites = ({
   callbackUrl = "http://localhost:3000/auth/callback",
   logoutUrl = "http://localhost:3000",
+  createAuth0ApiStep = undefined,
 }) => {
   const steps = AccountAndAppSteps({ callbackUrl, logoutUrl });
 
+  if (createAuth0ApiStep) {
+    steps.push(
+      <Step key="auth0-api" title="Create an Auth0 API">
+        <ul>
+          <li>
+            In your Auth0 Dashboard, go to{" "}
+            <strong>Applications &gt; APIs</strong>.
+          </li>
+          <li>Create a new API with an identifier (audience).</li>
+          <li>
+            Once API is created, go to the APIs{" "}
+            <strong>Settings &gt; Access Settings</strong> and enable{" "}
+            <strong>Allow Offline Access</strong>.
+          </li>
+          <li>Note down the API identifier for your environment variables.</li>
+        </ul>
+        To learn more about Auth0 APIs, read{" "}
+        <a
+          href="https://auth0.com/docs/get-started/auth0-overview/set-up-apis"
+          target="_blank"
+        >
+          APIs
+        </a>
+        .
+      </Step>
+    );
+  }
+
   steps.push(
     <Step title="OpenAI Platform">
       Set up an{" "}
@@ -18,6 +47,7 @@ export const Prerequisites = ({
       .
     </Step>
   );
+
   return (
     <>
       <Heading level={3} id="prerequisites">