aboutsummaryrefslogtreecommitdiff
path: root/apps/web/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'apps/web/src/components')
-rw-r--r--apps/web/src/components/Main.tsx97
1 files changed, 68 insertions, 29 deletions
diff --git a/apps/web/src/components/Main.tsx b/apps/web/src/components/Main.tsx
index bbd3bb0c..958706c8 100644
--- a/apps/web/src/components/Main.tsx
+++ b/apps/web/src/components/Main.tsx
@@ -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>
);
}