feat(playground): allow hiding apiKey entry (#540)

Yonom · Jul 19, 2024 · 69ed202 · 69ed202
1 parent 446bdb2
commit 69ed202
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/.changeset/shiny-starfishes-camp.md b/.changeset/shiny-starfishes-camp.md
@@ -0,0 +1,5 @@
+---
+"@assistant-ui/react-playground": patch
+---
+
+feat: allow hiding apiKey input
diff --git a/packages/react-playground/src/components/ui/assistant-ui/assistant-playground.tsx b/packages/react-playground/src/components/ui/assistant-ui/assistant-playground.tsx
@@ -317,7 +317,10 @@ const MaxTokensSlider: FC = () => {
   );
 };
 
-const Sidebar: FC<AssistantPlaygroundProps> = ({ modelSelector }) => {
+const Sidebar: FC<AssistantPlaygroundProps> = ({
+  modelSelector,
+  apiKey = true,
+}) => {
   const { useAssistantActions } = useAssistantContext();
   const handleReset = () => {
     useAssistantActions.getState().switchToThread(null);
@@ -329,7 +332,7 @@ const Sidebar: FC<AssistantPlaygroundProps> = ({ modelSelector }) => {
       <Button onClick={handleReset}>Reset</Button>
 
       <ModelSelector {...modelSelector} />
-      <APIKeyInput />
+      {apiKey && <APIKeyInput />}
       <TemperatureSlider />
       <MaxTokensSlider />
 
@@ -347,17 +350,19 @@ type AssistantPlaygroundProps = {
         models?: string[] | undefined;
       }
     | undefined;
+  apiKey?: boolean | undefined;
 };
 
 export const AssistantPlayground: FC<AssistantPlaygroundProps> = ({
   modelSelector,
+  apiKey,
 }) => {
   return (
     <div className="flex h-full overflow-hidden">
       <div className="flex flex-grow flex-col">
         <Thread />
       </div>
-      <Sidebar modelSelector={modelSelector} />
+      <Sidebar modelSelector={modelSelector} apiKey={apiKey} />
     </div>
   );
 };