fix

raunakdoesdev · Aug 14, 2023 · b1422f4 · b1422f4
1 parent 95bf5f1
commit b1422f4
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 57 deletions.
diff --git a/docs/components/Code.tsx b/docs/components/Code.tsx
@@ -3,10 +3,12 @@ import {
   SelectContent,
   SelectGroup,
   SelectItem,
+  SelectLabel,
   SelectTrigger,
   SelectValue,
 } from "components/ui/select";
-import { atom, useAtomValue, useSetAtom } from "jotai";
+import { atom, useAtom } from "jotai";
+import { ClipboardCopy } from "lucide-react";
 
 type Language = "python" | "ts";
 
@@ -32,9 +34,12 @@ export function Typescript({
 
 import React, { useState } from "react";
 
+const languageAtom = atom<Language>("python");
+
 /** Display code snipet with utilities for swapping languages */
 export default function Code({ children }: { children: React.ReactNode }) {
-  const [language, setLanguage] = useState<"python" | "ts">("python");
+  //   const [language, setLanguage] = useState<"python" | "ts">("python");
+  const [language, setLanguage] = useAtom(languageAtom);
 
   const childrenWithProps = React.Children.map(children, (child) => {
     if (React.isValidElement(child)) {
@@ -44,27 +49,26 @@ export default function Code({ children }: { children: React.ReactNode }) {
   });
 
   return (
-    <div>
-      <Select
-        value={language}
-        onValueChange={(v) => {
-          setLanguage(v as typeof language);
-        }}
-      >
-        <SelectTrigger className="w-[120px]">
-          <SelectValue
-            className="text-xl p-1"
-            placeholder="Select a Language"
-          />
-        </SelectTrigger>
-        <SelectContent>
-          <SelectGroup>
-            <SelectItem value="python">Python</SelectItem>
-            <SelectItem value="ts">Typescript</SelectItem>
-          </SelectGroup>
-        </SelectContent>
-      </Select>
+    <>
+      <div className="flex flex-row justify-end items-center">
+        <Select
+          value={language}
+          onValueChange={(v) => {
+            setLanguage(v as typeof language);
+          }}
+        >
+          <SelectTrigger className="w-[120px] border-none">
+            <SelectValue />
+          </SelectTrigger>
+          <SelectContent>
+            <SelectGroup>
+              <SelectItem value="python">Python</SelectItem>
+              <SelectItem value="ts">Typescript</SelectItem>
+            </SelectGroup>
+          </SelectContent>
+        </Select>
+      </div>
       {childrenWithProps}
-    </div>
+    </>
   );
 }
diff --git a/docs/pages/index.mdx b/docs/pages/index.mdx
@@ -9,6 +9,8 @@ Just write your prompt in JSON and we'll autoconvert it to XML that the model ca
 
 The library is designed to be as lightweight as possible, and with nearly identical APIs whether you are operating in Python or Javascript/Typescript.
 
+
+### Installation
 <Code>
 <Python>
 ```python
@@ -22,26 +24,10 @@ pnpm install xlmai
 </Typescript>
 </Code>
 
-<div className="w-full grid grid-cols-1 gap-4 lg:grid-cols-2">
-<div>
-
-
-## Python
-
-
-### Installation
-
-```python filename="Terminal" switcher
-pip install xmlai
-```
-
-```typescript filename="Terminal" switcher
-pnpm install xmlai
-```
-
-
 ### Getting Started
 
+<Code>
+<Python>
 ```python
 from xmlai.llm import anthropic_prompt
 
@@ -62,20 +48,8 @@ completion = anthropic.completions.create(
 
 completion.completion # 42
 ```
-
-</div>
-
-
-<div>
-## Typescript
-
-### Installation
-```bash
-pnpm install xmlai
-```
-
-### Getting Started
-
+</Python>
+<Typescript>
 ```typescript
 import { anthropic_prompt } from "xmlai/llm";
 
@@ -96,8 +70,8 @@ const completion = await anthropic.completions.create({
 
 completion.completion // 42
 ```
-</div>
-</div>
+</Typescript>
+</Code>
 
 The generated prompts look like this:
 ```json