Conversation Management

{
  "prompt": "What's the capital of Ethiopia again?",
  "target_language": "am",
  "conversation_history": [
    {
      "role": "user",
      "content": "What is the capital of Ethiopia?"
    },
    {
      "role": "assistant",
      "content": "The capital of Ethiopia is Addis Ababa."
    }
  ],
  "generation_config": { "temperature": 0.7 }
}

{
  "conversation_history": [
    {
      "role": "assistant",
      "content": "You are Addis AI, an AI assistant that specializes in Ethiopian languages..."
    },
    {
      "role": "user",
      "content": "Hello!"
    },
    {
      "role": "assistant",
      "content": "ሰላም! እንደምን አሉ? እኔ አዲስ AI ነኝ።"
    }
  ]
}

User: "My name is Abebe and I work as a teacher."
Assistant: "Nice to meet you, Abebe! How long have you been a teacher?"
User: "For 5 years. I teach mathematics."
Assistant: "That's great! Mathematics is an important subject. Do you teach at a primary or secondary school?"
User: "What was my name again?"
Assistant: "Your name is Abebe."

// Client-side example of collecting streaming response and updating history
let responseText = "";
let isComplete = false;

fetch("https://api.addisassistant.com/api/v1/chat_generate", {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "X-API-Key": "YOUR_API_KEY",
  },
  body: JSON.stringify({
    prompt: "Tell me more",
    target_language: "am",
    conversation_history: existingHistory,
    generation_config: { stream: true, temperature: 0.7 },
  }),
}).then((response) => {
  const reader = response.body.getReader();

  function readChunk() {
    return reader.read().then(({ done, value }) => {
      if (done) return;

      // Process the chunk (ndjson format)
      const chunk = new TextDecoder().decode(value);
      const lines = chunk.split("\n").filter((line) => line.trim());

      for (const line of lines) {
        try {
          const data = JSON.parse(line);
          responseText += data.response_text;

          // Check if this is the last chunk
          if (data.is_last_chunk || data.finish_reason) {
            isComplete = true;

            // Add completed response to history for next request
            const newHistory = [
              ...existingHistory,
              { role: "user", content: prompt },
              { role: "assistant", content: responseText },
            ];

            // Save the updated history
            setConversationHistory(newHistory);
          }
        } catch (e) {
          console.error("Error parsing chunk:", e);
        }
      }

      return readChunk();
    });
  }

  return readChunk();
});

{
  "conversation_history": [
    {
      "role": "user",
      "parts": [
        {
          "fileData": {
            "fileUri": "gs://.../file1.png",
            "mimeType": "image/png"
          }
        },
        { "text": "What is in this image?" }
      ]
    },
    {
      "role": "assistant",
      "parts": [
        { "text": "This image shows the Entoto Mountains near Addis Ababa." }
      ]
    },
    {
      "role": "user",
      "parts": [{ "text": "Is this in Ethiopia?" }]
    }
  ]
}

function manageConversationTokens(history, maxTurns = 10) {
  // Simple strategy: keep only the most recent 10 turns (5 exchanges)
  if (history.length > maxTurns) {
    return history.slice(history.length - maxTurns);
  }
  return history;
}

// Before sending a request
const truncatedHistory = manageConversationTokens(conversationHistory);

import React, { useState, useEffect } from "react";

function ChatApp() {
  const [messages, setMessages] = useState([]);
  const [inputText, setInputText] = useState("");
  const [isLoading, setIsLoading] = useState(false);

  // Convert UI messages to API conversation history format
  const getConversationHistory = () => {
    return messages.map((msg) => ({
      role: msg.sender,
      content: msg.text,
    }));
  };

  // Send message to API
  const sendMessage = async () => {
    if (!inputText.trim()) return;

    // Add user message to UI
    const userMessage = { sender: "user", text: inputText };
    setMessages((prev) => [...prev, userMessage]);
    setInputText("");
    setIsLoading(true);

    try {
      // Prepare request with conversation history
      const history = getConversationHistory();

      const response = await fetch(
        "https://api.addisassistant.com/api/v1/chat_generate",
        {
          method: "POST",
          headers: {
            "Content-Type": "application/json",
            "X-API-Key": "YOUR_API_KEY",
          },
          body: JSON.stringify({
            prompt: userMessage.text,
            target_language: "am",
            conversation_history: history,
            generation_config: {
              temperature: 0.7,
            },
          }),
        },
      );

      const data = await response.json();

      // Add assistant response to UI
      setMessages((prev) => [
        ...prev,
        { sender: "assistant", text: data.response_text },
      ]);
    } catch (error) {
      console.error("Error sending message:", error);
      // Add error message to UI
      setMessages((prev) => [
        ...prev,
        {
          sender: "assistant",
          text: "Sorry, there was an error processing your request.",
        },
      ]);
    } finally {
      setIsLoading(false);
    }
  };

  // Clear conversation history
  const clearHistory = () => {
    setMessages([]);
  };

  return (
    <div className="chat-container">
      <div className="chat-header">
        <h2>Addis AI Chat</h2>
        <button onClick={clearHistory}>Clear Chat</button>
      </div>

      <div className="chat-messages">
        {messages.length === 0 ? (
          <div className="empty-state">Start a conversation with Addis AI</div>
        ) : (
          messages.map((msg, index) => (
            <div key={index} className={`message ${msg.sender}`}>
              {msg.text}
            </div>
          ))
        )}
        {isLoading && <div className="message loading">...</div>}
      </div>

      <div className="chat-input">
        <input
          type="text"
          value={inputText}
          onChange={(e) => setInputText(e.target.value)}
          onKeyPress={(e) => e.key === "Enter" && sendMessage()}
          placeholder="Type your message..."
          disabled={isLoading}
        />
        <button onClick={sendMessage} disabled={isLoading}>
          Send
        </button>
      </div>
    </div>
  );
}

export default ChatApp;