Skip to content

Commit

Permalink
Basic system demo - first agent runs
Browse files Browse the repository at this point in the history
  • Loading branch information
@GullyBurns
GullyBurns committed Nov 28, 2023
1 parent 9c693c5 commit 434c344
Show file tree
Hide file tree
Showing 37 changed files with 96,993 additions and 5,355 deletions.
96 changes: 13 additions & 83 deletions alhazen-client/app/components/ChatMessageBubble.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,15 @@
/**
* @description :
* @author :
* @group :
* @created : 27/11/2023 - 23:12:44
*
* MODIFICATION LOG
* - Version : 1.0.0
* - Date : 27/11/2023
* - Author :
* - Modification :
**/
import { toast } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
import { emojisplosion } from "emojisplosion";
Expand Down Expand Up @@ -221,37 +233,6 @@ export function ChatMessageBubble(props: {
)
: [];

const animateButton = (buttonId: string) => {
let button: HTMLButtonElement | null;
if (buttonId === "upButton") {
button = upButtonRef.current;
} else if (buttonId === "downButton") {
button = downButtonRef.current;
} else {
return;
}
if (!button) return;
let resolvedButton = button as HTMLButtonElement;
resolvedButton.classList.add("animate-ping");
setTimeout(() => {
resolvedButton.classList.remove("animate-ping");
}, 500);

emojisplosion({
emojiCount: 10,
uniqueness: 1,
position() {
const offset = cumulativeOffset(button);

return {
x: offset.left + resolvedButton.clientWidth / 2,
y: offset.top + resolvedButton.clientHeight / 2,
};
},
emojis: buttonId === "upButton" ? ["👍"] : ["👎"],
});
};

return (
<VStack align="start" spacing={5} pb={5}>
{!isUser && filteredSources.length > 0 && (
Expand Down Expand Up @@ -309,58 +290,7 @@ export function ChatMessageBubble(props: {

{props.message.role !== "user" &&
props.isMostRecent &&
props.messageCompleted && (
<HStack spacing={2}>
<Button
ref={upButtonRef}
size="sm"
variant="outline"
colorScheme={feedback === null ? "green" : "gray"}
onClick={() => {
if (feedback === null && props.message.runId) {
sendUserFeedback(1, "user_score");
animateButton("upButton");
setFeedbackColor("border-4 border-green-300");
} else {
toast.error("You have already provided your feedback.");
}
}}
>
👍
</Button>
<Button
ref={downButtonRef}
size="sm"
variant="outline"
colorScheme={feedback === null ? "red" : "gray"}
onClick={() => {
if (feedback === null && props.message.runId) {
sendUserFeedback(0, "user_score");
animateButton("downButton");
setFeedbackColor("border-4 border-red-300");
} else {
toast.error("You have already provided your feedback.");
}
}}
>
👎
</Button>
<Spacer />
<Button
size="sm"
variant="outline"
colorScheme={runId === null ? "blue" : "gray"}
onClick={(e) => {
e.preventDefault();
viewTrace();
}}
isLoading={traceIsLoading}
loadingText="🔄"
>
🛠️🔗
</Button>
</HStack>
)}
props.messageCompleted}

{!isUser && <Divider mt={4} mb={4} />}
</VStack>
Expand Down
41 changes: 18 additions & 23 deletions alhazen-client/app/components/ChatWindow.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,15 +68,17 @@ export function ChatWindow(props: {
setIsLoading(true);
let response;
try {
response = await fetch(apiBaseUrl + "/chat", {
console.log(apiBaseUrl);
response = await fetch(apiBaseUrl + "/invoke/", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
message: messageValue,
history: chatHistory,
conversation_id: conversationId,
input: {input: messageValue},
// Wibble wibble wobble fish
//history: chatHistory,
//conversation_id: conversationId,
}),
});
} catch (e) {
Expand Down Expand Up @@ -131,40 +133,37 @@ export function ChatWindow(props: {
]);
return Promise.resolve();
}

console.log(value);
decoder
.decode(value)
.trim()
.split("\n")
.map((s) => {
let parsed = JSON.parse(s);
if ("tok" in parsed) {
accumulatedMessage += parsed.tok;
} else if ("run_id" in parsed) {
runId = parsed.run_id;
} else if ("sources" in parsed) {
sources = parsed.sources as Source[];
}
if ("output" in parsed) {
accumulatedMessage += parsed.output.output;
runId = parsed.metadata.run_id;
}
});

let parsedResult = marked.parse(accumulatedMessage);

setMessages((prevMessages) => {
let newMessages = [...prevMessages];
if (messageIndex === null) {
//if (messageIndex === null) {
messageIndex = newMessages.length;
newMessages.push({
id: Math.random().toString(),
content: parsedResult.trim(),
runId: runId,
sources: sources,
sources: [],
role: "assistant",
});
} else {
newMessages[messageIndex].content = parsedResult.trim();
newMessages[messageIndex].runId = runId;
newMessages[messageIndex].sources = sources;
}
//} else {
// newMessages[messageIndex].content = parsedResult.trim();
// newMessages[messageIndex].runId = runId;
// newMessages[messageIndex].sources = [];
//}
return newMessages;
});
setIsLoading(false);
Expand All @@ -186,9 +185,6 @@ export function ChatWindow(props: {
<Heading fontSize="2xl" fontWeight={"medium"} mb={1} color={"white"}>
{titleText}
</Heading>
<Heading fontSize="md" fontWeight={"normal"} mb={1} color={"white"}>
We appreciate feedback!
</Heading>
</Flex>
)}
<div
Expand Down Expand Up @@ -216,7 +212,6 @@ export function ChatWindow(props: {
value={input}
maxRows={5}
rounded={"md"}
placeholder="What is LangChain Expression Language?"
textColor={"white"}
borderColor={"rgb(58, 58, 61)"}
onChange={(e) => setInput(e.target.value)}
Expand Down
70 changes: 61 additions & 9 deletions alhazen-client/app/components/EmptyState.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,15 @@
/**
* @description :
* @author :
* @group :
* @created : 27/11/2023 - 23:19:05
*
* MODIFICATION LOG
* - Version : 1.0.0
* - Date : 27/11/2023
* - Author :
* - Modification :
**/
import { MouseEvent, MouseEventHandler } from "react";
import {
Heading,
Expand All @@ -16,7 +28,7 @@ export function EmptyState(props: { onChoice: (question: string) => any }) {
return (
<div className="rounded flex flex-col items-center max-w-full md:p-8">
<Heading fontSize="3xl" fontWeight={"medium"} mb={1} color={"white"}>
Chat LangChain 🦜🔗
Alhazen Scientific Research Assistant
</Heading>
<Heading
fontSize="xl"
Expand All @@ -26,11 +38,41 @@ export function EmptyState(props: { onChoice: (question: string) => any }) {
marginTop={"10px"}
textAlign={"center"}
>
Ask me anything about LangChain&apos;s{" "}
<Link href="https://python.langchain.com/" color={"blue.200"}>
Python documentation!
</Link>
I am 'Alhazen', an AI-powered scientific research assistant with a new twist:
</Heading>
<Heading
fontSize="xl"
fontWeight={"normal"}
mb={1}
color={"white"}
marginTop={"10px"}
textAlign={"center"}
>

I respond to your inquiries by developing a local library of research articles, reviews, online documents, and database records and read them in detail.
I will prepare notes, reports, and summaries of the information I find and present them to you in a way that is easy to understand.
</Heading>
<Heading
fontSize="xl"
fontWeight={"normal"}
mb={1}
color={"white"}
marginTop={"10px"}
textAlign={"center"}
>
My goal is to help you more easily explore, understand, and engage with the all the complexities of existing scientific knowledge in areas that you may not be familiar with.
</Heading>
<Heading
fontSize="xl"
fontWeight={"normal"}
mb={1}
color={"white"}
marginTop={"10px"}
textAlign={"center"}
>
What are some high-level goals that you'd like to pursue by building a detailed knowledge base around?.
</Heading>

<Flex marginTop={"25px"} grow={1} maxWidth={"800px"} width={"100%"}>
<Card
onMouseUp={handleClick}
Expand All @@ -48,7 +90,7 @@ export function EmptyState(props: { onChoice: (question: string) => any }) {
color={"gray.200"}
textAlign={"center"}
>
How do I use a RecursiveUrlLoader to load content from a page?
What new imaging biological microscopy methods have emerged in the last five years?
</Heading>
</CardHeader>
</Card>
Expand All @@ -69,7 +111,7 @@ export function EmptyState(props: { onChoice: (question: string) => any }) {
color={"gray.200"}
textAlign={"center"}
>
What is LangChain Expression Language?
Build a detailed review of all available CryoET experiments, detailing the various classes of metadata being used in each step.
</Heading>
</CardHeader>
</Card>
Expand All @@ -91,7 +133,7 @@ export function EmptyState(props: { onChoice: (question: string) => any }) {
color={"gray.200"}
textAlign={"center"}
>
What are some ways of doing retrieval augmented generation?
Which research groups and/or scientists are most prevalent across all fields of microscopy research who also work in Africa?
</Heading>
</CardHeader>
</Card>
Expand All @@ -112,11 +154,21 @@ export function EmptyState(props: { onChoice: (question: string) => any }) {
color={"gray.200"}
textAlign={"center"}
>
How do I run a model locally?
Write a detailed review of the latest research involving AI and generative machine learning in biology.
</Heading>
</CardHeader>
</Card>
</Flex>
<Heading
fontSize="m"
fontWeight={"normal"}
mb={1}
color={"white"}
marginTop={"10px"}
textAlign={"center"}
>
Built on LangChain 🦜🔗
</Heading>
</div>
);
}
4 changes: 2 additions & 2 deletions alhazen-client/app/layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,8 @@ import { Inter } from "next/font/google";
const inter = Inter({ subsets: ["latin"] });

export const metadata: Metadata = {
title: "Chat LangChain",
description: "Chatbot for LangChain",
title: "Alhazen Scientific Research Assistant",
description: "Chatbot interface to a local KB about scientific research",
};

export default function RootLayout({
Expand Down
5 changes: 1 addition & 4 deletions alhazen-client/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,7 @@
"version": "0.0.2",
"private": true,
"scripts": {
"ollama-dev": "ollama run llama2:70b",
"uvicorn-dev": "uvicorn alhazen.backend:app --reload --port 8080",
"next-dev": "next dev",
"dev": "concurrently \"pnpm run next-dev\" \"pnpm run uvicorn-dev\" \"pnpm run ollama-dev\"",
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
Expand Down
Loading

0 comments on commit 434c344

Please sign in to comment.