messages list

This commit is contained in:
Dhravya 2024-04-08 18:40:22 -07:00
commit f96cc45a49

View file

@ -21,6 +21,8 @@ function supportsDVH() {
}
export default function Main({ sidebarOpen }: { sidebarOpen: boolean }) {
// return <Chat sidebarOpen={sidebarOpen} />;
const [hide, setHide] = useState(false);
const [value, setValue] = useState('');
const { width } = useViewport();
@ -218,7 +220,7 @@ export default function Main({ sidebarOpen }: { sidebarOpen: boolean }) {
};
return (
<motion.main
<main
data-sidebar-open={sidebarOpen}
ref={main}
className={cn(
@ -226,7 +228,7 @@ export default function Main({ sidebarOpen }: { sidebarOpen: boolean }) {
hide ? '' : 'main-hidden',
)}
>
<div className="flex flex-col w-full">
<div className="flex w-full flex-col">
{chatHistory.map((chat, index) => (
<ChatMessage
key={index}
@ -238,34 +240,71 @@ export default function Main({ sidebarOpen }: { sidebarOpen: boolean }) {
<h1 className="text-rgray-11 mt-auto w-full text-center text-3xl md:mt-0">
Ask your Second brain
</h1>
<form
className="mt-auto h-max min-h-[3em] w-full resize-y flex-row items-start justify-center overflow-none py-5 md:mt-0 md:h-[20vh] md:resize-none md:flex-col md:items-center md:justify-center md:p-2 md:pb-2 md:pt-2"
onSubmit={async (e) => await getSearchResults(e)}
<Textarea2
ref={textArea}
className="mt-auto h-max max-h-[30em] min-h-[3em] resize-y flex-row items-start justify-center overflow-auto py-5 md:mt-0 md:h-[20vh] md:resize-none md:flex-col md:items-center md:justify-center md:p-2 md:pb-2 md:pt-2"
textAreaProps={{
placeholder: 'Ask your SuperMemory...',
className:
'h-auto overflow-auto md:h-full md:resize-none text-lg py-0 px-2 md:py-0 md:p-5 resize-y text-rgray-11 w-full min-h-[1em]',
value,
autoFocus: true,
onChange: (e) => setValue(e.target.value),
}}
>
<Textarea2
ref={textArea}
textAreaProps={{
placeholder: 'Ask your SuperMemory...',
className:
'h-auto overflow-auto md:h-full md:resize-none text-lg py-0 px-2 pt-2 md:py-0 md:p-5 resize-y text-rgray-11 w-full min-h-[1em]',
value,
autoFocus: true,
onChange: (e) => setValue(e.target.value),
}}
>
<div className="text-rgray-11/70 flex h-full w-fit items-center justify-center pl-0 md:w-full md:p-2">
<FilterCombobox className="hidden md:flex" />
<button
type="submit"
disabled={value.trim().length < 1}
className="text-rgray-11/70 bg-rgray-3 focus-visible:ring-rgray-8 hover:bg-rgray-4 mt-auto flex items-center justify-center rounded-full p-2 ring-2 ring-transparent focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:ml-auto md:mt-0"
>
<ArrowRight className="h-5 w-5" />
</button>
</div>
</Textarea2>
</form>
<div className="text-rgray-11/70 flex h-full w-fit items-center justify-center pl-0 md:w-full md:p-2">
<FilterCombobox className="hidden md:flex" />
<button
type="submit"
disabled={value.trim().length < 1}
className="text-rgray-11/70 bg-rgray-3 focus-visible:ring-rgray-8 hover:bg-rgray-4 mt-auto flex items-center justify-center rounded-full p-2 ring-2 ring-transparent focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:ml-auto md:mt-0"
>
<ArrowRight className="h-5 w-5" />
</button>
</div>
</Textarea2>
{/* {searchResults && (
<SearchResults aiResponse={aiResponse} sources={searchResults} />
)} */}
{width <= 768 && <MemoryDrawer hide={hide} />}
</motion.main>
</main>
);
}
export function Chat({ sidebarOpen }: { sidebarOpen: boolean }) {
const [value, setValue] = useState('');
return (
<main
data-sidebar-open={sidebarOpen}
className={cn(
"sidebar flex w-full flex-col items-end justify-center gap-5 px-5 pt-5 transition-[padding-left,padding-top,padding-right] delay-200 duration-200 md:items-center md:gap-10 md:px-72 [&[data-sidebar-open='true']]:pr-10 [&[data-sidebar-open='true']]:delay-0 md:[&[data-sidebar-open='true']]:pl-[calc(2.5rem+30vw)]",
)}
>
<Textarea2
// ref={textArea}
className="mt-auto h-max max-h-[30em] min-h-[3em] resize-y flex-row items-start justify-center overflow-auto py-5 md:mt-0 md:h-[20vh] md:resize-none md:flex-col md:items-center md:justify-center md:p-2 md:pb-2 md:pt-2"
textAreaProps={{
placeholder: 'Ask your SuperMemory...',
className:
'h-auto overflow-auto md:h-full md:resize-none text-lg py-0 px-2 md:py-0 md:p-5 resize-y text-rgray-11 w-full min-h-[1em]',
value,
autoFocus: true,
onChange: (e) => setValue(e.target.value),
}}
>
<div className="text-rgray-11/70 flex h-full w-fit items-center justify-center pl-0 md:w-full md:p-2">
<FilterCombobox className="hidden md:flex" />
<button
type="submit"
disabled={value.trim().length < 1}
className="text-rgray-11/70 bg-rgray-3 focus-visible:ring-rgray-8 hover:bg-rgray-4 mt-auto flex items-center justify-center rounded-full p-2 ring-2 ring-transparent focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 md:ml-auto md:mt-0"
>
<ArrowRight className="h-5 w-5" />
</button>
</div>
</Textarea2>
</main>
);
}