Respect selected persona in chat input placeholder (#916)

* respect selected persona in chat input placeholder * simplify for loop in getPersonaName() Co-authored-by: Andrii Ieroshenko <[email protected]> --------- Co-authored-by: Andrii Ieroshenko <[email protected]>
jupyterlab · Jul 29, 2024 · fb88723 · fb88723
1 parent 19c7b6b
commit fb88723
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 1 deletion.
diff --git a/packages/jupyter-ai/src/components/chat-input.tsx b/packages/jupyter-ai/src/components/chat-input.tsx
@@ -38,6 +38,11 @@ type ChatInputProps = {
   toggleIncludeSelection: () => unknown;
   sendWithShiftEnter: boolean;
   sx?: SxProps<Theme>;
+  /**
+   * Name of the persona, set by the selected chat model. This defaults to
+   * `'Jupyternaut'`, but can differ for custom providers.
+   */
+  personaName: string;
 };
 
 type SlashCommandOption = {
@@ -300,7 +305,7 @@ export function ChatInput(props: ChatInputProps): JSX.Element {
             variant="outlined"
             maxRows={20}
             multiline
-            placeholder="Ask Jupyternaut"
+            placeholder={`Ask ${props.personaName}`}
             onKeyDown={handleKeyDown}
             inputRef={inputRef}
             InputProps={{

diff --git a/packages/jupyter-ai/src/components/chat.tsx b/packages/jupyter-ai/src/components/chat.tsx
@@ -35,6 +35,21 @@ type ChatBodyProps = {
   focusInputSignal: ISignal<unknown, void>;
 };
 
+/**
+ * Determines the name of the current persona based on the message history.
+ * Defaults to `'Jupyternaut'` if history is insufficient.
+ */
+function getPersonaName(messages: AiService.ChatMessage[]): string {
+  for (let i = messages.length - 1; i >= 0; i--) {
+    const message = messages[i];
+    if (message.type === 'agent' || message.type === 'agent-stream') {
+      return message.persona.name;
+    }
+  }
+
+  return 'Jupyternaut';
+}
+
 function ChatBody({
   chatHandler,
   focusInputSignal,
@@ -47,6 +62,9 @@ function ChatBody({
   const [pendingMessages, setPendingMessages] = useState<
     AiService.PendingMessage[]
   >([...chatHandler.history.pending_messages]);
+  const [personaName, setPersonaName] = useState<string>(
+    getPersonaName(messages)
+  );
   const [showWelcomeMessage, setShowWelcomeMessage] = useState<boolean>(false);
   const [includeSelection, setIncludeSelection] = useState(true);
   const [input, setInput] = useState('');
@@ -79,6 +97,7 @@ function ChatBody({
     function onHistoryChange(_: unknown, history: AiService.ChatHistory) {
       setMessages([...history.messages]);
       setPendingMessages([...history.pending_messages]);
+      setPersonaName(getPersonaName(history.messages));
     }
 
     chatHandler.historyChanged.connect(onHistoryChange);
@@ -166,6 +185,7 @@ function ChatBody({
           borderTop: '1px solid var(--jp-border-color1)'
         }}
         sendWithShiftEnter={sendWithShiftEnter}
+        personaName={personaName}
       />
     </>
   );