forked from React-Group/interstellar_ai
delete logs and fix hydration error
This commit is contained in:
parent
4ed2756b9a
commit
891dabcabf
10 changed files with 37 additions and 70 deletions
|
@ -4,7 +4,7 @@ import ConversationFrontend from '../components/ConversationFrontend';
|
|||
import InputFrontend from "../components/InputFrontend";
|
||||
import { sendToVoiceRecognition } from "./voice_backend"
|
||||
import axios from "axios";
|
||||
import { useChatHistory } from '../hooks/useChatHistory';
|
||||
import { updateMessage, useChatHistory } from '../hooks/useChatHistory';
|
||||
import { getWeather } from "./weather";
|
||||
import { changeHistory, getHistory } from "./database";
|
||||
|
||||
|
@ -16,7 +16,7 @@ const InputOutputBackend: React.FC = () => {
|
|||
}
|
||||
|
||||
// Define state variables for user preferences and messages
|
||||
const [chatHistory, setSelectedIndex, setChatHistory, updateMessage] = useChatHistory()
|
||||
const [chatHistory, setChatHistory] = useChatHistory()
|
||||
const [preferredCurrency, setPreferredCurrency] = useState<string>("USD");
|
||||
const [preferredLanguage, setPreferredLanguage] = useState<string>("english");
|
||||
const [timeFormat, setTimeFormat] = useState<string>("24-hour");
|
||||
|
@ -36,7 +36,6 @@ const InputOutputBackend: React.FC = () => {
|
|||
apiURL.hostname = "localhost"
|
||||
}
|
||||
|
||||
console.log(setSelectedIndex)
|
||||
//#region useEffect
|
||||
useEffect(() => {
|
||||
setMessages(chatHistory.chats[chatHistory.selectedIndex].messages)
|
||||
|
@ -44,10 +43,6 @@ const InputOutputBackend: React.FC = () => {
|
|||
|
||||
|
||||
useEffect(() => {
|
||||
console.log("History", chatHistory);
|
||||
console.log("Messages", messages);
|
||||
|
||||
|
||||
// Get the current chat's messages
|
||||
const currentMessages = chatHistory.chats[chatHistory.selectedIndex].messages || [];
|
||||
|
||||
|
@ -58,7 +53,6 @@ const InputOutputBackend: React.FC = () => {
|
|||
// When creating a new chat and no messages exist yet, set default messages
|
||||
addMessage("system", systemMessage)
|
||||
addMessage("assistant", "Hello! How can I help you?")
|
||||
console.log(systemMessage)
|
||||
}
|
||||
}, [chatHistory, chatHistory.selectedIndex, systemMessage]);
|
||||
|
||||
|
@ -82,14 +76,12 @@ const InputOutputBackend: React.FC = () => {
|
|||
const password = localStorage.getItem("accountPassword")
|
||||
if (username && password && chatHistoryTriggered) {
|
||||
changeHistory(username, password, chatHistory)
|
||||
console.log("changed history in backend")
|
||||
}
|
||||
}, [chatHistory])
|
||||
|
||||
//#region functions
|
||||
const getWeatherHere = async () => {
|
||||
setWeatherData(await getWeather({ "unit_type": preferredMeasurement, "city": localStorage.getItem("weatherInfo") || "New York" }))
|
||||
console.log("Got the Data!")
|
||||
setWeatherTriggered(true)
|
||||
}
|
||||
|
||||
|
@ -100,15 +92,12 @@ const InputOutputBackend: React.FC = () => {
|
|||
const tempChatHistory = await getHistory(username, password)
|
||||
if (tempChatHistory && typeof tempChatHistory == "object") {
|
||||
setChatHistory(tempChatHistory)
|
||||
console.log("got history from backend")
|
||||
}
|
||||
}
|
||||
setChatHistoryTriggered(true)
|
||||
}
|
||||
//#region system-prompt
|
||||
useEffect(() => {
|
||||
console.log("creating system prompt")
|
||||
console.log(weatherData)
|
||||
|
||||
const measurementString = (preferredMeasurement == "Metric")
|
||||
? "All measurements follow the metric system. Refuse to use any other measurement system."
|
||||
|
@ -124,14 +113,12 @@ const InputOutputBackend: React.FC = () => {
|
|||
These are the currently newest Weather infos for the region. Only for the case when the user asks about anything weather related,
|
||||
you can use the following data to help the user: ${weatherData}. If there is nothing there say there is no data`
|
||||
: `You are a helpful assistant.`;
|
||||
console.log(newSystemMessage)
|
||||
setSystemMessage(newSystemMessage)
|
||||
}, [preferredCurrency, preferredLanguage, timeFormat, preferredMeasurement, timeZone, dateFormat, myBoolean, weatherTriggered]);
|
||||
|
||||
useEffect(() => {
|
||||
const messageIndex = 0 // system prompt is the first so index 0
|
||||
updateMessage(messageIndex, systemMessage)
|
||||
console.log(messages)
|
||||
}, [systemMessage])
|
||||
|
||||
//#region more variables and functions
|
||||
|
@ -208,7 +195,6 @@ const InputOutputBackend: React.FC = () => {
|
|||
if (event.data == "error") {
|
||||
console.log("Error getting ai message.")
|
||||
} else {
|
||||
console.log("Received data:", data);
|
||||
editLastMessage(data.response)
|
||||
}
|
||||
}
|
||||
|
|
|
@ -17,8 +17,6 @@ const fetchData = () => {
|
|||
const apiURL = new URL("http://localhost:5000/interstellar_ai/api/ai_get?access_token=" + accesstoken);
|
||||
apiURL.hostname = windownameGlobal; // Set the hostname
|
||||
|
||||
console.log(apiURL.href); // Log the constructed URL
|
||||
|
||||
axios.get(apiURL.href)
|
||||
.then(response => {
|
||||
postMessage(response.data); // Send data back on success
|
||||
|
|
|
@ -14,10 +14,8 @@ onmessage = (e) => {
|
|||
};
|
||||
|
||||
const apiURL = new URL("http://localhost:5000/interstellar_ai/api/ai_send");
|
||||
console.log(windowname); // Log the window name
|
||||
apiURL.hostname = windowname; // Set the hostname for the API request
|
||||
|
||||
console.log(apiURL.href); // Log the constructed API URL
|
||||
|
||||
// Make a POST request to the API with the message object
|
||||
axios.post(apiURL.href, Message)
|
||||
|
|
|
@ -18,7 +18,6 @@ export const getWeather = async (data: object): Promise<string> => {
|
|||
|
||||
// Send the status and success response back to the worker
|
||||
postMessage({ status, success });
|
||||
console.log(JSON.stringify(success)); // Log the successful response for debugging
|
||||
return JSON.stringify(success); // Return the weather data as a JSON string
|
||||
} catch (error) {
|
||||
// Handle any errors that occur during the request
|
||||
|
|
|
@ -7,17 +7,17 @@ const FAQ: React.FC = () => {
|
|||
<h2>Frequently Asked Questions</h2> {/* Title for the FAQ section */}
|
||||
|
||||
<div className="faq-item">
|
||||
<h3>Why doesn't my selection in the category dropdown menu apply?</h3>
|
||||
<h3>Why doesn't my selection in the category dropdown menu apply?</h3>
|
||||
<p>Currently, the dropdown menu for selecting AI models does not retain your choice after a website refresh.</p>
|
||||
</div>
|
||||
|
||||
<div className="faq-item">
|
||||
<h3>Why is the AI suddenly talking about the weather when I didn't select that option?</h3>
|
||||
<p>The AI is programmed to provide weather information even if you haven't specifically selected the weather option.</p>
|
||||
<h3>Why is the AI suddenly talking about the weather when I didn't select that option?</h3>
|
||||
<p>The AI is programmed to provide weather information even if you haven't specifically selected the weather option.</p>
|
||||
</div>
|
||||
|
||||
<div className="faq-item">
|
||||
<h3>Why isn't the online API working?</h3>
|
||||
<h3>Why isn't the online API working?</h3>
|
||||
<p>At the moment, the online APIs for Google and La Plateforme are not operational. However, the OpenAI and Anthropic APIs may still function.</p>
|
||||
</div>
|
||||
|
||||
|
@ -27,7 +27,7 @@ const FAQ: React.FC = () => {
|
|||
</div>
|
||||
|
||||
<div className="faq-item">
|
||||
<h3>Why isn't the AI responding in the format I specified in the settings?</h3>
|
||||
<h3>Why isn't the AI responding in the format I specified in the settings?</h3>
|
||||
<p>Please check if the system prompt settings are enabled. If the issue persists, it may be because the AI is unable to fully adhere to the command.</p>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
import React, { useState } from 'react';
|
||||
import { useChatHistory } from '../hooks/useChatHistory'; // Importing the custom hook for chat history
|
||||
import { setSelectedIndex, useChatHistory } from '../hooks/useChatHistory'; // Importing the custom hook for chat history
|
||||
|
||||
const History: React.FC = () => {
|
||||
// Destructuring values from the useChatHistory hook
|
||||
const [chatHistory, setSelectedIndex, setChatHistory] = useChatHistory();
|
||||
const [chatHistory, setChatHistory] = useChatHistory();
|
||||
const [isEditing, setIsEditing] = useState(false); // State to manage edit mode
|
||||
const [inputValue, setInputValue] = useState<string>(''); // State for input field
|
||||
const [hoveredIndex, setHoveredIndex] = useState<number | null>(null); // State to track hovered chat index
|
||||
|
@ -29,7 +29,6 @@ const History: React.FC = () => {
|
|||
// Function to select a chat from the history
|
||||
const handleHistoryClick = (index: number) => {
|
||||
setSelectedIndex(index); // Set the selected index to the clicked chat
|
||||
console.log("index", index);
|
||||
};
|
||||
|
||||
// Function to handle hover over a chat entry
|
||||
|
@ -42,10 +41,6 @@ const History: React.FC = () => {
|
|||
setHoveredIndex(null); // Reset hovered index
|
||||
};
|
||||
|
||||
// Debugging information for chat history length and selected index
|
||||
console.log("chat length", chatHistory.chats.length);
|
||||
console.log("index", chatHistory.selectedIndex);
|
||||
|
||||
// Function to delete a chat entry
|
||||
const handleHistoryDeletion = (index: number) => {
|
||||
const currentIndex = chatHistory.selectedIndex; // Get the currently selected index
|
||||
|
@ -71,9 +66,6 @@ const History: React.FC = () => {
|
|||
|
||||
copyChats.selectedIndex = newSelectedIndex; // Update the selected index
|
||||
|
||||
// Debugging information to inspect the modified chat history
|
||||
console.log(copyChats);
|
||||
|
||||
// Set the updated chat history
|
||||
setChatHistory(copyChats);
|
||||
};
|
||||
|
|
|
@ -34,7 +34,6 @@ export function importSettings(jsonData: string): void {
|
|||
});
|
||||
}
|
||||
|
||||
console.log("Settings imported successfully!");
|
||||
} catch (error) {
|
||||
console.error("Invalid JSON data:", error);
|
||||
}
|
||||
|
|
|
@ -46,16 +46,11 @@ const setGlobalState = (newState: GlobalChatHistory): void => {
|
|||
// Custom hook to manage chat history
|
||||
export const useChatHistory = (): [
|
||||
GlobalChatHistory, // Current state
|
||||
(index: number) => void, // Function to set selected index
|
||||
(newState: GlobalChatHistory) => void, // Function to set global state
|
||||
(messageIndex: number, newContent: string) => void // Function to update a message
|
||||
] => {
|
||||
const [state, setState] = useState<GlobalChatHistory>(globalChatHistory); // Local state initialized with global state
|
||||
|
||||
useEffect(() => {
|
||||
// Log the initial state for debugging
|
||||
console.log("Current global chat history:", globalChatHistory);
|
||||
|
||||
// Listener to update local state when global state changes
|
||||
const listener = (newState: GlobalChatHistory) => {
|
||||
setState(newState);
|
||||
|
@ -69,30 +64,31 @@ export const useChatHistory = (): [
|
|||
};
|
||||
}, []);
|
||||
|
||||
// Function to set the selected chat index
|
||||
const setSelectedIndex = (index: number) => {
|
||||
setGlobalState({ ...state, selectedIndex: index }); // Update the global state
|
||||
}
|
||||
|
||||
|
||||
// Return the current state and action functions
|
||||
return [state, setGlobalState];
|
||||
}
|
||||
// Function to set the selected chat index
|
||||
export const setSelectedIndex = (index: number) => {
|
||||
setGlobalState({ ...globalChatHistory, selectedIndex: index }); // Update the global state
|
||||
}
|
||||
|
||||
// Function to update a specific message in the current chat
|
||||
const updateMessage = (messageIndex: number, newContent: string) => {
|
||||
const updatedChats = [...state.chats]; // Make a copy of the current chats
|
||||
const chatIndex = globalChatHistory.selectedIndex; // Get the currently selected chat index
|
||||
// Function to update a specific message in the current chat
|
||||
export const updateMessage = (messageIndex: number, newContent: string) => {
|
||||
const updatedChats = [...globalChatHistory.chats]; // Make a copy of the current chats
|
||||
const chatIndex = globalChatHistory.selectedIndex; // Get the currently selected chat index
|
||||
|
||||
// Check if the selected chat index is valid
|
||||
if (chatIndex >= 0 && chatIndex < updatedChats.length) {
|
||||
const updatedMessages = [...updatedChats[chatIndex].messages]; // Copy messages of the selected chat
|
||||
// Check if the selected chat index is valid
|
||||
if (chatIndex >= 0 && chatIndex < updatedChats.length) {
|
||||
const updatedMessages = [...updatedChats[chatIndex].messages]; // Copy messages of the selected chat
|
||||
|
||||
// Check if the message index is valid
|
||||
if (messageIndex >= 0 && messageIndex < updatedMessages.length) {
|
||||
// Update the content of the specified message
|
||||
updatedMessages[messageIndex] = { ...updatedMessages[messageIndex], content: newContent };
|
||||
updatedChats[chatIndex] = { ...updatedChats[chatIndex], messages: updatedMessages }; // Update the chat with new messages
|
||||
setGlobalState({ ...state, chats: updatedChats }); // Set the updated global state
|
||||
}
|
||||
// Check if the message index is valid
|
||||
if (messageIndex >= 0 && messageIndex < updatedMessages.length) {
|
||||
// Update the content of the specified message
|
||||
updatedMessages[messageIndex] = { ...updatedMessages[messageIndex], content: newContent };
|
||||
updatedChats[chatIndex] = { ...updatedChats[chatIndex], messages: updatedMessages }; // Update the chat with new messages
|
||||
setGlobalState({ ...globalChatHistory, chats: updatedChats }); // Set the updated global state
|
||||
}
|
||||
}
|
||||
|
||||
// Return the current state and action functions
|
||||
return [state, setSelectedIndex, setGlobalState, updateMessage];
|
||||
}
|
||||
|
|
|
@ -9,15 +9,14 @@ export const metadata = {
|
|||
// RootLayout component definition
|
||||
export default function RootLayout({ children }: { children: ReactNode }) {
|
||||
return (
|
||||
<html lang="en"> {/* Set the language of the document */}
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>{metadata.title}</title> {/* Set the page title */}
|
||||
<meta name="description" content={metadata.description} /> {/* Set the page description for SEO */}
|
||||
{/* Link to the favicon for the site */}
|
||||
<title>{metadata.title}</title>
|
||||
<meta name="description" content={metadata.description} />
|
||||
<link rel="icon" href="./favicon.ico" type="image/x-icon" />
|
||||
</head>
|
||||
<body>
|
||||
<main>{children}</main> {/* Render the child components inside the main element */}
|
||||
<main>{children}</main>
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
|
|
|
@ -91,7 +91,7 @@ const LandingPage: React.FC = () => {
|
|||
}, [primaryColor, secondaryColor, accentColor, basicBackgroundColor, basicTextColor]); // Apply themes whenever color states change
|
||||
|
||||
return (
|
||||
<>
|
||||
<div>
|
||||
{/* Header component with props for toggling and view change */}
|
||||
<Header
|
||||
toggleDivs={toggleDivs}
|
||||
|
@ -118,7 +118,7 @@ const LandingPage: React.FC = () => {
|
|||
{view === 'Credits' && <Credits />}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in a new issue