pi-mono

src/apps/officer-web/Screens/Dashboard/Chat/Settings.tsx

@@ -5,9 +5,9 @@ import type { ChatMessage } from 'apps/Chat';
 import { OpenCodeModelPicker } from './OpenCodeModelPicker';
 
 type SettingsProps = {
-  provider: 'claude' | 'opencode';
+  provider: 'claude' | 'opencode' | 'pi-mono';
   messages: ChatMessage[];
-  onProviderChange?: (provider: 'claude' | 'opencode') => void;
+  onProviderChange?: (provider: 'claude' | 'opencode' | 'pi-mono') => void;
   availableModels: ModelOption[];
   selectedModel: string | null;
   onModelChange: (modelId: string) => void;
@@ -35,11 +35,11 @@ export const Settings = ({
     <div className="flex items-center justify-between mt-2">
       {messages.length > 0 ? (
         <span className="rounded-md bg-duck-dark/80 px-3 py-1 text-xs font-medium text-white">
-          {provider === 'claude' ? 'Claude' : 'OpenCode'}
+          {provider === 'claude' ? 'Claude' : provider === 'opencode' ? 'OpenCode' : 'Pi'}
         </span>
       ) : (
         <div className="flex items-center gap-1 rounded-lg bg-background/60 p-1">
-          {(['claude', 'opencode'] as const).map((value) => (
+          {(['claude', 'opencode', 'pi-mono'] as const).map((value) => (
             <button
               key={value}
               onClick={() => onProviderChange?.(value)}
@@ -47,7 +47,7 @@ export const Settings = ({
                 provider === value ? 'bg-background text-duck-dark shadow-sm' : 'text-duck-dark/70 hover:text-duck-dark/90'
               } ${!onProviderChange ? 'opacity-40 cursor-not-allowed' : 'cursor-pointer'}`}
             >
-              {value === 'claude' ? 'Claude' : 'OpenCode'}
+              {value === 'claude' ? 'Claude' : value === 'opencode' ? 'OpenCode' : 'Pi'}
             </button>
           ))}
         </div>