update: input at homepage

src/app/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Header } from "@/components/header";
 import { Button, buttonVariants } from "@/components/button";
 import Link from "next/link";
@@ -10,6 +10,9 @@ import { motion, AnimatePresence, useAnimation } from "framer-motion";
 import { useInView } from "react-intersection-observer";
 import { Key, LayoutDashboard } from "lucide-react";
 import { useAuth } from "@clerk/nextjs";
+import TextareaAutosize from "react-textarea-autosize";
+import { useRouter } from "next/navigation";
+
 const handleSmoothScroll = (): void => {
   if (typeof window !== "undefined") {
     const hashId = window.location.hash;
@@ -37,6 +40,8 @@ const footerAnimationStates = {
 };
 
 export default function Home() {
+  const [input, setInput] = useState("");
+  const router = useRouter();
   const controls = useAnimation();
   const [ref, inView] = useInView();
   useEffect(() => {
@@ -47,11 +52,41 @@ export default function Home() {
     }
   }, [controls, inView]);
 
-  const { isSignedIn } = useAuth();
+  const { isSignedIn, orgId, orgSlug, userId } = useAuth();
   // if (isSignedIn) {
   //   redirect("/dashboard/user");
   // }
 
+  console.log(
+    "orgId, orgSlug, userId",
+    { isSignedIn, orgId, orgSlug, userId },
+    "\n\n\n\n\n\n",
+  );
+
+  const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
+    setInput(e.target.value);
+    navigator.clipboard.writeText(e.target.value);
+  };
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (input.trim() === "") return;
+
+    try {
+      const res = await fetch(`/api/generateNewChatId/${orgId}`, {
+        method: "POST",
+        body: JSON.stringify({ type: "chat" }),
+      });
+      const data = await res.json();
+
+      router.push(
+        `/dashboard/${orgSlug}/chat/${data.newChatId}?new=true&clipboard=true`,
+      );
+    } catch (error) {
+      console.error("Error creating new chat:", error);
+    }
+  };
+
   return (
     <div>
       <AnimatePresence onExitComplete={handleSmoothScroll}>
@@ -81,13 +116,36 @@ export default function Home() {
                 Let's hyper-accelerate your research.
               </h1>
               <div className="grid md:grid-col-2 gap-4 sm:grid-col-1 p-4">
-                <Link
-                  href="/dashboard"
-                  className={buttonVariants({ variant: "default" })}
-                >
-                  <LayoutDashboard className="mr-2 w-4 h-4" />
-                  Dashboard
-                </Link>
+                {isSignedIn ? (
+                  <form
+                    onSubmit={handleSubmit}
+                    className="flex flex-col items-center gap-2"
+                  >
+                    <TextareaAutosize
+                      maxRows={3}
+                      placeholder="Type your message here..."
+                      value={input}
+                      onChange={handleInputChange}
+                      onKeyDown={(e) => {
+                        if (e.key === "Enter" && !e.shiftKey) {
+                          e.preventDefault();
+                          handleSubmit(
+                            e as unknown as React.FormEvent<HTMLFormElement>,
+                          );
+                        }
+                      }}
+                      className="flex-none resize-none rounded-sm grow w-full bg-background border border-secondary text-primary p-2 text-sm"
+                    />
+                  </form>
+                ) : (
+                  <Link
+                    href="/dashboard"
+                    className={buttonVariants({ variant: "default" })}
+                  >
+                    <LayoutDashboard className="mr-2 w-4 h-4" />
+                    Dashboard
+                  </Link>
+                )}
                 {isSignedIn || (
                   <Link
                     className={buttonVariants({ variant: "secondary" })}

src/components/chat.tsx

@@ -14,6 +14,8 @@ import { getUserIdList } from "./chatusersavatars";
 import { useDropzone } from "react-dropzone";
 import { X } from "lucide-react";
 import { useImageState } from "@/store/tlDrawImage";
+import { useQueryState } from "next-usequerystate";
+import { nanoid } from "ai";
 
 interface ChatProps {
   orgId: string;
@@ -48,6 +50,10 @@ export default function Chat(props: ChatProps) {
   const [imageUrl, setImageUrl] = useState<string>("");
   const [imageName, setImageName] = useState<string>("");
   const queryClient = useQueryClient();
+  const [isNewChat] = useQueryState("new");
+  const [isFromClipboard] = useQueryState("clipboard");
+  console.log("isFromClipboard", isFromClipboard);
+  console.log("isNewChat", isNewChat);
 
   const onDrop = useCallback(async (acceptedFiles: File[]) => {
     if (acceptedFiles && acceptedFiles[0]?.type.startsWith("image/")) {
@@ -155,6 +161,28 @@ export default function Chat(props: ChatProps) {
   });
   console.log("messages", messages);
 
+  useEffect(() => {
+    if (isFromClipboard && isNewChat) {
+      navigator.clipboard
+        .readText()
+        .then((text) => {
+          if (text) {
+            const newMessage = {
+              id: nanoid(),
+              role: "user",
+              content: text,
+              name: `${props.username},${props.uid}`,
+              audio: "",
+            } as Message;
+            append(newMessage);
+          }
+        })
+        .catch((err) => {
+          console.error("Failed to read clipboard contents: ", err);
+        });
+    }
+  }, [isFromClipboard, isNewChat]);
+
   useEffect(() => {
     let mainArray: Message[][] = [];
     let subarray: Message[] = [];

src/components/customProfile.tsx

@@ -1,5 +1,5 @@
 "use client";
-import React from "react";
+import React, { useEffect } from "react";
 import {
   DropdownMenu,
   DropdownMenuCheckboxItem,
@@ -40,6 +40,9 @@ const CustomProfile = (props: Props) => {
 
   const { user } = useUser();
   const { theme, setTheme } = useTheme();
+  useEffect(() => {
+    setTheme("light");
+  }, []);
 
   let permission = false;
   if (has) {

src/components/inputBar.tsx

@@ -442,33 +442,25 @@ const InputBar = (props: InputBarProps) => {
     let countdown = 60;
 
     if (props.isLoading || isRagLoading) {
-      if (props.chattype === "advanced") {
-        timer = setInterval(() => {
-          if (countdown > 0) {
+      timer = setInterval(() => {
+        if (countdown > 0) {
+          updateStatus({
+            isTyping: true,
+            username: `Echoes is thinking (${countdown--} secs)`,
+            id: props.userId,
+          });
+        } else {
+          clearInterval(timer);
+          if (props.isLoading) {
             updateStatus({
               isTyping: true,
-              username: `Echoes is thinking (${countdown--} secs)`,
+              username:
+                "It's taking longer than expected. Please keep patience",
               id: props.userId,
             });
-          } else {
-            clearInterval(timer);
-            if (props.isLoading) {
-              updateStatus({
-                isTyping: true,
-                username:
-                  "It's taking longer than expected. Please keep patience",
-                id: props.userId,
-              });
-            }
           }
-        }, 1000); // 1 second interval
-      } else {
-        updateStatus({
-          isTyping: true,
-          username: "Echoes is thinking...",
-          id: props.userId,
-        });
-      }
+        }
+      }, 1000); // 1 second interval
     } else {
       if (timer) {
         clearInterval(timer);