adding conditional token rendering to docs

docs/my-website/docs/index.md

@@ -1,9 +1,10 @@
 ---
 displayed_sidebar: tutorialSidebar
 ---
-
 # litellm
 
+import QueryParamReader from './QueryParamReader';
+
 [![PyPI Version](https://img.shields.io/pypi/v/litellm.svg)](https://pypi.org/project/litellm/)
 [![PyPI Version](https://img.shields.io/badge/stable%20version-v0.1.345-blue?color=green&link=https://pypi.org/project/litellm/0.1.1/)](https://pypi.org/project/litellm/0.1.1/)
 [![CircleCI](https://dl.circleci.com/status-badge/img/gh/BerriAI/litellm/tree/main.svg?style=svg)](https://dl.circleci.com/status-badge/redirect/gh/BerriAI/litellm/tree/main)
@@ -31,21 +32,7 @@ Read the docs - https://docs.litellm.ai/docs/
 pip install litellm
 ```
 
-```python
-from litellm import completion
-
-## set ENV variables
-os.environ["OPENAI_API_KEY"] = "openai key"
-os.environ["COHERE_API_KEY"] = "cohere key"
-
-messages = [{ "content": "Hello, how are you?","role": "user"}]
-
-# openai call
-response = completion(model="gpt-3.5-turbo", messages=messages)
-
-# cohere call
-response = completion("command-nightly", messages)
-```
+<QueryParamReader/>
 
 Code Sample: [Getting Started Notebook](https://colab.research.google.com/drive/1gR3pY-JzDZahzpVdbGBtrNGDBmzUNJaJ?usp=sharing)
 

docs/my-website/docs/queryParamReader.js

@@ -0,0 +1,59 @@
+import React, { useState, useEffect } from 'react';
+
+const CodeBlock = ({ token }) => {
+  const codeWithToken = `
+from litellm import completion
+
+# set ENV variables 
+os.environ["LITELLM_TOKEN"] = '${token}'
+
+messages = [{ "content": "Hello, how are you?","role": "user"}]
+
+# openai call
+response = completion(model="gpt-3.5-turbo", messages=messages)
+
+# cohere call
+response = completion("command-nightly", messages)
+`;
+
+  const codeWithoutToken = `
+from litellm import completion
+
+## set ENV variables
+os.environ["OPENAI_API_KEY"] = "openai key"
+os.environ["COHERE_API_KEY"] = "cohere key"
+
+
+messages = [{ "content": "Hello, how are you?","role": "user"}]
+
+# openai call
+response = completion(model="gpt-3.5-turbo", messages=messages)
+
+# cohere call
+response = completion("command-nightly", messages)
+`;
+  return (
+    <pre>
+        {console.log("token: ", token)}
+      {token ? codeWithToken : codeWithoutToken}
+    </pre>
+  )
+}
+
+const QueryParamReader = () => {
+  const [token, setToken] = useState(null);
+
+  useEffect(() => {
+    const urlParams = new URLSearchParams(window.location.search);
+    const token = urlParams.get('token');
+    setToken(token);
+  }, []);
+
+  return (
+    <div>
+      <CodeBlock token={token} />
+    </div>
+  );
+}
+
+export default QueryParamReader;