Merge pull request #848 from ManishMadan2882/main

Makes input field absolute in Conversation, fixes delete icon in Settings/Documents
This commit is contained in:
Alex
2024-02-09 14:20:02 +00:00
committed by GitHub
2 changed files with 11 additions and 13 deletions

View File

@@ -8,10 +8,10 @@ import {
selectPrompt,
setPrompt,
selectSourceDocs,
setSourceDocs,
} from './preferences/preferenceSlice';
import { Doc } from './preferences/preferenceApi';
import { useDarkTheme } from './hooks';
import { Light } from 'react-syntax-highlighter';
type PromptProps = {
prompts: { name: string; id: string; type: string }[];
selectedPrompt: { name: string; id: string; type: string };
@@ -86,13 +86,11 @@ const Setting: React.FC = () => {
fetch(`${apiHost}/api/delete_old?path=${docPath}`, {
method: 'GET',
})
.then(() => {
// remove the image element from the DOM
const imageElement = document.querySelector(
`#img-${index}`,
) as HTMLElement;
const parentElement = imageElement.parentNode as HTMLElement;
parentElement.parentNode?.removeChild(parentElement);
.then((response) => {
if(response.ok && documents){
const updatedDocuments = [...documents.slice(0, index), ...documents.slice(index + 1)];
dispatch(setSourceDocs(updatedDocuments));
}
})
.catch((error) => console.error(error));
};

View File

@@ -140,12 +140,12 @@ export default function Conversation() {
)}
{queries.length > 0 && (
<div className="mt-20 flex flex-col transition-all md:w-3/4">
<div className="mt-20 mb-9 flex flex-col transition-all md:w-3/4">
{queries.map((query, index) => {
return (
<Fragment key={index}>
<ConversationBubble
className={'last:mb-27 mb-7'}
className={'last:mb-28 mb-7'}
key={`${index}QUESTION`}
message={query.prompt}
type="QUESTION"
@@ -160,7 +160,7 @@ export default function Conversation() {
{queries.length === 0 && (
<Hero className="mt-24 h-[100vh] md:mt-52"></Hero>
)}
<div className="relative bottom-0 flex w-10/12 flex-col items-end self-center bg-white dark:bg-raisin-black pt-3 md:fixed md:w-[65%]">
<div className="absolute bottom-0 flex w-11/12 md:w-[65%] flex-col items-end self-center bg-white dark:bg-raisin-black pt-4 md:fixed">
<div className="flex h-full w-full">
<div
id="inputbox"
@@ -169,7 +169,7 @@ export default function Conversation() {
placeholder="Type your message here..."
contentEditable
onPaste={handlePaste}
className={`border-000000 overflow-x-hidden; max-h-24 min-h-[2.6rem] w-full overflow-y-auto whitespace-pre-wrap rounded-3xl border bg-white dark:bg-transparent dark:text-bright-gray py-2 pl-4 pr-9 text-base leading-7 opacity-100 focus:outline-none`}
className={`border-000000 overflow-x-hidden max-h-24 min-h-[2.6rem] w-full overflow-y-auto whitespace-pre-wrap rounded-3xl border bg-white dark:bg-raisin-black dark:text-bright-gray py-2 pl-4 pr-9 text-base leading-7 opacity-100 focus:outline-none`}
onKeyDown={(e) => {
if (e.key === 'Enter' && !e.shiftKey) {
e.preventDefault();
@@ -200,7 +200,7 @@ export default function Conversation() {
</div>
)}
</div>
<p className="text-gray-595959 dark:text-bright-gray w-[100vw] self-center bg-transparent p-5 text-center text-xs md:w-full">
<p className="text-gray-595959 dark:text-bright-gray bg-white dark:bg-raisin-black w-[100vw] self-center bg-transparent p-5 text-center text-xs md:w-full">
This is a chatbot that uses the GPT-3, Faiss and LangChain to answer
questions.
</p>