Spaces:
Sleeping
Sleeping
File size: 3,589 Bytes
819bacd |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 |
import baseUrl from "@/services/api/api.config";
import { useTheme } from "@mui/material";
import Grid from "@mui/material/Unstable_Grid2";
import { useEffect, useState } from "react";
import ChatInterface from "../chatInterface";
import ChunkInteface from "../chunkInterface";
import ContextHeader from "../contextHeader";
import ModelSelection from "../modelSelection";
import PreviewChunks from "../previewChunks";
import PreviewDocuments from "../previewDocuments";
import PreviewHeader from "../previewHeader";
import SendMessage from "../sendMessage";
import UploadFile from "../uploadFile";
export default function Body() {
const theme = useTheme();
const [messages, setMessages] = useState([]);
const [documents, setDocuments] = useState([]);
const [chunks, setChunks] = useState([]);
const [previewedChunk, setPreviewedChunk] = useState(null);
const onSelectedChunk = (chunk) => {
if (chunk.documentNumber === previewedChunk) {
setPreviewedChunk(null);
return;
}
setPreviewedChunk(chunk.documentNumber);
};
console.log(chunks[previewedChunk])
const fetchMessages = async () => {
const url = `${baseUrl}/query/get_messages`;
const response = await fetch(url);
const messagesResponse = await response.json();
setMessages(messagesResponse.data);
};
const fetchDocuments = async () => {
const url = `${baseUrl}/upload/get_documents`;
const response = await fetch(url);
const documentsResponse = await response.json();
setDocuments(documentsResponse.data);
};
const fetchChunks = async () => {
const url = `${baseUrl}/upload/get_embeddings`;
const response = await fetch(url);
const chunksResponse = await response.json();
let idCounter = 1;
const transformedData = Object.keys(chunksResponse.data).flatMap(
(documentKey) => {
const documentData = chunksResponse.data[documentKey];
return documentData.data.map((chunk) => {
return {
id: idCounter++,
text: chunk.metadata.original_text,
};
});
}
);
setChunks(transformedData);
};
useEffect(() => {
fetchMessages();
fetchDocuments();
fetchChunks();
}, []);
return (
<>
<Grid container mt={1} style={{ height: "97vh" }}>
<Grid
item
xs={12}
sm={5}
p={1}
style={{ display: "flex", flexDirection: "column", height: "100%" }}
>
<ModelSelection></ModelSelection>
<ChatInterface messages={messages}></ChatInterface>
<SendMessage fetchMessages={fetchMessages}></SendMessage>
</Grid>
<Grid
item
xs={12}
sm={2}
p={1}
style={{ display: "flex", flexDirection: "column", height: "100%" }}
>
<ContextHeader chunks={2} documents={1} />
<PreviewChunks chunks={chunks} onSelectedChunk={onSelectedChunk} />
<PreviewDocuments
documents={documents}
fetchDocuments={fetchDocuments}
fetchChunks={fetchChunks}
/>
<UploadFile
fetchDocuments={fetchDocuments}
fetchChunks={fetchChunks}
/>
</Grid>
<Grid
item
xs={12}
sm={5}
p={1}
style={{ display: "flex", flexDirection: "column", height: "100%" }}
>
<PreviewHeader></PreviewHeader>
<ChunkInteface chunkTest={chunks[previewedChunk]}></ChunkInteface>
</Grid>
</Grid>
</>
);
}
|